@astral/ui 4.25.1 → 4.26.0

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

@@ -0,0 +1,97 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+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");
+const Badge_2 = require("../../components/Badge");
+const Counter_1 = require("../../components/Counter");
+const styled_1 = require("../../components/styled");
+const constants_1 = require("./constants");
+exports.Wrapper = styled_1.styled.div `
+  display: flex;
+  gap: ${({ theme }) => theme.spacing(2)};
+  justify-content: space-between;
+
+  width: 100%; 
+  margin-top: ${({ theme }) => theme.spacing(4)};
+
+  .${FormLabel_1.formLabelClasses.root} {
+    display: none;
+  }
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    margin-top: 0;
+    padding: ${({ theme }) => theme.spacing(1, 4, 5, 4)};
+
+    font-size: 0;
+
+    .${InputBase_1.inputBaseClasses.input} {
+      padding: ${({ theme }) => theme.spacing(2, 3)};
+    }
+
+    .${constants_1.formFiltersClassnames.submitButton} {
+      display: none;
+    }
+  }
+`;
+exports.AllFiltersButtonWrapper = styled_1.styled.div `
+  display: none;
+
+  white-space: nowrap;
+
+  &.${constants_1.formFiltersClassnames.showAllFiltersButtonOnDesktop} {
+    display: flex;
+  }
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    margin-right: 0;
+    &.${constants_1.formFiltersClassnames.showAllFiltersButtonOnMobile} {
+      display: flex;
+    }
+
+    &.${constants_1.formFiltersClassnames.withoutSearch} {
+      width: 100%;
+
+      .${constants_1.formFiltersClassnames.allFiltersButton} {
+        width: 100%;
+      }
+    }
+
+    &.${constants_1.formFiltersClassnames.withSearch} {
+      .${constants_1.formFiltersClassnames.allFiltersButton} {
+         display: unset;
+         gap: 0;
+
+         padding: 8px;
+
+         font-size: 0;
+      }
+    }
+  }
+`;
+exports.MainFiltersWrapper = styled_1.styled.div `
+  display: grid;
+  grid-auto-flow: column;
+  grid-template-columns: ${({ columns }) => columns || 'repeat(auto-fit, min(200px, 1fr))'};
+  column-gap: ${({ theme }) => theme.spacing(2)};
+
+  width: 100%;
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    display: none;
+  }
+`;
+exports.StyledBadge = (0, styled_1.styled)(Badge_2.Badge) `
+   width: 100%; 
+  .${Badge_1.badgeClasses.dot} {
+      ${({ theme }) => theme.breakpoints.up('sm')} {
+        display: none;
+      }
+    }
+`;
+exports.StyledCounter = (0, styled_1.styled)(Counter_1.Counter) `
+   ${({ theme }) => theme.breakpoints.down('sm')} {
+    display: none;
+  }
+`;

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

