@astral/ui 4.21.3 → 4.22.1

package/components/CardGridInfinite/Card/Card.js

@@ -1,13 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Paper } from '../../Paper';
 import { Tooltip } from '../../Tooltip';
 import { getInertProps } from '../../utils/getInertProps';
 import { CardActionContextProvider } from './CardActionContext';
 import { SecondaryActionButton } from './SecondaryActionButton';
-import { CardHeader, HeaderWrapper, StyledDivider, Wrapper } from './styles';
+import { CardHeader, HeaderWrapper, StyledDivider, StyledPaper, Wrapper, } from './styles';
 import { useLogic } from './useLogic';
 export const Card = (props) => {
     const { handleActionClick } = useLogic(props);
     const { isDisabled, mainActions: MainActions, content, header, disabledReason, secondaryActions, } = props;
-    return (_jsx(CardActionContextProvider, { onActionClick: handleActionClick, isDisabledCard: isDisabled, children: _jsx(Tooltip, { title: isDisabled && disabledReason, withoutContainer: !isDisabled, placement: "top", componentsProps: { popper: { disablePortal: true } }, children: _jsx(Paper, { variant: "outlined", ...getInertProps(isDisabled), children: _jsxs(Wrapper, { children: [header && (_jsxs(_Fragment, { children: [_jsxs(CardHeader, { children: [_jsx(HeaderWrapper, { children: header }), secondaryActions && (_jsx(SecondaryActionButton, { renderActions: secondaryActions }))] }), _jsx(StyledDivider, {})] })), content, MainActions && _jsx(MainActions, {})] }) }) }) }));
+    return (_jsx(CardActionContextProvider, { onActionClick: handleActionClick, isDisabledCard: isDisabled, children: _jsx(Tooltip, { title: isDisabled && disabledReason, withoutContainer: !isDisabled, placement: "top", componentsProps: { popper: { disablePortal: true } }, children: _jsx(StyledPaper, { variant: "outlined", ...getInertProps(isDisabled), children: _jsxs(Wrapper, { children: [header && (_jsxs(_Fragment, { children: [_jsxs(CardHeader, { children: [_jsx(HeaderWrapper, { children: header }), secondaryActions && (_jsx(SecondaryActionButton, { renderActions: secondaryActions }))] }), _jsx(StyledDivider, {})] })), content, MainActions && _jsx(MainActions, {})] }) }) }) }));
 };

package/components/CardGridInfinite/Card/styles.d.ts

