@broxus/react-uikit 0.17.4 → 0.19.0

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

@@ -0,0 +1,68 @@
+"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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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.Segmented = Segmented;
+const segmented_1 = __importDefault(require("@rc-component/segmented"));
+const classnames_1 = __importDefault(require("classnames"));
+const React = __importStar(require("react"));
+const ConfigProvider_1 = require("../../components/ConfigProvider");
+function isSegmentedLabeledOptionWithIcon(option) {
+    return typeof option === 'object' && !!option?.icon;
+}
+function Segmented(props) {
+    const config = (0, ConfigProvider_1.useConfig)();
+    const { className, options = [], prefixCls = config.prefixCls, size, vertical, ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'segmented'), [config, prefixCls]);
+    const mergedOptions = React.useMemo(() => options.map(option => {
+        // @ts-ignore
+        if (isSegmentedLabeledOptionWithIcon(option)) {
+            const { icon, label, ...restOpts } = option;
+            return {
+                ...restOpts,
+                label: (React.createElement(React.Fragment, null,
+                    React.createElement("span", { className: `${rootCls}-item-icon` }, icon),
+                    label && React.createElement("span", null, label))),
+            };
+        }
+        return option;
+    }), [options, rootCls]);
+    return (React.createElement(segmented_1.default, { className: (0, classnames_1.default)(className, {
+            [`${rootCls}-${size}`]: size,
+            [`${rootCls}-vertical`]: vertical,
+        }), options: mergedOptions, prefixCls: rootCls, vertical: vertical, ...restProps }));
+}

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

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import './index.scss';
 export interface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement> {
     prefixCls?: string;
     ratio?: number;

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

@@ -41,7 +41,6 @@ const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const ConfigProvider_1 = require("../../components/ConfigProvider");
 const Icon_1 = require("../../components/Icon");
-require("./index.scss");
 function Spinner(props) {
     const config = (0, ConfigProvider_1.useConfig)();
     const { className, prefixCls = config.prefixCls, ratio, ...restProps } = props;

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

@@ -1,7 +1,6 @@
 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;

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

@@ -3,6 +3,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Subnav = void 0;
 const Item_1 = require("../../components/Subnav/Item");
 const Subnav_1 = require("../../components/Subnav/Subnav");
-require("./index.scss");
 exports.Subnav = Subnav_1.Subnav;
 exports.Subnav.Item = Item_1.Item;

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

@@ -1,7 +1,6 @@
-import { type SwitchChangeEventHandler, type SwitchClickEventHandler } from 'rc-switch';
+import { type SwitchChangeEventHandler, type SwitchClickEventHandler } from '@rc-component/switch';
 import * as React from 'react';
 import { type Direction } from '../../types';
-import './index.scss';
 export type SwitchSize = 'small';
 export type SwitchProps = {
     autoFocus?: boolean;

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

@@ -37,19 +37,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Switch = void 0;
+const switch_1 = __importDefault(require("@rc-component/switch"));
 const classnames_1 = __importDefault(require("classnames"));
-const rc_switch_1 = __importDefault(require("rc-switch"));
 const React = __importStar(require("react"));
 const ConfigProvider_1 = require("../../components/ConfigProvider");
 const Spinner_1 = require("../../components/Spinner");
-require("./index.scss");
 exports.Switch = React.forwardRef((props, ref) => {
     const config = (0, ConfigProvider_1.useConfig)();
     const { className, direction = config.direction, loading, loadingIcon, prefixCls = config.prefixCls, ...restProps } = props;
     const { size } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'switch'), [config, prefixCls]);
     const mergedLoadingIcon = React.useMemo(() => (React.createElement("div", { className: `${rootCls}-handle` }, loading && (loadingIcon ?? React.createElement(Spinner_1.Spinner, { className: `${rootCls}-loading-icon` })))), [loading, loadingIcon, rootCls]);
-    return (React.createElement(rc_switch_1.default, { ref: ref, className: (0, classnames_1.default)({
+    return (React.createElement(switch_1.default, { ref: ref, className: (0, classnames_1.default)({
             [`${rootCls}-small`]: size === 'small',
             [`${rootCls}-loading`]: loading,
             [`${rootCls}-rtl`]: direction === 'rtl',

package/dist/cjs/components/Tabs/hooks/useAnimateConfig.d.ts

@@ -1,3 +1,3 @@
-import { type AnimatedConfig } from 'rc-tabs/es/interface';
+import { type AnimatedConfig } from '@rc-component/tabs/es/interface';
 import { type TabsProps } from '../../../components/Tabs';
 export declare function useAnimateConfig(prefixCls: string, animated?: TabsProps['animated']): AnimatedConfig;

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

@@ -1,6 +1,5 @@
-import { type TabsProps as RcTabsProps } from 'rc-tabs';
+import { type TabsProps as RcTabsProps } from '@rc-component/tabs';
 import * as React from 'react';
-import './index.scss';
 export type TabsPosition = 'left' | 'right' | 'top' | 'bottom';
 export interface Tab {
     active?: boolean;

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

@@ -37,14 +37,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Tabs = Tabs;
+const tabs_1 = __importDefault(require("@rc-component/tabs"));
 const classnames_1 = __importDefault(require("classnames"));
-const rc_tabs_1 = __importDefault(require("rc-tabs"));
 const React = __importStar(require("react"));
 const ConfigProvider_1 = require("../../components/ConfigProvider");
 const Icon_1 = require("../../components/Icon");
 const hooks_1 = require("../../components/Tabs/hooks");
 const utils_1 = require("../../utils");
-require("./index.scss");
 function Tabs(props) {
     const config = (0, ConfigProvider_1.useConfig)();
     const { addIcon, animated, centered, className, direction, hideAdd, items, more, prefixCls = config.prefixCls, size, type, onEdit, ...restProps } = props;
@@ -61,7 +60,7 @@ function Tabs(props) {
             },
         }
         : undefined), [addIcon, hideAdd, onEdit, type]);
-    return (React.createElement(rc_tabs_1.default, { animated: (0, hooks_1.useAnimateConfig)(rootCls, animated), direction: direction, items: items, ...restProps, className: (0, classnames_1.default)({
+    return (React.createElement(tabs_1.default, { animated: (0, hooks_1.useAnimateConfig)(rootCls, animated), direction: direction, items: items, ...restProps, className: (0, classnames_1.default)({
             [`${rootCls}-${size}`]: size,
             [`${rootCls}-card`]: ['card', 'editable-card'].includes(type),
             [`${rootCls}-editable-card`]: type === 'editable-card',

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

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { type PolymorphicProps } from '../../components/Component';
 import { type BreakpointsConfig } from '../../types';
-import './index.scss';
 export type TextAlign = 'left' | 'right' | 'center' | 'justify';
 export type TextOwnProps = {
     align?: TextAlign | BreakpointsConfig<TextAlign>;

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

@@ -42,7 +42,6 @@ const React = __importStar(require("react"));
 const Component_1 = require("../../components/Component");
 const ConfigProvider_1 = require("../../components/ConfigProvider");
 const utils_1 = require("../../utils");
-require("./index.scss");
 const defaultElement = 'span';
 function Text(props) {
     const config = (0, ConfigProvider_1.useConfig)();

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

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

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

@@ -41,7 +41,6 @@ const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const Component_1 = require("../../components/Component");
 const ConfigProvider_1 = require("../../components/ConfigProvider");
-require("./index.scss");
 const defaultElement = 'div';
 function Tile(props) {
     const config = (0, ConfigProvider_1.useConfig)();

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

@@ -1,10 +1,9 @@
 import * as React from 'react';
 import { type PolymorphicProps } from '../../components/Component';
 import { type WidthBreakpointsConfig, type WidthSize } from '../../components/Width/types';
-import './index.scss';
-export interface WidthOwnProps extends WidthBreakpointsConfig {
+export interface WidthOwnProps extends Omit<WidthBreakpointsConfig, 'default'> {
     prefixCls?: string;
-    size?: WidthSize;
+    size?: WidthSize | WidthBreakpointsConfig;
 }
 export type WidthProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<WidthOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, WidthOwnProps>;
 declare const defaultElement = "div";

package/dist/cjs/components/Width/Width.js

@@ -42,15 +42,9 @@ const React = __importStar(require("react"));
 const Component_1 = require("../../components/Component");
 const ConfigProvider_1 = require("../../components/ConfigProvider");
 const utils_1 = require("../../components/Width/utils");
-require("./index.scss");
 const defaultElement = 'div';
 function Width(props) {
     const config = (0, ConfigProvider_1.useConfig)();
     const { className, prefixCls = config.prefixCls, size, s, m, l, xl, ...restProps } = props;
-    return (React.createElement(Component_1.Component, { className: (0, classnames_1.default)((0, utils_1.getWidthClassname)(size, prefixCls || config.prefixCls), (0, utils_1.getWidthClassname)({
-            l,
-            m,
-            s,
-            xl,
-        }, prefixCls || config.prefixCls), className), component: defaultElement, ...restProps }));
+    return (React.createElement(Component_1.Component, { className: (0, classnames_1.default)((0, utils_1.getWidthClassname)(size, prefixCls || config.prefixCls), (0, utils_1.getWidthClassname)({ l, m, s, xl }, prefixCls || config.prefixCls), className), component: defaultElement, ...restProps }));
 }

package/dist/cjs/components/Width/utils.d.ts

@@ -1,3 +1,3 @@
 import { type ChildWidthBreakpointsConfig, type ChildWidthSize, type WidthBreakpointsConfig, type WidthSize } from '../../components/Width';
-export declare function getWidthClassname(valueOrConfig: WidthSize | WidthBreakpointsConfig, prefixCls?: string): string | undefined;
+export declare function getWidthClassname(valueOrConfig?: WidthSize | WidthBreakpointsConfig, prefixCls?: string): string | undefined;
 export declare function getChildWidthClassname(valueOrConfig: ChildWidthSize | ChildWidthBreakpointsConfig | undefined, prefixCls?: string): string | undefined;

package/dist/cjs/index.d.ts

@@ -24,6 +24,7 @@ export * from './components/Card';
 export * from './components/Nav';
 export * from './components/Navbar';
 export * from './components/Subnav';
+export * from './components/Segmented';
 export * from './components/Breadcrumb';
 export * from './components/Tabs';
 export * from './components/Dotnav';

package/dist/cjs/index.js

@@ -40,6 +40,7 @@ __exportStar(require("./components/Card"), exports);
 __exportStar(require("./components/Nav"), exports);
 __exportStar(require("./components/Navbar"), exports);
 __exportStar(require("./components/Subnav"), exports);
+__exportStar(require("./components/Segmented"), exports);
 __exportStar(require("./components/Breadcrumb"), exports);
 __exportStar(require("./components/Tabs"), exports);
 __exportStar(require("./components/Dotnav"), exports);

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

@@ -1,4 +1,4 @@
-import { type CollapseProps } from 'rc-collapse';
+import { type CollapseProps } from '@rc-component/collapse';
 import * as React from 'react';
 export interface AccordionProps extends CollapseProps {
     direction?: string;

package/dist/esm/components/Accordion/Accordion.js

@@ -1,5 +1,5 @@
+import Collapse from '@rc-component/collapse';
 import classNames from 'classnames';
-import Collapse from 'rc-collapse';
 import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
 import { getCollapseMotion } from '../../utils';

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

@@ -1,12 +1,13 @@
-import { type CollapsePanelProps } from 'rc-collapse';
+import { type CollapsePanelProps } from '@rc-component/collapse';
 import * as React from 'react';
-export interface AccordionItemProps extends React.PropsWithChildren<Omit<CollapsePanelProps, 'prefixCls'>> {
+export interface AccordionItemProps extends Omit<CollapsePanelProps, 'expandIcon' | 'prefixCls'> {
+    expandIcon?: (props: AccordionItemProps) => React.ReactNode;
 }
 /**
  * Use Accordion items props instead
  * @deprecated
  */
-export declare function Item(props: AccordionItemProps): React.JSX.Element;
+export declare function Item(props: React.PropsWithChildren<AccordionItemProps>): React.JSX.Element;
 export declare namespace Item {
     var displayName: string;
 }

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

@@ -1,4 +1,4 @@
-import { Panel } from 'rc-collapse';
+import { Panel } from '@rc-component/collapse';
 import * as React from 'react';
 import { Icon } from '../../components/Icon';
 /**

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

@@ -1,7 +1,6 @@
 import type * as React from 'react';
 import { type AccordionProps } from '../../components/Accordion/Accordion';
 import { type AccordionItemProps, Item } from '../../components/Accordion/Item';
-import './index.scss';
 export type { AccordionProps, AccordionItemProps };
 export interface Accordion extends React.FunctionComponent<AccordionProps> {
     Item: typeof Item;

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

@@ -1,5 +1,4 @@
 import { Accordion as InternalAccordion } from '../../components/Accordion/Accordion';
 import { Item } from '../../components/Accordion/Item';
-import './index.scss';
 export const Accordion = InternalAccordion;
 Accordion.Item = Item;

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

@@ -1,6 +1,5 @@
-import { type MotionEndEventHandler } from 'rc-motion';
+import { type MotionEndEventHandler } from '@rc-component/motion';
 import * as React from 'react';
-import './index.scss';
 export interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {
     closable?: boolean;
     closeIcon?: React.ReactNode;

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

@@ -1,12 +1,11 @@
+import CSSMotion from '@rc-component/motion';
 import classNames from 'classnames';
-import CSSMotion from 'rc-motion';
 import * as React from 'react';
 import { Close } from '../../components/Close';
 import { useConfig } from '../../components/ConfigProvider';
-import './index.scss';
 export const Alert = React.forwardRef((props, ref) => {
     const config = useConfig();
-    const { children, className, closable = true, closeIcon, prefixCls = config.prefixCls, style, severity, onClose, onClosed, ...restProps } = props;
+    const { children, className, closable = true, closeIcon = config.alert?.closeIcon, prefixCls = config.prefixCls, style, severity, onClose, onClosed, ...restProps } = props;
     const [closed, setClosed] = React.useState(false);
     const close = React.useCallback(() => {
         onClose?.();
@@ -21,12 +20,11 @@ export const Alert = React.forwardRef((props, ref) => {
         }), onLeaveEnd: onClosed }, ({ className: motionClassName, style: motionStyle }) => (React.createElement("div", { className: classNames(rootCls, {
             [`${rootCls}-${severity}`]: severity !== undefined,
         }, className, motionClassName), "data-show": !closed, role: "alert", style: { ...style, ...motionStyle }, ...restProps },
-        closable
-            && (React.isValidElement(closeIcon) ? (React.cloneElement(closeIcon, {
-                // @ts-ignore
-                className: `${rootCls}-close`,
-                onClick: close,
-            })) : (React.createElement(Close, { className: `${rootCls}-close`, onClick: close }))),
+        closable && (React.isValidElement(closeIcon) ? (React.cloneElement(closeIcon, {
+            // @ts-ignore
+            className: `${rootCls}-close`,
+            onClick: close,
+        })) : (React.createElement(Close, { className: `${rootCls}-close`, onClick: close }))),
         children))));
 });
 if (process.env.NODE_ENV !== 'production') {

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

@@ -1,10 +1,11 @@
 import * as React from 'react';
+import { type AlignBreakpointsConfig, type AlignSide } from '../../components/Align/types';
 import { type PolymorphicProps } from '../../components/Component';
 import { type Direction } from '../../types';
-export interface AlignOwnProps {
+export interface AlignOwnProps extends Omit<AlignBreakpointsConfig, 'default'> {
+    align?: AlignSide | AlignBreakpointsConfig;
     direction?: Direction;
     prefixCls?: string;
-    side?: 'left' | 'right';
 }
 export type AlignProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<AlignOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, AlignOwnProps>;
 declare const defaultElement = "div";

package/dist/esm/components/Align/Align.js

@@ -1,17 +1,23 @@
 import classNames from 'classnames';
 import * as React from 'react';
+import { getAlignClassname } from '../../components/Align/utils';
 import { Component } from '../../components/Component';
 import { useConfig } from '../../components/ConfigProvider';
 const defaultElement = 'div';
 export function Align(props) {
     const config = useConfig();
-    const { className, direction = config.direction, prefixCls = config.prefixCls, side = 'left', ...restProps } = props;
+    const { align = 'left', className, direction = config.direction, prefixCls = config.prefixCls, s, m, l, xl, ...restProps } = props;
     const isRtl = React.useMemo(() => direction === 'rtl', [direction]);
-    const invertedSide = React.useMemo(() => (side === 'left' ? 'right' : 'left'), [side]);
-    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'align'), [config, prefixCls]);
-    return (React.createElement(Component, { className: classNames({
-            [`${rootCls}-${isRtl ? invertedSide : side}`]: true,
-        }, className), component: defaultElement, ...restProps }));
+    const mergedAlign = React.useMemo(() => {
+        if (isRtl && align === 'left') {
+            return 'right';
+        }
+        if (isRtl && align === 'right') {
+            return 'left';
+        }
+        return align;
+    }, [align, isRtl]);
+    return (React.createElement(Component, { className: classNames(getAlignClassname(mergedAlign, prefixCls || config.prefixCls), getAlignClassname({ l, m, s, xl }, prefixCls || config.prefixCls), className), component: defaultElement, ...restProps }));
 }
 if (process.env.NODE_ENV !== 'production') {
     Align.displayName = 'Align';

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

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import { type AlignProps } from '../../components/Align/Align';
+export declare function Center(props: Omit<AlignProps, 'align'>): React.JSX.Element;
+export declare namespace Center {
+    var displayName: string;
+}

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

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { Align } from '../../components/Align/Align';
+export function Center(props) {
+    return React.createElement(Align, { ...props, align: "center" });
+}
+if (process.env.NODE_ENV !== 'production') {
+    Center.displayName = 'Align.Center';
+}

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

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { type AlignProps } from '../../components/Align/Align';
-export declare function Left(props: Omit<AlignProps, 'side'>): React.JSX.Element;
+export declare function Left(props: Omit<AlignProps, 'align'>): React.JSX.Element;
 export declare namespace Left {
     var displayName: string;
 }

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Align } from '../../components/Align/Align';
 export function Left(props) {
-    return React.createElement(Align, { ...props, side: "left" });
+    return React.createElement(Align, { ...props, align: "left" });
 }
 if (process.env.NODE_ENV !== 'production') {
     Left.displayName = 'Align.Left';

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

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { type AlignProps } from '../../components/Align/Align';
-export declare function Right(props: Omit<AlignProps, 'side'>): React.JSX.Element;
+export declare function Right(props: Omit<AlignProps, 'align'>): React.JSX.Element;
 export declare namespace Right {
     var displayName: string;
 }

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Align } from '../../components/Align/Align';
 export function Right(props) {
-    return React.createElement(Align, { ...props, side: "right" });
+    return React.createElement(Align, { ...props, align: "right" });
 }
 if (process.env.NODE_ENV !== 'production') {
     Right.displayName = 'Align.Right';

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

@@ -1,10 +1,13 @@
 import type * as React from 'react';
 import { type AlignOwnProps, type AlignProps } from '../../components/Align/Align';
+import { Center } from '../../components/Align/Center';
 import { Left } from '../../components/Align/Left';
 import { Right } from '../../components/Align/Right';
-import './index.scss';
 export type { AlignOwnProps, AlignProps };
+export * from '../../components/Align/types';
+export * from '../../components/Align/utils';
 export interface Align extends React.FunctionComponent<AlignProps> {
+    Center: typeof Center;
     Left: typeof Left;
     Right: typeof Right;
 }

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

@@ -1,7 +1,10 @@
 import { Align as InternalAlign } from '../../components/Align/Align';
+import { Center } from '../../components/Align/Center';
 import { Left } from '../../components/Align/Left';
 import { Right } from '../../components/Align/Right';
-import './index.scss';
+export * from '../../components/Align/types';
+export * from '../../components/Align/utils';
 export const Align = InternalAlign;
+Align.Center = Center;
 Align.Left = Left;
 Align.Right = Right;

package/dist/esm/components/Align/types.d.ts

@@ -0,0 +1,3 @@
+import { type BreakpointsConfig } from '../../types';
+export type AlignSide = 'center' | 'left' | 'right';
+export type AlignBreakpointsConfig = Pick<BreakpointsConfig<AlignSide>, 'default'> & Omit<BreakpointsConfig<Omit<AlignSide, 'center'>>, 'default'>;

package/dist/esm/components/Align/types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/components/Align/utils.d.ts

@@ -0,0 +1,2 @@
+import { type AlignBreakpointsConfig, type AlignSide } from '../../components/Align/types';
+export declare function getAlignClassname(valueOrConfig: AlignSide | AlignBreakpointsConfig | undefined, prefixCls?: string): string | undefined;

package/dist/esm/components/Align/utils.js

@@ -0,0 +1,10 @@
+import { getBreakpointsConfigClasses } from '../../utils';
+export function getAlignClassname(valueOrConfig, prefixCls = 'uk') {
+    if (typeof valueOrConfig === 'string') {
+        return `${prefixCls}-align-${valueOrConfig}`;
+    }
+    if (typeof valueOrConfig === 'object' && !Array.isArray(valueOrConfig)) {
+        return getBreakpointsConfigClasses(prefixCls, 'align', valueOrConfig);
+    }
+    return undefined;
+}

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

@@ -2,7 +2,6 @@ import type * as React from 'react';
 import { type ArticleProps } from '../../components/Article/Article';
 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.FunctionComponent<ArticleProps> {
     Meta: typeof Meta;

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

@@ -1,7 +1,6 @@
 import { Article as InternalArticle } from '../../components/Article/Article';
 import { Meta } from '../../components/Article/Meta';
 import { Title } from '../../components/Article/Title';
-import './index.scss';
 export const Article = InternalArticle;
 Article.Meta = Meta;
 Article.Title = Title;

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

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { type PolymorphicProps } from '../../components/Component';
-import './index.scss';
 export type BadgeOwnProps = {
     prefixCls?: string;
 };

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

@@ -2,7 +2,6 @@ import classNames from 'classnames';
 import * as React from 'react';
 import { Component } from '../../components/Component';
 import { useConfig } from '../../components/ConfigProvider';
-import './index.scss';
 const defaultElement = 'span';
 export function Badge(props) {
     const config = useConfig();

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

@@ -1,7 +1,6 @@
 import type * as React from 'react';
 import { type BreadcrumbProps } from '../../components/Breadcrumb/Breadcrumb';
 import { Item } from '../../components/Breadcrumb/Item';
-import './index.scss';
 export type { BreadcrumbProps };
 export interface Breadcrumb extends React.FunctionComponent<BreadcrumbProps> {
     Item: typeof Item;

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

@@ -1,5 +1,4 @@
 import { Breadcrumb as InternalBreadcrumb } from '../../components/Breadcrumb/Breadcrumb';
 import { Item } from '../../components/Breadcrumb/Item';
-import './index.scss';
 export const Breadcrumb = InternalBreadcrumb;
 Breadcrumb.Item = Item;

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

@@ -1,7 +1,6 @@
 import type * as React from 'react';
 import { type ButtonProps } from '../../components/Button/Button';
 import { Group } from '../../components/Button/Group';
-import './index.scss';
 export type { ButtonProps };
 export interface Button extends React.ForwardRefExoticComponent<ButtonProps> {
     Group: typeof Group;

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

@@ -1,5 +1,4 @@
 import { Button as InternalButton } from '../../components/Button/Button';
 import { Group } from '../../components/Button/Group';
-import './index.scss';
 export const Button = InternalButton;
 Button.Group = Group;

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

@@ -6,7 +6,6 @@ import { Footer } from '../../components/Card/Footer';
 import { Header } from '../../components/Card/Header';
 import { Media } from '../../components/Card/Media';
 import { Title } from '../../components/Card/Title';
-import './index.scss';
 export type { CardProps };
 export interface Card extends React.FunctionComponent<CardProps> {
     Badge: typeof Badge;

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

@@ -5,7 +5,6 @@ import { Footer } from '../../components/Card/Footer';
 import { Header } from '../../components/Card/Header';
 import { Media } from '../../components/Card/Media';
 import { Title } from '../../components/Card/Title';
-import './index.scss';
 export const Card = InternalCard;
 Card.Badge = Badge;
 Card.Body = Body;