@plesk/ui-library 3.35.1 → 3.35.3

package/types/src/components/Grid/Grid.d.ts

@@ -0,0 +1,97 @@
+import { Component, ReactNode } from 'react';
+import { ContentRect } from 'react-measure';
+import './Grid.less';
+declare type ColumnsNumber = 1 | 2 | 3 | 4 | 5 | 6 | 'auto';
+declare type CalculateMaxColumns = (options: {
+    width: number;
+}) => number;
+export interface GridProps {
+    /**
+     * Content of the `Grid`.
+     * @since 0.0.48
+     */
+    children?: ReactNode;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+    /**
+     * Minimal column width
+     * @since 0.0.50
+     */
+    minColumnWidth?: number;
+    /**
+     * Maximum columns number
+     * @since 0.0.53
+     */
+    maxColumnsNumber?: number | CalculateMaxColumns;
+    /**
+     * Number of columns for `xs` breakpoint
+     * @since 0.0.53
+     */
+    xs?: ColumnsNumber;
+    /**
+     * Number of columns for `sm` breakpoint
+     * @since 0.0.48
+     */
+    sm?: ColumnsNumber;
+    /**
+     * Number of columns for `md` breakpoint
+     * @since 0.0.48
+     */
+    md?: ColumnsNumber;
+    /**
+     * Number of columns for `lg` breakpoint
+     * @since 0.0.48
+     */
+    lg?: ColumnsNumber;
+    /**
+     * Number of columns for `xl` breakpoint
+     * @since 0.0.48
+     */
+    xl?: ColumnsNumber;
+    /**
+     * Specifying the gutters between grid items
+     * @since 0.0.53
+     */
+    gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    /**
+     * Columns number change notifier
+     * @since 0.0.50
+     */
+    onColumnsChange?: (columnsNumber: number) => void;
+}
+interface GridState {
+    xs: ColumnsNumber | number | undefined;
+}
+/**
+ * `Grid` component is used to layout and align content based on 12-column system.
+ * @since 0.0.48
+ */
+declare class Grid extends Component<GridProps, GridState> {
+    static defaultProps: {
+        children: null;
+        className: null;
+        baseClassName: string;
+        minColumnWidth: null;
+        maxColumnsNumber: number;
+        xs: null;
+        sm: null;
+        md: null;
+        lg: null;
+        xl: null;
+        gap: null;
+        onColumnsChange: null;
+    };
+    state: {
+        xs: ColumnsNumber | undefined;
+    };
+    handleResize: ({ bounds }: ContentRect) => void;
+    getGapSize(): 0 | 8 | 12 | 16 | 24 | 32;
+    render(): JSX.Element;
+}
+export default Grid;

package/types/src/components/Grid/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Grid';
+export type { GridProps } from './Grid';

package/types/src/components/GridCol/GridCol.d.ts

@@ -0,0 +1,53 @@
+import { ReactNode, HTMLAttributes } from 'react';
+declare type GridColSize = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+export interface GridColProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Content of the `GridCol`.
+     * @since 0.0.48
+     */
+    children?: ReactNode;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+    /**
+     * Column size for `xs` breakpoint
+     * @type number (1...12)
+     * @since 0.0.53
+     */
+    xs?: GridColSize;
+    /**
+     * Column size for `sm` breakpoint
+     * @type number (1...12)
+     * @since 0.0.53
+     */
+    sm?: GridColSize;
+    /**
+     * Column size for `sm` breakpoint
+     * @type number (1...12)
+     * @since 0.0.53
+     */
+    md?: GridColSize;
+    /**
+     * Column size for `md` breakpoint
+     * @type number (1...12)
+     * @since 0.0.53
+     */
+    lg?: GridColSize;
+    /**
+     * Column size for `lg` breakpoint
+     * @type number (1...12)
+     * @since 0.0.53
+     */
+    xl?: GridColSize;
+}
+/**
+ * `GridCol` component is a part of [Grid](#!/Grid) component.
+ * @since 0.0.48
+ */
+declare const GridCol: ({ baseClassName, className, children, xs, sm, md, lg, xl, ...props }: GridColProps) => JSX.Element;
+export default GridCol;

package/types/src/components/GridCol/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './GridCol';
+export type { GridColProps } from './GridCol';

