@broxus/react-uikit 0.4.7 → 0.5.0

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

@@ -2,4 +2,7 @@ import * as React from 'react';
 export interface ArticleProps extends React.HTMLAttributes<HTMLElement> {
     prefixCls?: string;
 }
-export declare const Article: React.MemoExoticComponent<(props: ArticleProps) => React.JSX.Element>;
+export declare function Article(props: ArticleProps): React.JSX.Element;
+export declare namespace Article {
+    var displayName: string;
+}

package/dist/esm/components/Article/Article.js

@@ -1,14 +1,19 @@
 import classNames from 'classnames';
 import * as React from 'react';
-import { ComponentProvider } from '../../components/ComponentProvider';
+import { ArticleContext } from '../../components/Article/context';
 import { useConfig } from '../../components/ConfigProvider';
-export const Article = React.memo((props) => {
+export function Article(props) {
     const config = useConfig();
     const { className, prefixCls = config.prefixCls, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'article'), [config, prefixCls]);
-    return (React.createElement(ComponentProvider, { component: "article", prefixCls: prefixCls || config.prefixCls },
+    const context = React.useMemo(() => ({
+        getRootCls() {
+            return rootCls;
+        },
+    }), [rootCls]);
+    return (React.createElement(ArticleContext.Provider, { value: context },
         React.createElement("article", { className: classNames(rootCls, className), ...restProps })));
-});
+}
 if (process.env.NODE_ENV !== 'production') {
     Article.displayName = 'Article';
 }

package/dist/esm/components/Article/Meta.d.ts

@@ -4,4 +4,9 @@ export type ArticleMetaOwnProps = {
     prefixCls?: string;
 };
 export type ArticleMetaProps<E extends React.ElementType> = React.PropsWithChildren<ArticleMetaOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, ArticleMetaOwnProps>;
-export declare const Meta: React.MemoExoticComponent<(<E extends React.ElementType<any> = "p">(props: ArticleMetaProps<E>) => React.JSX.Element)>;
+declare const defaultElement: React.ElementType;
+export declare function Meta<E extends React.ElementType = typeof defaultElement>(props: ArticleMetaProps<E>): React.JSX.Element;
+export declare namespace Meta {
+    var displayName: string;
+}
+export {};

package/dist/esm/components/Article/Meta.js

@@ -1,16 +1,16 @@
 import classNames from 'classnames';
 import * as React from 'react';
+import { ArticleContext } from '../../components/Article/context';
 import { Component } from '../../components/Component';
-import { useComponentContext } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
 const defaultElement = 'p';
-export const Meta = React.memo((props) => {
+export function Meta(props) {
     const config = useConfig();
-    const { getRootCls } = useComponentContext();
+    const { getRootCls } = React.useContext(ArticleContext);
     const { className, prefixCls = getRootCls(), ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'meta'), [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') {
     Meta.displayName = 'Article.Meta';
 }

package/dist/esm/components/Article/Title.d.ts

@@ -4,4 +4,9 @@ export type ArticleTitleOwnProps = {
     prefixCls?: string;
 };
 export type ArticleTitleProps<E extends React.ElementType> = React.PropsWithChildren<ArticleTitleOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, ArticleTitleOwnProps>;
-export declare const Title: React.MemoExoticComponent<(<E extends React.ElementType<any> = "h1">(props: ArticleTitleProps<E>) => React.JSX.Element)>;
+declare const defaultElement: React.ElementType;
+export declare function Title<E extends React.ElementType = typeof defaultElement>(props: ArticleTitleProps<E>): React.JSX.Element;
+export declare namespace Title {
+    var displayName: string;
+}
+export {};

package/dist/esm/components/Article/Title.js

@@ -1,16 +1,16 @@
 import classNames from 'classnames';
 import * as React from 'react';
+import { ArticleContext } from '../../components/Article/context';
 import { Component } from '../../components/Component';
-import { useComponentContext } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
 const defaultElement = 'h1';
-export const Title = React.memo((props) => {
+export function Title(props) {
     const config = useConfig();
-    const { getRootCls } = useComponentContext();
+    const { getRootCls } = React.useContext(ArticleContext);
     const { className, prefixCls = getRootCls(), ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'title'), [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') {
     Title.displayName = 'Article.Title';
 }

package/dist/esm/components/Article/context.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+export type ArticleContextConsumerProps = {
+    getRootCls(): string | undefined;
+};
+export declare const ArticleContext: React.Context<ArticleContextConsumerProps>;

package/dist/esm/components/Article/context.js

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export const ArticleContext = React.createContext({
+    getRootCls() {
+        return 'uk-article';
+    },
+});

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

@@ -4,7 +4,7 @@ import { type ArticleMetaProps, Meta } from '../../components/Article/Meta';
 import { type ArticleTitleProps, Title } from '../../components/Article/Title';
 import './index.scss';
 export type { ArticleMetaProps, ArticleProps, ArticleTitleProps };
-export interface Article extends React.MemoExoticComponent<React.FunctionComponent<ArticleProps>> {
+export interface Article extends React.FunctionComponent<ArticleProps> {
     Meta: typeof Meta;
     Title: typeof Title;
 }

package/dist/esm/components/Card/Badge.d.ts

@@ -1,4 +1,9 @@
 import * as React from 'react';
 import { type BadgeProps } from '../../components/Badge';
 export type CardBadgeProps<E extends React.ElementType> = BadgeProps<E>;
-export declare const Badge: React.MemoExoticComponent<(<E extends React.ElementType<any> = "span">(props: CardBadgeProps<E>) => React.JSX.Element)>;
+declare const defaultElement: React.ElementType;
+export declare function Badge<E extends React.ElementType = typeof defaultElement>(props: CardBadgeProps<E>): React.JSX.Element;
+export declare namespace Badge {
+    var displayName: string;
+}
+export {};

package/dist/esm/components/Card/Badge.js

@@ -1,16 +1,16 @@
 import classNames from 'classnames';
 import * as React from 'react';
 import { Badge as BaseBadge } from '../../components/Badge';
-import { useComponentContext } from '../../components/ComponentProvider';
+import { CardContext } from '../../components/Card/context';
 import { useConfig } from '../../components/ConfigProvider';
 const defaultElement = 'span';
-export const Badge = React.memo((props) => {
+export function Badge(props) {
     const config = useConfig();
-    const { getRootCls } = useComponentContext();
+    const { getRootCls } = React.useContext(CardContext);
     const { className, prefixCls = getRootCls(), ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls, 'badge'), [config, prefixCls]);
     return React.createElement(BaseBadge, { className: classNames(rootCls, className), ...restProps });
-});
+}
 if (process.env.NODE_ENV !== 'production') {
     Badge.displayName = 'Card.Badge';
 }

package/dist/esm/components/Card/Body.d.ts

@@ -4,4 +4,9 @@ export type CardBodyOwnProps = {
     prefixCls?: string;
 };
 export type CardBodyProps<E extends React.ElementType> = React.PropsWithChildren<CardBodyOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, CardBodyOwnProps>;
-export declare const Body: React.MemoExoticComponent<(<E extends React.ElementType<any> = "div">(props: CardBodyProps<E>) => React.JSX.Element)>;
+declare const defaultElement: React.ElementType;
+export declare function Body<E extends React.ElementType = typeof defaultElement>(props: CardBodyProps<E>): React.JSX.Element;
+export declare namespace Body {
+    var displayName: string;
+}
+export {};

package/dist/esm/components/Card/Body.js

@@ -1,16 +1,16 @@
 import classNames from 'classnames';
 import * as React from 'react';
+import { CardContext } from '../../components/Card/context';
 import { Component } from '../../components/Component';
-import { useComponentContext } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
 const defaultElement = 'div';
-export const Body = React.memo((props) => {
+export function Body(props) {
     const config = useConfig();
-    const { getRootCls } = useComponentContext();
+    const { getRootCls } = React.useContext(CardContext);
     const { className, prefixCls = getRootCls(), ...restProps } = props;
-    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls, 'body'), [config, prefixCls]);
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'body'), [config, prefixCls]);
     return (React.createElement(Component, { className: classNames(rootCls, className), component: defaultElement, ...restProps }));
-});
+}
 if (process.env.NODE_ENV !== 'production') {
     Body.displayName = 'Card.Body';
 }

package/dist/esm/components/Card/Card.js

@@ -1,8 +1,8 @@
 import { capitalizeFirstLetter } from '@broxus/js-utils';
 import classNames from 'classnames';
 import * as React from 'react';
+import { CardContext } from '../../components/Card/context';
 import { Component } from '../../components/Component';
-import { ComponentProvider } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
 const defaultElement = 'div';
 export function Card(props) {
@@ -12,7 +12,12 @@ export function Card(props) {
         ? config[`card${capitalizeFirstLetter(color)}ColorMode`]
         : undefined, hoverable, prefixCls = config.prefixCls, size, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls, 'card'), [config, prefixCls]);
-    return (React.createElement(ComponentProvider, { component: "card", prefixCls: prefixCls || config.prefixCls },
+    const context = React.useMemo(() => ({
+        getRootCls() {
+            return rootCls;
+        },
+    }), [rootCls]);
+    return (React.createElement(CardContext.Provider, { value: context },
         React.createElement(Component, { className: classNames(rootCls, {
                 [`${rootCls}-${color}`]: color !== undefined,
                 [`${rootCls}-${size}`]: size !== undefined,

package/dist/esm/components/Card/Footer.d.ts

@@ -4,4 +4,9 @@ export type CardFooterOwnProps = {
     prefixCls?: string;
 };
 export type CardFooterProps<E extends React.ElementType> = React.PropsWithChildren<CardFooterOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, CardFooterOwnProps>;
-export declare const Footer: React.MemoExoticComponent<(<E extends React.ElementType<any> = "footer">(props: CardFooterProps<E>) => React.JSX.Element)>;
+declare const defaultElement: React.ElementType;
+export declare function Footer<E extends React.ElementType = typeof defaultElement>(props: CardFooterProps<E>): React.JSX.Element;
+export declare namespace Footer {
+    var displayName: string;
+}
+export {};

package/dist/esm/components/Card/Footer.js

@@ -1,16 +1,16 @@
 import classNames from 'classnames';
 import * as React from 'react';
+import { CardContext } from '../../components/Card/context';
 import { Component } from '../../components/Component';
-import { useComponentContext } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
 const defaultElement = 'footer';
-export const Footer = React.memo((props) => {
+export function Footer(props) {
     const config = useConfig();
-    const { getRootCls } = useComponentContext();
+    const { getRootCls } = React.useContext(CardContext);
     const { className, prefixCls = getRootCls(), ...restProps } = props;
-    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls, 'footer'), [config, prefixCls]);
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'footer'), [config, prefixCls]);
     return React.createElement(Component, { className: classNames(rootCls, className), component: defaultElement, ...restProps });
-});
+}
 if (process.env.NODE_ENV !== 'production') {
     Footer.displayName = 'Card.Footer';
 }

package/dist/esm/components/Card/Header.d.ts

@@ -4,4 +4,9 @@ export type CardHeaderOwnProps = {
     prefixCls?: string;
 };
 export type CardHeaderProps<E extends React.ElementType> = React.PropsWithChildren<CardHeaderOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, CardHeaderOwnProps>;
-export declare const Header: React.MemoExoticComponent<(<E extends React.ElementType<any> = "header">(props: CardHeaderProps<E>) => React.JSX.Element)>;
+declare const defaultElement: React.ElementType;
+export declare function Header<E extends React.ElementType = typeof defaultElement>(props: CardHeaderProps<E>): React.JSX.Element;
+export declare namespace Header {
+    var displayName: string;
+}
+export {};

package/dist/esm/components/Card/Header.js

@@ -1,16 +1,16 @@
 import classNames from 'classnames';
 import * as React from 'react';
+import { CardContext } from '../../components/Card/context';
 import { Component } from '../../components/Component';
-import { useComponentContext } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
 const defaultElement = 'header';
-export const Header = React.memo((props) => {
+export function Header(props) {
     const config = useConfig();
-    const { getRootCls } = useComponentContext();
+    const { getRootCls } = React.useContext(CardContext);
     const { className, prefixCls = getRootCls(), ...restProps } = props;
-    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls, 'header'), [config, prefixCls]);
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'header'), [config, prefixCls]);
     return React.createElement(Component, { className: classNames(rootCls, className), component: defaultElement, ...restProps });
-});
+}
 if (process.env.NODE_ENV !== 'production') {
     Header.displayName = 'Card.Header';
 }

package/dist/esm/components/Card/Media.d.ts

@@ -5,4 +5,9 @@ export type CardMediaOwnProps = {
     prefixCls?: string;
 };
 export type CardMediaProps<E extends React.ElementType> = React.PropsWithChildren<CardMediaOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, CardMediaOwnProps>;
-export declare const Media: React.MemoExoticComponent<(<E extends React.ElementType<any> = "div">(props: CardMediaProps<E>) => React.JSX.Element)>;
+declare const defaultElement: React.ElementType;
+export declare function Media<E extends React.ElementType = typeof defaultElement>(props: CardMediaProps<E>): React.JSX.Element;
+export declare namespace Media {
+    var displayName: string;
+}
+export {};

package/dist/esm/components/Card/Media.js

@@ -1,18 +1,18 @@
 import classNames from 'classnames';
 import * as React from 'react';
+import { CardContext } from '../../components/Card/context';
 import { Component } from '../../components/Component';
-import { useComponentContext } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
 const defaultElement = 'div';
-export const Media = React.memo((props) => {
+export function Media(props) {
     const config = useConfig();
-    const { getRootCls } = useComponentContext();
+    const { getRootCls } = React.useContext(CardContext);
     const { className, position, prefixCls = getRootCls(), ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'media'), [config, prefixCls]);
     return (React.createElement(Component, { className: classNames({
             [`${rootCls}-${position}`]: position !== undefined,
         }, className), component: defaultElement, ...restProps }));
-});
+}
 if (process.env.NODE_ENV !== 'production') {
     Media.displayName = 'Card.Media';
 }

package/dist/esm/components/Card/Title.d.ts

@@ -4,4 +4,9 @@ export type CardTitleOwnProps = {
     prefixCls?: string;
 };
 export type CardTitleProps<E extends React.ElementType> = React.PropsWithChildren<CardTitleOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, CardTitleOwnProps>;
-export declare const Title: React.MemoExoticComponent<(<E extends React.ElementType<any> = "h3">(props: CardTitleProps<E>) => React.JSX.Element)>;
+declare const defaultElement: React.ElementType;
+export declare function Title<E extends React.ElementType = typeof defaultElement>(props: CardTitleProps<E>): React.JSX.Element;
+export declare namespace Title {
+    var displayName: string;
+}
+export {};

package/dist/esm/components/Card/Title.js

@@ -1,16 +1,16 @@
 import classNames from 'classnames';
 import * as React from 'react';
+import { CardContext } from '../../components/Card/context';
 import { Component } from '../../components/Component';
-import { useComponentContext } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
 const defaultElement = 'h3';
-export const Title = React.memo((props) => {
+export function Title(props) {
     const config = useConfig();
-    const { getRootCls } = useComponentContext();
+    const { getRootCls } = React.useContext(CardContext);
     const { className, prefixCls = getRootCls(), ...restProps } = props;
-    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls, 'title'), [config, prefixCls]);
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'title'), [config, prefixCls]);
     return React.createElement(Component, { className: classNames(rootCls, className), component: defaultElement, ...restProps });
-});
+}
 if (process.env.NODE_ENV !== 'production') {
     Title.displayName = 'Card.Title';
 }

