@broxus/react-uikit 0.1.2 → 0.2.0

package/dist/cjs/components/Icon/Button.js

@@ -25,11 +25,8 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Button = void 0;
 const React = __importStar(require("react"));
-const Icon_1 = require("./Icon");
-function Button(props) {
-    return (React.createElement(Icon_1.Icon, { component: "button", role: "button", type: "button", ...props }));
-}
-exports.Button = Button;
+const Icon_1 = require("../Icon/Icon");
+exports.Button = React.memo((props) => (React.createElement(Icon_1.Icon, { ...props, component: "button", role: "button", type: "button" })));
 if (process.env.NODE_ENV !== 'production') {
-    Button.displayName = 'Icon.Button';
+    exports.Button.displayName = 'Icon.Button';
 }

package/dist/cjs/components/Icon/Icon.d.ts

@@ -1,13 +1,11 @@
 import * as React from 'react';
-import type { PolymorphicComponentProps } from '../Component';
-export declare type IconOwnProps = {
+import { type PolymorphicProps } from '../Component';
+export type IconOwnProps = {
     icon: string;
     material?: boolean;
     mode?: 'button' | 'image' | 'link';
     prefixCls?: string;
     round?: boolean;
 };
-export declare type IconProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentProps<E, IconOwnProps>;
-declare const defaultElement = "span";
-export declare function Icon<E extends React.ElementType = typeof defaultElement>(props: IconProps<E>): JSX.Element | null;
-export {};
+export type IconProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<IconOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, IconOwnProps>;
+export declare const Icon: React.MemoExoticComponent<(<E extends React.ElementType<any> = "span">(props: IconProps<E>) => JSX.Element | null)>;

package/dist/cjs/components/Icon/Icon.js

@@ -32,17 +32,17 @@ const classnames_1 = __importDefault(require("classnames"));
 const Component_1 = require("../Component");
 const ConfrigProvider_1 = require("../ConfrigProvider");
 const defaultElement = 'span';
-function Icon(props) {
+exports.Icon = React.memo((props) => {
     const config = (0, ConfrigProvider_1.useConfig)();
-    const { children, className, icon, material = true, mode, prefixCls = `${config.prefixCls}-icon`, round, type, ...restProps } = props;
+    const { children, className, icon, material = true, mode, prefixCls = config.prefixCls, round, type, ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'icon'), [config, prefixCls]);
     if (!icon) {
         return null;
     }
-    return (React.createElement(Component_1.Component, { className: (0, classnames_1.default)(prefixCls, {
-            [`${prefixCls}-button`]: type === 'button',
-            [`${prefixCls}-material`]: material,
-            [`${prefixCls}-round`]: material && round,
-            [`${prefixCls}-${mode}`]: mode !== undefined,
+    return (React.createElement(Component_1.Component, { className: (0, classnames_1.default)(rootCls, {
+            [`${rootCls}-button`]: type === 'button',
+            [`${rootCls}-material`]: material,
+            [`${rootCls}-round`]: material && round,
+            [`${rootCls}-${mode}`]: mode !== undefined,
         }, className), component: defaultElement, ...restProps }, material ? React.createElement("i", null, icon) : children));
-}
-exports.Icon = Icon;
+});

package/dist/cjs/components/Icon/Link.d.ts

@@ -1,5 +1,3 @@
-import type { IconProps } from './Icon';
-export declare function Link(props: IconProps): JSX.Element;
-export declare namespace Link {
-    var displayName: string;
-}
+import * as React from 'react';
+import { type IconProps } from '../Icon/Icon';
+export declare const Link: React.MemoExoticComponent<(props: IconProps) => JSX.Element>;

package/dist/cjs/components/Icon/Link.js

@@ -25,11 +25,8 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Link = void 0;
 const React = __importStar(require("react"));
-const Icon_1 = require("./Icon");
-function Link(props) {
-    return (React.createElement(Icon_1.Icon, { component: "a", ...props, role: "button", type: "link" }));
-}
-exports.Link = Link;
+const Icon_1 = require("../Icon/Icon");
+exports.Link = React.memo((props) => (React.createElement(Icon_1.Icon, { ...props, component: "a", role: "button", type: "link" })));
 if (process.env.NODE_ENV !== 'production') {
-    Link.displayName = 'Icon.Link';
+    exports.Link.displayName = 'Icon.Link';
 }

package/dist/cjs/components/Icon/default-svg-props.d.ts

@@ -1,4 +1,4 @@
-export declare const defaultProps: {
+export declare const defaultSvgProps: {
     fill: string;
     viewBox: string;
     xmlns: string;

package/dist/cjs/components/Icon/default-svg-props.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.defaultProps = void 0;
-exports.defaultProps = {
+exports.defaultSvgProps = void 0;
+exports.defaultSvgProps = {
     fill: 'none',
     viewBox: '0 0 20 20',
     xmlns: 'http://www.w3.org/2000/svg',

package/dist/cjs/components/Icon/index.d.ts

@@ -1,13 +1,13 @@
-import { Button } from './Button';
-import { Link } from './Link';
-import type { PolymorphicComponent } from '../Component';
-import type { IconOwnProps, IconProps } from './Icon';
+import type * as React from 'react';
+import { Button } from '../Icon/Button';
+import { type IconOwnProps, type IconProps } from '../Icon/Icon';
+import { Link } from '../Icon/Link';
 import './index.scss';
-export * from './default-svg-props';
-export * from './get-size';
+export * from '../Icon/default-svg-props';
+export * from '../Icon/get-size';
 export type { IconProps, IconOwnProps };
-export declare type CompoundedIcon = PolymorphicComponent<IconOwnProps> & {
+export interface Icon extends React.MemoExoticComponent<React.FunctionComponent<IconProps>> {
     Button: typeof Button;
     Link: typeof Link;
-};
-export declare const Icon: CompoundedIcon;
+}
+export declare const Icon: Icon;

package/dist/cjs/components/Icon/index.js

@@ -15,12 +15,12 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Icon = void 0;
-const Button_1 = require("./Button");
-const Icon_1 = require("./Icon");
-const Link_1 = require("./Link");
+const Button_1 = require("../Icon/Button");
+const Icon_1 = require("../Icon/Icon");
+const Link_1 = require("../Icon/Link");
 require("./index.scss");
-__exportStar(require("./default-svg-props"), exports);
-__exportStar(require("./get-size"), exports);
+__exportStar(require("../Icon/default-svg-props"), exports);
+__exportStar(require("../Icon/get-size"), exports);
 exports.Icon = Icon_1.Icon;
 exports.Icon.Button = Button_1.Button;
 exports.Icon.Link = Link_1.Link;

package/dist/cjs/components/Iconnav/Iconnav.d.ts

@@ -3,4 +3,4 @@ export interface IconnavProps extends React.HTMLAttributes<HTMLUListElement> {
     prefixCls?: string;
     vertical?: boolean;
 }
-export declare function Iconnav(props: IconnavProps): JSX.Element;
+export declare const Iconnav: React.MemoExoticComponent<(props: IconnavProps) => JSX.Element>;

package/dist/cjs/components/Iconnav/Iconnav.js

@@ -30,11 +30,11 @@ exports.Iconnav = void 0;
 const React = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const ConfrigProvider_1 = require("../ConfrigProvider");
-function Iconnav(props) {
+exports.Iconnav = React.memo((props) => {
     const config = (0, ConfrigProvider_1.useConfig)();
-    const { className, prefixCls = `${config.prefixCls}-iconnav`, vertical, ...restProps } = props;
-    return (React.createElement("ul", { className: (0, classnames_1.default)(prefixCls, {
-            [`${prefixCls}-vertical`]: vertical,
+    const { className, prefixCls = config.prefixCls, vertical, ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'iconnav'), [config, prefixCls]);
+    return (React.createElement("ul", { className: (0, classnames_1.default)(rootCls, {
+            [`${rootCls}-vertical`]: vertical,
         }, className), ...restProps }));
-}
-exports.Iconnav = Iconnav;
+});

package/dist/cjs/components/Iconnav/Item.d.ts

@@ -1,9 +1,5 @@
 import * as React from 'react';
 export interface IconnavItemProps extends React.LiHTMLAttributes<HTMLLIElement> {
     isActive?: boolean;
-    prefixCls?: string;
-}
-export declare function Item(props: IconnavItemProps): JSX.Element;
-export declare namespace Item {
-    var displayName: string;
 }
+export declare const Item: React.MemoExoticComponent<(props: IconnavItemProps) => JSX.Element>;

package/dist/cjs/components/Iconnav/Item.js

@@ -30,14 +30,13 @@ exports.Item = void 0;
 const React = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const ConfrigProvider_1 = require("../ConfrigProvider");
-function Item(props) {
+exports.Item = React.memo((props) => {
     const config = (0, ConfrigProvider_1.useConfig)();
     const { children, className, isActive, ...restProps } = props;
     return (React.createElement("li", { className: (0, classnames_1.default)({
-            [`${config}-active`]: isActive,
+            [`${config.prefixCls}-active`]: isActive,
         }, className), ...restProps }, children));
-}
-exports.Item = Item;
+});
 if (process.env.NODE_ENV !== 'production') {
-    Item.displayName = 'Iconnav.Item';
+    exports.Item.displayName = 'Iconnav.Item';
 }

package/dist/cjs/components/Iconnav/index.d.ts

@@ -1,9 +1,9 @@
-import * as React from 'react';
-import { Item } from './Item';
-import type { IconnavProps } from './Iconnav';
+import type * as React from 'react';
+import { type IconnavProps } from '../Iconnav/Iconnav';
+import { Item } from '../Iconnav/Item';
 import './index.scss';
 export type { IconnavProps };
-export interface CompoundedIconnav extends React.FunctionComponent<IconnavProps> {
+export interface Iconnav extends React.MemoExoticComponent<React.FunctionComponent<IconnavProps>> {
     Item: typeof Item;
 }
-export declare const Iconnav: CompoundedIconnav;
+export declare const Iconnav: Iconnav;

package/dist/cjs/components/Iconnav/index.js

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Iconnav = void 0;
-const Iconnav_1 = require("./Iconnav");
-const Item_1 = require("./Item");
+const Iconnav_1 = require("../Iconnav/Iconnav");
+const Item_1 = require("../Iconnav/Item");
 require("./index.scss");
 exports.Iconnav = Iconnav_1.Iconnav;
 exports.Iconnav.Item = Item_1.Item;

package/dist/cjs/components/Label/index.d.ts

@@ -5,4 +5,4 @@ export interface LabelProps extends React.HTMLAttributes<HTMLSpanElement> {
     prefixCls?: string;
     type?: 'success' | 'warning' | 'danger';
 }
-export declare function Label(props: LabelProps): JSX.Element;
+export declare const Label: React.MemoExoticComponent<(props: LabelProps) => JSX.Element>;

package/dist/cjs/components/Label/index.js

@@ -31,12 +31,12 @@ const React = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const ConfrigProvider_1 = require("../ConfrigProvider");
 require("./index.scss");
-function Label(props) {
+exports.Label = React.memo((props) => {
     const config = (0, ConfrigProvider_1.useConfig)();
-    const { className, large, prefixCls = `${config.prefixCls}-label`, type, ...restProps } = props;
-    return (React.createElement("span", { className: (0, classnames_1.default)(prefixCls, {
-            [`${prefixCls}-${type}`]: type !== undefined,
-            [`${prefixCls}-large`]: large,
+    const { className, large, prefixCls = config.prefixCls, type, ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'label'), [config, prefixCls]);
+    return (React.createElement("span", { className: (0, classnames_1.default)(rootCls, {
+            [`${rootCls}-${type}`]: type !== undefined,
+            [`${rootCls}-large`]: large,
         }, className), ...restProps }));
-}
-exports.Label = Label;
+});

package/dist/cjs/components/Label/index.scss

@@ -25,7 +25,7 @@
     background: var(--label-background);
     border-radius: var(--label-border-radius);
     color: var(--label-color);
-    display: inline-block;
+    display: inline-flex;
     font-size: var(--label-font-size);
     line-height: var(--label-line-height);
     padding: var(--label-padding-vertical) var(--label-padding-horizontal);

package/dist/cjs/components/Link/index.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import type { PolymorphicComponentProps } from '../Component';
+import { type PolymorphicProps } from '../Component';
 import './index.scss';
 export interface LinkOwnProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
     prefixCls?: string;
     type?: 'heading' | 'muted' | 'reset' | 'text' | 'toggle';
 }
-export declare type LinkProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentProps<E, LinkOwnProps>;
-export declare const Link: React.ForwardRefExoticComponent<Pick<LinkProps<React.ElementType<any>>, string | number | symbol> & React.RefAttributes<unknown>>;
+export type LinkProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<LinkOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, LinkOwnProps>;
+export declare const Link: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<LinkProps<React.ElementType<any>>, "ref"> & React.RefAttributes<unknown>>>;

package/dist/cjs/components/Link/index.js

@@ -33,10 +33,16 @@ const Component_1 = require("../Component");
 const ConfrigProvider_1 = require("../ConfrigProvider");
 require("./index.scss");
 const defaultElement = 'a';
-exports.Link = React.forwardRef((props, ref) => {
+const ForwardedLink = React.forwardRef((props, ref) => {
     const config = (0, ConfrigProvider_1.useConfig)();
-    const { children, className, prefixCls = `${config.prefixCls}-link`, type, ...restProps } = props;
+    const { children, className, prefixCls = config.prefixCls, type, ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'link'), [config, prefixCls]);
     return (React.createElement(Component_1.Component, { ref: ref, className: (0, classnames_1.default)({
-            [`${prefixCls}-${type}`]: type !== undefined,
+            [`${rootCls}-${type}`]: type !== undefined,
         }, className), component: defaultElement, ...restProps }, children));
 });
+exports.Link = React.memo(ForwardedLink);
+if (process.env.NODE_ENV !== 'production') {
+    ForwardedLink.displayName = 'Link.Forwarded';
+    exports.Link.displayName = 'Link';
+}

package/dist/cjs/components/List/Item.d.ts

@@ -1,7 +1,4 @@
 import * as React from 'react';
-declare type Props = React.LiHTMLAttributes<HTMLLIElement>;
-export declare function Item(props: Props): JSX.Element;
-export declare namespace Item {
-    var displayName: string;
-}
+type Props = React.LiHTMLAttributes<HTMLLIElement>;
+export declare const Item: React.MemoExoticComponent<(props: Props) => JSX.Element>;
 export {};

package/dist/cjs/components/List/Item.js

@@ -25,10 +25,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Item = void 0;
 const React = __importStar(require("react"));
-function Item(props) {
-    return React.createElement("li", { ...props });
-}
-exports.Item = Item;
+exports.Item = React.memo((props) => React.createElement("li", { ...props }));
 if (process.env.NODE_ENV !== 'production') {
-    Item.displayName = 'List.Item';
+    exports.Item.displayName = 'List.Item';
 }

package/dist/cjs/components/List/List.d.ts

@@ -5,4 +5,4 @@ export interface ListProps extends React.HTMLAttributes<HTMLUListElement> {
     size?: 'large' | 'collapse';
     type?: 'bullet' | 'disc' | 'divider' | 'striped' | 'circle' | 'square' | 'decimal' | 'hyphen';
 }
-export declare function List(props: ListProps): JSX.Element;
+export declare const List: React.MemoExoticComponent<(props: ListProps) => JSX.Element>;

package/dist/cjs/components/List/List.js

@@ -30,13 +30,13 @@ exports.List = void 0;
 const React = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const ConfrigProvider_1 = require("../ConfrigProvider");
-function List(props) {
+exports.List = React.memo((props) => {
     const config = (0, ConfrigProvider_1.useConfig)();
-    const { className, color, prefixCls = `${config.prefixCls}-list`, size, type, ...restProps } = props;
-    return (React.createElement("ul", { className: (0, classnames_1.default)(prefixCls, {
-            [`${prefixCls}-${color}`]: color !== undefined,
-            [`${prefixCls}-${size}`]: size !== undefined,
-            [`${prefixCls}-${type}`]: type !== undefined,
+    const { className, color, prefixCls = config.prefixCls, size, type, ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'list'), [config, prefixCls]);
+    return (React.createElement("ul", { className: (0, classnames_1.default)(rootCls, {
+            [`${rootCls}-${color}`]: color !== undefined,
+            [`${rootCls}-${size}`]: size !== undefined,
+            [`${rootCls}-${type}`]: type !== undefined,
         }, className), ...restProps }));
-}
-exports.List = List;
+});

package/dist/cjs/components/List/index.d.ts

@@ -1,9 +1,9 @@
-import * as React from 'react';
-import { Item } from './Item';
-import type { ListProps } from './List';
+import type * as React from 'react';
+import { type ListProps } from '../List/List';
+import { Item } from '../List/Item';
 import './index.scss';
 export type { ListProps };
-export interface CompoundedList extends React.FunctionComponent<ListProps> {
+export interface List extends React.MemoExoticComponent<React.FunctionComponent<ListProps>> {
     Item: typeof Item;
 }
-export declare const List: CompoundedList;
+export declare const List: List;

package/dist/cjs/components/List/index.js

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.List = void 0;
-const List_1 = require("./List");
-const Item_1 = require("./Item");
+const List_1 = require("../List/List");
+const Item_1 = require("../List/Item");
 require("./index.scss");
 exports.List = List_1.List;
 exports.List.Item = Item_1.Item;

package/dist/cjs/components/Modal/Modal.d.ts

@@ -1,5 +1,6 @@
-import type { DialogProps } from 'rc-dialog';
-import type { Direction } from '../../types';
+import * as React from 'react';
+import { type DialogProps } from 'rc-dialog';
+import { type Direction } from '../../types';
 export interface ModalProps extends Omit<DialogProps, 'afterClose'> {
     centered?: boolean;
     direction?: Direction;
@@ -8,4 +9,4 @@ export interface ModalProps extends Omit<DialogProps, 'afterClose'> {
     type?: 'info' | 'success' | 'warning' | 'error' | 'confirm';
     onClosed?: () => void;
 }
-export declare function Modal(props: ModalProps): JSX.Element;
+export declare const Modal: React.MemoExoticComponent<(props: ModalProps) => JSX.Element>;

package/dist/cjs/components/Modal/Modal.js

@@ -29,16 +29,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Modal = void 0;
 const React = __importStar(require("react"));
 const js_utils_1 = require("@broxus/js-utils");
-const rc_dialog_1 = __importDefault(require("rc-dialog"));
 const classnames_1 = __importDefault(require("classnames"));
-const utils_1 = require("../../utils");
+const rc_dialog_1 = __importDefault(require("rc-dialog"));
 const Close_1 = require("../Close");
 const ConfrigProvider_1 = require("../ConfrigProvider");
+const utils_1 = require("../../utils");
 let mousePosition;
-const getClickPosition = (e) => {
+const getClickPosition = (event) => {
     mousePosition = {
-        x: e.pageX,
-        y: e.pageY,
+        x: event.pageX,
+        y: event.pageY,
     };
     setTimeout(() => {
         mousePosition = null;
@@ -47,17 +47,20 @@ const getClickPosition = (e) => {
 if ((0, js_utils_1.canUseDocElement)()) {
     document.documentElement.addEventListener('click', getClickPosition, true);
 }
-function Modal(props) {
+exports.Modal = React.memo((props) => {
     const config = (0, ConfrigProvider_1.useConfig)();
-    const { centered, children, className, closable = true, closeIcon, focusTriggerAfterClose = true, full, prefixCls = `${config.prefixCls}-modal`, visible, onClose, onClosed, ...restProps } = props;
+    const { centered, children, className, closable = true, closeIcon, focusTriggerAfterClose = true, full, prefixCls = config.prefixCls, visible, onClose, onClosed, ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'modal'), [config, prefixCls]);
+    const defaultMaskTransitionName = React.useMemo(() => (0, utils_1.getMotionName)(prefixCls || config.prefixCls, 'fade'), [config.prefixCls, prefixCls]);
+    const defaultTransitionName = React.useMemo(() => (0, utils_1.getMotionName)(prefixCls || config.prefixCls, 'zoom'), [config.prefixCls, prefixCls]);
     return (React.createElement(rc_dialog_1.default, { className: (0, classnames_1.default)(className, {
-            [`${prefixCls}-centered`]: centered && !full,
-            [`${prefixCls}-full`]: full && !centered,
-        }), focusTriggerAfterClose: focusTriggerAfterClose, maskTransitionName: (0, utils_1.getTransitionName)(`${config.prefixCls}-motion`, 'fade'), mousePosition: mousePosition, prefixCls: prefixCls, transitionName: (0, utils_1.getTransitionName)(`${config.prefixCls}-motion`, 'zoom'), visible: visible, ...restProps, afterClose: onClosed, closable: false, closeIcon: null },
-        closable && (closeIcon || (React.createElement(Close_1.Close, { className: (0, classnames_1.default)({
-                [`${prefixCls}-close-default`]: !full,
-                [`${prefixCls}-close-full`]: full,
-            }), component: "button", onClick: onClose }))),
+            [`${rootCls}-centered`]: centered && !full,
+            [`${rootCls}-full`]: full && !centered,
+        }), focusTriggerAfterClose: focusTriggerAfterClose, maskTransitionName: defaultMaskTransitionName, mousePosition: mousePosition, prefixCls: rootCls, transitionName: defaultTransitionName, visible: visible, ...restProps, afterClose: onClosed, closable: false, closeIcon: null },
+        closable &&
+            (closeIcon || (React.createElement(Close_1.Close, { className: (0, classnames_1.default)({
+                    [`${rootCls}-close-default`]: !full,
+                    [`${rootCls}-close-full`]: full,
+                }), component: "button", onClick: onClose }))),
         children));
-}
-exports.Modal = Modal;
+});

package/dist/cjs/components/Modal/index.d.ts

@@ -1,2 +1,2 @@
 import './index.scss';
-export * from './Modal';
+export * from '../Modal/Modal';

package/dist/cjs/components/Modal/index.js

@@ -15,4 +15,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 require("./index.scss");
-__exportStar(require("./Modal"), exports);
+__exportStar(require("../Modal/Modal"), exports);

package/dist/cjs/components/Nav/Divider.d.ts

@@ -1,9 +1,4 @@
 import * as React from 'react';
-export declare type DividerProps = {
-    className?: string;
-    style?: React.CSSProperties;
-};
-export declare function Divider(props: DividerProps): JSX.Element | null;
-export declare namespace Divider {
-    var displayName: string;
-}
+import { type NavDividerType } from '../Nav/types';
+export type DividerProps = Omit<NavDividerType, 'type'>;
+export declare const Divider: React.MemoExoticComponent<(props: DividerProps) => JSX.Element | null>;

package/dist/cjs/components/Nav/Divider.js

@@ -29,18 +29,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Divider = void 0;
 const React = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
-const NavContext_1 = require("./context/NavContext");
-const PathContext_1 = require("./context/PathContext");
-function Divider(props) {
+const NavContext_1 = require("../Nav/context/NavContext");
+const PathContext_1 = require("../Nav/context/PathContext");
+exports.Divider = React.memo((props) => {
     const { className, style } = props;
     const { prefixCls } = React.useContext(NavContext_1.NavContext);
     const measure = (0, PathContext_1.useMeasure)();
     if (measure) {
         return null;
     }
-    return (React.createElement("li", { className: (0, classnames_1.default)(`${prefixCls}-divider`, className), style: style }));
-}
-exports.Divider = Divider;
+    return React.createElement("li", { className: (0, classnames_1.default)(`${prefixCls}-divider`, className), style: style });
+});
 if (process.env.NODE_ENV !== 'production') {
-    Divider.displayName = 'Nav.Divider';
+    exports.Divider.displayName = 'Nav.Divider';
 }

package/dist/cjs/components/Nav/Group/InternalNavItemGroup.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { type NavItemGroupType } from '../../Nav/types';
+export interface NavItemGroupProps extends Omit<NavItemGroupType, 'children' | 'type' | 'label'> {
+    title?: React.ReactNode;
+    children?: React.ReactNode;
+    /** @private Internal filled key. Do not set it directly */
+    eventKey?: string;
+    /** @private Do not use. Private warning empty usage */
+    warnKey?: boolean;
+}
+export declare const InternalNavItemGroup: React.MemoExoticComponent<(props: NavItemGroupProps) => JSX.Element>;

package/dist/cjs/components/Nav/Group/InternalNavItemGroup.js

@@ -0,0 +1,42 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InternalNavItemGroup = void 0;
+const React = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const js_utils_1 = require("@broxus/js-utils");
+const NavContext_1 = require("../../Nav/context/NavContext");
+exports.InternalNavItemGroup = React.memo((props) => {
+    const { children, className, title, ...restProps } = props;
+    const { prefixCls } = React.useContext(NavContext_1.NavContext);
+    const groupRootCls = React.useMemo(() => `${prefixCls}-group`, [prefixCls]);
+    const subRootCls = React.useMemo(() => `${prefixCls}-sub`, [prefixCls]);
+    return (React.createElement("li", { className: (0, classnames_1.default)(groupRootCls, className), role: "presentation", ...restProps, onClick: js_utils_1.stopEventPropagate },
+        React.createElement("div", { className: `${groupRootCls}-header`, role: "presentation", title: typeof title === 'string' ? title : undefined }, title),
+        React.createElement("ul", { className: subRootCls, role: "group" }, children)));
+});

package/dist/cjs/components/Nav/Group/index.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { type NavItemGroupProps } from '../../Nav/Group/InternalNavItemGroup';
+export declare const Group: React.MemoExoticComponent<(props: NavItemGroupProps) => JSX.Element>;