package/types/src/components/Icon/constants.d.ts

@@ -1,3 +1,3 @@
 export declare const NAMES_12: IconName[];
-export declare type IconName = 'archive' | 'arrow-back' | 'arrow-diagonal-out' | 'arrow-down' | 'arrow-down-in' | 'arrow-down-out' | 'arrow-down-tray' | 'arrow-left' | 'arrow-right' | 'arrow-right-circle-filled' | 'arrow-right-in' | 'arrow-right-out' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-in' | 'arrow-up-in-cloud' | 'arrow-up-out' | 'arrow-up-tray' | 'arrows-four-directions' | 'arrows-inward' | 'arrows-loop' | 'arrows-opposite' | 'arrows-outward' | 'backup' | 'backup2' | 'bar-chart-vertical' | 'bar-chart-vertical-arrow-up' | 'bar-chart-vertical-lock' | 'bell' | 'book-email' | 'boundary' | 'box-diagonal-bottom-in' | 'box-diagonal-top-in' | 'brush' | 'bug' | 'calendar' | 'calendar-clock' | 'camera' | 'card' | 'card-ribbon' | 'card-row' | 'card-tile' | 'cd' | 'cd-up-in-cloud' | 'chain' | 'chain-broken' | 'chat' | 'check-list' | 'check-mark' | 'check-mark-circle' | 'check-mark-circle-filled' | 'chevron-double-down' | 'chevron-double-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'chevron-up' | 'circle-diagonal' | 'clean' | 'clip' | 'clock' | 'clone' | 'cloud' | 'cloud-checkmark' | 'cloud-crossed' | 'cloud-graph' | 'code' | 'connection' | 'console' | 'console-filled' | 'copy' | 'copy-indicator' | 'cpu' | 'crane' | 'credit-cards' | 'cross-mark' | 'cross-mark-circle' | 'cross-mark-circle-filled' | 'crown-transfer' | 'dashboard' | 'database' | 'database-box' | 'database-filled' | 'database-plus' | 'deploy' | 'docker-filled' | 'dollar' | 'dollar-filled' | 'dot' | 'emoticon-confused' | 'emoticon-dead' | 'emoticon-excited' | 'emoticon-happy' | 'emoticon-neutral' | 'emoticon-sad' | 'emoticon-smile' | 'enter' | 'exclamation-mark-circle' | 'exclamation-mark-circle-filled' | 'eye' | 'eye-closed' | 'facebook' | 'facebook-filled' | 'feedback' | 'filter' | 'filter-check-mark' | 'fire' | 'flag' | 'flag-filled' | 'flag-globe' | 'floppy-disk' | 'folder-closed' | 'folder-key' | 'folder-network' | 'folder-open' | 'folders-tree' | 'forward-circle-filled' | 'four-squares' | 'gear' | 'git' | 'github' | 'globe' | 'hard-drive' | 'hard-drive-key' | 'hat' | 'hexagons' | 'home' | 'info-circle' | 'info-circle-filled' | 'ip-addresses' | 'joomla' | 'kebab' | 'key' | 'laravel' | 'lifebuoy' | 'lightbulb' | 'limit' | 'linux' | 'list' | 'list-check-mark' | 'location' | 'lock-closed' | 'lock-closed-check' | 'lock-closed-filled' | 'lock-open' | 'lock-open-cross' | 'lock-open-filled' | 'mail' | 'mail-circle-filled' | 'mail-settings' | 'megaphone' | 'menu' | 'menu-thin' | 'microsoft' | 'minimize' | 'minus' | 'minus-circle' | 'minus-circle-filled' | 'monitoring' | 'monitoring-off' | 'my-little-admin' | 'net' | 'nine-dots' | 'node-js' | 'package' | 'panel' | 'panel-check' | 'panel-eye' | 'panel-key' | 'panel-settings' | 'panels' | 'pause-circle' | 'pencil' | 'pencil-dialog' | 'php' | 'phpmyadmin' | 'pin' | 'pipette' | 'plans' | 'plugins' | 'plus' | 'power' | 'projects' | 'puzzle' | 'python' | 'question-mark-circle' | 'question-mark-circle-filled' | 'ram' | 'react-js' | 'recycle' | 'redirect-circle-filled' | 'refresh' | 'reload' | 'remove' | 'reset' | 'resource' | 'ribbon' | 'rocket' | 'ruby' | 'sand-clock' | 'scan' | 'screen' | 'search' | 'security-check' | 'send' | 'server' | 'servers' | 'share' | 'shield' | 'shield-attention-filled' | 'shield-chain' | 'shield-filled' | 'shopping-cart' | 'sidebar-right-hide' | 'sidebar-right-show' | 'signal-light' | 'site-page' | 'sleep' | 'sliders' | 'square-with-circles' | 'star' | 'star-circle-filled' | 'star-filled' | 'star-half-filled' | 'start' | 'start-circle' | 'start-filled' | 'stop' | 'stop-circle' | 'storage' | 'themes' | 'three-dots-horizontal' | 'three-dots-vertical' | 'tools' | 'transfer' | 'triangle-exclamation-mark' | 'triangle-exclamation-mark-filled' | 'unarchive' | 'user' | 'volume' | 'web' | 'web-plus' | 'web-settings' | 'windows' | 'woocommerce' | 'wordpress' | 'zero-circle-filled';
+export declare type IconName = 'archive' | 'arrow-back' | 'arrow-diagonal-out' | 'arrow-down' | 'arrow-down-circle-filled' | 'arrow-down-in' | 'arrow-down-out' | 'arrow-down-tray' | 'arrow-left' | 'arrow-left-circle-filled' | 'arrow-right' | 'arrow-right-circle-filled' | 'arrow-right-in' | 'arrow-right-out' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-circle-filled' | 'arrow-up-in' | 'arrow-up-in-cloud' | 'arrow-up-out' | 'arrow-up-tray' | 'arrows-four-directions' | 'arrows-inward' | 'arrows-loop' | 'arrows-opposite' | 'arrows-outward' | 'backup' | 'backup2' | 'bar-chart-vertical' | 'bar-chart-vertical-arrow-up' | 'bar-chart-vertical-lock' | 'bell' | 'book-email' | 'boundary' | 'box-diagonal-bottom-in' | 'box-diagonal-top-in' | 'brush' | 'bug' | 'calendar' | 'calendar-clock' | 'camera' | 'card' | 'card-ribbon' | 'card-row' | 'card-tile' | 'cd' | 'cd-up-in-cloud' | 'chain' | 'chain-broken' | 'chat' | 'check-list' | 'check-mark' | 'check-mark-circle' | 'check-mark-circle-filled' | 'chevron-double-down' | 'chevron-double-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'chevron-up' | 'circle-diagonal' | 'clean' | 'clip' | 'clock' | 'clone' | 'cloud' | 'cloud-checkmark' | 'cloud-crossed' | 'cloud-graph' | 'code' | 'connection' | 'console' | 'console-filled' | 'copy' | 'copy-indicator' | 'cpu' | 'crane' | 'credit-cards' | 'cross-mark' | 'cross-mark-circle' | 'cross-mark-circle-filled' | 'crown-transfer' | 'dashboard' | 'database' | 'database-box' | 'database-filled' | 'database-plus' | 'deploy' | 'docker-filled' | 'dollar' | 'dollar-filled' | 'dot' | 'dot-big' | 'emoticon-confused' | 'emoticon-dead' | 'emoticon-excited' | 'emoticon-happy' | 'emoticon-neutral' | 'emoticon-sad' | 'emoticon-smile' | 'enter' | 'exclamation-mark-circle' | 'exclamation-mark-circle-filled' | 'eye' | 'eye-closed' | 'facebook' | 'facebook-filled' | 'feedback' | 'filter' | 'filter-check-mark' | 'fire' | 'flag' | 'flag-filled' | 'flag-globe' | 'floppy-disk' | 'folder-closed' | 'folder-key' | 'folder-network' | 'folder-open' | 'folders-tree' | 'forward-circle-filled' | 'four-squares' | 'gear' | 'git' | 'github' | 'globe' | 'hard-drive' | 'hard-drive-key' | 'hat' | 'hexagons' | 'home' | 'info-circle' | 'info-circle-filled' | 'ip-addresses' | 'joomla' | 'kebab' | 'key' | 'laravel' | 'lifebuoy' | 'lightbulb' | 'limit' | 'linux' | 'list' | 'list-check-mark' | 'location' | 'lock-closed' | 'lock-closed-check' | 'lock-closed-filled' | 'lock-open' | 'lock-open-cross' | 'lock-open-filled' | 'mail' | 'mail-circle-filled' | 'mail-settings' | 'megaphone' | 'menu' | 'menu-thin' | 'microsoft' | 'minimize' | 'minus' | 'minus-circle' | 'minus-circle-filled' | 'monitoring' | 'monitoring-off' | 'my-little-admin' | 'net' | 'nine-dots' | 'node-js' | 'package' | 'panel' | 'panel-check' | 'panel-eye' | 'panel-key' | 'panel-settings' | 'panels' | 'pause-circle' | 'pencil' | 'pencil-dialog' | 'php' | 'phpmyadmin' | 'pin' | 'pipette' | 'plans' | 'plugins' | 'plus' | 'plus-circle' | 'plus-circle-filled' | 'power' | 'projects' | 'puzzle' | 'python' | 'question-mark-circle' | 'question-mark-circle-filled' | 'ram' | 'react-js' | 'recycle' | 'redirect-circle-filled' | 'refresh' | 'reload' | 'remove' | 'reset' | 'resource' | 'ribbon' | 'rocket' | 'ruby' | 'sand-clock' | 'scan' | 'screen' | 'search' | 'security-check' | 'send' | 'server' | 'servers' | 'share' | 'shield' | 'shield-attention-filled' | 'shield-chain' | 'shield-filled' | 'shopping-cart' | 'sidebar-right-hide' | 'sidebar-right-show' | 'signal-light' | 'site-page' | 'sleep' | 'sliders' | 'square-with-circles' | 'star' | 'star-circle-filled' | 'star-filled' | 'star-half-filled' | 'start' | 'start-circle' | 'start-filled' | 'stop' | 'stop-circle' | 'storage' | 'themes' | 'three-dots-horizontal' | 'three-dots-vertical' | 'tools' | 'transfer' | 'triangle-exclamation-mark' | 'triangle-exclamation-mark-filled' | 'unarchive' | 'user' | 'volume' | 'web' | 'web-plus' | 'web-settings' | 'windows' | 'woocommerce' | 'wordpress' | 'zero-circle-filled';
 export declare const NAMES: IconName[];