package/dist/esm/components/Card/context.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+export type CardContextConsumerProps = {
+    getRootCls(): string | undefined;
+};
+export declare const CardContext: React.Context<CardContextConsumerProps>;

package/dist/esm/components/Card/context.js

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export const CardContext = React.createContext({
+    getRootCls() {
+        return 'uk-card';
+    },
+});

package/dist/esm/components/Flex/Flex.js

@@ -1,8 +1,8 @@
 import classNames from 'classnames';
 import * as React from 'react';
 import { Component } from '../../components/Component';
-import { ComponentProvider } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
+import { FlexContext } from '../../components/Flex/context';
 import { getBreakpointsConfigClasses } from '../../utils';
 const defaultElement = 'div';
 export function Flex(props) {
@@ -12,7 +12,12 @@ export function Flex(props) {
     const justifyContentCls = React.useMemo(() => (typeof justifyContent === 'string'
         ? `${rootCls}-${justifyContent}`
         : getBreakpointsConfigClasses(prefixCls || config.prefixCls, 'flex', justifyContent)), [config.prefixCls, justifyContent, prefixCls, rootCls]);
-    return (React.createElement(ComponentProvider, { component: "flex", prefixCls: prefixCls || config.prefixCls },
+    const context = React.useMemo(() => ({
+        getRootCls() {
+            return rootCls;
+        },
+    }), [rootCls]);
+    return (React.createElement(FlexContext.Provider, { value: context },
         React.createElement(Component, { className: classNames({
                 [rootCls]: !inline,
                 [`${rootCls}-inline`]: inline,

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

@@ -1,13 +1,13 @@
 import classNames from 'classnames';
 import * as React from 'react';
 import { Component } from '../../components/Component';
-import { useComponentContext } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
+import { FlexContext } from '../../components/Flex/context';
 import { getBreakpointsConfigClasses } from '../../utils';
 const defaultElement = 'div';
 export function Item(props) {
     const config = useConfig();
-    const { getRootCls } = useComponentContext();
+    const { getRootCls } = React.useContext(FlexContext);
     const { className, itemDimensions, order, prefixCls = getRootCls(), ...restProps } = props;
     const orderCls = React.useMemo(() => (typeof order === 'string'
         ? `${prefixCls}-${order}`

package/dist/esm/components/Flex/context.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+export type FlexContextConsumerProps = {
+    getRootCls(): string | undefined;
+};
+export declare const FlexContext: React.Context<FlexContextConsumerProps>;

package/dist/esm/components/Flex/context.js

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export const FlexContext = React.createContext({
+    getRootCls() {
+        return undefined;
+    },
+});

package/dist/esm/components/Form/Controls.js

@@ -1,10 +1,10 @@
 import classNames from 'classnames';
 import * as React from 'react';
-import { useComponentContext } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
+import { FormContext } from '../../components/Form/context';
 export const Controls = React.memo((props) => {
     const config = useConfig();
-    const { getRootCls } = useComponentContext();
+    const { getRootCls } = React.useContext(FormContext);
     const { className, prefixCls = getRootCls(), ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'controls'), [config, prefixCls]);
     return React.createElement("div", { className: classNames(rootCls, className), ...restProps });

package/dist/esm/components/Form/ControlsText.js

@@ -1,10 +1,10 @@
 import classNames from 'classnames';
 import * as React from 'react';
-import { useComponentContext } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
+import { FormContext } from '../../components/Form/context';
 export const ControlsText = React.memo((props) => {
     const config = useConfig();
-    const { getRootCls } = useComponentContext();
+    const { getRootCls } = React.useContext(FormContext);
     const { className, prefixCls = getRootCls(), ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'controls-text'), [config, prefixCls]);
     return React.createElement("div", { className: classNames(rootCls, className), ...restProps });

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

@@ -5,4 +5,6 @@ export interface FormOwnProps {
     prefixCls?: string;
 }
 export type FormProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<FormOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, FormOwnProps>;
-export declare const Form: React.MemoExoticComponent<(<E extends React.ElementType<any> = "form">(props: FormProps<E>) => React.JSX.Element)>;
+declare const defaultElement: React.ElementType;
+export declare function Form<E extends React.ElementType = typeof defaultElement>(props: FormProps<E>): React.JSX.Element;
+export {};

package/dist/esm/components/Form/Form.js

@@ -1,15 +1,20 @@
 import classNames from 'classnames';
 import * as React from 'react';
 import { Component } from '../../components/Component';
-import { ComponentProvider } from '../../components/ComponentProvider';
 import { useConfig } from '../../components/ConfigProvider';
+import { FormContext } from '../../components/Form/context';
 const defaultElement = 'form';
-export const Form = React.memo((props) => {
+export function Form(props) {
     const config = useConfig();
     const { className, layout, prefixCls = config.prefixCls, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'form'), [config, prefixCls]);
-    return (React.createElement(ComponentProvider, { component: "form", prefixCls: prefixCls || config.prefixCls },
+    const context = React.useMemo(() => ({
+        getRootCls() {
+            return rootCls;
+        },
+    }), [rootCls]);
+    return (React.createElement(FormContext.Provider, { value: context },
         React.createElement(Component, { className: classNames(rootCls, {
                 [`${rootCls}-${layout}`]: layout !== undefined,
             }, className), component: defaultElement, ...restProps })));
-});
+}

package/dist/esm/components/Form/context.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+export type FormContextConsumerProps = {
+    getRootCls(): string | undefined;
+};
+export declare const FormContext: React.Context<FormContextConsumerProps>;

package/dist/esm/components/Form/context.js

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export const FormContext = React.createContext({
+    getRootCls() {
+        return 'uk-form';
+    },
+});

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

@@ -7,7 +7,7 @@ import { Label } from '../../components/Form/Label';
 import { Legend } from '../../components/Form/Legend';
 import './index.scss';
 export type { FormProps };
-export interface Form extends React.MemoExoticComponent<React.ForwardRefExoticComponent<FormProps>> {
+export interface Form extends React.FunctionComponent<FormProps> {
     Controls: typeof Controls;
     ControlsText: typeof ControlsText;
     Fieldset: typeof Fieldset;

package/dist/esm/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 const List: React.MemoExoticComponent<(props: ListProps) => React.JSX.Element>;
+export declare function List(props: ListProps): React.JSX.Element;

package/dist/esm/components/List/List.js

@@ -1,7 +1,7 @@
 import classNames from 'classnames';
 import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
-export const List = React.memo((props) => {
+export function List(props) {
     const config = useConfig();
     const { className, color, prefixCls = config.prefixCls, size, type, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'list'), [config, prefixCls]);
@@ -10,4 +10,4 @@ export const List = React.memo((props) => {
             [`${rootCls}-${size}`]: size !== undefined,
             [`${rootCls}-${type}`]: type !== undefined,
         }, className), ...restProps }));
-});
+}

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

@@ -3,7 +3,7 @@ import { Item } from '../../components/List/Item';
 import { type ListProps } from '../../components/List/List';
 import './index.scss';
 export type { ListProps };
-export interface List extends React.MemoExoticComponent<React.FunctionComponent<ListProps>> {
+export interface List extends React.FunctionComponent<ListProps> {
     Item: typeof Item;
 }
 export declare const List: List;

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

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

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

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export function Item(props) {
+    return React.createElement("li", { ...props });
+}
+if (process.env.NODE_ENV !== 'production') {
+    Item.displayName = 'Subnav.Item';
+}

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

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export interface SubnavProps extends React.HTMLAttributes<HTMLUListElement> {
+    prefixCls?: string;
+    type?: 'divider' | 'pill';
+}
+export declare function Subnav(props: SubnavProps): React.JSX.Element;

package/dist/esm/components/Subnav/Subnav.js

@@ -0,0 +1,11 @@
+import classNames from 'classnames';
+import * as React from 'react';
+import { useConfig } from '../../components/ConfigProvider';
+export function Subnav(props) {
+    const config = useConfig();
+    const { className, prefixCls = config.prefixCls, type, ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'subnav'), [config, prefixCls]);
+    return (React.createElement("ul", { className: classNames(rootCls, {
+            [`${rootCls}-${type}`]: type !== undefined,
+        }, className), ...restProps, "data-uk-margin": "" }));
+}

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

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

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

@@ -0,0 +1,5 @@
+import { Item } from '../../components/Subnav/Item';
+import { Subnav as InnerSubnav } from '../../components/Subnav/Subnav';
+import './index.scss';
+export const Subnav = InnerSubnav;
+Subnav.Item = Item;