@@ -0,0 +1,92 @@
+import { type ObjectAsyncGuard, type ObjectGuard } from '@astral/validations';
+import { type ReactNode } from 'react';
+import { type Control } from 'react-hook-form';
+import type { ButtonProps } from '../../components/Button';
+type InputsProps<TFieldValues extends Record<string, unknown>> = {
+    control: Control<TFieldValues>;
+};
+export type FormFiltersProps<TFieldValues extends Record<string, unknown>> = {
+    /**
+     * Схема валидации из @astral/validations
+     */
+    validationSchema?: ObjectGuard<TFieldValues> | ObjectAsyncGuard<TFieldValues>;
+    /**
+     * Значения фильтров
+     */
+    values?: TFieldValues;
+    /**
+     * Callback вызываемый при изменении значений фильтров. Вызывается с debounce (300ms)
+     */
+    onChange: (values: TFieldValues) => void;
+    /**
+     * Поле поиска
+     *
+     * @example
+     * ```ts
+     * <FormFilters
+     *   SearchField={(props) => <FormFiltersSearchField {...props} placeholder="Поиск..." />}
+     * />
+     * ```
+     */
+    searchField?: (props: InputsProps<TFieldValues> & {
+        fullWidth?: boolean;
+    }) => ReactNode;
+    /**
+     * Основные фильтры
+     *
+     * @example
+     * ```ts
+     * <FormFilters
+     *   MainFilters={({ control, isModal, ...props }) =>
+     *    <FormTextField
+     *      {...props}
+     *      control={control}
+     *      name="name"
+     *      label="Название"
+     *      placeholder={isModal ? 'Введите название' : 'Название'}
+     *    />
+     * />
+     * ```
+     */
+    mainFilters?: (props: InputsProps<TFieldValues> & {
+        isModal?: boolean;
+    }) => ReactNode;
+    /**
+     * Фильтры, отображаемые в модальном окне "Все фильтры"
+     *
+     * @example
+     * ```ts
+     * <FormFilters
+     *   SecondaryFilters={({ control, ...props }) => <FormTextField {...props} control={control} placeholder="Введите название" />}
+     * />
+     * ```
+     */
+    secondaryFilters?: (props: InputsProps<TFieldValues>) => ReactNode;
+    /**
+     * Кнопка отправки формы
+     *
+     * @example
+     * ```ts
+     * <FormFilters
+     *   SubmitButton={(props) => <Button {...props} loading={isLoading}>Применить</Button>}
+     * />
+     * ```
+     */
+    submitButton?: (props: ButtonProps) => ReactNode;
+    /**
+     * Определение ширины колонок для основных фильтров.
+     * Поддерживает CSS grid-template-columns синтаксис:
+     * - minmax(min, max): например, "minmax(150px, 200px) minmax(200px, 300px)"
+     * - fr (fractional units): например, "1fr 2fr"
+     * - px (pixels): например, "200px 300px"
+     * - Комбинации: например, "minmax(150px, 1fr) 2fr"
+     *
+     * @default "1fr"
+     */
+    mainFiltersColumns?: string;
+    /**
+     * Флаг загрузки фильтров, используйте когда фильтры загружаются динамически с сервера
+     */
+    isLoading?: boolean;
+};
+export {};

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

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/node/hook-form/FormFilters/useLogic/hooks/index.d.ts

@@ -0,0 +1 @@
+export { useFirstMountAfterLoading } from './useFirstMountAfterLoading';

package/node/hook-form/FormFilters/useLogic/hooks/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFirstMountAfterLoading = void 0;
+var useFirstMountAfterLoading_1 = require("./useFirstMountAfterLoading");
+Object.defineProperty(exports, "useFirstMountAfterLoading", { enumerable: true, get: function () { return useFirstMountAfterLoading_1.useFirstMountAfterLoading; } });

package/node/hook-form/FormFilters/useLogic/hooks/useFirstMountAfterLoading.d.ts

@@ -0,0 +1 @@
+export declare function useFirstMountAfterLoading(isLoading?: boolean): boolean;

package/node/hook-form/FormFilters/useLogic/hooks/useFirstMountAfterLoading.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFirstMountAfterLoading = void 0;
+const react_1 = require("react");
+function useFirstMountAfterLoading(isLoading) {
+    const isFirst = (0, react_1.useRef)(true);
+    if (isFirst.current && !isLoading) {
+        isFirst.current = false;
+        return true;
+    }
+    return isFirst.current;
+}
+exports.useFirstMountAfterLoading = useFirstMountAfterLoading;

package/node/hook-form/FormFilters/useLogic/index.d.ts

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

package/node/hook-form/FormFilters/useLogic/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("./useLogic"), exports);

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

