@broxus/react-uikit 0.2.2 → 0.3.0

package/dist/esm/components/Nav/Sub/PopupTrigger.js

@@ -2,14 +2,14 @@ import * as React from 'react';
 import classNames from 'classnames';
 import Trigger from 'rc-trigger';
 import raf from 'rc-util/lib/raf';
-import { NavContext } from '../../Nav/context/NavContext';
-import { placements, placementsRtl } from '../../Nav/placements';
-import { getMotion } from '../../Nav/utils/motionUtil';
-import { useConfig } from '../../ConfrigProvider';
+import { useConfig } from '../../../components/ConfrigProvider';
+import { NavContext } from '../../../components/Nav/context/NavContext';
+import { placements, placementsRtl } from '../../../components/Nav/placements';
+import { getMotion } from '../../../components/Nav/utils/motionUtil';
 const popupPlacementMap = {
-    'horizontal': 'bottom-left',
-    'inline': null,
-    'vertical': 'right-top',
+    horizontal: 'bottom-left',
+    inline: null,
+    vertical: 'right-top',
     'vertical-left': 'right-top',
     'vertical-right': 'left-top',
 };

package/dist/esm/components/Nav/Sub/SubNavList.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import { NavContext } from '../context/NavContext';
+import { NavContext } from '../../../components/Nav/context/NavContext';
 const ForwardedSubNavList = React.forwardRef((props, ref) => {
     const { className, children, ...restProps } = props;
     const { mode, prefixCls, rtl } = React.useContext(NavContext);

package/dist/esm/components/Nav/Sub/index.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type SubNavType } from '../../Nav/types';
+import { type SubNavType } from '../../../components/Nav/types';
 export interface SubNavProps extends Omit<SubNavType, 'children' | 'key' | 'label'> {
     children?: React.ReactNode;
     title?: React.ReactNode;

package/dist/esm/components/Nav/Sub/index.js

@@ -3,18 +3,18 @@ import { noop } from '@broxus/js-utils';
 import classNames from 'classnames';
 import Overflow from 'rc-overflow';
 import warning from 'rc-util/lib/warning';
-import { useNavId } from '../../Nav/context/IdContext';
-import { NavContext, NavContextProvider } from '../../Nav/context/NavContext';
-import { PathTrackerContext, PathUserContext, useFullPath, useMeasure, } from '../../Nav/context/PathContext';
-import { PrivateContext } from '../../Nav/context/PrivateContext';
-import { useActive } from '../../Nav/hooks/useActive';
-import { useDirectionStyle } from '../../Nav/hooks/useDirectionStyle';
-import { useMemoCallback } from '../../Nav/hooks/useMemoCallback';
-import { InlineSubNavList } from '../../Nav/Sub/InlineSubNavList';
-import { PopupTrigger } from '../../Nav/Sub/PopupTrigger';
-import { SubNavList } from '../../Nav/Sub/SubNavList';
-import { parseChildren } from '../../Nav/utils/nodeUtil';
-import { warnItemProp } from '../../Nav/utils/warnUtil';
+import { useNavId } from '../../../components/Nav/context/IdContext';
+import { NavContext, NavContextProvider } from '../../../components/Nav/context/NavContext';
+import { PathTrackerContext, PathUserContext, useFullPath, useMeasure, } from '../../../components/Nav/context/PathContext';
+import { PrivateContext } from '../../../components/Nav/context/PrivateContext';
+import { useActive } from '../../../components/Nav/hooks/useActive';
+import { useDirectionStyle } from '../../../components/Nav/hooks/useDirectionStyle';
+import { useMemoCallback } from '../../../components/Nav/hooks/useMemoCallback';
+import { InlineSubNavList } from '../../../components/Nav/Sub/InlineSubNavList';
+import { PopupTrigger } from '../../../components/Nav/Sub/PopupTrigger';
+import { SubNavList } from '../../../components/Nav/Sub/SubNavList';
+import { parseChildren } from '../../../components/Nav/utils/nodeUtil';
+import { warnItemProp } from '../../../components/Nav/utils/warnUtil';
 const InternalSubNav = React.memo((props) => {
     const { children, className, disabled, eventKey, expandIcon, internalPopupClose, itemIcon, popupClassName, popupOffset, style, title, warnKey, onClick, onMouseEnter, onMouseLeave, onTitleClick, onTitleMouseEnter, onTitleMouseLeave, ...restProps } = props;
     const domDataId = useNavId(eventKey);
@@ -129,12 +129,12 @@ const InternalSubNav = React.memo((props) => {
         const triggerMode = triggerModeRef.current;
         // Still wrap with Trigger here since we need avoid react re-mount dom node
         // Which makes motion failed
-        titleNode = (React.createElement(PopupTrigger, { disabled: disabled, mode: triggerMode, popup: React.createElement(NavContextProvider
+        titleNode = (React.createElement(PopupTrigger, { disabled: disabled, mode: triggerMode, popup: (React.createElement(NavContextProvider
             // Special handle of horizontal mode
             , { 
                 // Special handle of horizontal mode
                 mode: triggerMode === 'horizontal' ? 'vertical' : triggerMode },
-                React.createElement(SubNavList, { className: `${popupPrefixCls}-nav`, id: popupId, ref: popupRef }, children)), popupClassName: popupClassName, popupOffset: popupOffset, prefixCls: popupPrefixCls, visible: !internalPopupClose && open && mode !== 'inline', onVisibleChange: onPopupVisibleChange }, titleNode));
+                React.createElement(SubNavList, { className: `${popupPrefixCls}-nav`, id: popupId, ref: popupRef }, children))), popupClassName: popupClassName, popupOffset: popupOffset, prefixCls: popupPrefixCls, visible: !internalPopupClose && open && mode !== 'inline', onVisibleChange: onPopupVisibleChange }, titleNode));
     }
     // List node
     let listNode = (React.createElement(Overflow.Item, { className: classNames('uk-parent', className, {

package/dist/esm/components/Nav/context/NavContext.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { type CSSMotionProps } from 'rc-motion';
-import { type BuiltinPlacements, type NavClickEventHandler, type NavMode, type RenderIconType, type TriggerSubNavAction } from '../../Nav/types';
+import { type BuiltinPlacements, type NavClickEventHandler, type NavMode, type RenderIconType, type TriggerSubNavAction } from '../../../components/Nav/types';
 export interface NavContextProps {
     activeKey: string;
     builtinPlacements?: BuiltinPlacements;

package/dist/esm/components/Nav/context/NavContext.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import useMemo from 'rc-util/lib/hooks/useMemo';
 import shallowEqual from 'shallowequal';
-import { useConfig } from '../../ConfrigProvider';
+import { useConfig } from '../../../components/ConfrigProvider';
 export const NavContext = React.createContext({
     popupPrefixCls: 'dropdown',
     prefixCls: 'nav',

package/dist/esm/components/Nav/context/PrivateContext.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type NavProps } from '../../Nav/Nav';
+import { type NavProps } from '../../../components/Nav/Nav';
 export interface PrivateContextProps {
     _internalRenderMenuItem?: NavProps['_internalRenderMenuItem'];
     _internalRenderSubMenuItem?: NavProps['_internalRenderSubMenuItem'];

package/dist/esm/components/Nav/hooks/useAccessibility.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
-import { type NavMode } from '../../Nav/types';
+import { type NavMode } from '../../../components/Nav/types';
 export declare function useAccessibility<T extends HTMLElement>(mode: NavMode, activeKey: string, isRtl: boolean, id: string, containerRef: React.RefObject<HTMLUListElement>, getKeys: () => string[], getKeyPath: (key: string, includeOverflow?: boolean) => string[], triggerActiveKey: (key: string) => void, triggerAccessibilityOpen: (key: string, open?: boolean) => void, originOnKeyDown?: React.KeyboardEventHandler<T>): React.KeyboardEventHandler<T>;

package/dist/esm/components/Nav/hooks/useAccessibility.js

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { getFocusNodeList } from 'rc-util/lib/Dom/focus';
 import KeyCode from 'rc-util/lib/KeyCode';
 import raf from 'rc-util/lib/raf';
-import { getNavId } from '../../Nav/context/IdContext';
+import { getNavId } from '../../../components/Nav/context/IdContext';
 // destruct to reduce minify size
 const { LEFT, RIGHT, UP, DOWN, ENTER, ESC } = KeyCode;
 const ArrowKeys = [UP, DOWN, LEFT, RIGHT];

package/dist/esm/components/Nav/hooks/useActive.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type NavHoverEventHandler } from '../../Nav/types';
+import { type NavHoverEventHandler } from '../../../components/Nav/types';
 interface ActiveObj {
     active: boolean;
     onMouseEnter?: React.MouseEventHandler<HTMLElement>;

package/dist/esm/components/Nav/hooks/useActive.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { NavContext } from '../../Nav/context/NavContext';
+import { NavContext } from '../../../components/Nav/context/NavContext';
 export function useActive(eventKey, disabled, onMouseEnter, onMouseLeave) {
     const { 
     // Active

package/dist/esm/components/Nav/hooks/useDirectionStyle.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { NavContext } from '../../Nav/context/NavContext';
+import { NavContext } from '../../../components/Nav/context/NavContext';
 export function useDirectionStyle(level) {
     const { mode, rtl, inlineIndent } = React.useContext(NavContext);
     if (mode !== 'inline') {

package/dist/esm/components/Nav/hooks/useKeyRecords.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import warning from 'rc-util/lib/warning';
-import { nextSlice } from '../../Nav/utils/timeUtil';
+import { nextSlice } from '../../../components/Nav/utils/timeUtil';
 import { useForceUpdate } from '../../../hooks';
 const PATH_SPLIT = '__RC_UTIL_PATH_SPLIT__';
 function getPathStr(keyPath) {

package/dist/esm/components/Nav/index.d.ts

@@ -1,10 +1,10 @@
 import type * as React from 'react';
-import { Divider } from '../Nav/Divider';
-import { Group } from '../Nav/Group';
-import { Header } from '../Nav/Header';
-import { Item } from '../Nav/Item';
-import { type NavProps } from '../Nav/Nav';
-import { Sub } from '../Nav/Sub';
+import { Divider } from '../../components/Nav/Divider';
+import { Group } from '../../components/Nav/Group';
+import { Header } from '../../components/Nav/Header';
+import { Item } from '../../components/Nav/Item';
+import { type NavProps } from '../../components/Nav/Nav';
+import { Sub } from '../../components/Nav/Sub';
 import './index.scss';
 export type { NavProps };
 export interface Nav extends React.MemoExoticComponent<React.ForwardRefExoticComponent<NavProps>> {

package/dist/esm/components/Nav/index.js

@@ -1,9 +1,9 @@
-import { Divider } from '../Nav/Divider';
-import { Group } from '../Nav/Group';
-import { Header } from '../Nav/Header';
-import { Item } from '../Nav/Item';
-import { Nav as InternalNav } from '../Nav/Nav';
-import { Sub } from '../Nav/Sub';
+import { Divider } from '../../components/Nav/Divider';
+import { Group } from '../../components/Nav/Group';
+import { Header } from '../../components/Nav/Header';
+import { Item } from '../../components/Nav/Item';
+import { Nav as InternalNav } from '../../components/Nav/Nav';
+import { Sub } from '../../components/Nav/Sub';
 import './index.scss';
 export const Nav = InternalNav;
 Nav.Divider = Divider;

package/dist/esm/components/Nav/utils/motionUtil.d.ts

@@ -1,5 +1,5 @@
 import { type CSSMotionProps } from 'rc-motion';
-import { type NavMode } from '../../Nav/types';
+import { type NavMode } from '../../../components/Nav/types';
 export declare function getMotion(mode: NavMode | 'other', motion?: CSSMotionProps, defaultMotions?: Partial<{
     [key in NavMode | 'other']: CSSMotionProps;
 }>): CSSMotionProps | undefined;

package/dist/esm/components/Nav/utils/nodeUtil.d.ts

@@ -1,4 +1,4 @@
 import * as React from 'react';
-import { type ItemType } from '../../Nav/types';
+import { type ItemType } from '../../../components/Nav/types';
 export declare function parseChildren(children: React.ReactNode | undefined, keyPath: string[]): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>[];
 export declare function parseItems(children: React.ReactNode | undefined, items: ItemType[] | undefined, keyPath: string[]): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>[];

package/dist/esm/components/Nav/utils/nodeUtil.js

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import toArray from 'rc-util/lib/Children/toArray';
-import { Divider } from '../../Nav/Divider';
-import { Group } from '../../Nav/Group';
-import { Item } from '../../Nav/Item';
-import { Sub } from '../../Nav/Sub';
+import { Divider } from '../../../components/Nav/Divider';
+import { Group } from '../../../components/Nav/Group';
+import { Item } from '../../../components/Nav/Item';
+import { Sub } from '../../../components/Nav/Sub';
 export function parseChildren(children, keyPath) {
     return toArray(children).map((child, index) => {
         if (React.isValidElement(child)) {

package/dist/esm/components/Navbar/Center.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type PolymorphicProps } from '../Component';
+import { type PolymorphicProps } from '../../components/Component';
 export interface NavbarCenterOwnProps extends React.HTMLAttributes<HTMLElement> {
     prefixCls?: string;
 }

package/dist/esm/components/Navbar/Center.js

@@ -1,13 +1,13 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import { Component } from '../Component';
-import { useConfig } from '../ConfrigProvider';
+import { Component } from '../../components/Component';
+import { useConfig } from '../../components/ConfrigProvider';
 const defaultElement = 'div';
 export const Center = React.memo((props) => {
     const config = useConfig();
     const { className, prefixCls = config.prefixCls, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar-center'), [config, prefixCls]);
-    return (React.createElement(Component, { className: classNames(rootCls, className), component: defaultElement, ...restProps }));
+    return React.createElement(Component, { className: classNames(rootCls, className), component: defaultElement, ...restProps });
 });
 if (process.env.NODE_ENV !== 'production') {
     Center.displayName = 'Navbar.Center';

package/dist/esm/components/Navbar/Container.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type PolymorphicProps } from '../Component';
+import { type PolymorphicProps } from '../../components/Component';
 export interface NavbarContainerOwnProps extends React.HTMLAttributes<HTMLElement> {
     prefixCls?: string;
     transparent?: boolean;

package/dist/esm/components/Navbar/Container.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import { Component } from '../Component';
-import { useConfig } from '../ConfrigProvider';
+import { Component } from '../../components/Component';
+import { useConfig } from '../../components/ConfrigProvider';
 const defaultElement = 'div';
 export const Container = React.memo((props) => {
     const config = useConfig();

package/dist/esm/components/Navbar/Item.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type PolymorphicProps } from '../Component';
+import { type PolymorphicProps } from '../../components/Component';
 export interface NavbarItemOwnProps extends React.HTMLAttributes<HTMLElement> {
     align?: 'left' | 'right' | 'center';
     prefixCls?: string;

package/dist/esm/components/Navbar/Item.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import { Component } from '../Component';
-import { useConfig } from '../ConfrigProvider';
+import { Component } from '../../components/Component';
+import { useConfig } from '../../components/ConfrigProvider';
 const defaultElement = 'div';
 export const Item = React.memo((props) => {
     const config = useConfig();

package/dist/esm/components/Navbar/Left.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type PolymorphicProps } from '../Component';
+import { type PolymorphicProps } from '../../components/Component';
 export interface NavbarLeftOwnProps extends React.HTMLAttributes<HTMLElement> {
     prefixCls?: string;
 }

package/dist/esm/components/Navbar/Left.js

@@ -1,13 +1,13 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import { Component } from '../Component';
-import { useConfig } from '../ConfrigProvider';
+import { Component } from '../../components/Component';
+import { useConfig } from '../../components/ConfrigProvider';
 const defaultElement = 'div';
 export const Left = React.memo((props) => {
     const config = useConfig();
     const { className, prefixCls = config.prefixCls, ...restProps } = props;
-    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar'), [config, prefixCls]);
-    return (React.createElement(Component, { className: classNames(`${rootCls}-left`, className), component: defaultElement, ...restProps }));
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar-left'), [config, prefixCls]);
+    return React.createElement(Component, { className: classNames(rootCls, className), component: defaultElement, ...restProps });
 });
 if (process.env.NODE_ENV !== 'production') {
     Left.displayName = 'Navbar.Left';

package/dist/esm/components/Navbar/Nav.d.ts

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

package/dist/esm/components/Navbar/Nav.js

@@ -1,13 +1,13 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import { useConfig } from '../ConfrigProvider';
-import { Nav as BaseNav } from '../Nav';
-export function Nav(props) {
+import { useConfig } from '../../components/ConfrigProvider';
+import { Nav as BaseNav } from '../../components/Nav';
+export const Nav = React.memo((props) => {
     const config = useConfig();
     const { className, prefixCls = config.prefixCls, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar'), [config, prefixCls]);
     return (React.createElement(BaseNav, { className: classNames(`${rootCls}-nav`, className), popupPrefixCls: `${rootCls}-dropdown`, ...restProps, mode: "horizontal" }));
-}
+});
 if (process.env.NODE_ENV !== 'production') {
     Nav.displayName = 'Navbar.Nav';
 }

package/dist/esm/components/Navbar/Navbar.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 export interface NavbarProps extends React.HTMLAttributes<HTMLElement> {
     asContainer?: boolean;
+    prefixCls?: string;
     transparent?: boolean;
 }
-export declare function Navbar(props: NavbarProps): JSX.Element;
+export declare const Navbar: React.MemoExoticComponent<(props: NavbarProps) => JSX.Element>;

package/dist/esm/components/Navbar/Navbar.js

@@ -1,9 +1,12 @@
 import * as React from 'react';
 import classNames from 'classnames';
-export function Navbar(props) {
-    const { asContainer, className, transparent, ...restProps } = props;
-    return (React.createElement("nav", { className: classNames('uk-navbar', {
-            'uk-navbar-container': asContainer,
-            'uk-navbar-transparent': transparent,
+import { useConfig } from '../../components/ConfrigProvider';
+export const Navbar = React.memo((props) => {
+    const config = useConfig();
+    const { asContainer, className, prefixCls = config.prefixCls, transparent, ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar'), [config, prefixCls]);
+    return (React.createElement("nav", { className: classNames(rootCls, {
+            [`${rootCls}-container`]: asContainer,
+            [`${rootCls}-transparent`]: transparent,
         }, className), ...restProps }));
-}
+});

package/dist/esm/components/Navbar/Right.d.ts

@@ -1,9 +1,7 @@
 import * as React from 'react';
-import { type PolymorphicProps } from '../Component';
-export type NavbarRightProps<E extends React.ElementType = React.ElementType> = PolymorphicProps<E, unknown>;
-declare const defaultElement: React.ElementType;
-export declare function Right<E extends React.ElementType = typeof defaultElement>(props: NavbarRightProps<E>): JSX.Element;
-export declare namespace Right {
-    var displayName: string;
+import { type PolymorphicProps } from '../../components/Component';
+export interface NavbarRightOwnProps extends React.HTMLAttributes<HTMLElement> {
+    prefixCls?: string;
 }
-export {};
+export type NavbarRightProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<NavbarRightOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, NavbarRightOwnProps>;
+export declare const Right: React.MemoExoticComponent<(<E extends React.ElementType<any> = "div">(props: NavbarRightProps<E>) => JSX.Element)>;

package/dist/esm/components/Navbar/Right.js

@@ -1,11 +1,14 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import { Component } from '../Component';
+import { Component } from '../../components/Component';
+import { useConfig } from '../../components/ConfrigProvider';
 const defaultElement = 'div';
-export function Right(props) {
-    const { className, ...restProps } = props;
-    return (React.createElement(Component, { className: classNames('uk-navbar-right', className), component: defaultElement, ...restProps }));
-}
+export const Right = React.memo((props) => {
+    const config = useConfig();
+    const { className, prefixCls = config.prefixCls, ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar'), [config, prefixCls]);
+    return React.createElement(Component, { className: classNames(`${rootCls}-right`, className), component: defaultElement, ...restProps });
+});
 if (process.env.NODE_ENV !== 'production') {
     Right.displayName = 'Navbar.Right';
 }

package/dist/esm/components/Navbar/Toggle.d.ts

@@ -1,12 +1,8 @@
 import * as React from 'react';
-import { type PolymorphicProps } from '../Component';
+import { type PolymorphicProps } from '../../components/Component';
 export type NavbarToggleOwnProps = {
     icon?: boolean;
+    prefixCls?: string;
 };
 export type NavbarToggleProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<NavbarToggleOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, NavbarToggleOwnProps>;
-declare const defaultElement: React.ElementType;
-export declare function Toggle<E extends React.ElementType = typeof defaultElement>(props: NavbarToggleProps<E>): JSX.Element;
-export declare namespace Toggle {
-    var displayName: string;
-}
-export {};
+export declare const Toggle: React.MemoExoticComponent<(<E extends React.ElementType<any> = "div">(props: NavbarToggleProps<E>) => JSX.Element)>;

package/dist/esm/components/Navbar/Toggle.js

@@ -1,13 +1,16 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import { Component } from '../Component';
+import { Component } from '../../components/Component';
+import { useConfig } from '../../components/ConfrigProvider';
 const defaultElement = 'div';
-export function Toggle(props) {
-    const { className, icon = false, ...restProps } = props;
-    return (React.createElement(Component, { className: classNames('uk-navbar-toggle', {
-            'uk-navbar-toggle-icon': icon,
+export const Toggle = React.memo((props) => {
+    const config = useConfig();
+    const { className, icon, prefixCls = config.prefixCls, ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar-toggle'), [config, prefixCls]);
+    return (React.createElement(Component, { className: classNames(rootCls, {
+            [`${rootCls}-icon`]: icon,
         }, className), component: defaultElement, ...restProps }));
-}
+});
 if (process.env.NODE_ENV !== 'production') {
     Toggle.displayName = 'Navbar.Toggle';
 }

package/dist/esm/components/Navbar/index.d.ts

@@ -1,15 +1,15 @@
 import type * as React from 'react';
-import { Center } from '../Navbar/Center';
-import { Container } from '../Navbar/Container';
-import { type NavbarProps } from '../Navbar/Navbar';
-import { Item } from '../Navbar/Item';
-import { Left } from '../Navbar/Left';
-import { Nav } from '../Navbar/Nav';
-import { Right } from '../Navbar/Right';
-import { Toggle } from '../Navbar/Toggle';
+import { Center } from '../../components/Navbar/Center';
+import { Container } from '../../components/Navbar/Container';
+import { type NavbarProps } from '../../components/Navbar/Navbar';
+import { Item } from '../../components/Navbar/Item';
+import { Left } from '../../components/Navbar/Left';
+import { Nav } from '../../components/Navbar/Nav';
+import { Right } from '../../components/Navbar/Right';
+import { Toggle } from '../../components/Navbar/Toggle';
 import './index.scss';
 export type { NavbarProps };
-export interface Navbar extends React.FunctionComponent<NavbarProps> {
+export interface Navbar extends React.MemoExoticComponent<React.FunctionComponent<NavbarProps>> {
     Center: typeof Center;
     Container: typeof Container;
     Item: typeof Item;

package/dist/esm/components/Navbar/index.js

@@ -1,11 +1,11 @@
-import { Center } from '../Navbar/Center';
-import { Container } from '../Navbar/Container';
-import { Navbar as InternalNavbar } from '../Navbar/Navbar';
-import { Item } from '../Navbar/Item';
-import { Left } from '../Navbar/Left';
-import { Nav } from '../Navbar/Nav';
-import { Right } from '../Navbar/Right';
-import { Toggle } from '../Navbar/Toggle';
+import { Center } from '../../components/Navbar/Center';
+import { Container } from '../../components/Navbar/Container';
+import { Navbar as InternalNavbar } from '../../components/Navbar/Navbar';
+import { Item } from '../../components/Navbar/Item';
+import { Left } from '../../components/Navbar/Left';
+import { Nav } from '../../components/Navbar/Nav';
+import { Right } from '../../components/Navbar/Right';
+import { Toggle } from '../../components/Navbar/Toggle';
 import './index.scss';
 export const Navbar = InternalNavbar;
 Navbar.Center = Center;

package/dist/esm/components/Progress/index.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import { useConfig } from '../ConfrigProvider';
+import { useConfig } from '../../components/ConfrigProvider';
 import './index.scss';
 export const Progress = React.memo((props) => {
     const config = useConfig();

package/dist/esm/components/Section/index.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { type PolymorphicProps } from '../Component';
+import { type PolymorphicProps } from '../../components/Component';
 import './index.scss';
 export type SectionOwnProps = {
     color?: 'default' | 'muted' | 'primary' | 'secondary' | 'tertiary';

package/dist/esm/components/Section/index.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import { Component } from '../Component';
-import { useConfig } from '../ConfrigProvider';
+import { Component } from '../../components/Component';
+import { useConfig } from '../../components/ConfrigProvider';
 import './index.scss';
 const defaultElement = 'section';
 export const Section = React.memo((props) => {

package/dist/esm/components/Spinner/index.d.ts

@@ -4,4 +4,4 @@ export interface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement> {
     prefixCls?: string;
     ratio?: number;
 }
-export declare function Spinner(props: SpinnerProps): JSX.Element;
+export declare const Spinner: React.MemoExoticComponent<(props: SpinnerProps) => JSX.Element>;

package/dist/esm/components/Spinner/index.js

@@ -1,15 +1,12 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import { useConfig } from '../ConfrigProvider';
-import { defaultSvgProps, getSize } from '../Icon';
+import { useConfig } from '../../components/ConfrigProvider';
+import { defaultSvgProps, getSize } from '../../components/Icon';
 import './index.scss';
-export function Spinner(props) {
+export const Spinner = React.memo((props) => {
     const config = useConfig();
     const { className, prefixCls = config.prefixCls, ratio, ...restProps } = props;
-    return (React.createElement("span", { className: classNames([
-            `${prefixCls || config.prefixCls}-spinner`,
-            `${prefixCls || config.prefixCls}-icon`,
-        ], className), ...restProps },
-        React.createElement("svg", { ...defaultSvgProps, ...getSize(20, 20, ratio), viewBox: "0 0 30 30" },
-            React.createElement("circle", { fill: "none", stroke: "currentColor", cx: 15, cy: 15, r: 14 }))));
-}
+    return (React.createElement("span", { className: classNames([`${prefixCls || config.prefixCls}-spinner`, `${prefixCls || config.prefixCls}-icon`], className), ...restProps },
+        React.createElement("svg", { ...defaultSvgProps, ...getSize(20, 20, ratio), viewBox: "0 0 20 20" },
+            React.createElement("circle", { fill: "none", stroke: "currentColor", cx: 10, cy: 10, r: 9 }))));
+});

package/dist/esm/components/Tabs/index.js

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import classNames from 'classnames';
 import RcTabs from 'rc-tabs';
-import { useConfig } from '../ConfrigProvider';
-import { Icon } from '../Icon';
+import { useConfig } from '../../components/ConfrigProvider';
+import { Icon } from '../../components/Icon';
 import { getMotionName } from '../../utils';
 import './index.scss';
 export const Tabs = React.memo((props) => {