package/types/src/components/InPlaceEdit/InPlaceEdit.d.ts

@@ -0,0 +1,50 @@
+import { ChangeEvent, Component, ReactNode, KeyboardEvent, HTMLAttributes } from 'react';
+import './InPlaceEdit.less';
+export interface InPlaceEditProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /**
+     * Value of the component.
+     * @since 1.8.3
+     */
+    value?: ReactNode;
+    /**
+     * Event handler of value change with inline editing form.
+     * @since 1.8.3
+     */
+    onChange?: (value: string) => void;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+}
+declare type InPlaceEditState = {
+    editing: boolean;
+    draft: ReactNode;
+};
+/**
+ * This component allows users to edit a short text "in place" — in other words, straight in the interface, without
+ * opening additional dialog windows. If a text is large enough that it doesn't fit on a single line, you should
+ * give users a different way of editing the text.
+ * @since 1.8.3
+ */
+declare class InPlaceEdit extends Component<InPlaceEditProps, InPlaceEditState> {
+    static defaultProps: {
+        value: null;
+        onChange: null;
+        className: null;
+        baseClassName: string;
+    };
+    state: {
+        editing: boolean;
+        draft: string;
+    };
+    handleEdit: () => void;
+    handleEditKey: (event: KeyboardEvent<HTMLInputElement>) => void;
+    handleChange: (event: ChangeEvent<HTMLInputElement>) => void;
+    handleEditOk: () => void;
+    render(): JSX.Element;
+}
+export default InPlaceEdit;

