@plesk/ui-library 3.35.2 → 3.35.3

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

@@ -0,0 +1,145 @@
+import { Component, MouseEvent, ReactNode } from 'react';
+import { ContentRect } from 'react-measure';
+import { FormContextProps } from '../Form/types';
+import { InPlaceEditProps } from '../InPlaceEdit';
+import './Section.less';
+export interface SectionProps {
+    /**
+     * Title of the section.
+     * @since 0.0.54
+     */
+    title?: ReactNode;
+    /**
+     * Visual intent color to apply to component.
+     * @since 0.0.54
+     */
+    intent?: 'danger' | 'warning' | 'success' | 'inactive';
+    /**
+     * Is section collapsible.
+     * @since 0.0.54
+     */
+    collapsible?: boolean;
+    /**
+     * Is section collapsed now.
+     * @since 0.0.54
+     */
+    collapsed?: boolean;
+    /**
+     * Event handler of title change with inline editing form.
+     * @since 0.0.54
+     */
+    onTitleChange?: InPlaceEditProps['onChange'];
+    /**
+     * Event handler of closing section with X-sign at the right.
+     * @since 0.0.54
+     */
+    onClose?: () => void;
+    /**
+     * A callback executed when the section collapsing.
+     * @since 3.26.0
+     */
+    onToggle?: (collapsed: boolean) => void;
+    /**
+     * Array of custom section action button at the right.
+     * @since 0.0.54
+     */
+    buttons?: ReactNode[];
+    /**
+     * Vertical or horizontal section view.
+     * Section view will be automatically switched if this parameter is not specified explicitly.
+     * @since 0.3.0
+     */
+    vertical: boolean;
+    /**
+     * Content of the `Section`.
+     * @since 0.0.54
+     */
+    children: ReactNode;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+    /**
+     * @ignore
+     */
+    form?: FormContextProps;
+}
+interface DerivedState {
+    prevCollapsed?: boolean;
+    prevErrors?: Record<string, any>;
+    collapsed?: boolean;
+}
+interface SectionState extends DerivedState {
+    vertical: boolean;
+}
+export declare const SECTION_BASE_CLASS_NAME: string;
+declare class Section extends Component<SectionProps, SectionState> {
+    static defaultProps: {
+        title: undefined;
+        intent: undefined;
+        collapsible: boolean;
+        collapsed: boolean;
+        onTitleChange: undefined;
+        onClose: undefined;
+        onToggle: undefined;
+        buttons: undefined;
+        vertical: undefined;
+        children: undefined;
+        className: undefined;
+        baseClassName: string;
+        form: undefined;
+    };
+    state: SectionState;
+    static getDerivedStateFromProps(props: SectionProps, state: SectionState): DerivedState;
+    handleResize: ({ bounds }: ContentRect) => void;
+    handleCollapse: (e: MouseEvent<HTMLButtonElement>) => void;
+    renderCollapseButton({ baseClassName, collapsible, }: {
+        baseClassName: string;
+        collapsible: boolean;
+    }): false | JSX.Element;
+    renderCloseButton({ baseClassName, onClose, buttons, }: {
+        baseClassName: string;
+        onClose: SectionProps['onClose'];
+        buttons: SectionProps['buttons'];
+    }): JSX.Element | undefined;
+    renderTitle({ baseClassName, title, onTitleChange, }: {
+        baseClassName: string;
+        title: SectionProps['title'];
+        onTitleChange: SectionProps['onTitleChange'];
+    }): false | "" | 0 | JSX.Element | null | undefined;
+    renderContent({ collapsible, children }: {
+        collapsible: boolean;
+        children: ReactNode;
+    }): ReactNode;
+    render(): JSX.Element;
+}
+/**
+ * `Section` component is used for dividing of complex content into groups for better readability
+ * and comprehension of the presented information.
+ * @since 0.0.54
+ */
+declare const SectionWrapper: {
+    (props: Omit<SectionProps, 'form'>): JSX.Element;
+    displayName: string;
+    defaultProps: {
+        title: undefined;
+        intent: undefined;
+        collapsible: boolean;
+        collapsed: boolean;
+        onTitleChange: undefined;
+        onClose: undefined;
+        onToggle: undefined;
+        buttons: undefined;
+        vertical: undefined;
+        children: undefined;
+        className: undefined;
+        baseClassName: string;
+        form: undefined;
+    };
+    WrappedComponent: typeof Section;
+};
+export default SectionWrapper;

