@cloudbase/weda-ui 3.8.2 → 3.9.1

package/dist/web/components/wd-markdown/index.d.ts

@@ -0,0 +1,4 @@
+import { WdMarkdown } from './wd-markdown';
+export { WdMarkdown } from './wd-markdown';
+export type { MarkdownProps } from './wd-markdown';
+export default WdMarkdown;

package/dist/web/components/wd-markdown/index.js

@@ -0,0 +1,3 @@
+import { WdMarkdown } from './wd-markdown';
+export { WdMarkdown } from './wd-markdown';
+export default WdMarkdown;

package/dist/web/components/wd-markdown/style.d.ts

@@ -0,0 +1,3 @@
+import './github-markdown-light.css';
+import 'highlight.js/styles/github.min.css';
+import '../style';

package/dist/web/components/wd-markdown/style.js

@@ -0,0 +1,3 @@
+import './github-markdown-light.css';
+import 'highlight.js/styles/github.min.css';
+import '../style';

package/dist/web/components/wd-markdown/wd-markdown.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { CommonPropsType } from '../../types';
+import type { DataType } from '../../../configs/components/wd-markdown';
+import './style';
+export interface MarkdownProps extends CommonPropsType, DataType {
+}
+export declare const WdMarkdown: React.ForwardRefExoticComponent<MarkdownProps & React.RefAttributes<any>>;

package/dist/web/components/wd-markdown/wd-markdown.js

@@ -0,0 +1,96 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/* eslint-disable @typescript-eslint/no-magic-numbers */
+import { useEffect, useState, useCallback, forwardRef, useRef, } from 'react';
+import MarkdownIt from 'markdown-it/dist/markdown-it.js';
+import copy from 'markdown-it-code-copy';
+import hljs from 'highlight.js';
+import { useSetWidgetApi } from '../../utils/widget-api/use-set-widget-api';
+import { useConfig } from '../../utils/config-context';
+import { usePlatform } from '../../utils/platform';
+import classNames from '../../utils/classnames';
+import useDebouncedCallback from '../../utils/hooks/use-debounced-callback';
+import { useImgTransform } from '../richTextView/useImgTransform';
+import { getOnClick } from '../wd-unified-link/utils';
+import './style';
+export const WdMarkdown = forwardRef(function WdMarkdown({ value = '', options, className, style, id, events }, ref) {
+    const platform = usePlatform();
+    const { classPrefix } = useConfig();
+    const cls = classNames({
+        [`${classPrefix}-markdown`]: true,
+        'markdown-body': true,
+        [`${classPrefix}-${platform}-table`]: true,
+        [className]: className,
+    });
+    // markdown-it实例
+    const [mdInstance, setMdInstance] = useState(null);
+    const destroy = useCallback(() => {
+        if (!mdInstance) {
+            return;
+        }
+        setMdInstance(null);
+    }, [mdInstance]);
+    const onMarkdownReady = useCallback((mdInstance) => {
+        setMdInstance(mdInstance);
+        if (events === null || events === void 0 ? void 0 : events.onReady) {
+            events === null || events === void 0 ? void 0 : events.onReady({ markdownInstance: mdInstance });
+        }
+    }, [events]);
+    // 初始化markdown-it实例
+    const init = useDebouncedCallback(useCallback(async (options) => {
+        let md = mdInstance;
+        if (md) {
+            destroy();
+        }
+        md = new MarkdownIt({
+            // 默认开启高亮
+            highlight: function (str, lang) {
+                if (lang && hljs.getLanguage(lang)) {
+                    try {
+                        return hljs.highlight(lang, str).value;
+                    }
+                    catch (__) { }
+                }
+                return ''; // 使用额外的默认转义
+            },
+            ...options,
+        });
+        md.use(copy);
+        onMarkdownReady(md);
+    }, [mdInstance, onMarkdownReady, destroy]), 500, {
+        maxWait: 1000,
+    });
+    useEffect(() => {
+        init(options);
+    }, [init, options]);
+    const [html, setHtml] = useState('');
+    useEffect(() => {
+        if (mdInstance) {
+            setHtml(mdInstance === null || mdInstance === void 0 ? void 0 : mdInstance.render(value));
+        }
+    }, [mdInstance, value]);
+    const displayValue = useImgTransform(html);
+    const markdownRef = useRef(null);
+    useEffect(() => {
+        if (markdownRef.current) {
+            markdownRef.current.querySelectorAll('a').forEach((a) => {
+                const url = a.href;
+                // 若非同域 默认新页面打开
+                if (/https?:\/\//.test(url) &&
+                    !url.startsWith(window.location.origin)) {
+                    a.target = a.target || '_blank';
+                }
+                a.addEventListener('click', (e) => {
+                    getOnClick({ url })(e);
+                });
+            });
+        }
+    }, [displayValue]);
+    useSetWidgetApi(() => {
+        return {
+            value,
+            markdownInstance: mdInstance,
+            updateMarkdownInstance: ({ markdownInstance }) => setMdInstance(markdownInstance),
+        };
+    }, [value, mdInstance], ref);
+    return (_jsx("div", { ref: markdownRef, className: cls, style: style, id: id, children: mdInstance && (_jsx("div", { dangerouslySetInnerHTML: { __html: displayValue } })) }));
+});