package/types/src/components/InPlaceEdit/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './InPlaceEdit';
+export type { InPlaceEditProps } from './InPlaceEdit';

package/types/src/components/Input/Input.d.ts

@@ -4,7 +4,7 @@ import './Input.less';
 declare type RootProps = {
     [k: string]: any;
 } & HTMLProps<HTMLSpanElement>;
-declare type InputProps = {
+export declare type InputProps = {
     /**
      * The HTML input type.
      * @since 0.0.57

package/types/src/components/Input/index.d.ts

@@ -1 +1,2 @@
 export { default } from './Input';
+export type { InputProps } from './Input';

package/types/src/components/InputFile/InputFile.d.ts

@@ -1,6 +1,7 @@
 import { ReactNode } from 'react';
+import { DataAttributes } from '../../utils/types';
 import './InputFile.less';
-declare type InputFileProps = {
+export interface InputFileProps extends DataAttributes {
     /**
      * @ignore
      */
@@ -45,7 +46,7 @@ declare type InputFileProps = {
      * @since 3.28.1
      */
     accept?: string;
-};
+}
 /**
  * `InputFile` component is used for browsing and choosing a file from the local disk.
  * @since 3.2.0

package/types/src/components/InputFile/index.d.ts

@@ -1 +1,2 @@
 export { default } from './InputFile';
+export type { InputFileProps } from './InputFile';

package/types/src/components/InputNumber/InputNumber.d.ts

@@ -1,7 +1,7 @@
 import { FunctionComponent, ReactElement } from 'react';
 import { IconProps } from '../Icon';
 import './InputNumber.less';
-declare type InputNumberProps = {
+export interface InputNumberProps {
     /**
      * @ignore
      */
@@ -55,7 +55,7 @@ declare type InputNumberProps = {
      * @since 2.3.0
      */
     incrementIcon?: string | IconProps | ReactElement<any>;
-};
+}
 /**
  * `InputNumber` component is used for entering integer numbers.
  * @since 2.2.0

package/types/src/components/InputNumber/index.d.ts

@@ -1 +1,2 @@
 export { default } from './InputNumber';
+export type { InputNumberProps } from './InputNumber';

package/types/src/components/Layout/Layout.d.ts

@@ -0,0 +1,161 @@
+import { Component, ReactNode } from 'react';
+import { ContentRect } from 'react-measure';
+import '../../helpers/base.less';
+import './Layout.less';
+declare type CollapsedState = 'responsive' | 'desktop';
+export interface LayoutProps {
+    /**
+     * Type of the `Layout`
+     * @since 1.4.0
+     */
+    type?: 'fluid' | 'simplified';
+    /**
+     * Header content.
+     * @since 1.4.0
+     */
+    header?: ReactNode;
+    /**
+     * Define header position - always on top (fixed) or static.
+     * @since 1.4.0
+     */
+    headerFixed?: boolean;
+    /**
+     * Additional content at the top of the header.
+     * @since 3.2.0
+     */
+    headerAddon?: ReactNode;
+    /**
+     * Sidebar content.
+     * @since 1.4.0
+     */
+    sidebar?: ReactNode;
+    /**
+     * Sidebar type.
+     * @since 3.2.0
+     */
+    sidebarType?: 'collapsed' | 'folded';
+    /**
+     * Define if sidebar can collapse.
+     * @since 1.4.0
+     */
+    sidebarCollapsible?: boolean;
+    /**
+     * Sidebar collapsed state.
+     * A boolean value is used for desktop mode only, but you can set an array with collapsed states for all modes, e.g. `['responsive', 'desktop']`.
+     *
+     * @since 1.4.0
+     */
+    sidebarCollapsed?: boolean | CollapsedState[];
+    /**
+     * Additional content between header and main content.
+     * @since 1.4.0
+     */
+    contentAddon?: ReactNode;
+    /**
+     * Content header.
+     * @since 3.0.0
+     */
+    contentHeader?: ReactNode;
+    /**
+     * Footer content.
+     * @since 1.4.0
+     */
+    footer?: ReactNode;
+    /**
+     * Main content of the `Layout`.
+     * @since 1.4.0
+     */
+    children?: ReactNode;
+    /**
+     * Width of the content
+     * @since 3.0.0
+     */
+    width?: 'sm' | 'md' | 'lg';
+    /**
+     * Sidebar onToggle handler.
+     * The handler is called with two args:
+     *
+     * * Whether collapsed or not.
+     * * In which mode: responsive or desktop.
+     *
+     * @since 1.4.0
+     */
+    onSidebarToggle?: (sidebarClosed: boolean, state: CollapsedState) => void;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+}
+declare type LayoutState = {
+    isSidebarClosedDesktop?: boolean;
+    isSidebarClosedResponsive?: boolean;
+    headerHeight?: number | null;
+    isResponsive?: boolean;
+    prevSidebarCollapsed?: LayoutProps['sidebarCollapsed'];
+};
+/**
+ * @since 1.4.0
+ */
+export default class Layout extends Component<LayoutProps, LayoutState> {
+    static defaultProps: {
+        type: string;
+        header: undefined;
+        headerFixed: boolean;
+        headerAddon: undefined;
+        sidebar: undefined;
+        sidebarType: string;
+        sidebarCollapsible: boolean;
+        sidebarCollapsed: boolean;
+        contentAddon: undefined;
+        contentHeader: undefined;
+        footer: undefined;
+        width: undefined;
+        onSidebarToggle: undefined;
+        children: undefined;
+        className: undefined;
+        baseClassName: string;
+    };
+    state: {
+        isSidebarClosedDesktop: boolean;
+        isSidebarClosedResponsive: boolean;
+        headerHeight: null;
+        isResponsive: boolean;
+    };
+    static getDerivedStateFromProps(props: LayoutProps, state: LayoutState): LayoutState;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    private readonly headerRef;
+    private readonly sidebarRef;
+    private readonly responsiveSidebarTogglerRef;
+    private unsubscribeMatchMedia?;
+    private unsubscribeClickOutside?;
+    handleMatchMedia: ({ matches }: MediaQueryListEvent | MediaQueryList) => void;
+    handleClickOutside: () => void;
+    handleToggle: () => void;
+    handleResize: ({ bounds }: ContentRect) => void;
+    getSidebarClosed: () => boolean;
+    renderHeader({ header }: {
+        header: ReactNode;
+    }): JSX.Element | null;
+    renderContentAddon({ contentAddon }: {
+        contentAddon: ReactNode;
+    }): JSX.Element | null;
+    renderContentHeader({ contentHeader }: {
+        contentHeader: ReactNode;
+    }): JSX.Element | null;
+    renderSidebar({ sidebar }: {
+        sidebar: ReactNode;
+    }): JSX.Element | null;
+    renderMainContent({ children }: {
+        children: ReactNode;
+    }): JSX.Element;
+    renderFooter({ footer }: {
+        footer: ReactNode;
+    }): JSX.Element | null;
+    render(): JSX.Element;
+}
+export {};