package/types/src/components/Section/SectionItem.d.ts

@@ -0,0 +1,38 @@
+import { ReactNode, HTMLAttributes } from 'react';
+import './SectionItem.less';
+export interface SectionItemProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    /**
+     * Content of the `SectionItem`.
+     * @since 0.0.54
+     */
+    children?: ReactNode;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+    /**
+     * Title of the section item.
+     * @since 0.0.54
+     */
+    title?: ReactNode;
+    /**
+     * Is this section item contains actions? If it so than there should be extra whitespaces.
+     * @since 0.0.54
+     */
+    actions?: boolean;
+    /**
+     * @ignore
+     */
+    vertical?: boolean;
+}
+export declare const SECTION_ITEM_BASE_CLASS_NAME: string;
+/**
+ * `SectionItem` component is used for showing parameters and its values in [Section](#!/Section).
+ * @since 0.0.54
+ */
+declare const SectionItem: ({ baseClassName, className, children, title, actions, vertical, ...props }: SectionItemProps) => JSX.Element;
+export default SectionItem;

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

@@ -0,0 +1,5 @@
+export { default } from './Section';
+export { SECTION_BASE_CLASS_NAME } from './Section';
+export { default as SectionItem, SECTION_ITEM_BASE_CLASS_NAME } from './SectionItem';
+export type { SectionItemProps } from './SectionItem';
+export type { SectionProps } from './Section';

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

@@ -1,5 +1,6 @@
 import { ReactElement, ReactNode } from 'react';