package/dist/web/components/wd-menu-layout/components/H5Menu.js

@@ -5,6 +5,7 @@ import { WdIcon, WdMenuList } from '../../index';
 import { Drawer, ConfigProvider } from 'tea-component';
 import { slotDiv, MenuLayoutContext } from '../utils';
 export const H5Menu = forwardRef(function H5Menu(props, ref) {
+    const { outerClickClosable = true } = props;
     const { classPrefix } = useConfig();
     const [visible, setVisible] = useState(false);
     const provider = useMemo(() => {
@@ -14,5 +15,7 @@ export const H5Menu = forwardRef(function H5Menu(props, ref) {
             },
         };
     }, [setVisible]);
-    return (_jsxs(MenuLayoutContext.Provider, { value: provider, children: [_jsxs("div", { className: `${classPrefix}-menulayout__bar-wrap`, children: [_jsx("div", { className: `${classPrefix}-menulayout__bar-logo`, children: slotDiv(props.headSlot) }), _jsx("div", { className: `${classPrefix}-menulayout__bar-content`, children: slotDiv(props.headRightSlot, { justifyContent: 'flex-end' }) }), _jsx("div", { className: `${classPrefix}-menulayout__bar-extra`, children: !visible ? (_jsx(WdIcon, { name: "td:view-list", size: "md", onClick: () => setVisible(true) })) : (_jsx(WdIcon, { name: "td:close", size: "md", onClick: () => setVisible(false) })) }), _jsx(ConfigProvider, { classPrefix: "wedatea2td", children: _jsxs(Drawer, { style: { visibility: visible ? 'visible' : 'hidden' }, size: 'm', placement: 'right', disableAnimation: true, outerClickClosable: false, showMask: visible, visible: true, onClose: () => setVisible(false), className: `${classPrefix}-menulayout-h5__drawer ${classPrefix}-menulayout__menu`, children: [_jsx(WdMenuList, { ...props, className: "", id: "", style: {}, ref: ref }), _jsx("div", { className: `${classPrefix}-menulayout-h5__drawer-slot ${classPrefix}-menulayout-body__footer`, children: slotDiv(props.footerSlot) })] }) })] }), _jsx("div", { className: `${classPrefix}-menulayout-body`, children: _jsx("div", { className: `${classPrefix}-menulayout-body__content ${classPrefix}-menulayout__body`, children: props.contentSlot }) })] }));
+    return (_jsxs(MenuLayoutContext.Provider, { value: provider, children: [_jsxs("div", { className: `${classPrefix}-menulayout__bar-wrap`, children: [_jsx("div", { className: `${classPrefix}-menulayout__bar-logo`, children: slotDiv(props.headSlot) }), _jsx("div", { className: `${classPrefix}-menulayout__bar-content`, children: slotDiv(props.headRightSlot, { justifyContent: 'flex-end' }) }), _jsx("div", { className: `${classPrefix}-menulayout__bar-extra`, 
+                        // 防止连续触发
+                        style: props.outerClickClosable && visible ? { pointerEvents: 'none' } : {}, children: !visible ? (_jsx(WdIcon, { name: "td:view-list", size: "md", onClick: () => setVisible(true) })) : (_jsx(WdIcon, { name: "td:close", size: "md", onClick: () => setVisible(false) })) }), _jsx(ConfigProvider, { classPrefix: "wedatea2td", children: _jsxs(Drawer, { size: 'm', placement: 'right', disableAnimation: true, outerClickClosable: outerClickClosable, showMask: visible, visible: visible, onClose: () => setVisible(false), className: `${classPrefix}-menulayout-h5__drawer ${classPrefix}-menulayout__menu`, children: [_jsx(WdMenuList, { ...props, className: "", id: "", style: {}, ref: ref }), _jsx("div", { className: `${classPrefix}-menulayout-h5__drawer-slot ${classPrefix}-menulayout-body__footer`, children: slotDiv(props.footerSlot) })] }) })] }), _jsx("div", { className: `${classPrefix}-menulayout-body`, children: _jsx("div", { className: `${classPrefix}-menulayout-body__content ${classPrefix}-menulayout__body`, children: props.contentSlot }) })] }));
 });