@@ -0,0 +1,18 @@
+import { type UseFormReturn } from '../../useForm';
+import { type FormFiltersDialogProps } from '../FormFiltersDialog/types';
+import { type FormFiltersProps } from '../types';
+type UseLogicReturn<TFieldValues extends Record<string, unknown>> = {
+    headerForm: UseFormReturn<TFieldValues>;
+    searchField: FormFiltersProps<TFieldValues>['searchField'];
+    mainFilters: FormFiltersProps<TFieldValues>['mainFilters'];
+    submitButton: FormFiltersProps<TFieldValues>['submitButton'];
+    counter: number;
+    onSubmit: (submittedValues: TFieldValues) => void;
+    onOpenModal: () => void;
+    dialogProps: FormFiltersDialogProps<TFieldValues>;
+    mainFiltersColumns?: string;
+    isLoading?: boolean;
+    allFiltersButtonClassName: string;
+};
+export declare const useLogic: <TFieldValues extends Record<string, unknown>>({ validationSchema, values, onChange, searchField, mainFilters, secondaryFilters, submitButton, mainFiltersColumns, isLoading, }: FormFiltersProps<TFieldValues>) => UseLogicReturn<TFieldValues>;
+export {};

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

@@ -0,0 +1,124 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLogic = void 0;
+const debounce_1 = require("@astral/utils/debounce");
+const react_1 = require("react");
+const react_hook_form_1 = require("react-hook-form");
+const checkIsDeepEqual_1 = require("../../../components/utils/checkIsDeepEqual");
+const classNames_1 = require("../../../components/utils/classNames");
+const constants_1 = require("../../FormFiltersSearchField/constants");
+const useForm_1 = require("../../useForm");
+const constants_2 = require("../constants");
+const hooks_1 = require("./hooks");
+const useLogic = ({ validationSchema, values, onChange, searchField, mainFilters, secondaryFilters, submitButton, mainFiltersColumns, isLoading, }) => {
+    const [isModalOpen, setIsModalOpen] = (0, react_1.useState)(false);
+    const isFirstMount = (0, hooks_1.useFirstMountAfterLoading)(isLoading);
+    const onOpenModal = () => {
+        setIsModalOpen(true);
+    };
+    const headerForm = (0, useForm_1.useForm)({
+        validationSchema,
+        defaultValues: values,
+    });
+    const headerFormValues = (0, react_hook_form_1.useWatch)({
+        control: headerForm.control,
+    });
+    // Ref для хранения debounced функции, чтобы можно было её отменить
+    const debouncedOnChangeRef = (0, react_1.useRef)(null);
+    // Ref для отслеживания внешнего reset (чтобы не вызывать onChange при внешнем reset)
+    const isExternalResetRef = (0, react_1.useRef)(false);
+    // Ref для хранения предыдущих внешних values (для сравнения)
+    const previousValuesRef = (0, react_1.useRef)(values);
+    // Отменяет предыдущий debounced вызов onChange, если он есть
+    const clearPreviousDebouncedOnChange = () => {
+        if (debouncedOnChangeRef.current) {
+            debouncedOnChangeRef.current.clear();
+        }
+    };
+    const hasSubmitButton = Boolean(submitButton);
+    (0, react_1.useEffect)(() => {
+        // Если есть submitButton, не вызываем onChange при изменении значений
+        if (hasSubmitButton || isLoading || isFirstMount) {
+            return;
+        }
+        clearPreviousDebouncedOnChange();
+        // Пропускаем onChange если это внешний reset
+        if (isExternalResetRef.current) {
+            isExternalResetRef.current = false;
+            return;
+        }
+        // Создаем новый debounced вызов
+        const debouncedOnChange = (0, debounce_1.debounce)(() => {
+            onChange(headerFormValues);
+        }, 300);
+        debouncedOnChangeRef.current = debouncedOnChange;
+        debouncedOnChange();
+        return () => {
+            debouncedOnChange.clear();
+        };
+    }, [headerFormValues, onChange, hasSubmitButton, isLoading]);
+    const searchName = document
+        .getElementById(constants_1.FORM_FILTERS_SEARCH_FIELD_ID)
+        ?.getAttribute('name') || '';
+    // Исключаем поиск из счетчика фильтров
+    const counter = Object.values(headerFormValues).filter(Boolean).length -
+        (headerFormValues[searchName] ? 1 : 0);
+    const setFiltersValues = (newValues) => headerForm.reset(newValues);
+    // Функция отправки формы на SubmitButton. Приводит к вызову onChange без debounce.
+    const onSubmit = (submittedValues) => {
+        clearPreviousDebouncedOnChange();
+        onChange?.(submittedValues);
+    };
+    // Функция отправки формы на кнопку "Применить" в модальном окне
+    const onSubmitModal = (submittedValues) => {
+        setFiltersValues(submittedValues);
+        onSubmit(submittedValues);
+    };
+    // Синхронизация внешних values с формой
+    (0, react_1.useEffect)(() => {
+        if (isFirstMount) {
+            return;
+        }
+        // Сравниваем значения, чтобы избежать лишних reset
+        const valuesChanged = !(0, checkIsDeepEqual_1.checkIsDeepEqual)(previousValuesRef.current, values);
+        if (!valuesChanged) {
+            return;
+        }
+        clearPreviousDebouncedOnChange();
+        isExternalResetRef.current = true;
+        previousValuesRef.current = values;
+        setFiltersValues(values);
+    }, [values, headerForm]);
+    const allFiltersButtonClassName = (0, react_1.useMemo)(() => {
+        return (0, classNames_1.classNames)({
+            [constants_2.formFiltersClassnames.showAllFiltersButtonOnDesktop]: Boolean(secondaryFilters),
+            [constants_2.formFiltersClassnames.showAllFiltersButtonOnMobile]: Boolean(mainFilters) || Boolean(secondaryFilters),
+            [constants_2.formFiltersClassnames.withSearch]: Boolean(searchField),
+            [constants_2.formFiltersClassnames.withoutSearch]: !searchField,
+        });
+    }, [mainFilters, secondaryFilters, searchField]);
+    const dialogProps = {
+        validationSchema,
+        values,
+        mainFilters,
+        secondaryFilters,
+        defaultValues: headerFormValues,
+        onSubmit: onSubmitModal,
+        isModalOpen,
+        setIsModalOpen,
+    };
+    return {
+        headerForm,
+        searchField,
+        mainFilters,
+        submitButton,
+        counter,
+        onSubmit,
+        onOpenModal,
+        dialogProps,
+        mainFiltersColumns,
+        isLoading,
+        allFiltersButtonClassName,
+    };
+};
+exports.useLogic = useLogic;

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