package/types/src/components/Layout/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Layout';
+export type { LayoutProps } from './Layout';

package/types/src/components/Link/Link.d.ts

@@ -42,8 +42,7 @@ export declare type LinkProps<Component extends ElementType = 'a'> = {
 } & PolymorphicComponentProps<Component, BaseLinkProps>;
 /**
  * `Link` is used for navigation purposes.
- *
- * Since: 1.9.0
+ * @since 1.9.0
  */
 declare const Link: <Component extends ElementType<any> = "a">({ baseClassName, className, onClick, disabled, pseudo, component, children, ...other }: LinkProps<Component>) => JSX.Element;
 export default Link;

package/types/src/components/LocaleProvider/LocaleProvider.d.ts

@@ -7,7 +7,7 @@ declare type Messages = {
 declare type Translate = (key: string, params?: {
     [key: string]: unknown;
 }, fallback?: string) => string | ReactNode[];
-export declare const useTranslate: (namespace?: string | undefined) => Translate;
+export declare const useTranslate: (namespace?: string) => Translate;
 declare type LocaleProviderProps = {
     /**
      * Localization messages

package/types/src/components/Media/Media.d.ts

@@ -0,0 +1,66 @@
+import { ReactNode, HTMLProps } from 'react';
+import './Media.less';
+export interface MediaProps extends Omit<HTMLProps<HTMLDivElement>, 'title'> {
+    /**
+     * Title
+     * @since 0.0.45
+     */
+    title?: ReactNode;
+    /**
+     * Title addon
+     * @since 0.0.68
+     */
+    titleAddon?: ReactNode;
+    /**
+     * Title size
+     * @deprecated Pass a component as a title prop
+     * @since 0.0.68
+     */
+    titleSize?: 'md' | 'lg' | 'xl';
+    /**
+     * Image
+     * @since 0.0.45
+     */
+    image?: ReactNode;
+    /**
+     * Spacings between image and content
+     * @since 0.3.0
+     */
+    imageSpacing?: 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+    /**
+     * Media object and content alignment
+     * @since 3.19.0
+     */
+    align?: 'start' | 'center' | 'end';
+    /**
+     * Media object (image) alignment
+     * @since 3.19.0
+     */
+    imageAlign?: 'start' | 'center' | 'end';
+    /**
+     * Media vertical direction
+     * @since 3.19.0
+     */
+    vertical?: boolean;
+    /**
+     * Content of the `Media`.
+     * @since 0.0.45
+     */
+    children?: ReactNode;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+}
+/**
+ * `Media` component is a combination of icon, text title and content.
+ * This layout was so widely spread in our products so we have decided to create a special component for it.
+ * Probably we should have named the component differently (not Media), but we didn't have better idea then ;)
+ * @since 0.0.45
+ */
+declare const Media: ({ className, children, title, titleAddon, titleSize, image, imageSpacing, imageAlign, align, vertical, baseClassName, ...props }: MediaProps) => JSX.Element;
+export default Media;

package/types/src/components/Media/MediaSection.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode } from 'react';
+export interface MediaSectionProps {
+    /**
+     * Content of the `MediaSection`.
+     * @since 0.0.68
+     */
+    children?: ReactNode;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+}
+/**
+ * `MediaSection` is a part of [Media](#!/Media) component.
+ * @since 0.0.68
+ */
+declare const MediaSection: ({ className, children, baseClassName, ...props }: MediaSectionProps) => JSX.Element;
+export default MediaSection;

