@cloudbase/weda-ui 3.5.0 → 3.5.1

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

@@ -7,7 +7,7 @@ import { convertLegacyProps } from './convert-legacy-props';
 import { convertLegacyEnum } from '../../utils/tool';
 import { WD_TEXT_LEVEL, WD_TEXT_MAX_LINES } from '../../../enum';
 import '../style';
-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) {
+export const WdText = forwardRef(function WdText({ className, style, id, level: _level = 'body-default', text, overflow = false, maxLines: _maxLines, space = true, tips = true, userSelect = false, events, contenteditable, onInput, onBlur, ...props }, ref) {
     const platform = usePlatform();
     // 兼容旧版组件的属性值
     let level = convertLegacyProps('level', String(_level)) || _level;
@@ -35,7 +35,7 @@ export const WdText = forwardRef(function WdText({ className, style, id, level:
         // size
         [levelClass[level]]: levelClass[level],
         // 连续字符会换行，正常英文不会强制换行
-        [`${classPrefix}-g-wrod-break`]: true,
+        [`${classPrefix}-g-word-break`]: true,
         // 是否可选中
         [`${classPrefix}-g-user-select-none`]: !userSelect,
         // 超出隐藏多少行

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

@@ -0,0 +1,4 @@
+import { WdTextarea, WdTextareaProps } from './wd-textarea';
+export { WdTextarea };
+export type { WdTextareaProps };
+export default WdTextarea;

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

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { CommonPropsType } from '../../types';
+import type { DataType } from '../../../configs/components/wd-textarea';
+/**
+ * 标准化：多行输入组件
+ */
+export declare const WdTextarea: React.ForwardRefExoticComponent<WdTextareaProps & React.RefAttributes<any>>;
+export interface WdTextareaProps extends CommonPropsType, DataType {
+    classRoot?: string;
+}

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

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useImperativeHandle, useRef, useEffect, useState, useMemo, } from 'react';
+import { forwardRef, useImperativeHandle, useRef, useState, useMemo, } from 'react';
 import classNames from '../../utils/classnames';
 import { useConfig } from '../../utils/config-context';
 import { WdFormItem } from '../wd-form-item';
@@ -34,23 +34,9 @@ export const WdTextarea = forwardRef(function WdTextarea(props, ref) {
         'textarea-restriction': counterVisible,
     });
     const countCls = `${textareaWrap}__label ${root}-${classRoot}__count-text`;
-    useEffect(() => {
-        autoScroll();
-    }, []);
-    // 输入自动滚动
-    const autoScroll = function () {
-        if (!textareaRef.current)
-            return;
-        textareaRef.current.style.height = 'auto';
-        if (textareaRef.current.scrollHeight >= textareaRef.current.offsetHeight) {
-            textareaRef.current.style.height =
-                textareaRef.current.scrollHeight + 'px';
-        }
-    };
     /** 内部事件 */
     const onChange = function (e) {
         var _a;
-        autoScroll();
         const text = typeof e === 'string' ? e : e.target.value;
         onChangeForm(text);
         (_a = events.change) === null || _a === void 0 ? void 0 : _a.call(events, { value: text }, { originEvent: e });
@@ -74,5 +60,5 @@ export const WdTextarea = forwardRef(function WdTextarea(props, ref) {
         disabled,
         readOnly,
     }), [innerHandle, name, value, label, required, visible, disabled, readOnly]);
-    return (visible && (_jsx(WdFormItem, { ...props, validateErrorMsg: validateErrorMsg, validateState: validateState, readOnly: readOnly, disabled: disabled, readValue: value, classRoot: classRoot, inputId: inputId, layout: layout, children: _jsxs("div", { className: cls, ref: wrapRef, onFocus: () => wrapRef.current.classList.add('is-focused'), onBlur: () => wrapRef.current.classList.remove('is-focused'), children: [_jsx("textarea", { id: inputId, ref: textareaRef, rows: 2, placeholder: placeholder, name: name, value: value, maxLength: maxLength, autoFocus: focus, disabled: disabled, readOnly: readOnly, onChange: onChange, onFocus: onFocus, onBlur: onBlur, ...startWithOnProps }), counterVisible && (_jsxs("label", { className: countCls, children: [counter, "/", maxLength] }))] }) })));
+    return (visible && (_jsx(WdFormItem, { ...props, validateErrorMsg: validateErrorMsg, validateState: validateState, readOnly: readOnly, disabled: disabled, readValue: value, classRoot: classRoot, inputId: inputId, layout: layout, children: _jsxs("div", { className: cls, ref: wrapRef, onFocus: () => wrapRef.current.classList.add('is-focused'), onBlur: () => wrapRef.current.classList.remove('is-focused'), children: [_jsx("textarea", { id: inputId, ref: textareaRef, rows: 2, placeholder: placeholder, name: name, value: value !== null && value !== void 0 ? value : '', maxLength: maxLength, autoFocus: focus, disabled: disabled, readOnly: readOnly, onChange: onChange, onFocus: onFocus, onBlur: onBlur, ...startWithOnProps }), counterVisible && (_jsxs("label", { className: countCls, children: [counter, "/", maxLength] }))] }) })));
 });

package/dist/web/components/wd-time/h5.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import type { IPureTime } from './interface';
+/**
+ * 时间组件，h5 端受控
+ */
+export declare function TimeH5(props: IPureTime): JSX.Element;

package/dist/web/components/wd-time/h5.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useMemo, useRef } from 'react';
+import { useConfig } from '../../utils/config-context';
+import { convertTimeValue, convertTimeToMoment, useDateFormat, isDateInRange, } from '../../utils/hooks/useFormLegacy';
+import { Modal } from '../wd-date/elements/Modal.h5';
+import { TimePicker } from '../wd-date/elements/TimePicker.h5';
+import { useSyncValue } from '../../utils/hooks/useSyncValue';
+import { noop } from '../../utils/constant';
+import { getDayNow } from '../../utils/moment';
+/**
+ * 时间组件，h5 端受控
+ */
+export function TimeH5(props) {
+    const { placeholder, inputId, name, disabled, value: _value, onChange = noop, mode, start: _start, end: _end, } = props;
+    const [value, setValue] = useSyncValue(_value);
+    const [visible, setVisible] = useState(false);
+    const { classPrefix } = useConfig();
+    const inputCls = `${classPrefix}-form-select_input`;
+    const format = useDateFormat({ mode });
+    const start = useMemo(() => { var _a; return (_a = convertTimeToMoment(_start)) === null || _a === void 0 ? void 0 : _a.valueOf(); }, [_start]);
+    const end = useMemo(() => { var _a; return (_a = convertTimeToMoment(_end)) === null || _a === void 0 ? void 0 : _a.valueOf(); }, [_end]);
+    const valueDisplay = useMemo(() => { var _a; return ((_a = convertTimeToMoment(value)) === null || _a === void 0 ? void 0 : _a.format(format)) || ''; }, [value, format]);
+    const pickerMode = mode !== 'second' ? 'datetimeMinute' : '';
+    const pickerValue = useMemo(() => { var _a; return (_a = (convertTimeToMoment(value) || getDayNow(mode))) === null || _a === void 0 ? void 0 : _a.valueOf(); }, [value, mode]);
+    const pickerValueRef = useRef(pickerValue); // 弹窗中临时值
+    const handleOk = () => {
+        var _a, _b;
+        const [inRange, title] = isDateInRange(pickerValueRef.current, start, end, format);
+        if (!inRange) {
+            (_b = (_a = window.app) === null || _a === void 0 ? void 0 : _a.showToast) === null || _b === void 0 ? void 0 : _b.call(_a, { title, icon: 'none' });
+            return;
+        }
+        const value = convertTimeValue(pickerValueRef.current);
+        setValue(value);
+        setVisible(false);
+        onChange === null || onChange === void 0 ? void 0 : onChange(value);
+    };
+    const handleChange = (val) => {
+        pickerValueRef.current = val;
+    };
+    const handleClick = () => {
+        if (disabled)
+            return;
+        pickerValueRef.current = pickerValue;
+        setVisible(true);
+    };
+    return (_jsxs(_Fragment, { children: [_jsx("input", { id: inputId, className: inputCls, type: "text", name: name, placeholder: placeholder, autoComplete: "off", disabled: disabled, readOnly: true, value: valueDisplay, onClick: handleClick }), _jsx(Modal, { visible: visible, onClose: () => setVisible(false), onOk: handleOk, children: _jsx(TimePicker, { value: pickerValue, start: start, end: end, mode: pickerMode, onChange: handleChange }) })] }));
+}

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

@@ -0,0 +1,4 @@
+import { WdTime } from './wd-time';
+export { WdTime } from './wd-time';
+export type { WdTimeProps } from './interface';
+export default WdTime;

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

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

package/dist/web/components/wd-time/interface.d.ts

@@ -0,0 +1,10 @@
+import type { DataType } from '../../../configs/components/wd-time';
+import type { CommonPropsType } from '../../types';
+export interface WdTimeProps extends CommonPropsType, DataType {
+    classRoot?: string;
+}
+export interface IPureTime extends DataType {
+    onChange?: (v: number) => any;
+    disabled?: boolean;
+    inputId?: string;
+}

package/dist/web/components/wd-time/interface.js

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

package/dist/web/components/wd-time/pc.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import type { IPureTime } from './interface';
+/**
+ * 时间组件，pc 端受控
+ */
+export declare function TimePc(props: IPureTime): JSX.Element;

package/dist/web/components/wd-time/pc.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { TimePicker, ConfigProvider } from 'tea-component';
+import { convertTimeValue, convertTimeToMoment, } from '../../utils/hooks/useFormLegacy';
+import { useConfig } from '../../utils/config-context';
+/**
+ * 时间组件，pc 端受控
+ */
+export function TimePc(props) {
+    const { value: _value, start: _start, end: _end, mode, disabled, placeholder, clearable, onChange, } = props;
+    const { classPrefix } = useConfig();
+    const value = useMemo(() => convertTimeToMoment(_value), [_value]);
+    const start = useMemo(() => convertTimeToMoment(_start), [_start]);
+    const end = useMemo(() => convertTimeToMoment(_end), [_end]);
+    const format = mode === 'second' ? 'HH:mm:ss' : 'HH:mm';
+    const handleChange = (m) => {
+        const time = convertTimeValue(m);
+        onChange === null || onChange === void 0 ? void 0 : onChange(time);
+    };
+    return (_jsx(ConfigProvider, { classPrefix: classPrefix, children: _jsx(TimePicker, { onChange: handleChange, disabled: disabled, placeholder: placeholder, value: value, range: [start, end], format: format, clearable: clearable }) }));
+}

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

@@ -0,0 +1,6 @@
+import React from 'react';
+import type { WdTimeProps } from './interface';
+/**
+ * 标准化：时间组件
+ */
+export declare const WdTime: React.ForwardRefExoticComponent<WdTimeProps & React.RefAttributes<any>>;

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

@@ -0,0 +1,58 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useMemo } from 'react';
+import { usePlatform } from '../../utils/platform';
+import { WdFormItem, WdInputGroup, WdInputWrap } from '../wd-form-item';
+import { TimePc } from './pc';
+import { TimeH5 } from './h5';
+import { getUuid } from '../../utils/tool';
+import { convertTimeValue, convertTimeToMoment, useDateFormat, MAX_TIME, useFormItemCommonTrait, useHandleClear, } from '../../utils/hooks/useFormLegacy';
+/**
+ * 标准化：时间组件
+ */
+export const WdTime = React.forwardRef(function WdTime(props, ref) {
+    const { classRoot = 'time', value: _value, start: _start, end: _end, mode, clearable = false, events, } = props;
+    const isH5 = usePlatform() === 'h5';
+    const inputId = useMemo(() => getUuid(), []);
+    const formValue = useMemo(() => convertTimeValue(_value), [_value]);
+    const start = useMemo(() => { var _a; return (_a = convertTimeValue(_start)) !== null && _a !== void 0 ? _a : 0; }, [_start]);
+    const end = useMemo(() => { var _a; return (_a = convertTimeValue(_end)) !== null && _a !== void 0 ? _a : MAX_TIME; }, [_end]);
+    const traitProps = { ...props, value: formValue, inputRef: ref };
+    const trait = useFormItemCommonTrait(traitProps);
+    const { value, onChange, disabled, readOnly, visible, required } = trait;
+    const format = useDateFormat({ mode });
+    const readValue = useMemo(() => { var _a; return (_a = convertTimeToMoment(value)) === null || _a === void 0 ? void 0 : _a.format(format); }, [value, format]);
+    const pureChange = (v) => {
+        var _a;
+        onChange === null || onChange === void 0 ? void 0 : onChange(v);
+        (_a = events === null || events === void 0 ? void 0 : events.change) === null || _a === void 0 ? void 0 : _a.call(events, { value: v });
+    };
+    const clearProps = useHandleClear({
+        onChange: pureChange,
+        clearable,
+        disabled,
+        value,
+    });
+    const formItemProps = {
+        ...props,
+        classRoot,
+        readValue,
+        inputId,
+        readOnly,
+        visible,
+        required,
+    };
+    const inputGroupProps = { ...props, classRoot };
+    const inputWrapProps = { ...props, classRoot, ...clearProps };
+    const timeProps = {
+        ...props,
+        start,
+        end,
+        value,
+        disabled,
+        inputId,
+        onChange: pureChange,
+    };
+    if (!visible)
+        return null;
+    return (_jsx(WdFormItem, { ...formItemProps, children: _jsx(WdInputGroup, { ...inputGroupProps, children: _jsx(WdInputWrap, { ...inputWrapProps, children: isH5 ? _jsx(TimeH5, { ...timeProps }) : _jsx(TimePc, { ...timeProps }) }) }) }));
+});

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

@@ -0,0 +1,3 @@
+import { WdTree } from './wd-tree';
+export { WdTree, type WdTreeProps } from './wd-tree';
+export default WdTree;

package/dist/web/components/wd-tree/utils.d.ts

@@ -0,0 +1,192 @@
+import type { DataType, PropsType } from '../../../configs/components/wd-tree';
+type SrcTreeNode = DataType['data'][number];
+type CheckedState = '' | 'checked' | 'childChecked';
+type SearchedState = '' | 'searched' | 'childSearched';
+type ExpandState = '' | 'expand' | 'childExpand';
+export interface TreeNode extends SrcTreeNode {
+    checked?: CheckedState;
+    searched?: SearchedState;
+    expanded?: ExpandState;
+    isExpand?: boolean;
+    showIcon?: boolean;
+    root?: TreeNode;
+    parent?: TreeNode;
+    iconShow?: string;
+    pos?: string;
+}
+interface IInitData {
+    data: TreeNode[];
+    parent: TreeNode | null;
+    showIcon: DataType['showIcon'];
+    expendIcon: DataType['expendIcon'];
+    foldIcon: DataType['foldIcon'];
+    leafIcon: DataType['leafIcon'];
+    pos?: string;
+}
+interface IInitTreeState {
+    data: TreeNode[];
+    checkedCustom: DataType['checkedCustom'];
+    expandType: DataType['expandType'];
+    expandCustom: DataType['expandCustom'];
+    searchKey?: string;
+    parentChecked?: CheckedState;
+}
+interface IFindNodeParams {
+    tree: TreeNode[];
+    info: {
+        selected?: string;
+    };
+    condition: {
+        key: string;
+        value?: string | boolean;
+        alias?: string;
+        aim?: string;
+        infoKey?: string;
+    }[];
+}
+declare const TREE_INFO_GOT: ({
+    key: string;
+    infoKey: string;
+    alias: string;
+    aim?: undefined;
+    value?: undefined;
+} | {
+    key: string;
+    infoKey: string;
+    alias: string;
+    aim: string;
+    value?: undefined;
+} | {
+    key: string;
+    value: boolean;
+    alias: string;
+    infoKey?: undefined;
+    aim?: undefined;
+} | {
+    key: string;
+    value: boolean;
+    alias: string;
+    aim: string;
+    infoKey?: undefined;
+} | {
+    key: string;
+    value: string;
+    infoKey?: undefined;
+    alias?: undefined;
+    aim?: undefined;
+} | {
+    key: string;
+    value: string;
+    alias: string;
+    aim: string;
+    infoKey?: undefined;
+} | {
+    key: string;
+    value: string;
+    alias: string;
+    infoKey?: undefined;
+    aim?: undefined;
+})[];
+/**
+ * 根据初始值获取用于组件展示的数据
+ * @param {IInitData} param0
+ * @returns
+ */
+declare const initData: ({ data, parent, showIcon, expendIcon, foldIcon, leafIcon, pos, }: IInitData) => TreeNode[];
+/**
+ * 初始化节点状态
+ * @param param0
+ * @returns
+ */
+declare const initTreeState: ({ data, checkedCustom, expandType, expandCustom, searchKey, parentChecked, }: IInitTreeState) => TreeNode[];
+/**
+ * 当某节点的选择状态变化时，处理该节点的父和子的选择状态
+ * @param treeNode
+ */
+declare const dealCheck: (treeNode: TreeNode) => void;
+/**
+ * 查找满足要求的节点
+ * @param tree 树
+ * @param condition 需要获取的内容
+ * @returns
+ */
+declare const findNode: (params: IFindNodeParams) => PropsType['treeInfo'];
+/**
+ * 根据checkable状态获取树信息
+ * @param params
+ * @param checkable
+ * @returns
+ */
+declare const getTreeInfo: (params: IFindNodeParams, checkable: boolean) => {
+    checkedState?: boolean;
+    selectedState?: boolean;
+    expandedtate?: boolean;
+    expanded: string[];
+    event: string;
+    checked: string[];
+    selected: string[];
+    currentNode: {
+        data?: {
+            label: string;
+            children: any[];
+            value: string;
+            disabled: boolean;
+            foldIcon: string;
+            expendIcon: string;
+            leafIcon: string;
+        }[];
+    };
+    selectedPositions: string[];
+    selectedNodes: {
+        label: string;
+        children: any[];
+        value: string;
+        disabled: boolean;
+        foldIcon: string;
+        expendIcon: string;
+        leafIcon: string;
+    }[];
+    expandedPositions: string[];
+    expandedNodes: {
+        label: string;
+        children: any[];
+        value: string;
+        disabled: boolean;
+        foldIcon: string;
+        expendIcon: string;
+        leafIcon: string;
+    }[];
+    searched: string[];
+    searchedPositions: string[];
+    searchedNodes: {
+        label: string;
+        children: any[];
+        value: string;
+        disabled: boolean;
+        foldIcon: string;
+        expendIcon: string;
+        leafIcon: string;
+    }[];
+    checkedPositions: string[];
+    checkedNodes: {
+        label: string;
+        children: any[];
+        value: string;
+        disabled: boolean;
+        foldIcon: string;
+        expendIcon: string;
+        leafIcon: string;
+    }[];
+    childChecked: string[];
+    childCheckedPositions: string[];
+    childCheckedNodes: {
+        label: string;
+        children: any[];
+        value: string;
+        disabled: boolean;
+        foldIcon: string;
+        expendIcon: string;
+        leafIcon: string;
+    }[];
+};
+export { TREE_INFO_GOT, initData, initTreeState, dealCheck, findNode, getTreeInfo, };

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

@@ -0,0 +1,6 @@
+import React from 'react';
+import type { CommonPropsType } from '../../types';
+import type { DataType } from '../../../configs/components/wd-tree';
+export declare const WdTree: React.ForwardRefExoticComponent<WdTreeProps & React.RefAttributes<unknown>>;
+export interface WdTreeProps extends CommonPropsType, DataType {
+}

package/dist/web/components/wd-upload-file/index.d.ts

@@ -0,0 +1,3 @@
+import { WdUploadFile } from './wd-upload-file';
+export { WdUploadFile, type WdUploadFileProps } from './wd-upload-file';
+export default WdUploadFile;

package/dist/web/components/wd-upload-file/index.js

@@ -0,0 +1,3 @@
+import { WdUploadFile } from './wd-upload-file';
+export { WdUploadFile } from './wd-upload-file';
+export default WdUploadFile;

package/dist/web/components/wd-upload-file/wd-upload-file.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import type { CommonPropsType } from '../../types';
+export declare const WdUploadFile: ({ isReadOnly }: {
+    isReadOnly?: boolean;
+}) => JSX.Element;
+export interface WdUploadFileProps extends CommonPropsType {
+    isReadOnly?: boolean;
+}

package/dist/web/components/wd-upload-file/wd-upload-file.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import classNames from '../../utils/classnames';
+import { useConfig } from '../../utils/config-context';
+import { WdButton, WdIcon } from '../index';
+import { WdFormItem } from '../wd-form-item';
+import { ConfigProvider, Progress } from 'tea-component';
+const Xlsx = '../../../style/components/upload/icons/xlsx.svg';
+const Word = '../../../style/components/upload/icons/word.svg';
+const Txt = '../../../style/components/upload/icons/txt.svg';
+const Download = '../../../style/components/upload/icons/download.svg';
+const FormItemMockData = {
+    classRoot: 'upload',
+    labelVisible: true,
+    label: '文件上传',
+    testId: 'form-upload-file',
+    borderedPc: true,
+    layout: 'horizontal',
+    // layout: 'vertical',
+};
+export const WdUploadFile = ({ isReadOnly = false }) => {
+    const { classPrefix } = useConfig();
+    const compClassName = `${classPrefix}-upload-wrap  ${classPrefix}-upload-file-wrap`;
+    return (_jsx(_Fragment, { children: _jsx(WdFormItem, { ...FormItemMockData, children: _jsxs("div", { className: classNames(compClassName), children: [_jsx(WdButton, { className: `${classPrefix}-upload-btn`, iconType: "text-with-icon", iconPosition: "before", icon: "td:upload", text: "\u70B9\u51FB\u4E0A\u4F20", theme: "secondary", variant: "outline", iconSource: "inner" }), _jsx("p", { className: "wd-form-item__help", children: _jsx("span", { className: "wd-form-item__help-text wd-input__help", children: "\u6700\u591A\u4E0A\u4F2010\u4E2A\u6587\u4EF6\uFF0C\u5355\u4E2A\u6587\u4EF6\u6700\u592710m\uFF0C\u652F\u6301\u683C\u5F0F\u5982\u4E0B\uFF1Apng\u3001jpeg\u3001pdf\u3001doc\u3001xls\u3001zip" }) }), _jsxs("div", { className: `${classPrefix}-upload__control ${classPrefix}-upload__control-file `, children: [_jsxs("div", { className: `${classPrefix}-upload__item-file `, children: [_jsx("div", { className: `${classPrefix}-upload__icon`, children: _jsx(WdIcon, { name: "Txt", size: "md", type: "custom", src: Txt }) }), _jsxs("div", { className: `${classPrefix}-upload__item-control `, children: [_jsxs("div", { className: `${classPrefix}-upload__item-file-control `, children: [_jsx("div", { className: `${classPrefix}-upload__item-file-left `, children: _jsxs("div", { className: `${classPrefix}-upload__file-text`, children: [_jsx("div", { className: `${classPrefix}-upload__file-name`, children: "\u4E00\u4E2A\u6587\u4EF6\u540D\u79F0.text" }), _jsx("div", { className: `${classPrefix}-upload__file-size`, children: "100MB | 30%" })] }) }), _jsx("div", { className: `${classPrefix}-upload__item-file-right `, children: _jsx(WdIcon, { name: "td:delete", size: "xs", type: "inner" }) })] }), _jsx(ConfigProvider, { classPrefix: "wd", children: _jsx(Progress, { strokeWidth: 2, percent: 30, theme: "default" }) })] })] }), _jsxs("div", { className: `${classPrefix}-upload__item-file `, children: [_jsx("div", { className: `${classPrefix}-upload__icon`, children: _jsx(WdIcon, { name: "Word", size: "md", type: "custom", src: Word }) }), _jsxs("div", { className: `${classPrefix}-upload__item-control `, children: [_jsxs("div", { className: `${classPrefix}-upload__item-file-control `, children: [_jsx("div", { className: `${classPrefix}-upload__item-file-left `, children: _jsxs("div", { className: `${classPrefix}-upload__file-text`, children: [_jsx("div", { className: `${classPrefix}-upload__file-name`, title: " \u4E00\u4E2A\u6587\u4EF6\u540D\u79F0.word", children: "\u4E00\u4E2A\u6587\u4EF6\u540D\u79F0.word" }), _jsx("div", { className: `${classPrefix}-upload__file-size`, children: "100MB | 60%" })] }) }), _jsx("div", { className: `${classPrefix}-upload__item-file-right `, children: _jsx(WdIcon, { name: "td:delete", size: "xs", type: "inner" }) })] }), _jsx(ConfigProvider, { classPrefix: "wd", children: _jsx(Progress, { strokeWidth: 2, percent: 60, theme: "default" }) })] })] }), _jsxs("div", { className: `${classPrefix}-upload__item-file `, children: [_jsx("div", { className: `${classPrefix}-upload__icon`, children: _jsx(WdIcon, { name: "Txt", size: "md", type: "custom", src: Txt }) }), _jsx("div", { className: `${classPrefix}-upload__item-control `, children: _jsxs("div", { className: `${classPrefix}-upload__item-file-control `, children: [_jsx("div", { className: `${classPrefix}-upload__item-file-left `, children: _jsxs("div", { className: `${classPrefix}-upload__file-text`, children: [_jsx("div", { className: `${classPrefix}-upload__file-name`, children: "\u4E00\u4E2A\u6587\u4EF6\u540D\u79F0.text" }), _jsx("div", { className: `${classPrefix}-upload__file-size`, children: "100MB" })] }) }), _jsxs("div", { className: `${classPrefix}-upload__item-file-right `, children: [_jsx(WdIcon, { name: "Download", size: "xs", type: "custom", src: Download }), _jsx(WdIcon, { style: { marginLeft: 18 }, name: "td:delete", size: "xs", type: "inner" })] })] }) })] }), _jsxs("div", { className: `${classPrefix}-upload__item-file `, children: [_jsx("div", { className: `${classPrefix}-upload__icon`, children: _jsx(WdIcon, { name: "Xlsx", size: "md", type: "custom", src: Xlsx }) }), _jsx("div", { className: `${classPrefix}-upload__item-control `, children: _jsxs("div", { className: `${classPrefix}-upload__item-file-control `, children: [_jsx("div", { className: `${classPrefix}-upload__item-file-left `, children: _jsxs("div", { className: `${classPrefix}-upload__file-text`, children: [_jsx("div", { className: `${classPrefix}-upload__file-name`, children: "\u4E00\u4E2A\u6587\u4EF6\u540D\u79F0.Xlsx" }), _jsx("div", { className: `${classPrefix}-upload__file-size ${classPrefix}-upload__file-size--error`, children: "\u4E0A\u4F20\u5931\u8D25" })] }) }), _jsxs("div", { className: `${classPrefix}-upload__item-file-right `, children: [_jsx(WdIcon, { name: "td:refresh", size: "xs", type: "inner", style: { marginRight: 18 } }), _jsx(WdIcon, { name: "td:delete", size: "xs", type: "inner" })] })] }) })] }), _jsxs("div", { className: `${classPrefix}-upload__item-file `, children: [_jsx("div", { className: `${classPrefix}-upload__icon`, children: _jsx(WdIcon, { name: "Xlsx", size: "md", type: "custom", src: Xlsx }) }), _jsx("div", { className: `${classPrefix}-upload__item-control `, children: _jsxs("div", { className: `${classPrefix}-upload__item-file-control `, children: [_jsx("div", { className: `${classPrefix}-upload__item-file-left `, children: _jsxs("div", { className: `${classPrefix}-upload__file-text`, children: [_jsx("div", { className: `${classPrefix}-upload__file-name`, children: "\u53EA\u8BFB\u72B6\u6001.Xlsx" }), _jsx("div", { className: `${classPrefix}-upload__file-size`, children: "20Mb" })] }) }), isReadOnly && (_jsxs("div", { className: `${classPrefix}-upload__item-file-right `, children: [_jsx(WdIcon, { name: "td:refresh", size: "xs", type: "inner", style: { marginRight: 18 } }), _jsx(WdIcon, { name: "td:delete", size: "xs", type: "inner" })] }))] }) })] })] })] }) }) }));
+};

package/dist/web/components/wd-upload-image/index.d.ts

@@ -0,0 +1,3 @@
+import { WdUploadImage } from './wd-upload-image';
+export { WdUploadImage, type WdUploadImageProps } from './wd-upload-image';
+export default WdUploadImage;

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

@@ -0,0 +1,3 @@
+import { WdUploadImage } from './wd-upload-image';
+export { WdUploadImage } from './wd-upload-image';
+export default WdUploadImage;

package/dist/web/components/wd-upload-image/wd-upload-image.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import type { CommonPropsType } from '../../types';
+export declare const WdUploadImage: () => JSX.Element;
+export type WdUploadImageProps = CommonPropsType;

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

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/* eslint-disable max-lines */
+import * as React from 'react';
+import classNames from '../../utils/classnames';
+import { useConfig } from '../../utils/config-context';
+import { WdButton, WdImage, WdIcon, WdRadioList,
+// WdInputWrap,
+ } from '../index';
+import { WdLoading } from '../wd-loading';
+import { usePlatform } from '../../utils/platform';
+import { WdFormItem } from '../wd-form-item';
+import { ConfigProvider, Modal } from 'tea-component';
+const FormItemMockData = {
+    classRoot: 'upload',
+    labelVisible: true,
+    label: '图片上传',
+    testId: 'form-upload-image',
+    borderedPc: true,
+    layout: 'horizontal',
+    // layout: 'vertical',
+};
+export const WdUploadImage = () => {
+    const { classPrefix } = useConfig();
+    const platform = usePlatform();
+    const ish5 = platform === 'h5';
+    const compClassName = `${classPrefix}-upload-wrap  ${classPrefix}-upload-file-wrap`;
+    const [isShowDialog, setIsShowDialog] = React.useState(false);
+    // 待删，为组件 ts 不报错
+    const extra = {};
+    return (_jsx(_Fragment, { children: _jsxs(WdFormItem, { ...FormItemMockData, children: [_jsxs("div", { className: classNames(compClassName), children: [_jsx("p", { className: "wd-form-item__help", children: _jsx("span", { className: "wd-form-item__help-text wd-input__help", children: "\u6700\u591A\u4E0A\u4F2010\u5F20\u56FE\u7247\uFF0C\u5355\u4E2A\u56FE\u7247\u6700\u592710m\uFF0C\u652F\u6301\u683C\u5F0F\u5982\u4E0B\uFF1Apng\u3001jpeg" }) }), _jsxs("ul", { className: `${classPrefix}-upload__control ${classPrefix}-upload__control-image `, children: [_jsx("li", { className: `${classPrefix}-upload__item-image ${classPrefix}-upload__item-image--add`, onClick: () => {
+                                        setIsShowDialog(true);
+                                    }, children: _jsx("p", { className: `${classPrefix}-upload__image-box`, children: _jsx(WdIcon, { name: "td:add", size: "md" }) }) }), _jsxs("li", { className: `${classPrefix}-upload__item-image`, children: [_jsx("p", { className: `${classPrefix}-upload__image-box`, children: _jsx(WdImage, { src: "https://qcloudimg.tencent-cloud.cn/raw/4a29d51b504f12b4933ce4490110b4dc.svg", ...extra }) }), !ish5 ? (_jsx("p", { className: `${classPrefix}-upload__image-name`, children: "\u56FE\u7247\u540D\u79F0" })) : (_jsx(WdIcon, { className: `${classPrefix}-upload__image-close`, name: "td:close", size: "sm" }))] }), _jsxs("li", { className: `${classPrefix}-upload__item-image`, children: [_jsx("p", { className: `${classPrefix}-upload__image-box`, children: _jsx(WdImage, { src: "https://qcloudimg.tencent-cloud.cn/raw/4a29d51b504f12b4933ce4490110b4dc.svg", ...extra }) }), !ish5 ? (_jsx("p", { className: `${classPrefix}-upload__image-name`, children: "\u56FE\u7247\u540D\u79F0" })) : (_jsx(WdIcon, { className: `${classPrefix}-upload__image-close`, name: "td:close", size: "sm" }))] }), _jsxs("li", { className: `${classPrefix}-upload__item-image`, children: [_jsx("p", { className: `${classPrefix}-upload__image-box`, children: _jsx(WdImage, { src: "https://qcloudimg.tencent-cloud.cn/raw/4a29d51b504f12b4933ce4490110b4dc.svg", ...extra }) }), !ish5 ? (_jsx("p", { className: `${classPrefix}-upload__image-name`, children: "\u56FE\u7247\u540D\u79F0" })) : (_jsx(WdIcon, { className: `${classPrefix}-upload__image-close`, name: "td:close", size: "sm" }))] }), _jsxs("li", { className: `${classPrefix}-upload__item-image`, children: [_jsx("p", { className: `${classPrefix}-upload__image-box`, children: _jsx(WdImage, { src: "https://qcloudimg.tencent-cloud.cn/raw/4a29d51b504f12b4933ce4490110b4dc.svg", ...extra }) }), !ish5 ? (_jsx("p", { className: `${classPrefix}-upload__image-name`, children: "\u56FE\u7247\u540D\u79F0" })) : (_jsx(WdIcon, { className: `${classPrefix}-upload__image-close`, name: "td:close", size: "sm" }))] }), _jsxs("li", { className: `${classPrefix}-upload__item-image`, children: [_jsx("p", { className: `${classPrefix}-upload__image-box`, children: _jsx(WdImage, { src: "https://qcloudimg.tencent-cloud.cn/raw/4a29d51b504f12b4933ce4490110b4dc.svg", ...extra }) }), !ish5 ? (_jsx("p", { className: `${classPrefix}-upload__image-name`, children: "\u56FE\u7247\u540D\u79F0" })) : (_jsx(WdIcon, { className: `${classPrefix}-upload__image-close`, name: "td:close", size: "sm" }))] }), _jsxs("li", { className: `${classPrefix}-upload__item-image`, children: [_jsxs("p", { className: `${classPrefix}-upload__image-box`, children: [_jsx(WdImage, { src: "https://qcloudimg.tencent-cloud.cn/raw/4a29d51b504f12b4933ce4490110b4dc.svg", ...extra }), !ish5 && (_jsx("div", { className: `${classPrefix}-upload__image-box-mask`, children: _jsxs("div", { className: `${classPrefix}-upload__image-box-mask__control`, children: [_jsx(WdIcon, { name: "td:browse" }), _jsx("span", { className: `${classPrefix}-upload__image-line` }), _jsx(WdIcon, { name: "td:delete" })] }) }))] }), !ish5 ? (_jsx("p", { className: `${classPrefix}-upload__image-name`, children: "\u56FE\u7247\u540D\u79F0" })) : (_jsx(WdIcon, { className: `${classPrefix}-upload__image-close`, name: "td:close", size: "sm" }))] }), _jsxs("li", { className: `${classPrefix}-upload__item-image`, children: [_jsx("p", { className: `${classPrefix}-upload__image-box`, children: _jsx(WdLoading, { text: ish5 ? '上传中...' : '上传中 40%' }) }), !ish5 ? (_jsx("p", { className: `${classPrefix}-upload__image-name`, children: "\u56FE\u7247\u540D\u79F0" })) : (_jsx(WdIcon, { className: `${classPrefix}-upload__image-close`, name: "td:close", size: "sm" }))] }), _jsxs("li", { className: `${classPrefix}-upload__item-image`, children: [_jsx("p", { className: `${classPrefix}-upload__image-box `, children: _jsx(WdLoading, { text: ish5 ? ('请重试') : (_jsxs(_Fragment, { children: ["\u683C\u5F0F\u9519\u8BEF\uFF0C\u8BF7", _jsx("span", { className: `${classPrefix}-g-text-refresh`, children: "\u91CD\u8BD5" })] })), icon: ish5 ? (_jsx(WdIcon, { name: "td:refresh", size: "md" })) : (_jsx(WdIcon, { name: "td:error-circle-filled", size: "md" })) }) }), !ish5 && (_jsx("p", { className: `${classPrefix}-upload__image-name`, children: "\u56FE\u7247\u540D\u79F0" }))] })] })] }), _jsx(ConfigProvider, { classPrefix: "wedatea2td", children: _jsxs(Modal, { className: `${classPrefix}-upload-dialog `, visible: isShowDialog, caption: "\u4E0A\u4F20\u56FE\u7247", onClose: () => {
+                            setIsShowDialog(false);
+                        }, children: [_jsx(Modal.Body, { children: _jsxs("div", { className: `${classPrefix}-upload-dialog__control `, children: [_jsx(WdRadioList, { status: '', required: false, format: '', labelWidth: '', labelAlign: '', labelWrap: false, labelTips: '', extra: '', borderedH5: false, requiredFlag: false, requiredMsg: '', tipBlock: '', enumName: '', ...{ $widget: { closest: () => { } } }, labelVisible: true, layout: 'horizontal', label: '上传方式', direction: 'inline', range: [
+                                                {
+                                                    label: '点击上传/拖拽',
+                                                    value: '1',
+                                                },
+                                                {
+                                                    label: '输入链接上传',
+                                                    value: '2',
+                                                },
+                                            ], name: "demo", size: 'md', value: '1' }), _jsx("div", { className: `${classPrefix}-upload-dialog__click-upload-box`, children: _jsxs("p", { children: [_jsx("span", { className: `${classPrefix}-upload-dialog__click-upload`, children: "\u70B9\u51FB\u4E0A\u4F20" }), ' ', "/ \u62D6\u62FD"] }) })] }) }), _jsxs(Modal.Footer, { children: [_jsx(WdButton, { text: "\u53D6\u6D88", size: "md", theme: "secondary", events: {
+                                            tap: () => {
+                                                setIsShowDialog(false);
+                                            },
+                                        } }), _jsx(WdButton, { text: "\u786E\u5B9A", size: "md", theme: "primary", events: {
+                                            tap: () => {
+                                                setIsShowDialog(false);
+                                            },
+                                        } })] })] }) })] }) }));
+};

package/dist/web/components/web-view/index.d.ts

@@ -0,0 +1,3 @@
+import { WebView } from './web-view';
+export { WebView, type WdWebViewProps } from './web-view';
+export default WebView;

package/dist/web/components/web-view/style.d.ts

@@ -0,0 +1,2 @@
+import './index.css';
+import '../style';

package/dist/web/components/web-view/web-view.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { Except } from 'type-fest';
+import type { CommonPropsType } from '../../types';
+import type { DataType } from '../../../configs/components/web-view';
+import './style';
+export declare const WebView: React.ForwardRefExoticComponent<WdWebViewProps & React.RefAttributes<unknown>>;
+export interface WdWebViewProps extends CommonPropsType, Except<DataType, 'link'> {
+    link?: DataType['link'];
+}

package/dist/web/components/web-view/web-view.js

@@ -6,7 +6,7 @@ import { isInIde, usePlatform } from '../../utils/platform';
 import { Bubble } from 'tea-component';
 import EmptyContent from '../statusContent';
 import './style';
-export const WebView = forwardRef(function WebView({ link, events, className, style }, ref) {
+export const WebView = forwardRef(function WebView({ link = '', events, className, style }, ref) {
     const platform = usePlatform();
     const iframeRef = useRef(null);
     // 样式