-declare type SpotProps = {
+import { SpotPulsarProps } from './SpotPulsar';
+export interface SpotProps extends Omit<SpotPulsarProps, 'rect'> {
     /**
      * A css selector for the node that should be highlighted.
      * @since 3.0.1
@@ -61,7 +62,7 @@ declare type SpotProps = {
         current: number;
         total: number;
     };
-};
+}
 /**
  * The component can be used to attract the user's attention to a specific element on the page.
  * @since 3.0.1

package/types/src/components/Spot/SpotPulsar.d.ts

@@ -1,9 +1,11 @@
+import { HTMLAttributes } from 'react';
+import { DataAttributes } from '../../utils/types';
 import './SpotPulsar.less';
-declare type SpotPulsarProps = {
+export interface SpotPulsarProps extends HTMLAttributes<HTMLDivElement>, DataAttributes {
     baseClassName?: string;
     className?: string;
     rect: DOMRect;
     placement?: 'left' | 'center' | 'right';
-};
+}
 declare const SpotPulsar: import("react").ForwardRefExoticComponent<SpotPulsarProps & import("react").RefAttributes<HTMLDivElement>>;
 export default SpotPulsar;

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

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

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

@@ -0,0 +1,50 @@
+import { ReactElement, KeyboardEvent } from 'react';
+import './Subnav.less';
+export interface SubnavProps {
+    /**
+     * Subnav items
+     * @since 0.0.42
+     */
+    children?: ReactElement;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+    /**
+     * @ignore
+     */
+    onKeyDown?: (e: KeyboardEvent<HTMLDivElement>) => void;
+}
+/**
+ * `Subnav` component is used when you need a second level navigation under [Tabs](#!/Tabs) on the screen.
+ * @since 0.0.42
+ */
+declare const Subnav: ({ className, children, onKeyDown, baseClassName, ...props }: SubnavProps) => JSX.Element;
+export interface SubnavItemProps {
+    /**
+     * Is item active.
+     */
+    active?: boolean;
+    /**
+     * Content of the item
+     */
+    children: ReactElement;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+}
+/**
+ * SubnavItem component.
+ */
+declare const SubnavItem: ({ className, active, children, baseClassName, ...props }: SubnavItemProps) => ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export default Subnav;
+export { SubnavItem };

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

@@ -0,0 +1,2 @@
+export { default, SubnavItem } from './Subnav';
+export type { SubnavProps, SubnavItemProps } from './Subnav';

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

@@ -1,10 +1,10 @@
-import { Component, HTMLAttributes, SyntheticEvent } from 'react';
+import { Component, ComponentPropsWithoutRef, SyntheticEvent } from 'react';
 import './TextArea.less';
 declare type Rows = number | {
     min: number;
     max: number;
 };
-declare type TextAreaProps = {
+export declare type TextAreaProps = {
     /**
      * @ignore
      */
@@ -32,7 +32,7 @@ declare type TextAreaProps = {
      * @ignore
      */
     onChange?: (e: SyntheticEvent<HTMLTextAreaElement>) => void;
-} & Omit<HTMLAttributes<HTMLTextAreaElement>, 'rows'>;
+} & Omit<ComponentPropsWithoutRef<'textarea'>, 'rows'>;
 declare type TextAreaState = {
     textareaStyles: any;
     minRows?: number;

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

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

package/types/src/components/Toolbar/RegistryContext.d.ts

@@ -1,8 +1,8 @@
-declare type RegistryItem = {
+export declare type RegistryItem = {
     setCompact: (compact: boolean) => void;
     isCompact: (one: boolean) => boolean;
 };
-declare type Registry = {
+export declare type Registry = {
     stack: RegistryItem[];
     register: (item: RegistryItem) => void;
     unregister: (item: RegistryItem) => void;

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

@@ -0,0 +1,47 @@
+import { Component, ReactNode } from 'react';
+import { DistractionFreeMode } from '../DistractionFreeModeContext';
+import '../../helpers/base.less';
+import './Toolbar.less';
+/**
+ * `Toolbar` component is a panel containing various instruments used for managing the contents of a large content block.
+ * Toolbar is located on top of the managed content block.
+ * It typically consists of three main parts: controls that add new elements, controls that work with existing elements,
+ * and controls for changing the way the content block looks.
+ * @since 0.0.57
+ */
+export interface ToolbarProps {
+    /**
+     * Content of the `Toolbar`.
+     * @since 0.0.57
+     */
+    children?: ReactNode;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+}
+declare type ToolbarState = {
+    distractionFreeMode: DistractionFreeMode;
+};
+declare class Toolbar extends Component<ToolbarProps, ToolbarState> {
+    static defaultProps: {
+        children: null;
+        className: null;
+        baseClassName: string;
+    };
+    constructor(props: ToolbarProps);
+    state: {
+        distractionFreeMode: {
+            enabled: boolean;
+            toggle: () => void;
+        };
+    };
+    private readonly registry;
+    private measure;
+    render(): JSX.Element;
+}
+export default Toolbar;

package/types/src/components/Toolbar/ToolbarGroup.d.ts

@@ -0,0 +1,46 @@
+import { ReactNode, ReactChild } from 'react';
+import { Registry } from './RegistryContext';
+import { DistractionFreeMode } from '../DistractionFreeModeContext';
+/**
+ * `ToolbarGroup` is a part of [Toolbar](#!/Toolbar) component.
+ * It is used for grouping several toolbar controls together.
+ * @since 0.0.57
+ */
+export interface ToolbarGroupProps {
+    /**
+     * Title.
+     * @since 0.0.60
+     */
+    title: ReactChild;
+    /**
+     * Whether to group children into a dropdown or not.
+     * @since 3.8.0
+     */
+    groupable?: boolean;
+    /**
+     * Content of the `ToolbarGroup`.
+     * @since 0.0.57
+     */
+    children?: ReactNode;
+    /**
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @ignore
+     */
+    baseClassName?: string;
+    /**
+     * @ignore
+     */
+    registry: Registry;
+    /**
+     * @ignore
+     */
+    distractionFreeMode: DistractionFreeMode;
+}
+declare const ToolbarGroupWrapper: {
+    ({ groupable, baseClassName, ...props }: Omit<ToolbarGroupProps, 'registry' | 'distractionFreeMode'>): JSX.Element;
+    displayName: string;
+};
+export default ToolbarGroupWrapper;

package/types/src/components/Toolbar/ToolbarMenu.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode, MouseEvent } from 'react';
 declare type ToolbarMenuProps = {
-    onItemClick: (e: MouseEvent) => void;
+    onItemClick?: (e: MouseEvent) => void;
     children: ReactNode;
 };
 declare const ToolbarMenu: import("react").ForwardRefExoticComponent<ToolbarMenuProps & import("react").RefAttributes<HTMLElement>>;

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

@@ -0,0 +1,5 @@
+export { default } from './Toolbar';
+export type { ToolbarProps } from './Toolbar';
+export { default as ToolbarGroup } from './ToolbarGroup';
+export type { ToolbarGroupProps } from './ToolbarGroup';
+export { default as ToolbarExpander } from './ToolbarExpander';

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

@@ -1,6 +1,6 @@
 import { ReactElement } from 'react';
 import Spot from '../Spot';
-declare type TourProps = {
+export declare type TourProps = {
     /**
      * A number of current spot.
      * @since 2.7.0

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

@@ -15,8 +15,8 @@ export type { CarouselProps } from './Carousel';
 export { default as Checkbox } from './Checkbox';
 export { default as Radio } from './Radio';
 export { default as CodeEditor } from './CodeEditor';
-export { default as Columns } from './Columns';
-export * from './Columns';
+export { default as Columns, Column } from './Columns';
+export type { ColumnsProps, ColumnProps } from './Columns';
 export { default as ComboBox } from './ComboBox';
 export * from './ComboBox';
 export { default as ConsoleOutput } from './ConsoleOutput';
@@ -29,6 +29,7 @@ export type { DrawerProps } from './Drawer';
 export { default as Dropdown } from './Dropdown';
 export type { DropdownProps } from './Dropdown';
 export { default as InPlaceEdit } from './InPlaceEdit';
+export type { InPlaceEditProps } from './InPlaceEdit';
 export { default as ExtendedStatusMessage } from './ExtendedStatusMessage';
 export * from './ExtendedStatusMessage';
 export { default as Figure } from './Figure';
@@ -42,7 +43,9 @@ export type { FormFieldCheckboxProps } from './FormFieldCheckbox';
 export { default as FormFieldPassword } from './FormFieldPassword';
 export * from './FormFieldPassword';
 export { default as FormFieldRadioButtons } from './FormFieldRadioButtons';
+export type { FormFieldRadioButtonsProps } from './FormFieldRadioButtons';
 export { default as FormFieldText } from './FormFieldText';
+export type { FormFieldTextProps } from './FormFieldText';
 export { default as FormFieldSelect } from './FormFieldSelect';
 export { default as Grid } from './Grid';
 export type { GridProps } from './Grid';
@@ -53,9 +56,13 @@ export { default as Hint } from './Hint';
 export { default as Icon } from './Icon';
 export type { IconProps, IconName, IconSize } from './Icon';
 export { default as Input } from './Input';
+export type { InputProps } from './Input';
 export { default as InputFile } from './InputFile';
+export type { InputFileProps } from './InputFile';
 export { default as InputNumber } from './InputNumber';
+export type { InputNumberProps } from './InputNumber';
 export { default as TextArea } from './TextArea';
+export type { TextAreaProps } from './TextArea';
 export { default as Select } from './Select';
 export * from './Select';
 export { default as Item } from './Item';
@@ -63,22 +70,25 @@ export { default as ItemLink } from './ItemLink';
 export { default as ItemList } from './ItemList';
 export { default as Label } from './Label';
 export { default as Layout } from './Layout';
+export type { LayoutProps } from './Layout';
 export { default as List } from './List';
 export * from './List';
 export { default as LocaleProvider } from './LocaleProvider';
 export * from './LocaleProvider';
 export { default as Markdown } from './Markdown';
-export { default as Media } from './Media';
-export * from './Media';
-export { default as Menu } from './Menu';
-export * from './Menu';
+export { default as Media, MediaSection } from './Media';
+export type { MediaSectionProps, MediaProps } from './Media';
+export { default as Menu, MenuDivider, MenuHeader, MenuItem, MenuSelectableItem } from './Menu';
+export type { MenuProps, MenuHeaderProps, MenuDividerProps, MenuItemProps, MenuSelectableItemProps, } from './Menu';
 export { default as Overlay } from './Overlay';
 export { default as PageHeader } from './PageHeader';
 export { default as Pagination } from './Pagination';
 export { default as Panel } from './Panel';
 export { default as Paragraph } from './Paragraph';
 export { default as Plaintext } from './Plaintext';
+export type { PlainTextProps } from './Plaintext';
 export { default as Popover } from './Popover';
+export type { PopoverProps } from './Popover';
 export { default as Progress } from './Progress';
 export type { ProgressProps } from './Progress';
 export { default as ProgressBar } from './ProgressBar';
@@ -93,12 +103,13 @@ export { default as Section } from './Section';
 export * from './Section';
 export { default as SegmentedControl } from './SegmentedControl';
 export { default as Spot } from './Spot';
+export type { SpotProps } from './Spot';
 export { default as SplitButton } from './SplitButton';
 export type { SplitButtonProps } from './SplitButton';
 export { default as Status } from './Status';
 export { default as StatusMessage } from './StatusMessage';
-export { default as Subnav } from './Subnav';
-export * from './Subnav';
+export { default as Subnav, SubnavItem } from './Subnav';
+export type { SubnavProps, SubnavItemProps } from './Subnav';
 export { default as Switch } from './Switch';
 export type { SwitchProps } from './Switch';
 export { default as SwitchesPanel } from './SwitchesPanel';
@@ -109,8 +120,8 @@ export { default as Tabs } from './Tabs';
 export * from './Tabs';
 export { default as Text } from './Text';
 export { default as Toaster } from './Toaster';
-export { default as Toolbar } from './Toolbar';
-export * from './Toolbar';
+export { default as Toolbar, ToolbarGroup, ToolbarExpander } from './Toolbar';
+export type { ToolbarGroupProps, ToolbarProps } from './Toolbar';
 export { default as Tooltip } from './Tooltip';
 export type { TooltipProps } from './Tooltip';
 export { default as Tour } from './Tour';

package/types/src/utils/types/DataAttributes.d.ts

@@ -0,0 +1,3 @@
+export interface DataAttributes {
+    [dataAttribute: `data-${string}`]: unknown;
+}

package/types/src/utils/types/index.d.ts

@@ -1 +1,2 @@
+export type { DataAttributes } from './DataAttributes';
 export type { PolymorphicComponentProps, PolymorphicComponentPropsWithRef, } from './PolymorphicComponent';

package/cjs/tests/index.js

@@ -1,13 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function () {
-    return _renderer.default;
-  }
-});
-var _renderer = _interopRequireDefault(require("./renderer"));

package/cjs/tests/renderer.js

@@ -1,33 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("@testing-library/react");
-var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
-var _jsxRuntime = require("react/jsx-runtime");
-// Copyright 2023. Plesk International GmbH. All rights reserved.
-
-const renderer = (Component, baseProps) => propOverrides => {
-  const {
-    asFragment,
-    rerender
-  } = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
-    ...baseProps,
-    ...propOverrides
-  }));
-  return {
-    asFragment,
-    user: _userEvent.default,
-    rerender: rerenderPropsOverrides => rerender( /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
-      ...baseProps,
-      ...propOverrides,
-      ...rerenderPropsOverrides
-    })),
-    ...baseProps
-  };
-};
-var _default = renderer;
-exports.default = _default;

package/esm/tests/index.js

@@ -1,3 +0,0 @@
-// Copyright 2023. Plesk International GmbH. All rights reserved.
-
-export { default } from './renderer';

package/esm/tests/renderer.js

@@ -1,25 +0,0 @@
-// Copyright 2023. Plesk International GmbH. All rights reserved.
-
-import { render } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { jsx as _jsx } from "react/jsx-runtime";
-const renderer = (Component, baseProps) => propOverrides => {
-  const {
-    asFragment,
-    rerender
-  } = render( /*#__PURE__*/_jsx(Component, {
-    ...baseProps,
-    ...propOverrides
-  }));
-  return {
-    asFragment,
-    user: userEvent,
-    rerender: rerenderPropsOverrides => rerender( /*#__PURE__*/_jsx(Component, {
-      ...baseProps,
-      ...propOverrides,
-      ...rerenderPropsOverrides
-    })),
-    ...baseProps
-  };
-};
-export default renderer;