package/types/src/components/Media/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from './Media';
+export type { MediaProps } from './Media';
+export { default as MediaSection } from './MediaSection';
+export type { MediaSectionProps } from './MediaSection';

package/types/src/components/Menu/Menu.d.ts

@@ -0,0 +1,40 @@
+import { ReactNode, HTMLAttributes } from 'react';
+import '../../helpers/base.less';
+import './Menu.less';
+export interface MenuProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Triggered when menu item was clicked.
+     * @since 0.0.56
+     */
+    onItemClick?: () => void;
+    /**
+     * Content of the `Menu`.
+     * @since 0.0.55
+     */
+    children?: ReactNode;
+    /**
+     * Show menu in overlay.
+     * @ignore
+     */
+    overlay?: boolean;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+}
+/**
+ * `Menu` component displays grouped controls for navigating the UI, performing actions on objects, or showing
+ * options for [Lists](#!/List) (for example, sorting and filtering settings). `Menu` is most typically used in a
+ * [Dropdown](#!/Dropdown).
+ *
+ * `Menu` consists of several [Menu Items](#!/MenuItem) (or [Selectable Menu
+ * Items](#!/MenuSelectableItem)) which can be grouped by [Menu Headers](#!/MenuHeader)
+ * or separated by [Menu Dividers](#!/MenuDivider).
+ * @since 0.0.55
+ */
+declare const Menu: import("react").ForwardRefExoticComponent<MenuProps & import("react").RefAttributes<HTMLElement>>;
+export default Menu;

