@astral/ui 4.18.4 → 4.18.6

package/components/DashboardLayout/Main/constants.js

@@ -1,4 +1,4 @@
-import { createUIKitClassname } from '../../utils';
+import { createUIKitClassname } from '../../utils/createUIKitClassname';
 export const dashboardLayoutMainClassnames = {
     main: createUIKitClassname('dashboard-layout-main'),
     alert: createUIKitClassname('dashboard-layout-main__alert'),

package/components/DashboardLayout/constants.js

@@ -1,4 +1,4 @@
-import { createUIKitClassname } from '../utils';
+import { createUIKitClassname } from '../utils/createUIKitClassname';
 export const HEADER_HEIGHT = '60px';
 export const HEADER_HEIGHT_MOBILE = '48px';
 export const dashboardLayoutClassnames = {

package/components/DashboardLayout/index.d.ts

@@ -1,4 +1,5 @@
-export { type DashboardLayoutProps, DashboardLayout } from './DashboardLayout';
+export { DashboardLayout } from './DashboardLayout';
+export type { DashboardLayoutProps } from './types';
 export { dashboardLayoutHeaderClassnames } from './Header';
 export { dashboardLayoutMainClassnames } from './Main';
 export { dashboardLayoutClassnames } from './constants';

package/components/DashboardLayout/public.d.ts

@@ -1,2 +1,3 @@
 export type { DashboardSidebarProps } from '../DashboardSidebar';
-export { DashboardLayout, type DashboardLayoutProps } from './DashboardLayout';
+export { DashboardLayout } from './DashboardLayout';
+export type { DashboardLayoutProps } from './types';

package/components/DashboardLayout/types.d.ts

@@ -0,0 +1,13 @@
+import { type ReactNode } from 'react';
+export type DashboardLayoutProps = {
+    children: ReactNode;
+    /**
+     * Флаг режима фокусировки: убирает header, сворачивает sidebar, растягивает контент на всю ширину.
+     * Пример использования: просмотр документа
+     */
+    isFocusedMode?: boolean;
+    /**
+     * Если true, отображается состояние загрузки
+     */
+    isLoading?: boolean;
+};

package/components/DashboardLayout/types.js

@@ -0,0 +1 @@
+export {};

package/components/DashboardLayoutSkeleton/DashboardLayoutSkeleton.js

@@ -5,7 +5,7 @@ import { Header } from '../DashboardLayout/Header';
 import { DecorativeHeaderBackground, LayoutContent, Wrapper, } from '../DashboardLayout/styles';
 import { DashboardSidebarSkeleton } from '../DashboardSidebarSkeleton';
 import { MenuOrganizationSkeleton } from '../MenuOrganization';
-import { LoadingPlaceholder } from '../placeholders';
+import { LoadingPlaceholder } from '../placeholders/LoadingPlaceholder';
 import { Content } from './styles';
 /**
  * Компонент можно использовать для отображения состояния загрузки дашборда

package/components/DashboardSidebar/DashboardSidebar.js

@@ -3,7 +3,8 @@ import { forwardRef } from 'react';
 import { DashboardSidebarSkeleton } from '../DashboardSidebarSkeleton';
 import { NavMenu } from '../NavMenu';
 import { PinButton } from '../PinButton';
-import { classNames, getInertProps } from '../utils';
+import { classNames } from '../utils/classNames';
+import { getInertProps } from '../utils/getInertProps';
 import { dashboardSidebarClassnames } from './constants';
 import { SidebarNav } from './SidebarNav';
 import { Footer, SidebarContent, SidebarHeader, SidebarRoot, StyledPaper, Wrapper, } from './styles';

package/components/DashboardSidebar/constants.js

@@ -1,4 +1,4 @@
-import { createUIKitClassname } from '../utils';
+import { createUIKitClassname } from '../utils/createUIKitClassname';
 export const dashboardSidebarClassnames = {
     root: createUIKitClassname('dashboard-layout-sidebar'),
 };

package/components/DashboardSidebar/useLogic/useLogic.js

@@ -1,9 +1,10 @@
 import { useContext, useEffect, useRef } from 'react';
 import { DashboardContext } from '../../DashboardContext';
-import { dashboardLayoutHeaderClassnames, dashboardLayoutMainClassnames, } from '../../DashboardLayout';
+import { dashboardLayoutHeaderClassnames } from '../../DashboardLayout/Header';
+import { dashboardLayoutMainClassnames } from '../../DashboardLayout/Main';
 import { DashboardSidebarContext } from '../../DashboardSidebarProvider';
-import { useViewportType } from '../../hooks/useViewportType';
 import { useTheme } from '../../theme/hooks/useTheme';
+import { useViewportType } from '../../useViewportType';
 export const useLogic = (props) => {
     const { className, menu, header, isLoading } = props;
     const { onToggleSidebar, isPinned, onTogglePin, collapsedIn, setIsPopupOpen, } = useContext(DashboardSidebarContext);

package/components/DashboardSidebarPopover/FadePopup/useLogic/useLogic.js

@@ -1,6 +1,6 @@
 import { useContext } from 'react';
 import { DashboardSidebarContext } from '../../../DashboardSidebarProvider';
-import { usePopoverAnimation } from '../../../hooks/usePopoverAnimation';
+import { usePopoverAnimation } from '../../../usePopoverAnimation';
 export const useLogic = ({ isOpen }) => {
     const { popoverAnchorRef } = useContext(DashboardSidebarContext);
     const topPosition = popoverAnchorRef.current?.offsetTop;

package/components/DashboardSidebarPopover/SidebarPopoverItem/SidebarPopoverItem.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRefWithGeneric } from '../../forwardRefWithGeneric';
 import { Tooltip } from '../../Tooltip';
 import { Typography } from '../../Typography';
-import { getInertProps } from '../../utils';
+import { getInertProps } from '../../utils/getInertProps';
 import { sidebarPopoverItemClassnames } from './constants';
 import { IconWrapper, Item, ItemWrapper, Wrapper } from './styles';
 import { useLogic } from './useLogic';

package/components/DashboardSidebarPopover/SidebarPopoverItem/constants.js

@@ -1,4 +1,4 @@
-import { createUIKitClassname } from '../../utils';
+import { createUIKitClassname } from '../../utils/createUIKitClassname';
 export const sidebarPopoverItemClassnames = {
     content: createUIKitClassname('sidebar-popover-item__content'),
 };

package/components/DashboardSidebarPopover/styles.d.ts

@@ -3,17 +3,11 @@ export declare const Wrapper: 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<HTMLUListElement>, HTMLUListElement>, {}>;
-export declare const Title: import("../styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    align?: "inherit" | "center" | "left" | "right" | "justify" | undefined;
-    gutterBottom?: boolean | undefined;
-    noWrap?: boolean | undefined;
-    paragraph?: boolean | undefined;
-} & {
+export declare const Title: import("../styled").StyledComponent<import("../Typography/types").TypographyPropsBase & {
     color?: import("../Typography").TypographyColor | undefined;
     variant?: import("../Typography").TypographyVariant | undefined;
     colorIntensity?: import("../Typography").Intensity | undefined;
-    component?: ("symbol" | "object" | "main" | "body" | "small" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "caption" | "button" | "link" | "slot" | "style" | "title" | import("react").ComponentType<any> | "search" | "big" | "sub" | "sup" | "map" | "filter" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "br" | "canvas" | "center" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "source" | "span" | "strong" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view") | undefined;
+    component?: import("../Typography/types").ComponentProp | undefined;
     isUpperCase?: boolean | undefined;
 } & import("react").HTMLAttributes<HTMLParagraphElement> & import("react").RefAttributes<HTMLSpanElement> & {
     theme?: import("@emotion/react").Theme | undefined;

package/components/DashboardSidebarProvider/hooks/useSidebar/useSidebar.js

@@ -1,9 +1,9 @@
 import useMediaQuery from '@mui/material/useMediaQuery';
 import { useEffect, useState } from 'react';
-import { useFirstMountState } from '../../../hooks/useFirstMountState';
-import { useLocalStorage } from '../../../hooks/useLocalStorage';
-import { useViewportType } from '../../../hooks/useViewportType';
 import { useTheme } from '../../../theme/hooks/useTheme';
+import { useFirstMountState } from '../../../useFirstMountState';
+import { useLocalStorage } from '../../../useLocalStorage';
+import { useViewportType } from '../../../useViewportType';
 const useMobileSidebar = () => {
     const [collapsedIn, setCollapsedIn] = useState(false);
     const onToggleSidebar = () => {

package/components/DashboardSidebarSkeleton/DashboardSidebarSkeleton.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { dashboardSidebarClassnames } from '../DashboardSidebar';
+import { dashboardSidebarClassnames } from '../DashboardSidebar/constants';
 import { Skeleton } from '../Skeleton';
-import { classNames } from '../utils';
+import { classNames } from '../utils/classNames';
 import { ItemWrapper, ListWrapper, SkeletonDescription, Wrapper, } from './styles';
 import { useLogic } from './useLogic';
 export const DashboardSidebarSkeleton = () => {

package/components/DashboardSidebarSkeleton/useLogic/useLogic.js

@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react';
 import { LOCAL_STORAGE_KEY } from '../../DashboardSidebarProvider';
-import { useLocalStorage } from '../../hooks/useLocalStorage';
+import { useLocalStorage } from '../../useLocalStorage';
 export const useLogic = () => {
     // Достается напрямую, т.к. нет гарантий, что скелетон будет обернут в контекст
     const [storageState = true] = useLocalStorage(LOCAL_STORAGE_KEY, true);

package/components/DataGrid/Body/Body.js

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useContext } from 'react';
 import { ConfigContext } from '../../ConfigProvider';
 import { ContentState } from '../../ContentState';
-import { classNames } from '../../utils';
+import { classNames } from '../../utils/classNames';
 import { dataGridClassnames } from '../constants';
 import { Row } from '../Row';
 import { RowContextProvider } from '../Row/RowContext';

package/components/DataGrid/Cell/Cell.js

@@ -1,6 +1,6 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { OverflowTypography } from '../../OverflowTypography';
-import { getInertProps } from '../../utils';
+import { getInertProps } from '../../utils/getInertProps';
 import { Wrapper } from './styles';
 import { useLogic } from './useLogic';
 export const Cell = (props) => {

package/components/DataGrid/DataGrid.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useContext } from 'react';
 import { ConfigContext } from '../ConfigProvider';
-import { classNames, getInertProps } from '../utils';
+import { classNames } from '../utils/classNames';
+import { getInertProps } from '../utils/getInertProps';
 import { Body } from './Body';
 import { dataGridClassnames, EXPANDED_LEVEL_BY_DEFAULT, INITIAL_OPENED_NESTED_CHILDREN_COUNT_BY_DEFAULT, MIN_DISPLAY_ROWS_BY_DEFAULT, } from './constants';
 import { DataGridContextProvider } from './DataGridContext';

package/components/DataGrid/NoData/NoData.d.ts

@@ -1,4 +1,4 @@
-import { type PlaceholderSize } from '../../placeholders';
+import { type PlaceholderSize } from '../../placeholders/Placeholder';
 export type NoDataProps = {
     /**
      * Заголовок

package/components/DataGrid/NoData/NoData.js

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useContext } from 'react';
 import { Button } from '../../Button';
 import { ConfigContext } from '../../ConfigProvider';
-import { Placeholder } from '../../placeholders';
+import { Placeholder, } from '../../placeholders/Placeholder';
 export const NoData = ({ title = 'Нет\u00a0данных', imgAlt = title, action, size = 'small', }) => {
     const { imagesMap: { noDataImgSrc }, } = useContext(ConfigContext);
     return (_jsx(Placeholder, { title: title, imgSrc: noDataImgSrc, size: size, Actions: action ? (_jsx(Button, { onClick: action.onClick, "aria-label": action.text, children: action.text })) : undefined, imgAlt: imgAlt }));

package/components/DataGrid/Row/Row.js

@@ -3,8 +3,8 @@ import { memo, useCallback } from 'react';
 import { Checkbox } from '../../Checkbox';
 import { useHidePersonalData } from '../../personalDataSecurity';
 import { Tooltip } from '../../Tooltip';
-import { getInertProps } from '../../utils';
 import { checkIsDeepEqual } from '../../utils/checkIsDeepEqual';
+import { getInertProps } from '../../utils/getInertProps';
 import { DISABLE_ROW_ATTR } from './constants';
 import { NestedChildren } from './NestedChildren';
 import { CellStyled, CheckboxCell, ChevronIcon, CollapseButton, CollapseCell, ContentWrapper, Wrapper, } from './styles';

package/components/DataGrid/Row/constants.js

@@ -1,4 +1,4 @@
-import { createUIKitClassname } from '../../utils';
+import { createUIKitClassname } from '../../utils/createUIKitClassname';
 export const DISABLE_ROW_ATTR = 'data-row-disable';
 export const dataGridClassnames = {
     hidden: createUIKitClassname('data-grid__row_hidden'),

package/components/DataGrid/Row/useLogic/useLogic.js

@@ -1,5 +1,5 @@
 import { useContext, useEffect, useMemo, useState, } from 'react';
-import { redirectToLink } from '../../../utils';
+import { redirectToLink } from '../../../utils/redirectToLink';
 import { DataGridContext } from '../../DataGridContext';
 import { Variant } from '../../enums';
 import { DISABLE_ROW_ATTR } from '../constants';

package/components/DataGrid/constants.js

@@ -1,4 +1,4 @@
-import { createUIKitClassname } from '../utils';
+import { createUIKitClassname } from '../utils/createUIKitClassname';
 export const MIN_ROW_HEIGHT = 44;
 export const ROOT_ACTION_CELL_WIDTH = 32;
 export const TREE_LINE_WIDTH = ROOT_ACTION_CELL_WIDTH / 2;

package/components/DataGrid/types.d.ts

@@ -1,5 +1,5 @@
 import { type CSSProperties, type ReactNode } from 'react';
-import { type Target } from '../utils';
+import { type Target } from '../utils/redirectToLink';
 import { type Variant } from './enums';
 import type { NoDataProps } from './NoData';
 export type AlignVariant = 'left' | 'center' | 'right';

package/components/DataGrid/useLogic/useLogic.js

@@ -1,6 +1,7 @@
 import { useCallback, useEffect, useMemo, useRef, } from 'react';
-import { useFirstMountState } from '../../hooks/useFirstMountState';
-import { prop, uniqueBy } from '../../utils';
+import { useFirstMountState } from '../../useFirstMountState';
+import { prop } from '../../utils/prop';
+import { uniqueBy } from '../../utils/uniqueBy';
 import { Variant } from '../enums';
 import { getGridTemplateColumns, getIsAllowHorizontalScroll } from './utils';
 export const useLogic = ({ keyId, columns, rows = [], variant, tree, subrows, selectedRows = [], isLoading, isDisabled, onSelectRow, isHideSelectAll, isHideHeaderIfNoData = false, }) => {

package/components/DataGridActionCell/SecondaryActionsButton/SecondaryActionsButton.js

@@ -2,8 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import ClickAwayListener from '@mui/material/ClickAwayListener';
 import { useContext, useRef, useState } from 'react';
 import { DotsVOutlineMd } from '../../../icons/DotsVOutlineMd';
-import { useMenu } from '../../hooks/useMenu';
 import { IconButton } from '../../IconButton';
+import { useMenu } from '../../useMenu';
 import { ActionCellContext } from '../ActionCellContext';
 import { DataGridSecondaryActions, } from '../DataGridSecondaryActions';
 import { SecondaryActionsMenuProvider } from '../SecondaryActionsMenuContext';

package/components/DataGridInfinite/DataGridInfinite.js

@@ -11,7 +11,8 @@ import { Row, RowContextProvider } from '../DataGrid/Row';
 import { Container } from '../DataGrid/styles';
 import { Loader } from '../Loader';
 import { ScrollToTopButton } from '../ScrollToTopButton';
-import { classNames, getInertProps } from '../utils';
+import { classNames } from '../utils/classNames';
+import { getInertProps } from '../utils/getInertProps';
 import { OVERSCAN_COUNT } from './constants';
 import { EndData } from './EndData';
 import { ErrorMessage } from './ErrorMessage';

package/components/DataGridInfinite/NoData/NoData.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useContext } from 'react';
 import { ConfigContext } from '../../ConfigProvider';
-import { Placeholder } from '../../placeholders';
+import { Placeholder } from '../../placeholders/Placeholder';
 import { NO_DATA_TEXT } from './constants';
 export const NoData = () => {
     const { imagesMap } = useContext(ConfigContext);

package/components/DataGridInfinite/useLogic/useLogic.js

@@ -1,8 +1,9 @@
 import { useCallback, useMemo, useRef, useState, } from 'react';
 import { Variant } from '../../DataGrid/enums';
 import { getGridTemplateColumns } from '../../DataGrid/useLogic/utils';
-import { useToggle } from '../../hooks/useToggle';
-import { prop, uniqueBy } from '../../utils';
+import { useToggle } from '../../useToggle';
+import { prop } from '../../utils/prop';
+import { uniqueBy } from '../../utils/uniqueBy';
 import { VIRTUOSO_CONTAINER_ID, VIRTUOSO_LIST_ID } from '../constants';
 export const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows = [], isLoading, isDisabled, isEndReached, onEndReached, onSelectRow, isHideSelectAll, isHideHeaderIfNoData = false, }) => {
     const virtuoso = useRef(null);

package/components/DataGridPagination/styles.d.ts

@@ -3,17 +3,11 @@ export declare const PaginationWrapper: 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 Range: import("../styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    align?: "inherit" | "center" | "left" | "right" | "justify" | undefined;
-    gutterBottom?: boolean | undefined;
-    noWrap?: boolean | undefined;
-    paragraph?: boolean | undefined;
-} & {
+export declare const Range: import("../styled").StyledComponent<import("../Typography/types").TypographyPropsBase & {
     color?: import("../Typography").TypographyColor | undefined;
     variant?: import("../Typography").TypographyVariant | undefined;
     colorIntensity?: import("../Typography").Intensity | undefined;
-    component?: ("symbol" | "object" | "main" | "body" | "small" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "caption" | "button" | "link" | "slot" | "style" | "title" | import("react").ComponentType<any> | "search" | "big" | "sub" | "sup" | "map" | "filter" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "br" | "canvas" | "center" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "source" | "span" | "strong" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view") | undefined;
+    component?: import("../Typography/types").ComponentProp | undefined;
     isUpperCase?: boolean | undefined;
 } & import("react").HTMLAttributes<HTMLParagraphElement> & import("react").RefAttributes<HTMLSpanElement> & {
     theme?: import("@emotion/react").Theme | undefined;

package/components/DataGridPaginationContainer/styles.d.ts

@@ -1,15 +1,9 @@
 /// <reference types="react" />
-export declare const Range: import("../styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    align?: "inherit" | "center" | "left" | "right" | "justify" | undefined;
-    gutterBottom?: boolean | undefined;
-    noWrap?: boolean | undefined;
-    paragraph?: boolean | undefined;
-} & {
+export declare const Range: import("../styled").StyledComponent<import("../Typography/types").TypographyPropsBase & {
     color?: import("../Typography").TypographyColor | undefined;
     variant?: import("../Typography").TypographyVariant | undefined;
     colorIntensity?: import("../Typography").Intensity | undefined;
-    component?: ("symbol" | "object" | "main" | "body" | "small" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "caption" | "button" | "link" | "slot" | "style" | "title" | import("react").ComponentType<any> | "search" | "big" | "sub" | "sup" | "map" | "filter" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "br" | "canvas" | "center" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "source" | "span" | "strong" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view") | undefined;
+    component?: import("../Typography/types").ComponentProp | undefined;
     isUpperCase?: boolean | undefined;
 } & import("react").HTMLAttributes<HTMLParagraphElement> & import("react").RefAttributes<HTMLSpanElement> & {
     theme?: import("@emotion/react").Theme | undefined;

package/components/DatePicker/DateCalendar/DateCalendarHead/styles.d.ts

@@ -2,17 +2,11 @@
 export declare const HeadButton: import("../../../styled").StyledComponent<Omit<import("../../../StaticCalendar/StaticCalendarButton/useLogic").UseLogicParams, "ref"> & import("react").RefAttributes<HTMLButtonElement> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
-export declare const HeadText: import("../../../styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    align?: "inherit" | "center" | "left" | "right" | "justify" | undefined;
-    gutterBottom?: boolean | undefined;
-    noWrap?: boolean | undefined;
-    paragraph?: boolean | undefined;
-} & {
+export declare const HeadText: import("../../../styled").StyledComponent<import("../../../Typography/types").TypographyPropsBase & {
     color?: import("../../../Typography").TypographyColor | undefined;
     variant?: import("../../../Typography").TypographyVariant | undefined;
     colorIntensity?: import("../../../Typography").Intensity | undefined;
-    component?: ("symbol" | "object" | "main" | "body" | "small" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "caption" | "button" | "link" | "slot" | "style" | "title" | import("react").ComponentType<any> | "search" | "big" | "sub" | "sup" | "map" | "filter" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "br" | "canvas" | "center" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "source" | "span" | "strong" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view") | undefined;
+    component?: import("../../../Typography/types").ComponentProp | undefined;
     isUpperCase?: boolean | undefined;
 } & import("react").HTMLAttributes<HTMLParagraphElement> & import("react").RefAttributes<HTMLSpanElement> & {
     theme?: import("@emotion/react").Theme | undefined;

package/components/DatePicker/DatePicker.d.ts

@@ -1,112 +1,19 @@
-import { type ReactNode, type RefObject, type SyntheticEvent } from 'react';
-import { type TextFieldProps } from '../TextField';
-import { type CloseEventReason } from '../types';
-import { type DateMask } from '../utils/date';
-import { type MondayFirst } from './DayPicker';
-import { type MinMaxDate, type WithDoubleNavigationButtons } from './types';
-export type DatePickerProps = MondayFirst & WithDoubleNavigationButtons & Partial<MinMaxDate> & {
-    /**
-     * Маска для инпута даты
-     * @default 'DD.MM.YYYY'
-     */
-    mask?: DateMask;
-    /**
-     * Обработчик изменения состояния. Передает только Date object, если дата невалидна, то будет Invalid date
-     */
-    onChange?: (date?: Date | null) => void;
-    onBlur?: () => void;
-    onOpen?: () => void;
-    onClose?: (event?: SyntheticEvent<Element, Event> | Event, reason?: CloseEventReason) => void;
-    inputProps?: Omit<TextFieldProps, 'ref' | 'value' | 'onChange'>;
-    inputRef?: RefObject<HTMLInputElement>;
-    /**
-     * Блокирует взаимодействие с элементом
-     */
-    disabled?: boolean;
-    /**
-     * Принимает только Date object, включая невалидную дату Invalid date
-     */
-    value?: Date | null;
-    /**
-     * Название класса, применяется к корневому компоненту
-     */
-    className?: string;
-    /**
-     * Определяет размер компонента
-     * @default 	'medium'
-     */
-    size?: 'small' | 'medium';
-    /**
-     * Название текстового поля
-     */
-    label?: ReactNode;
-    /**
-     * Лейбл будет помечен как обязательный
-     */
-    required?: boolean;
-    /**
-     * Вспомогательный текст под полем ввода
-     */
-    helperText?: ReactNode;
-    /**
-     * Включает/отключает резервирование места под helperText
-     */
-    hideHelperText?: boolean;
-    /**
-     * Элемент в начале инпута
-     */
-    startAdornment?: ReactNode;
-} & Pick<TextFieldProps, 'label' | 'required' | 'helperText'>;
-export declare const DatePicker: import("react").ForwardRefExoticComponent<MondayFirst & WithDoubleNavigationButtons & Partial<MinMaxDate> & {
-    /**
-     * Маска для инпута даты
-     * @default 'DD.MM.YYYY'
-     */
+/// <reference types="react" />
+export declare const DatePicker: import("react").ForwardRefExoticComponent<import("./DayPicker").MondayFirst & import("./types").WithDoubleNavigationButtons & Partial<import("./types").MinMaxDate> & {
     mask?: string | undefined;
-    /**
-     * Обработчик изменения состояния. Передает только Date object, если дата невалидна, то будет Invalid date
-     */
-    onChange?: ((date?: Date | null) => void) | undefined;
+    onChange?: ((date?: Date | null | undefined) => void) | undefined;
     onBlur?: (() => void) | undefined;
     onOpen?: (() => void) | undefined;
-    onClose?: ((event?: SyntheticEvent<Element, Event> | Event, reason?: CloseEventReason) => void) | undefined;
-    inputProps?: Omit<TextFieldProps, "onChange" | "ref" | "value"> | undefined;
-    inputRef?: RefObject<HTMLInputElement> | undefined;
-    /**
-     * Блокирует взаимодействие с элементом
-     */
+    onClose?: ((event?: Event | import("react").SyntheticEvent<Element, Event> | undefined, reason?: import("..").CloseEventReason | undefined) => void) | undefined;
+    inputProps?: Omit<import("..").TextFieldProps, "onChange" | "ref" | "value"> | undefined;
+    inputRef?: import("react").RefObject<HTMLInputElement> | undefined;
     disabled?: boolean | undefined;
-    /**
-     * Принимает только Date object, включая невалидную дату Invalid date
-     */
     value?: Date | null | undefined;
-    /**
-     * Название класса, применяется к корневому компоненту
-     */
     className?: string | undefined;
-    /**
-     * Определяет размер компонента
-     * @default 	'medium'
-     */
     size?: "medium" | "small" | undefined;
-    /**
-     * Название текстового поля
-     */
-    label?: ReactNode;
-    /**
-     * Лейбл будет помечен как обязательный
-     */
+    label?: import("react").ReactNode;
     required?: boolean | undefined;
-    /**
-     * Вспомогательный текст под полем ввода
-     */
-    helperText?: ReactNode;
-    /**
-     * Включает/отключает резервирование места под helperText
-     */
+    helperText?: import("react").ReactNode;
     hideHelperText?: boolean | undefined;
-    /**
-     * Элемент в начале инпута
-     */
-    startAdornment?: ReactNode;
-} & Pick<TextFieldProps, "label" | "required" | "helperText"> & import("react").RefAttributes<HTMLDivElement>>;
+    startAdornment?: import("react").ReactNode;
+} & Pick<import("..").TextFieldProps, "label" | "required" | "helperText"> & import("react").RefAttributes<HTMLDivElement>>;

package/components/DatePicker/DatePicker.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, } from 'react';
+import { forwardRef } from 'react';
 import { DEFAULT_DATE_MASK } from './constants';
 import { DatePickerInput } from './DatePickerInput';
 import { DatePickerPopover } from './DatePickerPopover';