@@ -14,3 +14,6 @@ export declare const HeaderWrapper: import("../../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>, {}>;
+export declare const StyledPaper: import("../../styled").StyledComponent<Omit<import("../../Paper").PaperProps, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;

package/components/CardGridInfinite/Card/styles.js

@@ -1,6 +1,11 @@
 import { Divider } from '../../Divider';
+import { Paper } from '../../Paper';
 import { styled } from '../../styled';
 export const Wrapper = styled.div `
+    display: flex;
+    flex-direction: column;
+
+    height: 100%;
     padding: ${({ theme }) => theme.spacing(4, 5)};
 
     ${({ theme }) => theme.breakpoints.down('sm')} {
@@ -20,3 +25,6 @@ export const HeaderWrapper = styled.div `
     overflow: hidden;
     flex: 1;
 `;
+export const StyledPaper = styled(Paper) `
+    height: 100%;
+`;

package/components/CardGridInfinite/CardGridMainActions/styles.js

@@ -5,5 +5,6 @@ export const Wrapper = styled.div `
     grid-auto-flow: column;
     gap: ${({ theme }) => theme.spacing(3)};
 
+    margin-top: auto;
     padding-top: ${({ theme }) => theme.spacing(6)};
 `;

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

@@ -0,0 +1,23 @@
+import { type ReactNode } from 'react';
+export type FormControlContextProps = {
+    /**
+     *  Размер элементов формы
+     */
+    size?: 'small' | 'medium';
+    /**
+     * Включает/отключает резервирование места под helperText
+     */
+    hideHelperText?: boolean;
+};
+export type FormControlProviderProps = Partial<FormControlContextProps> & {
+    children: ReactNode;
+};
+/**
+ * Контекст для управления состоянием и конфигурацией элементов формы.
+ */
+export declare const FormControlContext: import("react").Context<FormControlContextProps | undefined>;
+/**
+ * Провайдер контекста для группы элементов формы.
+ * Оборачивает группу элементов предоставляет им общую конфигурацию.
+ */
+export declare const FormControlProvider: ({ children, size, hideHelperText, }: FormControlProviderProps) => import("react/jsx-runtime").JSX.Element;

package/hook-form/FormControlProvider/FormControlProvider.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext } from 'react';
+/**
+ * Контекст для управления состоянием и конфигурацией элементов формы.
+ */
+export const FormControlContext = createContext(undefined);
+/**
+ * Провайдер контекста для группы элементов формы.
+ * Оборачивает группу элементов предоставляет им общую конфигурацию.
+ */
+export const FormControlProvider = ({ children, size, hideHelperText, }) => {
+    return (_jsx(FormControlContext.Provider, { value: { size, hideHelperText }, children: children }));
+};

package/hook-form/FormControlProvider/index.d.ts

@@ -0,0 +1 @@
+export * from './FormControlProvider';

package/hook-form/FormControlProvider/index.js

@@ -0,0 +1 @@
+export * from './FormControlProvider';

package/hook-form/useFormFieldProps/useFormFieldProps.js

@@ -1,5 +1,7 @@
+import { useContext } from 'react';
 import { useController, } from 'react-hook-form';
 import { useForwardedRef } from '../../components/useForwardedRef';
+import { FormControlContext } from '../FormControlProvider';
 import { useFormFieldErrorProps, } from '../useFormFieldErrorProps';
 import { useFormInputProps, } from '../useFormInputProps';
 /**
@@ -11,9 +13,11 @@ export const useFormFieldProps = (props) => {
         disabled: undefined,
     });
     const ref = useForwardedRef(field.ref);
+    const contextProps = useContext(FormControlContext);
     const inputProps = useFormInputProps(props);
     const errorProps = useFormFieldErrorProps(fieldState);
     return {
+        ...contextProps,
         ...field,
         ...inputProps,
         ...errorProps,

package/node/components/CardGridInfinite/Card/Card.js

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Card = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const Paper_1 = require("../../Paper");
 const Tooltip_1 = require("../../Tooltip");
 const getInertProps_1 = require("../../utils/getInertProps");
 const CardActionContext_1 = require("./CardActionContext");
@@ -12,6 +11,6 @@ const useLogic_1 = require("./useLogic");
 const Card = (props) => {
     const { handleActionClick } = (0, useLogic_1.useLogic)(props);
     const { isDisabled, mainActions: MainActions, content, header, disabledReason, secondaryActions, } = props;
-    return ((0, jsx_runtime_1.jsx)(CardActionContext_1.CardActionContextProvider, { onActionClick: handleActionClick, isDisabledCard: isDisabled, children: (0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { title: isDisabled && disabledReason, withoutContainer: !isDisabled, placement: "top", componentsProps: { popper: { disablePortal: true } }, children: (0, jsx_runtime_1.jsx)(Paper_1.Paper, { variant: "outlined", ...(0, getInertProps_1.getInertProps)(isDisabled), children: (0, jsx_runtime_1.jsxs)(styles_1.Wrapper, { children: [header && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(styles_1.CardHeader, { children: [(0, jsx_runtime_1.jsx)(styles_1.HeaderWrapper, { children: header }), secondaryActions && ((0, jsx_runtime_1.jsx)(SecondaryActionButton_1.SecondaryActionButton, { renderActions: secondaryActions }))] }), (0, jsx_runtime_1.jsx)(styles_1.StyledDivider, {})] })), content, MainActions && (0, jsx_runtime_1.jsx)(MainActions, {})] }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(CardActionContext_1.CardActionContextProvider, { onActionClick: handleActionClick, isDisabledCard: isDisabled, children: (0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { title: isDisabled && disabledReason, withoutContainer: !isDisabled, placement: "top", componentsProps: { popper: { disablePortal: true } }, children: (0, jsx_runtime_1.jsx)(styles_1.StyledPaper, { variant: "outlined", ...(0, getInertProps_1.getInertProps)(isDisabled), children: (0, jsx_runtime_1.jsxs)(styles_1.Wrapper, { children: [header && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(styles_1.CardHeader, { children: [(0, jsx_runtime_1.jsx)(styles_1.HeaderWrapper, { children: header }), secondaryActions && ((0, jsx_runtime_1.jsx)(SecondaryActionButton_1.SecondaryActionButton, { renderActions: secondaryActions }))] }), (0, jsx_runtime_1.jsx)(styles_1.StyledDivider, {})] })), content, MainActions && (0, jsx_runtime_1.jsx)(MainActions, {})] }) }) }) }));
 };
 exports.Card = Card;

package/node/components/CardGridInfinite/Card/styles.d.ts

@@ -14,3 +14,6 @@ export declare const HeaderWrapper: import("@emotion/styled/dist/declarations/sr
     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>, {}>;
+export declare const StyledPaper: import("@emotion/styled/dist/declarations/src/types").StyledComponent<Omit<import("../../Paper").PaperProps, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;

package/node/components/CardGridInfinite/Card/styles.js

@@ -1,9 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.HeaderWrapper = exports.CardHeader = exports.StyledDivider = exports.Wrapper = void 0;
+exports.StyledPaper = exports.HeaderWrapper = exports.CardHeader = exports.StyledDivider = exports.Wrapper = void 0;
 const Divider_1 = require("../../Divider");
+const Paper_1 = require("../../Paper");
 const styled_1 = require("../../styled");
 exports.Wrapper = styled_1.styled.div `
+    display: flex;
+    flex-direction: column;
+
+    height: 100%;
     padding: ${({ theme }) => theme.spacing(4, 5)};
 
     ${({ theme }) => theme.breakpoints.down('sm')} {
@@ -23,3 +28,6 @@ exports.HeaderWrapper = styled_1.styled.div `
     overflow: hidden;
     flex: 1;
 `;
+exports.StyledPaper = (0, styled_1.styled)(Paper_1.Paper) `
+    height: 100%;
+`;

package/node/components/CardGridInfinite/CardGridMainActions/styles.js

@@ -8,5 +8,6 @@ exports.Wrapper = styled_1.styled.div `
     grid-auto-flow: column;
     gap: ${({ theme }) => theme.spacing(3)};
 
+    margin-top: auto;
     padding-top: ${({ theme }) => theme.spacing(6)};
 `;

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

@@ -0,0 +1,23 @@
+import { type ReactNode } from 'react';
+export type FormControlContextProps = {
+    /**
+     *  Размер элементов формы
+     */
+    size?: 'small' | 'medium';
+    /**
+     * Включает/отключает резервирование места под helperText
+     */
+    hideHelperText?: boolean;
+};
+export type FormControlProviderProps = Partial<FormControlContextProps> & {
+    children: ReactNode;
+};
+/**
+ * Контекст для управления состоянием и конфигурацией элементов формы.
+ */
+export declare const FormControlContext: import("react").Context<FormControlContextProps | undefined>;
+/**
+ * Провайдер контекста для группы элементов формы.
+ * Оборачивает группу элементов предоставляет им общую конфигурацию.
+ */
+export declare const FormControlProvider: ({ children, size, hideHelperText, }: FormControlProviderProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormControlProvider = exports.FormControlContext = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+/**
+ * Контекст для управления состоянием и конфигурацией элементов формы.
+ */
+exports.FormControlContext = (0, react_1.createContext)(undefined);
+/**
+ * Провайдер контекста для группы элементов формы.
+ * Оборачивает группу элементов предоставляет им общую конфигурацию.
+ */
+const FormControlProvider = ({ children, size, hideHelperText, }) => {
+    return ((0, jsx_runtime_1.jsx)(exports.FormControlContext.Provider, { value: { size, hideHelperText }, children: children }));
+};
+exports.FormControlProvider = FormControlProvider;

package/node/hook-form/FormControlProvider/index.d.ts

@@ -0,0 +1 @@
+export * from './FormControlProvider';

package/node/hook-form/FormControlProvider/index.js

@@ -0,0 +1,17 @@
+"use strict";
+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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./FormControlProvider"), exports);

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

@@ -1,8 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormFieldProps = void 0;
+const react_1 = require("react");
 const react_hook_form_1 = require("react-hook-form");
 const useForwardedRef_1 = require("../../components/useForwardedRef");
+const FormControlProvider_1 = require("../FormControlProvider");
 const useFormFieldErrorProps_1 = require("../useFormFieldErrorProps");
 const useFormInputProps_1 = require("../useFormInputProps");
 /**
@@ -14,9 +16,11 @@ const useFormFieldProps = (props) => {
         disabled: undefined,
     });
     const ref = (0, useForwardedRef_1.useForwardedRef)(field.ref);
+    const contextProps = (0, react_1.useContext)(FormControlProvider_1.FormControlContext);
     const inputProps = (0, useFormInputProps_1.useFormInputProps)(props);
     const errorProps = (0, useFormFieldErrorProps_1.useFormFieldErrorProps)(fieldState);
     return {
+        ...contextProps,
         ...field,
         ...inputProps,
         ...errorProps,

package/package.json

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