@cloudbase/weda-ui 3.4.5 → 3.4.6

package/dist/web/components/lottery/index.js

@@ -255,137 +255,136 @@ export default React.forwardRef(function Lottery({ className, id, style, prizeLi
         },
     ];
     return (React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
-        React.createElement("div", { className: "body", key: "lottery", "data-testid": "lottery" },
-            React.createElement("div", { className: cls, id: id, style: style },
-                React.createElement("div", { className: `${CLASS_PREFIX}__wrap` },
-                    dotList.map((dot, index) => {
-                        return (React.createElement("div", { key: index },
-                            dot.single && (React.createElement("div", { key: `${dot.direction}-${index}`, className: classNames(`${CLASS_PREFIX}__dot-single`, `${CLASS_PREFIX}__dot-${dot.position}`), style: {
-                                    width: `${(9 * widthRatio) / 14}rem`,
-                                    height: `${(9 * heightRatio) / 14}rem`,
-                                    top: `${dot.position}` === 'left-top' ||
-                                        `${dot.position}` === 'right-top'
-                                        ? `${(9 * heightRatio) / 14}rem`
-                                        : '',
-                                    bottom: `${dot.position}` === 'left-bottom' ||
-                                        `${dot.position}` === 'right-bottom'
-                                        ? `${(9 * heightRatio) / 14}rem`
-                                        : '',
-                                    left: `${dot.position}` === 'left-top' ||
-                                        `${dot.position}` === 'left-bottom'
-                                        ? `${(6 * widthRatio) / 14}rem`
+        React.createElement("div", { className: cls, id: id, style: style, "data-testid": "lottery" },
+            React.createElement("div", { className: `${CLASS_PREFIX}__wrap` },
+                dotList.map((dot, index) => {
+                    return (React.createElement("div", { key: index },
+                        dot.single && (React.createElement("div", { key: `${dot.direction}-${index}`, className: classNames(`${CLASS_PREFIX}__dot-single`, `${CLASS_PREFIX}__dot-${dot.position}`), style: {
+                                width: `${(9 * widthRatio) / 14}rem`,
+                                height: `${(9 * heightRatio) / 14}rem`,
+                                top: `${dot.position}` === 'left-top' ||
+                                    `${dot.position}` === 'right-top'
+                                    ? `${(9 * heightRatio) / 14}rem`
+                                    : '',
+                                bottom: `${dot.position}` === 'left-bottom' ||
+                                    `${dot.position}` === 'right-bottom'
+                                    ? `${(9 * heightRatio) / 14}rem`
+                                    : '',
+                                left: `${dot.position}` === 'left-top' ||
+                                    `${dot.position}` === 'left-bottom'
+                                    ? `${(6 * widthRatio) / 14}rem`
+                                    : '',
+                                right: `${dot.position}` === 'right-top' ||
+                                    `${dot.position}` === 'right-bottom'
+                                    ? `${(6 * widthRatio) / 14}rem`
+                                    : '',
+                            } })),
+                        !dot.single && (React.createElement("div", { key: `${dot.direction}-${index}`, className: `${CLASS_PREFIX}__dot-${dot.position}`, style: {
+                                left: `${dot.position}` === 'top' ||
+                                    `${dot.position}` === 'bottom'
+                                    ? `calc((${'100%'} - ${dotWidth}rem) / 2)`
+                                    : `${dot.position}` === 'left'
+                                        ? `${(widthRatio * 18 - widthRatio * 9) / 2 / 14}rem`
                                         : '',
-                                    right: `${dot.position}` === 'right-top' ||
-                                        `${dot.position}` === 'right-bottom'
-                                        ? `${(6 * widthRatio) / 14}rem`
+                                top: `${dot.position}` === 'left' ||
+                                    `${dot.position}` === 'right'
+                                    ? `calc((100% - ${dotHeight}rem) / 2)`
+                                    : `${dot.position}` === 'top'
+                                        ? `${(heightRatio * 18 - heightRatio * 9) / 2 / 14}rem`
                                         : '',
-                                } })),
-                            !dot.single && (React.createElement("div", { key: `${dot.direction}-${index}`, className: `${CLASS_PREFIX}__dot-${dot.position}`, style: {
-                                    left: `${dot.position}` === 'top' ||
-                                        `${dot.position}` === 'bottom'
-                                        ? `calc((${'100%'} - ${dotWidth}rem) / 2)`
-                                        : `${dot.position}` === 'left'
-                                            ? `${(widthRatio * 18 - widthRatio * 9) / 2 / 14}rem`
+                                bottom: `${dot.position}` === 'bottom'
+                                    ? `${(heightRatio * 18 - heightRatio * 9) / 2 / 14}rem`
+                                    : '',
+                                right: `${dot.position}` === 'right'
+                                    ? `${(widthRatio * 18 - widthRatio * 9) / 2 / 14}rem`
+                                    : '',
+                            } }, true && renderDot(dot.direction, dot.list)))));
+                }),
+                React.createElement("div", { className: `${CLASS_PREFIX}__inner`, style: {
+                        paddingTop: `${(18 * heightRatio) / 14}rem`,
+                        paddingBottom: `${(18 * heightRatio) / 14}rem`,
+                        paddingLeft: `${(18 * widthRatio) / 14}rem`,
+                        paddingRight: `${(18 * widthRatio) / 14}rem`,
+                    } },
+                    React.createElement("div", { className: `${CLASS_PREFIX}__inner-wrap` },
+                        React.createElement("ul", { className: `${CLASS_PREFIX}__list` }, lotteryList.map((item, index) => {
+                            return (React.createElement("li", { "data-testid": "lottery-item", key: index, className: classNames(`${CLASS_PREFIX}__turntable-item`, item.idx === activedId ? 'is-actived' : '', item.selected ? 'is-selected' : ''), style: {
+                                    width: `calc((${'100%'} - ${(widthRatio * 8 * 4) / 14}rem) / 3)`,
+                                    height: `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3)`,
+                                    top: `${index}` == '0' ||
+                                        `${index}` == '1' ||
+                                        `${index}` == '2'
+                                        ? `${(heightRatio * 8) / 14}rem`
+                                        : `${index}` == '3'
+                                            ? `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3 + ${(heightRatio * 8 * 2) / 14}rem)`
                                             : '',
-                                    top: `${dot.position}` === 'left' ||
-                                        `${dot.position}` === 'right'
-                                        ? `calc((100% - ${dotHeight}rem) / 2)`
-                                        : `${dot.position}` === 'top'
-                                            ? `${(heightRatio * 18 - heightRatio * 9) / 2 / 14}rem`
+                                    bottom: `${index}` == '4' ||
+                                        `${index}` == '5' ||
+                                        `${index}` == '6'
+                                        ? `${(heightRatio * 8) / 14}rem`
+                                        : `${index}` == '7'
+                                            ? `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3 + ${(heightRatio * 8 * 2) / 14}rem)`
                                             : '',
-                                    bottom: `${dot.position}` === 'bottom'
-                                        ? `${(heightRatio * 18 - heightRatio * 9) / 2 / 14}rem`
+                                    right: `${index}` == '2' ||
+                                        `${index}` == '3' ||
+                                        `${index}` == '4'
+                                        ? `${(widthRatio * 8) / 14}rem`
                                         : '',
-                                    right: `${dot.position}` === 'right'
-                                        ? `${(widthRatio * 18 - widthRatio * 9) / 2 / 14}rem`
-                                        : '',
-                                } }, true && renderDot(dot.direction, dot.list)))));
-                    }),
-                    React.createElement("div", { className: `${CLASS_PREFIX}__inner`, style: {
-                            paddingTop: `${(18 * heightRatio) / 14}rem`,
-                            paddingBottom: `${(18 * heightRatio) / 14}rem`,
-                            paddingLeft: `${(18 * widthRatio) / 14}rem`,
-                            paddingRight: `${(18 * widthRatio) / 14}rem`,
-                        } },
-                        React.createElement("div", { className: `${CLASS_PREFIX}__inner-wrap` },
-                            React.createElement("ul", { className: `${CLASS_PREFIX}__list` }, lotteryList.map((item, index) => {
-                                return (React.createElement("li", { "data-testid": "lottery-item", key: index, className: classNames(`${CLASS_PREFIX}__turntable-item`, item.idx === activedId ? 'is-actived' : '', item.selected ? 'is-selected' : ''), style: {
-                                        width: `calc((${'100%'} - ${(widthRatio * 8 * 4) / 14}rem) / 3)`,
-                                        height: `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3)`,
-                                        top: `${index}` == '0' ||
-                                            `${index}` == '1' ||
-                                            `${index}` == '2'
-                                            ? `${(heightRatio * 8) / 14}rem`
-                                            : `${index}` == '3'
-                                                ? `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3 + ${(heightRatio * 8 * 2) / 14}rem)`
-                                                : '',
-                                        bottom: `${index}` == '4' ||
-                                            `${index}` == '5' ||
-                                            `${index}` == '6'
-                                            ? `${(heightRatio * 8) / 14}rem`
-                                            : `${index}` == '7'
-                                                ? `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3 + ${(heightRatio * 8 * 2) / 14}rem)`
-                                                : '',
-                                        right: `${index}` == '2' ||
-                                            `${index}` == '3' ||
-                                            `${index}` == '4'
-                                            ? `${(widthRatio * 8) / 14}rem`
+                                    left: `${index}` == '0' ||
+                                        `${index}` == '6' ||
+                                        `${index}` == '7'
+                                        ? `${(widthRatio * 8) / 14}rem`
+                                        : `${index}` == '1' || `${index}` == '5'
+                                            ? `calc((${'100%'} - ${(widthRatio * 8 * 4) / 14}rem) / 3 + ${(widthRatio * 8 * 2) / 14}rem)`
                                             : '',
-                                        left: `${index}` == '0' ||
-                                            `${index}` == '6' ||
-                                            `${index}` == '7'
-                                            ? `${(widthRatio * 8) / 14}rem`
-                                            : `${index}` == '1' || `${index}` == '5'
-                                                ? `calc((${'100%'} - ${(widthRatio * 8 * 4) / 14}rem) / 3 + ${(widthRatio * 8 * 2) / 14}rem)`
-                                                : '',
+                                } },
+                                React.createElement("div", { className: `${CLASS_PREFIX}__turntable-cell`, style: {
+                                        borderLeftWidth: `${(4 * widthRatio) / 14}rem`,
+                                        borderRightWidth: `${(4 * widthRatio) / 14}rem`,
+                                        borderTopWidth: `${(4 * heightRatio) / 14}rem`,
+                                        borderBottomWidth: `${(4 * heightRatio) / 14}rem`,
+                                        paddingTop: `${(8 * heightRatio) / 14}rem`,
+                                        paddingBottom: `${(8 * heightRatio) / 14}rem`,
+                                        paddingLeft: `${(2 * widthRatio) / 14}rem`,
+                                        paddingRight: `${(2 * widthRatio) / 14}rem`,
                                     } },
-                                    React.createElement("div", { className: `${CLASS_PREFIX}__turntable-cell`, style: {
-                                            borderLeftWidth: `${(4 * widthRatio) / 14}rem`,
-                                            borderRightWidth: `${(4 * widthRatio) / 14}rem`,
-                                            borderTopWidth: `${(4 * heightRatio) / 14}rem`,
-                                            borderBottomWidth: `${(4 * heightRatio) / 14}rem`,
-                                            paddingTop: `${(8 * heightRatio) / 14}rem`,
-                                            paddingBottom: `${(8 * heightRatio) / 14}rem`,
-                                            paddingLeft: `${(2 * widthRatio) / 14}rem`,
-                                            paddingRight: `${(2 * widthRatio) / 14}rem`,
+                                    item.src && (React.createElement("div", { className: `${CLASS_PREFIX}__turntable-cell-image`, style: {
+                                            height: `${(heightRatio * 40) / 14}rem`,
                                         } },
-                                        item.src && (React.createElement("div", { className: `${CLASS_PREFIX}__turntable-cell-image`, style: {
+                                        React.createElement("img", { src: item.src, alt: item.desc, className: `${CLASS_PREFIX}__turntable-cell-icon`, style: {
+                                                width: `${(widthRatio * 40) / 14}rem`,
                                                 height: `${(heightRatio * 40) / 14}rem`,
-                                            } },
-                                            React.createElement("img", { src: item.src, alt: item.desc, className: `${CLASS_PREFIX}__turntable-cell-icon`, style: {
-                                                    width: `${(widthRatio * 40) / 14}rem`,
-                                                    height: `${(heightRatio * 40) / 14}rem`,
-                                                } }))),
-                                        item.desc && (React.createElement("div", { className: `${CLASS_PREFIX}__turntable-cell-desc`, style: {
-                                                marginTop: `${(heightRatio * 6) / 14}rem`,
-                                                fontSize: `${(widthRatio * 12) / 14}rem`,
-                                                lineHeight: `${(heightRatio * 17) / 14}rem`,
-                                            } }, item.desc)))));
-                            })),
-                            React.createElement("div", { className: classNames(`${CLASS_PREFIX}__turntable-btn`, btnActived ? 'is-actived' : ''), style: {
-                                    width: `calc((${'100%'} - ${(widthRatio * 8 * 4) / 14}rem) / 3)`,
-                                    height: `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3)`,
-                                    top: `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3 + ${(heightRatio * 8 * 2) / 14}rem)`,
-                                    left: `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3 + ${(heightRatio * 8 * 2) / 14}rem)`,
+                                            } }))),
+                                    item.desc && (React.createElement("div", { className: `${CLASS_PREFIX}__turntable-cell-desc`, style: {
+                                            marginTop: `${(heightRatio * 6) / 14}rem`,
+                                            fontSize: `${(widthRatio * 12) / 14}rem`,
+                                            lineHeight: `${(heightRatio * 17) / 14}rem`,
+                                        } }, item.desc)))));
+                        })),
+                        React.createElement("div", { className: classNames(`${CLASS_PREFIX}__turntable-btn`, btnActived ? 'is-actived' : ''), style: {
+                                width: `calc((${'100%'} - ${(widthRatio * 8 * 4) / 14}rem) / 3)`,
+                                height: `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3)`,
+                                top: `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3 + ${(heightRatio * 8 * 2) / 14}rem)`,
+                                left: `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3 + ${(heightRatio * 8 * 2) / 14}rem)`,
+                            } },
+                            React.createElement("div", { className: `${CLASS_PREFIX}__btn-inner`, style: {
+                                    paddingTop: `${(9 * heightRatio) / 14}rem`,
+                                    paddingBottom: `${(9 * heightRatio) / 14}rem`,
+                                    paddingLeft: `${(9 * widthRatio) / 14}rem`,
+                                    paddingRight: `${(9 * widthRatio) / 14}rem`,
                                 } },
-                                React.createElement("div", { className: `${CLASS_PREFIX}__btn-inner`, style: {
-                                        paddingTop: `${(9 * heightRatio) / 14}rem`,
-                                        paddingBottom: `${(9 * heightRatio) / 14}rem`,
-                                        paddingLeft: `${(9 * widthRatio) / 14}rem`,
-                                        paddingRight: `${(9 * widthRatio) / 14}rem`,
-                                    } },
-                                    React.createElement("div", { className: `${CLASS_PREFIX}__btn` },
-                                        React.createElement("a", { "data-testid": "start-lottery", className: `${CLASS_PREFIX}__btn-image`, style: {
-                                                paddingTop: `${(11 * heightRatio) / 14}rem`,
-                                                paddingBottom: `${(11 * heightRatio) / 14}rem`,
-                                                paddingLeft: `${(15 * widthRatio) / 14}rem`,
-                                                paddingRight: `${(15 * widthRatio) / 14}rem`,
-                                            }, onClick: startLottery },
-                                            React.createElement("p", { className: `${CLASS_PREFIX}__btn-text`, style: {
-                                                    fontSize: `${(widthRatio * 18) / 14}rem`,
-                                                    lineHeight: `${(widthRatio * 22) / 14}rem`,
-                                                } },
-                                                "\u5F00\u59CB",
-                                                React.createElement("br", null),
-                                                "\u62BD\u5956"))))))))))));
+                                React.createElement("div", { className: `${CLASS_PREFIX}__btn` },
+                                    React.createElement("a", { "data-testid": "start-lottery", className: `${CLASS_PREFIX}__btn-image`, style: {
+                                            paddingTop: `${(11 * heightRatio) / 14}rem`,
+                                            paddingBottom: `${(11 * heightRatio) / 14}rem`,
+                                            paddingLeft: `${(15 * widthRatio) / 14}rem`,
+                                            paddingRight: `${(15 * widthRatio) / 14}rem`,
+                                        }, onClick: startLottery },
+                                        React.createElement("p", { className: `${CLASS_PREFIX}__btn-text`, style: {
+                                                fontSize: `${(widthRatio * 18) / 14}rem`,
+                                                lineHeight: `${(widthRatio * 22) / 14}rem`,
+                                            } },
+                                            "\u5F00\u59CB",
+                                            React.createElement("br", null),
+                                            "\u62BD\u5956")))))))))));
 });

package/dist/web/components/table/ExportFileModalByApi/index.js

@@ -128,7 +128,7 @@ export function ExportFileModalByApi({ onCancel, visible, fields, selectedKeysLi
                             maxWidth: '430px',
                         }, title: status === 'success'
                             ? '数据导出完成'
-                            : '数据导出中，请稍后...', description: status !== 'success' ? (React.createElement("div", null,
+                            : '数据导出中，请稍候...', description: status !== 'success' ? (React.createElement("div", null,
                             "\u5173\u95ED\u5F39\u7A97\u540E\uFF0C\u5BFC\u51FA\u4EFB\u52A1\u4F1A\u7EE7\u7EED\u6267\u884C\uFF0C\u53EF\u5728",
                             React.createElement("a", { onClick: () => {
                                     onCancel();

package/dist/web/components/table/ImportFileModal/index.js

@@ -261,7 +261,7 @@ export function ImportFileModal({ onCancel, visible, fields, dataBatchCreate, da
                 status !== 'validateError' && status !== 'error' && (React.createElement("div", { className: `status-wrap ${status}` },
                     React.createElement(Status, { icon: 'blank', size: 's', description: status === 'success'
                             ? '数据导入成功'
-                            : '数据导入中，请稍后...' }))))),
+                            : '数据导入中，请稍候...' }))))),
             nextAction: () => {
                 const repeatList = repeatabilityCheck(fileJsonMap);
                 if (repeatList.length) {

package/dist/web/components/table/ImportFileModalByApi/index.js

@@ -247,7 +247,7 @@ export function ImportFileModalByApi({ onCancel, handleInOrOutRecordModealVisibl
                 status !== 'validateError' && status !== 'error' && (React.createElement("div", { className: `status-wrap ${status}` },
                     React.createElement(Status, { icon: 'blank', size: 'm', title: status === 'success'
                             ? '数据导入完成'
-                            : '数据导入中，请稍后...', description: status !== 'success' ? (React.createElement("div", null,
+                            : '数据导入中，请稍候...', description: status !== 'success' ? (React.createElement("div", null,
                             "\u5173\u95ED\u5F39\u7A97\u540E\uFF0C\u5BFC\u5165\u4EFB\u52A1\u4F1A\u7EE7\u7EED\u6267\u884C\uFF0C\u53EF\u5728",
                             React.createElement("a", { onClick: () => {
                                     handleInOrOutRecordModealVisible('import');

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

@@ -1,9 +1,17 @@
-import * as React from 'react';
+import React, { forwardRef, useImperativeHandle } from 'react';
 import { Bubble, ConfigProvider } from 'tea-component';
 import classNames from '../../utils/classnames';
 import { isInIde, usePlatform } from '../../utils/platform';
-export const WdBubble = ({ trigger, placement, promptTheme, arrowPointAtCenter, openDelay, closeDelay, bubbleContent, bubbleChildren, events, id, style, className, }) => {
+export const WdBubble = forwardRef(function WdBubble({ trigger, placement, promptTheme, arrowPointAtCenter, openDelay, closeDelay, bubbleContent, bubbleChildren, events, id, style, className, }, ref) {
     const platform = usePlatform();
+    // Widget API，挂载组件只读属性和组件方法
+    useImperativeHandle(ref, () => {
+        return {
+            trigger,
+            placement,
+            promptTheme,
+        };
+    }, [trigger, placement, promptTheme]);
     return (React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
         React.createElement("div", { className: classNames('wd-bubble', className, platform === 'h5' ? 'wd-h5-bubble' : 'wd-pc-bubble'), id: id, style: style }, isInIde() ? (React.createElement(Bubble, { content: bubbleContent && (React.createElement("div", { className: 'wd-bubble-content', style: { minWidth: '140px' } }, bubbleContent)), visible: true }, bubbleChildren)) : (React.createElement(Bubble, { content: bubbleContent, error: promptTheme === 'error', dark: promptTheme === 'dark', trigger: trigger, placement: placement, arrowPointAtCenter: arrowPointAtCenter, openDelay: Number(openDelay), closeDelay: Number(closeDelay), onVisibleChange: (visible) => {
                 if (visible) {
@@ -14,4 +22,4 @@ export const WdBubble = ({ trigger, placement, promptTheme, arrowPointAtCenter,
                 }
             } },
             React.createElement("span", { className: 'wd-bubble-child' }, bubbleChildren))))));
-};
+});

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

@@ -1,16 +1,17 @@
-import * as React from 'react';
+import React, { forwardRef, useImperativeHandle } from 'react';
 import classNames from '../../utils/classnames';
 import { emptyObject } from '../../utils/constant';
 import { useConfig } from '../../utils/config-context';
 import { getParentForm } from '../../utils/widget-api';
 import { convertLegacyProps } from './convert-legacy-props';
 import { textToString, usePlatform } from '../../utils/platform';
-import { convertLegacyEnum } from '../../utils/tool';
+import { convertLegacyEnum, filterPropsWithOn } from '../../utils/tool';
 import { WD_BUTTON_THEME, WD_BUTTON_VARIANT, WD_BUTTON_SIZE, WD_BUTTON_ICON_TYPE, WD_BUTTON_ICON_POSITION, WD_BUTTON_TYPE, } from '../../../enum';
 import { WdIcon } from '../index';
-export const WdButton = ({ text, size: _size = 'md', theme: _theme = 'secondary', variant: _variant = 'base', iconType: _iconType = 'none', iconSource = 'inner', icon: _icon, iconSrc, iconPosition: _iconPosition = 'before', block, formType: _formType, disabled, events = emptyObject, className, style, id, loading, 
-// 组件 widget 实例，后续可能会更改接口
-$node, ...props }) => {
+export const WdButton = forwardRef(function WdButton(props, ref) {
+    const { text, size: _size = 'md', theme: _theme = 'secondary', variant: _variant = 'base', iconType: _iconType = 'none', iconSource = 'inner', icon: _icon, iconSrc, iconPosition: _iconPosition = 'before', block, formType: _formType, disabled, events = emptyObject, className, style, id, loading, 
+    // 组件 widget 实例，后续可能会更改接口
+    $node, openType, ...restProps } = props;
     const platform = usePlatform();
     // 兼容旧版组件的属性值
     let size = convertLegacyProps('size', _size) || _size;
@@ -65,13 +66,8 @@ $node, ...props }) => {
         }
     };
     const propsStartWithOn = React.useMemo(() => {
-        return Object.keys(props).reduce((acc, cur) => {
-            if (cur.startsWith('on')) {
-                acc[cur] = props[cur];
-            }
-            return acc;
-        }, {});
-    }, [props]);
+        return filterPropsWithOn(restProps);
+    }, [restProps]);
     const Icon = () => {
         // icon样式
         const iconCls = classNames({
@@ -82,8 +78,21 @@ $node, ...props }) => {
         });
         return icon || iconSrc ? (React.createElement(WdIcon, { className: iconCls, size: 'sm', name: icon, src: iconSrc, type: iconSource })) : null;
     };
+    // Widget API，挂载组件只读属性和组件方法
+    useImperativeHandle(ref, () => {
+        return {
+            text,
+            theme,
+            variant,
+            size,
+            block,
+            disabled,
+            formType,
+            openType,
+        };
+    }, [text, theme, variant, size, block, disabled, formType, openType]);
     return (React.createElement("button", { className: classNames(classes, className), disabled: disabled, type: formType, style: style, id: id, ...propsStartWithOn, onClick: onClick },
         iconPosition === 'before' && iconType === 'text-with-icon' && React.createElement(Icon, null),
         iconType === 'icon-only' ? (React.createElement(Icon, null)) : (React.createElement("span", { className: `${classPrefix}-btn__text` }, textToString(text))),
         iconPosition === 'after' && iconType === 'text-with-icon' && React.createElement(Icon, null)));
-};
+});

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

@@ -1,12 +1,10 @@
-import * as React from 'react';
+import React, { forwardRef, useImperativeHandle } from 'react';
 import classNames from '../../utils/classnames';
 import { useConfig } from '../../utils/config-context';
 import { usePlatform } from '../../utils/platform';
 import { convertLegacyEnum } from '../../utils/tool';
 import { WD_DIVIDER_TYPE } from '../../../enum';
-export const WdDivider = ({ className, style, id, type: _type = 'solid', 
-// diriction = 'horizontal',
-...props }) => {
+export const WdDivider = forwardRef(function WdDivider({ className, style, id, type: _type = 'solid', ...restProps }, ref) {
     const platform = usePlatform();
     // 兼容旧版组件的属性值
     const { classPrefix } = useConfig();
@@ -16,7 +14,6 @@ export const WdDivider = ({ className, style, id, type: _type = 'solid',
     // 类名
     const classList = [compClassName];
     type && classList.push(`${compClassName}--${type}`);
-    // diriction && classList.push(`${btnClassName}-${diriction}`);
     // 用户定义的className
     classList.push(className);
     if (platform === 'h5') {
@@ -25,5 +22,11 @@ export const WdDivider = ({ className, style, id, type: _type = 'solid',
     else {
         classList.push('wd-pc-divider');
     }
-    return (React.createElement("div", { "data-testid": "wd-divider-test", className: classNames(...classList), style: style, id: id, ...props }));
-};
+    // Widget API，挂载组件只读属性和组件方法
+    useImperativeHandle(ref, () => {
+        return {
+            type,
+        };
+    }, [type]);
+    return (React.createElement("div", { "data-testid": "wd-divider-test", className: classNames(...classList), style: style, id: id, ...restProps }));
+});

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

@@ -1,11 +1,11 @@
-import * as React from 'react';
+import React, { forwardRef, useImperativeHandle } from 'react';
 import classNames from '../../utils/classnames';
 import { emptyObject } from '../../utils/constant';
 import { useConfig } from '../../utils/config-context';
 import { usePlatform } from '../../utils/platform';
 import { convertLegacyEnum } from '../../utils/tool';
 import { WD_ICON_TYPE, WD_ICON_SIZE } from '../../../enum';
-export const WdIcon = ({ type: _type = 'inner', name, src, size: _size, events = emptyObject, className, style: _style, id, color: _color, ...props }) => {
+export const WdIcon = forwardRef(function WdIcon({ type: _type = 'inner', name, src, size: _size, events = emptyObject, className, style: _style, id, color: _color, ...props }, ref) {
     const platform = usePlatform();
     // 兼容旧版组件的属性值 size/color
     const remdiff = 2;
@@ -52,6 +52,15 @@ export const WdIcon = ({ type: _type = 'inner', name, src, size: _size, events =
             return acc;
         }, {});
     }, [props]);
+    // Widget API，挂载组件只读属性和组件方法
+    useImperativeHandle(ref, () => {
+        return {
+            type,
+            name,
+            src,
+            size,
+        };
+    }, [type, name, src, size]);
     if (type === 'inner') {
         return (React.createElement("i", { className: classNames(classes, className), style: style, id: id, onClick: onClick, ...propsStartWithOn }));
     }
@@ -60,4 +69,4 @@ export const WdIcon = ({ type: _type = 'inner', name, src, size: _size, events =
                 ? src
                 : 'https://qcloudimg.tencent-cloud.cn/raw/4a29d51b504f12b4933ce4490110b4dc.svg', onClick: onClick, ...propsStartWithOn }));
     }
-};
+});

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

@@ -1,15 +1,14 @@
-import * as React from 'react';
-import { useState, useMemo } from 'react';
+import React, { forwardRef, useImperativeHandle, useState, useMemo, } from 'react';
 import classNames from '../../utils/classnames';
 import { ImageInner } from './image';
 import { emptyObject } from '../../utils/constant';
 import { useTempUrl } from '../../utils/hooks/use-cloud-id-temp-url';
 import { useConfig } from '../../utils/config-context';
-export default function Image({ 
+export default forwardRef(function WdImage({ 
 // 系统属性
 className, events = emptyObject, style, 
 // 组件属性
-src, alt, mode, lazyLoad, imgPreview, maskClosable, fit, }) {
+src, alt, mode, lazyLoad, imgPreview, maskClosable, fit, }, ref) {
     const [isError, setIsError] = useState(false);
     const { classPrefix } = useConfig();
     const cls = classNames({
@@ -52,8 +51,16 @@ src, alt, mode, lazyLoad, imgPreview, maskClosable, fit, }) {
             }
         }
     }, [style, objectFit, isError]);
+    // Widget API，挂载组件只读属性和组件方法
+    useImperativeHandle(ref, () => {
+        return {
+            fit,
+            src,
+            alt,
+        };
+    }, [fit, src, alt]);
     return src === realSrc || (realSrc !== undefined && src !== realSrc) ? (React.createElement(ImageInner, { objectFit: realFit, style: realStyle, className: cls, alt: alt, src: realSrc, isError: isError, setIsError: setIsError, events: events, lazyLoad: lazyLoad, imgPreview: imgPreview, maskClosable: maskClosable })) : null;
-}
+});
 function getObjectFitByWxImageMode(mode) {
     const array = [
         {

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

@@ -1,10 +1,10 @@
-import * as React from 'react';
+import React, { forwardRef, useImperativeHandle } from 'react';
 import classNames from '../../utils/classnames';
 import { emptyObject } from '../../utils/constant';
 import { useConfig } from '../../utils/config-context';
 import { usePlatform } from '../../utils/platform';
 import { WdIcon } from '../index';
-export const WdLink = ({ content, url, isOpenInNewWindow, params, iconType, iconSource = 'inner', icon, iconSrc, iconPosition = 'before', disabled, enableSlot = true, contentSlot, events = emptyObject, className, style, id, ...props }) => {
+export const WdLink = forwardRef(function WdLink({ content, url, isOpenInNewWindow, params, iconType, iconSource = 'inner', icon, iconSrc, iconPosition = 'before', disabled, enableSlot = true, contentSlot, events = emptyObject, className, style, id, ...props }, ref) {
     const platform = usePlatform();
     // 样式
     const { classPrefix } = useConfig();
@@ -47,13 +47,21 @@ export const WdLink = ({ content, url, isOpenInNewWindow, params, iconType, icon
         });
         return icon || iconSrc ? (React.createElement(WdIcon, { className: iconCls, size: 'sm', name: icon, src: iconSrc, type: iconSource })) : null;
     };
+    // Widget API，挂载组件只读属性和组件方法
+    useImperativeHandle(ref, () => {
+        return {
+            content,
+            url,
+            disabled,
+        };
+    }, [content, url, disabled]);
     return (React.createElement("a", { style: style, className: classNames(classes, className), target: isOpenInNewWindow ? '_blank' : '_self', href: href, id: id, onClick: onClick, rel: "noopener noreferrer", ...props },
         enableSlot && contentSlot && (React.createElement("div", { className: `${classPrefix}-link__slot` }, contentSlot)),
         React.createElement("span", { className: `${classPrefix}-link__wrap` },
             iconPosition === 'before' && iconType === 'text-with-icon' && React.createElement(Icon, null),
             iconType === 'icon-only' ? (React.createElement(Icon, null)) : (React.createElement("span", { className: `${classPrefix}-link__text` }, content)),
             iconPosition === 'after' && iconType === 'text-with-icon' && React.createElement(Icon, null))));
-};
+});
 function processUrl(url, params) {
     url = url === null || url === void 0 ? void 0 : url.trim();
     // URL 构造函数不支持 '//xxx.com' 的格式

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

@@ -1,11 +1,11 @@
-import * as React from 'react';
+import React, { forwardRef, useImperativeHandle } from 'react';
 import classNames from '../../utils/classnames';
 import { useConfig } from '../../utils/config-context';
 import { textToString, usePlatform } from '../../utils/platform';
 import { convertLegacyProps } from './convert-legacy-props';
 import { convertLegacyEnum } from '../../utils/tool';
 import { WD_TEXT_LEVEL, WD_TEXT_MAX_LINES } from '../../../enum';
-export const WdText = ({ className, style, id, level: _level = 'body-default', text, overflow, maxLines: _maxLines, space, tips, userSelect, events, contenteditable, onInput, onBlur, ...props }) => {
+export const WdText = forwardRef(function WdText({ className, style, id, level: _level = 'body-default', text, overflow, maxLines: _maxLines, space, tips, userSelect, events, contenteditable, onInput, onBlur, ...props }, ref) {
     const platform = usePlatform();
     // 兼容旧版组件的属性值
     let level = convertLegacyProps('level', String(_level)) || _level;
@@ -58,6 +58,18 @@ export const WdText = ({ className, style, id, level: _level = 'body-default', t
             return acc;
         }, {});
     }, [props]);
+    // Widget API，挂载组件只读属性和组件方法
+    useImperativeHandle(ref, () => {
+        return {
+            text,
+            level,
+            overflow,
+            maxLines,
+            space,
+            userSelect,
+            tips,
+        };
+    }, [text, level, overflow, maxLines, space, userSelect, tips]);
     switch (level) {
         case 'title-1':
             return (React.createElement("h1", { className: classNames(classes, className), style: inlineStyle, id: id, 
@@ -88,4 +100,4 @@ export const WdText = ({ className, style, id, level: _level = 'body-default', t
                 //@ts-expect-error contentEditable type def sucks
                 contentEditable: contenteditable, onInput: onInput, onBlur: onBlur, title: tips ? textToString(text) : '', onClick: (e) => events.tap({}, { originEvent: e }), ...propsStartWithOn }, textToString(text)));
     }
-};
+});

package/dist/web/utils/hooks/use-cloud-id-temp-url.js

@@ -1,11 +1,15 @@
 import useSWR from 'swr';
 import { getTempFileURL } from '../tcb';
-import { transFileCloudidToName } from '../platform';
+import { isCloudFileID, transFileCloudidToName } from '../platform';
 export function useTempUrl(cloudId) {
+    const isCloudId = isCloudFileID(cloudId);
     const prefix = 'tcb:cloud-id:temp-url';
-    const key = `${prefix}:${transFileCloudidToName(cloudId)}`;
+    // https格式不走cloudId处理逻辑
+    const key = isCloudId
+        ? `${prefix}:${transFileCloudidToName(cloudId)}`
+        : cloudId;
     return useSWR(key, async () => {
-        if (!(cloudId === null || cloudId === void 0 ? void 0 : cloudId.startsWith('cloud://'))) {
+        if (!isCloudId) {
             return cloudId;
         }
         const tempUrl = await getTempFileURL(cloudId);

package/dist/web/utils/platform.js

@@ -222,7 +222,6 @@ export const getWhereList = (where) => {
                         if (val === '' ||
                             val === undefined ||
                             Object.prototype.toString.call(val) === '[object Object]') {
-                            console.error(`${item2 === null || item2 === void 0 ? void 0 : item2.key}筛选值为：${val},不符合查询条件，请检查绑定变量值是否正确`);
                             return;
                         }
                         if ('_begin_with' === rel) {