package/dist/web/components/wd-menu-layout/components/NavTabMenu.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { WdMenuLayoutProps } from '../wd-menu-layout';
+export declare const NavTabMenu: React.ForwardRefExoticComponent<WdMenuLayoutProps & React.RefAttributes<unknown>>;

package/dist/web/components/wd-menu-layout/components/NavTabMenu.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { useConfig } from '../../../utils/config-context';
+export const NavTabMenu = forwardRef(function TabMenu(props) {
+    const { classPrefix } = useConfig();
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: `${classPrefix}-menulayout-header`, children: props.headRightSlot }), _jsx("div", { className: `${classPrefix}-menulayout-body__content ${classPrefix}-menulayout__body`, children: props.contentSlot }), _jsx("div", { className: `${classPrefix}-menulayout-body__left-slot ${classPrefix}-menulayout-body__footer`, children: props.footerSlot })] }));
+});

package/dist/web/components/wd-menu-layout/wd-menu-layout.js

@@ -5,6 +5,7 @@ import { PlantMenu } from './components/PlantMenu';
 import { VerticalMenu } from './components/VerticalMenu';
 import { TabMenu } from './components/TabMenu';
 import { NavMenu } from './components/NavMenu';
+import { NavTabMenu } from './components/NavTabMenu';
 import { H5Menu } from './components/H5Menu';
 import { useConfig } from '../../utils/config-context';
 import classNames from '../../utils/classnames';
@@ -14,8 +15,10 @@ export const WdMenuLayout = forwardRef(function WdMenuLayout(props, ref) {
     const { classPrefix } = useConfig();
     const platform = usePlatform();
     const _type = props.type || props.template;
-    const type = platform === 'h5' && !['tab', 'nav'].includes(_type) ? 'h5' : _type;
+    const type = platform === 'h5' && !['tab', 'nav', 'navTab'].includes(_type)
+        ? 'h5'
+        : _type;
     return (
     // 1024px 800px为方便测试  开发时去掉
-    _jsxs("div", { id: props.id, style: props.style, className: classNames(props.className, `${classPrefix}-menulayout`, `${classPrefix}-menulayout-root`, ['h5'].includes(type) ? `${classPrefix}-menulayout-h5-root` : '', `${classPrefix}-menulayout--${type}`), children: [['horizontal'].includes(type) && (_jsx(HorizontalMenu, { ...props, ref: ref })), ['vertical'].includes(type) && (_jsx(VerticalMenu, { ...props, ref: ref })), ['plant'].includes(type) && _jsx(PlantMenu, { ...props, ref: ref }), ['h5'].includes(type) && _jsx(H5Menu, { ...props, ref: ref }), ['tab'].includes(type) && _jsx(TabMenu, { ...props, ref: ref }), ['nav'].includes(type) && _jsx(NavMenu, { ...props, ref: ref })] }));
+    _jsxs("div", { id: props.id, style: props.style, className: classNames(props.className, `${classPrefix}-menulayout`, `${classPrefix}-menulayout-root`, ['h5'].includes(type) ? `${classPrefix}-menulayout-h5-root` : '', `${classPrefix}-menulayout--${type}`), children: [['horizontal'].includes(type) && (_jsx(HorizontalMenu, { ...props, ref: ref })), ['vertical'].includes(type) && (_jsx(VerticalMenu, { ...props, ref: ref })), ['plant'].includes(type) && _jsx(PlantMenu, { ...props, ref: ref }), ['h5'].includes(type) && _jsx(H5Menu, { ...props, ref: ref }), ['tab'].includes(type) && _jsx(TabMenu, { ...props, ref: ref }), ['nav'].includes(type) && _jsx(NavMenu, { ...props, ref: ref }), ['navTab'].includes(type) && (_jsx(NavTabMenu, { ...props, ref: ref }))] }));
 });