@@ -0,0 +1,10 @@
+import { type FormFiltersModalGroupProps } from './types';
+/**
+ * Компонент для группировки фильтров в Grid сетку
+ * @example
+ * <FormFiltersModalGroup columns="1fr 2fr">
+ *  <FormSelect />
+ *  <FormSelect />
+ * </FormFiltersModalGroup>
+ */
+export declare const FormFiltersModalGroup: ({ children, columns, ...props }: FormFiltersModalGroupProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormFiltersModalGroup = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const styles_1 = require("./styles");
+/**
+ * Компонент для группировки фильтров в Grid сетку
+ * @example
+ * <FormFiltersModalGroup columns="1fr 2fr">
+ *  <FormSelect />
+ *  <FormSelect />
+ * </FormFiltersModalGroup>
+ */
+const FormFiltersModalGroup = ({ children, columns = '1fr', ...props }) => {
+    return ((0, jsx_runtime_1.jsx)(styles_1.Container, { container: true, columns: columns, ...props, children: children }));
+};
+exports.FormFiltersModalGroup = FormFiltersModalGroup;

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

@@ -0,0 +1,2 @@
+export { FormFiltersModalGroup } from './FormFiltersModalGroup';
+export type { FormFiltersModalGroupProps } from './types';

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

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormFiltersModalGroup = void 0;
+var FormFiltersModalGroup_1 = require("./FormFiltersModalGroup");
+Object.defineProperty(exports, "FormFiltersModalGroup", { enumerable: true, get: function () { return FormFiltersModalGroup_1.FormFiltersModalGroup; } });

package/node/hook-form/FormFiltersModalGroup/public.d.ts

@@ -0,0 +1,2 @@
+export { FormFiltersModalGroup } from './FormFiltersModalGroup';
+export type { FormFiltersModalGroupProps } from './types';

package/node/hook-form/FormFiltersModalGroup/public.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormFiltersModalGroup = void 0;
+var FormFiltersModalGroup_1 = require("./FormFiltersModalGroup");
+Object.defineProperty(exports, "FormFiltersModalGroup", { enumerable: true, get: function () { return FormFiltersModalGroup_1.FormFiltersModalGroup; } });

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

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const Container: import("@emotion/styled/dist/declarations/src/types").StyledComponent<Omit<import("../../components/Grid/GridComponent").GridComponentProps, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & import("../../components/Grid/styles").StyledGridProps, {}, {}>;

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

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Container = void 0;
+const Grid_1 = require("../../components/Grid");
+const styled_1 = require("../../components/styled");
+const constants_1 = require("../FormFilters/constants");
+exports.Container = (0, styled_1.styled)(Grid_1.Grid) `
+  display: contents;
+
+  > * {
+  flex: 1;
+  }
+
+  .${constants_1.formFiltersClassnames.modalFilters} & {
+    display: grid;
+    column-gap: ${({ theme }) => theme.spacing(5)};
+    align-items: center;
+    justify-content: space-between;
+
+    ${({ theme }) => theme.breakpoints.down('sm')} {
+      display: flex;
+      flex-direction: column;
+      align-items: unset;
+    }
+  }
+`;

package/node/hook-form/FormFiltersModalGroup/types.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from 'react';
+import { type GridProps } from '../../components/Grid';
+export type FormFiltersModalGroupProps = Omit<GridProps, 'container'> & {
+    children?: ReactNode;
+    /**
+     * Количество колонок
+     */
+    columns?: number | string;
+};

package/node/hook-form/FormFiltersModalGroup/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { type SearchFieldProps } from '../../components/SearchField';
+import { type WithFormFieldProps } from '../types';
+export type FormFiltersSearchFieldProps<TFieldValues extends object> = WithFormFieldProps<SearchFieldProps, TFieldValues> & {
+    width?: string;
+};
+export declare const FormFiltersSearchField: <T extends object>(props: Omit<SearchFieldProps, "error" | "name"> & Omit<import("react-hook-form").UseControllerProps<T>, "rules"> & {
+    width?: string | undefined;
+} & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | null;

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

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormFiltersSearchField = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const forwardRefWithGeneric_1 = require("../../components/forwardRefWithGeneric");
+const SearchField_1 = require("../../components/SearchField");
+const useFormFieldProps_1 = require("../useFormFieldProps");
+const constants_1 = require("./constants");
+const styles_1 = require("./styles");
+/**
+ * Адаптер для SearchField
+ */
+function FormFiltersSearchFieldInner({ width, ...props }, ref) {
+    const fieldProps = (0, useFormFieldProps_1.useFormFieldProps)({
+        ...props,
+        defaultValue: props.defaultValue || '',
+    });
+    return ((0, jsx_runtime_1.jsx)(styles_1.Wrapper, { "$width": width, children: (0, jsx_runtime_1.jsx)(SearchField_1.SearchField, { ...fieldProps, ref: ref, inputProps: { id: constants_1.FORM_FILTERS_SEARCH_FIELD_ID } }) }));
+}
+exports.FormFiltersSearchField = (0, forwardRefWithGeneric_1.forwardRefWithGeneric)(FormFiltersSearchFieldInner);

package/node/hook-form/FormFiltersSearchField/constants.d.ts

@@ -0,0 +1 @@
+export declare const FORM_FILTERS_SEARCH_FIELD_ID = "form-filters-search-field";

package/node/hook-form/FormFiltersSearchField/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FORM_FILTERS_SEARCH_FIELD_ID = void 0;
+exports.FORM_FILTERS_SEARCH_FIELD_ID = 'form-filters-search-field';

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

@@ -0,0 +1 @@
+export { FormFiltersSearchField, type FormFiltersSearchFieldProps, } from './FormFiltersSearchField';

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

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormFiltersSearchField = void 0;
+var FormFiltersSearchField_1 = require("./FormFiltersSearchField");
+Object.defineProperty(exports, "FormFiltersSearchField", { enumerable: true, get: function () { return FormFiltersSearchField_1.FormFiltersSearchField; } });

package/node/hook-form/FormFiltersSearchField/public.d.ts

@@ -0,0 +1 @@
+export { FormFiltersSearchField, type FormFiltersSearchFieldProps, } from './FormFiltersSearchField';

package/node/hook-form/FormFiltersSearchField/public.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormFiltersSearchField = void 0;
+var FormFiltersSearchField_1 = require("./FormFiltersSearchField");
+Object.defineProperty(exports, "FormFiltersSearchField", { enumerable: true, get: function () { return FormFiltersSearchField_1.FormFiltersSearchField; } });

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export declare const Wrapper: 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;
+} & {
+    $width?: string | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

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

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Wrapper = void 0;
+const styled_1 = require("../../components/styled");
+exports.Wrapper = styled_1.styled.div `
+  min-width: ${({ $width }) => $width || '240px'};
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    width: 100%;
+  }
+`;

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

@@ -7,6 +7,7 @@ export declare const useLogic: <TFormValues extends Record<string, unknown>>({ a
         title?: import("react").ReactNode;
         description?: import("react").ReactNode;
         subheader?: import("react").ReactNode;
+        filters?: import("react").ReactNode;
         breadcrumbs?: import("react").ReactNode;
         className?: string | undefined;
         isLoading?: boolean | undefined;

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

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { type SearchFieldProps } from '../../components/SearchField';
+import { type WithFormFieldProps } from '../types';
+export type FormSearchFieldProps<TFieldValues extends object> = WithFormFieldProps<SearchFieldProps, TFieldValues>;
+export declare const FormSearchField: <T extends object>(props: Omit<SearchFieldProps, "error" | "name"> & Omit<import("react-hook-form").UseControllerProps<T>, "rules"> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | null;

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

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormSearchField = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const forwardRefWithGeneric_1 = require("../../components/forwardRefWithGeneric");
+const SearchField_1 = require("../../components/SearchField");
+const useFormFieldProps_1 = require("../useFormFieldProps");
+/**
+ * Адаптер для SearchField
+ */
+function FormSearchFieldInner(props, ref) {
+    const fieldProps = (0, useFormFieldProps_1.useFormFieldProps)({
+        ...props,
+        defaultValue: props.defaultValue || '',
+    });
+    return (0, jsx_runtime_1.jsx)(SearchField_1.SearchField, { ...fieldProps, ref: ref });
+}
+exports.FormSearchField = (0, forwardRefWithGeneric_1.forwardRefWithGeneric)(FormSearchFieldInner);

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

@@ -0,0 +1 @@
+export { FormSearchField, type FormSearchFieldProps, } from './FormSearchField';

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

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormSearchField = void 0;
+var FormSearchField_1 = require("./FormSearchField");
+Object.defineProperty(exports, "FormSearchField", { enumerable: true, get: function () { return FormSearchField_1.FormSearchField; } });

package/node/hook-form/FormSearchField/public.d.ts

@@ -0,0 +1 @@
+export { FormSearchField, type FormSearchFieldProps, } from './FormSearchField';

package/node/hook-form/FormSearchField/public.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormSearchField = void 0;
+var FormSearchField_1 = require("./FormSearchField");
+Object.defineProperty(exports, "FormSearchField", { enumerable: true, get: function () { return FormSearchField_1.FormSearchField; } });

package/package.json

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