package/components/DatePicker/DatePickerPopover/DatePickerPopover.d.ts

@@ -1,6 +1,6 @@
 import { type PopperProps } from '@mui/material/Popper';
 import { type PropsWithChildren } from 'react';
-import { type WithoutEmotionSpecific } from '../../types';
+import { type WithoutEmotionSpecific } from '../../types/WithoutEmotionSpecific';
 export type DatePickerPopperProps = PropsWithChildren<Omit<WithoutEmotionSpecific<PopperProps>, 'children' | 'disablePortal' | 'transition'> & {
     /**
      * Обработчик закрытия Popper

package/components/DatePicker/DatePickerPopover/DatePickerPopover.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { BottomDrawer } from '../../BottomDrawer';
 import { ClickAwayListener } from '../../ClickAwayListener';
-import { usePopoverAnimation } from '../../hooks/usePopoverAnimation';
-import { useViewportType } from '../../hooks/useViewportType';
+import { usePopoverAnimation } from '../../usePopoverAnimation';
+import { useViewportType } from '../../useViewportType';
 import { datePickerClassnames } from '../constants';
 import { AnimatedWrapper, InnerContainer, StyledPopper } from './styles';
 export const DatePickerPopover = ({ children, onMouseEnter, onMouseLeave, onClose, anchorEl, title, open, ...props }) => {

package/components/DatePicker/DayPicker/DayPicker.js

@@ -3,7 +3,7 @@ import { addMonths } from '@astral/utils/date/addMonths';
 import { addYears } from '@astral/utils/date/addYears';
 import { useCallback, useContext, useEffect, useMemo } from 'react';
 import { ConfigContext } from '../../ConfigProvider';
-import { useLocaleDateTimeFormat } from '../../hooks/useLocaleDateTimeFormat';
+import { useLocaleDateTimeFormat } from '../../useLocaleDateTimeFormat';
 import { datePickerClassnames } from '../constants';
 import { DateCalendarHead, DateCalendarWrapper, StaticDaysCalendarWrapper, } from '../DateCalendar';
 import { useCalendarNavigate } from '../hooks/useCalendarNavigate';

package/components/DatePicker/MonthPicker/MonthPicker.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { addYears } from '@astral/utils/date/addYears';
 import { useContext } from 'react';
 import { ConfigContext } from '../../ConfigProvider';
-import { useLocaleDateTimeFormat } from '../../hooks/useLocaleDateTimeFormat';
+import { useLocaleDateTimeFormat } from '../../useLocaleDateTimeFormat';
 import { datePickerClassnames, ELEMENTS_COUNT_IN_ROW_IN_LARGE_GRID, } from '../constants';
 import { DateCalendarGridButtonLarge, DateCalendarGridLarge, DateCalendarHead, DateCalendarWrapper, } from '../DateCalendar';
 import { useCalendarNavigate } from '../hooks/useCalendarNavigate';

package/components/DatePicker/MonthPicker/hooks/useMonthsGrid/useMonthsGrid.d.ts

@@ -1,4 +1,4 @@
-import { type CalendarGridBuilder } from '../../../../types';
+import { type CalendarGridBuilder } from '../../../../types/CalendarGridBuilder';
 export type MonthItem = {
     /**
      * нормализованный день месяца для использования в календаре

package/components/DatePicker/YearPicker/hooks/useYearsGrid/useYearsGrid.d.ts

@@ -1,4 +1,4 @@
-import { type CalendarGridBuilder } from '../../../../types';
+import { type CalendarGridBuilder } from '../../../../types/CalendarGridBuilder';
 export type YearItem = {
     /**
      * номер года для рендера в календаре