package/dist/web/components/wd-menu-nav-tab-layout/index.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import type { CommonPropsType } from '../../types';
+export default function WdMenuNavTabLayout({ children, className, style, id, }: PropsType): JSX.Element;
+export interface PropsType extends CommonPropsType {
+    title?: string;
+}

package/dist/web/components/wd-menu-nav-tab-layout/index.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import classNames from '../../utils/classnames';
+export default function WdMenuNavTabLayout({ children, className, style, id, }) {
+    return (_jsx("div", { role: "container", id: id, style: style, className: classNames({ 'weda-ui': true, [className]: className }), children: children }));
+}

package/dist/web/components/wd-table/components/FieldRender/index.js

@@ -138,8 +138,8 @@ export function getFieldRender(field = {}, extra = {}) {
                 }
                 return (_jsx(TextWrap, { ...textProps, children: fieldValue[relatedField] || fieldValue[primaryField] || '-' }));
             }
-            else if (format === 'x-video') {
-                // 视频
+            else if (format === 'x-video' || format === 'x-music') {
+                // 视频/音频
                 return _jsx(VideoPreview, { value: fieldValue });
             }
             else {
@@ -165,6 +165,9 @@ export function getFieldRender(field = {}, extra = {}) {
             if (format === 'x-location') {
                 return xLocationRender(fieldValue, modelType);
             }
+            else if (format === 'x-json') {
+                return _jsx(TextWrap, { ...textProps, children: JSON.stringify(fieldValue) });
+            }
             else if (modelType === 'detail') {
                 return objectRender({
                     value: fieldValue,

package/dist/web/utils/error.d.ts

@@ -8,3 +8,16 @@ export declare class WdCompError extends Error {
         original?: Error;
     });
 }
+export declare const errorHandler: ({ id, code, error }: {
+    id?: string;
+    code: any;
+    error: any;
+}) => {
+    compError: WdCompError;
+    comErrorInfo: {
+        code: any;
+        requestId: any;
+        original: any;
+        message: string;
+    };
+};

package/dist/web/utils/error.js

@@ -25,3 +25,14 @@ export class WdCompError extends Error {
         this.original = context === null || context === void 0 ? void 0 : context.original;
     }
 }
+export const errorHandler = ({ id = '', code, error }) => {
+    const comErrorInfo = {
+        code: (error === null || error === void 0 ? void 0 : error.code) || code,
+        requestId: error === null || error === void 0 ? void 0 : error.requestId,
+        original: error,
+        message: `[组件${id}:${code}]${(error === null || error === void 0 ? void 0 : error.message) || code}`,
+    };
+    const compError = new WdCompError(comErrorInfo.message, comErrorInfo);
+    console.error(comErrorInfo);
+    return { compError, comErrorInfo };
+};

package/dist/web/utils/getModelParams.d.ts

@@ -2,5 +2,7 @@ export function convertWhere(props: any, supportManyRelated: any): any;
 export function getModelParams(props: any): {
     orderBy: any;
     orderType: any;
+    filter: any;
+    select: {};
     where: any[];
 };

package/dist/web/utils/getModelParams.js

@@ -19,22 +19,91 @@ export const convertWhere = (props, supportManyRelated) => {
     where = where === null || where === void 0 ? void 0 : where.filter((i) => !isEmptyObj(i));
     return Array.isArray(where) ? where : [];
 };
+/**
+ * 拼接filter参数
+ */
+const getFilter = (wList) => {
+    var _a, _b, _c;
+    let where = [];
+    let filter = { where: {} };
+    if ((_a = wList === null || wList === void 0 ? void 0 : wList.where) === null || _a === void 0 ? void 0 : _a.$or) {
+        const wListWhere = ((_b = wList === null || wList === void 0 ? void 0 : wList.where) === null || _b === void 0 ? void 0 : _b.$or) || [];
+        if ((wList === null || wList === void 0 ? void 0 : wList.constructor) === Object) {
+            where = [...wListWhere];
+            filter = {
+                ...wList,
+                where: {
+                    $or: where,
+                },
+            };
+        }
+    }
+    else {
+        const wListWhere = ((_c = wList === null || wList === void 0 ? void 0 : wList.where) === null || _c === void 0 ? void 0 : _c.$and) || [];
+        if ((wList === null || wList === void 0 ? void 0 : wList.constructor) === Object) {
+            where = [...wListWhere];
+            filter = {
+                ...wList,
+                where: {
+                    $and: where,
+                },
+            };
+        }
+    }
+    if (Array.isArray(wList)) {
+        where = [...wList];
+        filter = {
+            where: {
+                $and: where,
+            },
+        };
+    }
+    return getParseValue(filter);
+};
+const getSelectFields = (props) => {
+    let select = {};
+    // 支持自定义查询字段
+    if (props.selectFieldType === 'custom') {
+        const _selectFields = Array.isArray(props.selectFields)
+            ? props.selectFields
+            : [];
+        _selectFields.forEach((name) => {
+            select[name] = true;
+        });
+    }
+    else {
+        select = { $master: true };
+    }
+    return select;
+};
 /**
  * 获取tcb查询条件
  */
 export const getModelParams = (props) => {
+    var _a;
     const params = {};
     try {
-        const where = convertWhere(props);
         const { orderBy, orderType } = props || {};
         if (orderBy && ['asc', 'desc'].includes(orderType)) {
             params['orderBy'] = orderBy;
             params['orderType'] = orderType;
         }
-        if (Array.isArray(where) && where.length > 0) {
-            params['where'] = where;
+        if (props.supportManyRelated) {
+            // 支持多关联查询，需要将查询条件转换为filter
+            if (((_a = props === null || props === void 0 ? void 0 : props.queryCondition) === null || _a === void 0 ? void 0 : _a.constructor) === Object) {
+                params['filter'] = getFilter(props.queryCondition);
+            }
+            params.select = getSelectFields(props);
+        }
+        else {
+            const where = convertWhere(props);
+            if (Array.isArray(where) && where.length > 0) {
+                params['where'] = where;
+            }
         }
     }
-    catch (e) { }
+    catch (e) {
+        console.error('getModelParams error', e);
+    }
     return params;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudbase/weda-ui",
-  "version": "3.8.2",
+  "version": "3.9.1",
   "main": "./dist/index.js",
   "module": "./dist/index",
   "miniprogram": "mpdist",
@@ -105,11 +105,14 @@
     "echarts": "^5.3.0",
     "echarts-for-react": "^3.0.2",
     "eslint-plugin-compat": "^4.1.4",
+    "highlight.js": "^11.10.0",
     "js-beautify": "^1.15.1",
     "jsonexport": "3.2.0",
     "lodash.get": "^4.4.2",
     "lodash.isequal": "^4.5.0",
     "lodash.set": "^4.3.2",
+    "markdown-it": "^14.1.0",
+    "markdown-it-code-copy": "^0.1.2",
     "moment": "^2.29.4",
     "object.fromentries": "^2.0.7",
     "prop-types": "^15.7.2",