@mi-avalon/libs 0.0.18 → 0.0.20

package/dist/components/ItemsRow/index.d.ts

@@ -0,0 +1,42 @@
+import { ButtonProps } from 'antd';
+import * as React from 'react';
+/**
+ * 默认配置按钮，也可以通过render() 渲染其他组件
+ */
+export interface IRowItem {
+    /**
+     * 按钮名称
+     */
+    label?: string;
+    /**
+     * 按钮类型
+     */
+    type?: ButtonProps['type'];
+    /**
+     * 如果没有指定Render，则是按钮的onClick
+     */
+    onClick?: (e: any) => void;
+    /**
+     * 其他按钮属性
+     */
+    btnProps?: ButtonProps;
+    /**
+     * item 的className
+     */
+    className?: string;
+    /**
+     * 自定义渲染
+     */
+    render?: () => React.ReactNode;
+}
+export interface IItemRowProps {
+    route?: Array<{
+        name: string;
+        url?: string;
+    }>;
+    items?: IRowItem[];
+    style?: React.CSSProperties;
+    className?: string;
+    offsetTop?: number;
+}
+export declare const ItemsRow: (props: IItemRowProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/ItemsRow/index.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button } from 'antd';
+import { CompThemeProvider } from '../ThemeContext';
+import { getClassName } from '../utils';
+const classname = (n = '') => {
+    const cn = 'items-row';
+    return getClassName(cn, n);
+};
+export const ItemsRow = (props) => {
+    if (!props.items) {
+        return null;
+    }
+    return (_jsx(CompThemeProvider, { children: _jsx("div", { className: `${classname()} ${props.className || ''}`, style: props.style, children: (props.items || []).map((item, index) => {
+                const className = `${classname('item')} ${item.className}`;
+                if (item.render) {
+                    return (_jsx("span", { className: className, children: item.render() }, index));
+                }
+                return (_jsx(Button, { className: className, ...item.btnProps, type: item.type || 'primary', onClick: item.onClick, children: item.label }, item.label));
+            }) }) }));
+};

package/dist/components/MBreadcrumb/index.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { IRowItem } from '../ItemsRow';
+import './index.scss';
+export interface RouteItem {
+    name: string;
+    url?: string;
+}
+export interface IMBreadcrumbProps {
+    routes?: RouteItem[];
+    customItems?: IRowItem[];
+    style?: React.CSSProperties;
+    className?: string;
+    offsetTop?: number;
+    mainAppBaseUrl?: string;
+    microAppName?: string;
+}
+export declare const MBreadcrumb: React.FC<IMBreadcrumbProps>;

package/dist/components/MBreadcrumb/index.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Affix, Breadcrumb, Card } from 'antd';
+import * as React from 'react';
+import { ItemsRow } from '../ItemsRow';
+import { CompThemeProvider } from '../ThemeContext';
+import { getClassName } from '../utils';
+import './index.scss';
+const classname = (n = '') => {
+    const cn = 'm-breadcrumb';
+    return getClassName(cn, n);
+};
+export const MBreadcrumb = props => {
+    const { routes, customItems, style, className, offsetTop = 64, mainAppBaseUrl, microAppName, } = props;
+    const affixRef = React.useRef(null);
+    const onScroll = React.useCallback(() => {
+        affixRef.current?.updatePosition?.();
+    }, []);
+    React.useEffect(() => {
+        window.addEventListener('scroll', onScroll, true);
+        return () => window.removeEventListener('scroll', onScroll);
+    }, [onScroll]);
+    const getUrl = React.useCallback((url) => {
+        if (!url)
+            return '';
+        const cleanedUrl = url.replace(/^\/+/, '');
+        const parts = [
+            mainAppBaseUrl?.replace(/\/+$/, ''),
+            microAppName?.replace(/\/+$/, ''),
+            cleanedUrl,
+        ].filter(Boolean);
+        return `/${parts.join('/')}`;
+    }, [mainAppBaseUrl, microAppName]);
+    return (_jsx(CompThemeProvider, { children: _jsx("div", { className: `${classname()} ${className || ''}`, style: style, children: _jsx(Affix, { ref: affixRef, offsetTop: offsetTop, children: _jsxs(Card, { className: classname('container'), rootClassName: classname('body'), variant: 'borderless', children: [_jsx(Breadcrumb, { className: classname('inner-breadcrumb'), style: { fontSize: '18px' }, children: routes?.map(v => (_jsx(Breadcrumb.Item, { children: v.url ? _jsx("a", { href: `#${getUrl(v.url)}`, children: v.name }) : v.name }, v.url || v.name))) }), _jsx("div", { className: classname('custom-item-wrapper'), children: _jsx(ItemsRow, { items: customItems }) })] }) }) }) }));
+};