package/types/src/components/Menu/MenuBaseItem.d.ts

@@ -0,0 +1,41 @@
+import { ElementType, ReactNode } from 'react';
+import { IconName, IconProps } from '../Icon';
+import { PolymorphicComponentProps } from '../../utils/types';
+declare type MenuBaseItemBaseProps = {
+    /**
+     * Icon
+     * @since 0.0.60
+     */
+    icon?: IconName | IconProps | ReactNode;
+    /**
+     * Right label of item.
+     * @since 0.0.60
+     */
+    label?: ReactNode;
+    /**
+     * Content of the `MenuBaseItem`.
+     * @since 0.0.60
+     */
+    children?: ReactNode;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+};
+export declare type MenuBaseItemProps<Component extends ElementType = 'div'> = {
+    /**
+     * Component to render as the root element. Useful when rendering a `MenuBaseItem` as other component or tag.
+     * @since 1.9.1
+     */
+    component?: Component;
+} & PolymorphicComponentProps<Component, MenuBaseItemBaseProps>;
+/**
+ * `MenuBaseItem` component.
+ * @since 0.0.60
+ */
+declare const MenuBaseItem: ({ className, children, icon, label, component: Component, baseClassName, ...props }: MenuBaseItemProps) => JSX.Element;
+export default MenuBaseItem;