package/dist/components/MDescriptions/index.js

@@ -4,6 +4,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * 用于展示对象的详细信息，如用户信息、产品详情等
  */
 import { Descriptions } from 'antd';
+import { CompThemeProvider } from '../ThemeContext';
 const MDescriptions = props => {
     const { data, title, column = 3, lineHeight, align = 'left', itemLayout, colon = true, bordered = false, style, className, labelStyle, contentStyle, } = props;
     // 合并样式
@@ -18,7 +19,7 @@ const MDescriptions = props => {
         ...(itemLayout?.value ? { width: `${itemLayout.value}px` } : {}),
         ...contentStyle,
     };
-    return (_jsx(Descriptions, { title: title, column: column, colon: colon, bordered: bordered, style: style, className: className, labelStyle: mergedLabelStyle, contentStyle: mergedContentStyle, children: data.map((item, index) => (_jsx(Descriptions.Item, { label: item.label, span: item.span, children: item.value || '-' }, item.label?.toString() || index))) }));
+    return (_jsx(CompThemeProvider, { children: _jsx(Descriptions, { title: title, column: column, colon: colon, bordered: bordered, style: style, className: className, labelStyle: mergedLabelStyle, contentStyle: mergedContentStyle, children: data.map((item, index) => (_jsx(Descriptions.Item, { label: item.label, span: item.span, children: item.value || '-' }, item.label?.toString() || index))) }) }));
 };
 MDescriptions.displayName = 'MDescriptions';
 export { MDescriptions };

package/dist/components/MTable/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * 表格
+ */
+import { TableProps } from 'antd';
+export interface IMTableProps extends TableProps {
+}
+export declare function MTable(props: IMTableProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/MTable/index.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * 表格
+ */
+import { Table } from 'antd';
+import { CompThemeProvider } from '../ThemeContext';
+export function MTable(props) {
+    const columns = props.columns?.map(e => ({ ...e, dataIndex: e.key })) ?? [];
+    return (_jsxs(CompThemeProvider, { children: [_jsx(Table, { rowKey: e => e.id, ...props, columns: columns }), ";"] }));
+}

package/dist/components/ThemeContext/index.d.ts

@@ -0,0 +1,11 @@
+import { ThemeConfig } from 'antd';
+interface ThemeContextType {
+    theme?: ThemeConfig;
+}
+export declare const MiThemeProvider: import("react").Provider<ThemeContextType>;
+export declare function useMiThemeConfig(): ThemeContextType;
+interface IProps {
+    children: React.ReactNode;
+}
+export declare function CompThemeProvider(props: IProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/ThemeContext/index.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ConfigProvider, theme } from 'antd';
+import { createContext, useContext } from 'react';
+const ThemeContext = createContext({
+    theme: {
+        cssVar: true,
+        algorithm: [theme.defaultAlgorithm],
+    },
+});
+export const MiThemeProvider = ThemeContext.Provider;
+export function useMiThemeConfig() {
+    return useContext(ThemeContext);
+}
+export function CompThemeProvider(props) {
+    const { theme } = useMiThemeConfig();
+    return _jsx(ConfigProvider, { theme: theme, children: props.children });
+}

package/dist/components/index.d.ts

@@ -1,2 +1,5 @@
+export * from './ItemsRow';
+export * from './MBreadcrumb';
 export * from './MDescriptions';
-export { default as MyButton } from './MyButton';
+export * from './MTable';
+export * from './ThemeContext';

package/dist/components/index.js

@@ -1,10 +1,9 @@
-// export { default as ItemRow } from './ItemsRow';
-// export { default as MBreadcrumb } from './MBreadcrumb';
+export * from './ItemsRow';
+export * from './MBreadcrumb';
 export * from './MDescriptions';
 // export * from './MForm';
 // export { default as MForm } from './MForm';
 // export * from './MiModal';
 // export { default as MSearch } from './MSearch';
-// export { default as MTable } from './MTable';
-export { default as MyButton } from './MyButton';
-// export * from './ThemeContext';
+export * from './MTable';
+export * from './ThemeContext';