@cloudbase/weda-ui 3.5.2-mp → 3.5.3

package/dist/web/components/wd-member-select/h5.js

@@ -0,0 +1,93 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Portal } from '../common/portal';
+import { useConfig } from '../../utils/config-context';
+import { WdIcon, WdInputWrap } from '../index';
+import { WdRadio } from '../wd-radio';
+import StatusContent from '../statusContent';
+const mockOptionData = [
+    { label: '部门/人员1', key: 0 },
+    { label: '部门/人员2', key: 1 },
+    { label: '部门/人员3', key: 2 },
+    { label: '部门/人员4', key: 3 },
+    { label: '部门/人员5', key: 4 },
+    { label: '部门/人员6', key: 5 },
+    { label: '部门/人员7', key: 6 },
+    { label: '部门/人员8', key: 7 },
+    { label: '部门/人员9', key: 8 },
+    { label: '部门/人员10', key: 9 },
+    { label: '部门/人员11', key: 10 },
+    { label: '部门/人员12', key: 11 },
+    { label: '部门/人员13', key: 12 },
+    { label: '部门/人员14', key: 13 },
+    { label: '部门/人员15', key: 14 },
+    { label: '部门/人员16', key: 15 },
+    { label: '部门/人员17', key: 16 },
+];
+const type = 'basics'; // 基础部门选择：basics 单选radio 多选 checkbox 搜索 search 已选中弹框 checked
+// const clickIndex = 1;
+export function MemberPickerH5({ isShow = true, close }) {
+    // 选中的人
+    const [checked, setChecked] = useState(false);
+    const [selectIndex, setSelectIndex] = useState(0);
+    const { classPrefix } = useConfig();
+    return isShow ? (_jsx(Portal, { type: "div", children: _jsxs("div", { className: `${classPrefix}-custom-picker ${classPrefix}-member-picker`, children: [_jsx("div", { className: `${classPrefix}-custom-backdrop`, onClick: () => {
+                        close();
+                    } }), [type].includes('checked') && (_jsxs("div", { className: `${classPrefix}-custom-picker__inner`, children: [_jsxs("div", { className: `${classPrefix}-custom-picker__header`, children: [_jsx("div", { className: `${classPrefix}-custom-picker__header-cancle`, children: "\u53D6\u6D88" }), _jsx("div", { className: `${classPrefix}-custom-picker__header-title`, children: "\u9009\u62E9\u4EBA\u5458" }), _jsx("div", { className: `${classPrefix}-custom-picker__header-confirm is-disable`, children: "\u786E\u8BA4" })] }), _jsx("div", { className: `${classPrefix}-custom-picker__body`, children: _jsx("div", { className: `${classPrefix}-custom-picker__columns ${classPrefix}-custom-picker__columns--select`, style: {
+                                    height: 'auto',
+                                }, children: _jsx("ul", { className: `${classPrefix}-custom-picker__column`, style: {
+                                        height: '290px',
+                                    }, children: mockOptionData.map((item, index) => {
+                                        return (_jsxs("li", { className: `${classPrefix}-custom-picker__column-item ${classPrefix}-custom-picker__column-item--results `, onClick: () => {
+                                                setSelectIndex(item === null || item === void 0 ? void 0 : item.key);
+                                                setChecked(true);
+                                            }, children: [_jsx("div", { className: `${classPrefix}-custom-picker__column-item-text`, children: item.label }), _jsx(WdIcon, { name: "td:close-circle-filled", size: "sm" })] }, index));
+                                    }) }) }) })] })), ![type].includes('checked') && (_jsxs("div", { className: `${classPrefix}-custom-picker__inner is-full is-no-border`, children: [_jsxs("div", { className: `${classPrefix}-custom-picker__header`, children: [_jsx("div", { className: `${classPrefix}-custom-picker__header-cancle`, children: "\u53D6\u6D88" }), _jsx("div", { className: `${classPrefix}-custom-picker__header-title`, children: "\u9009\u62E9\u4EBA\u5458" }), _jsx("div", { className: `${classPrefix}-custom-picker__header-confirm`, children: "\u786E\u8BA4" })] }), _jsxs("div", { className: `${classPrefix}-custom-picker__body`, children: [_jsx("div", { className: `${classPrefix}-custom-search `, children: _jsx(WdInputWrap, { className: `${classPrefix}-custom-search-input ${classPrefix}-member__control-search is-borderless size-height-lg size-width-hundred`, before: _jsx(WdIcon, { name: "td:search", size: "sm" }), children: _jsx("input", { type: "text", placeholder: "\u641C\u7D22\u6210\u5458" }) }) }), _jsx("div", { className: `${classPrefix}-custom-line ` }), [type].includes('search') ? (_jsx("div", { className: `${classPrefix}-custom-picker__columns ${classPrefix}-custom-picker__columns--select`, style: {
+                                        height: 'auto',
+                                    }, children: _jsx("ul", { className: `${classPrefix}-custom-picker__column`, style: {
+                                            height: checked
+                                                ? 'calc(100vh - 190px)'
+                                                : 'calc(100vh - 135px)',
+                                        }, children: mockOptionData.length === 0 ? (_jsx(StatusContent, { emptyText: '暂无成员', component: "table", icon: "noMember" })) : (_jsx(_Fragment, { children: mockOptionData.map((item, index) => {
+                                                return (_jsxs("li", { className: `${classPrefix}-custom-picker__column-item ${classPrefix}-custom-picker__column-item--results `, onClick: () => {
+                                                        setSelectIndex(item === null || item === void 0 ? void 0 : item.key);
+                                                        setChecked(true);
+                                                    }, children: [_jsx(WdRadio, { ...{}, labelVisible: true, value: "1", layout: 'horizontal', option: {
+                                                                value: '1',
+                                                            }, name: "demo", size: 'lg', getChangeHandler: () => { } }), _jsxs("div", { className: `${classPrefix}-custom-picker__column-item-text`, children: [_jsxs("div", { className: `${classPrefix}-custom-picker__column-item-text-title`, children: [_jsx("span", { className: `${classPrefix}-custom-picker__column-item-text-title-results`, children: item.label }), item.label] }), _jsx("div", { className: `${classPrefix}-custom-picker__column-item-text-subtitle`, children: item.label })] })] }, index));
+                                            }) })) }) })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: `${classPrefix}-custom-picker__department-box`, children: [_jsx("span", { className: `${classPrefix}-custom-picker__department-item`, children: "\u5168\u90E8\u90E8\u95E8" }), _jsx("span", { className: `${classPrefix}-custom-picker__department-item`, children: _jsx(WdIcon, { name: "td:chevron-right", size: "xs" }) }), _jsx("span", { className: `${classPrefix}-custom-picker__department-item `, children: "\u90E8\u95E82" }), _jsx("span", { className: `${classPrefix}-custom-picker__department-item ${classPrefix}-custom-picker__department-select`, children: _jsx(WdIcon, { name: "td:chevron-right", size: "xs" }) }), _jsx("span", { className: `${classPrefix}-custom-picker__department-item ${classPrefix}-custom-picker__department-select`, children: "\u90E8\u95E84" })] }), [type].includes('basics') && (_jsx("div", { className: `${classPrefix}-custom-picker__columns ${classPrefix}-custom-picker__columns--select`, style: {
+                                                height: 'auto',
+                                            }, children: _jsx("ul", { className: `${classPrefix}-custom-picker__column`, style: {
+                                                    height: checked
+                                                        ? 'calc(100vh - 245px)'
+                                                        : 'calc(100vh - 190px)',
+                                                }, children: mockOptionData.map((item, index) => {
+                                                    return (_jsxs("li", { className: `${classPrefix}-custom-picker__column-item ${classPrefix}-custom-picker__column-item--department `, onClick: () => {
+                                                            setSelectIndex(item === null || item === void 0 ? void 0 : item.key);
+                                                            setChecked(true);
+                                                        }, children: [_jsx(WdIcon, { name: "td:fork", size: "md" }), _jsx("div", { className: `${classPrefix}-custom-picker__column-item-text`, children: item.label }), _jsx(WdIcon, { name: "td:chevron-right", size: "sm" })] }, index));
+                                                }) }) })), [type].includes('radio') && (_jsx("div", { className: `${classPrefix}-custom-picker__columns ${classPrefix}-custom-picker__columns--select`, style: {
+                                                height: 'auto',
+                                            }, children: _jsx("ul", { className: `${classPrefix}-custom-picker__column`, style: {
+                                                    height: checked
+                                                        ? 'calc(100vh - 245px)'
+                                                        : 'calc(100vh - 190px)',
+                                                }, children: mockOptionData.map((item, index) => {
+                                                    return (_jsxs("li", { className: `${classPrefix}-custom-picker__column-item ${classPrefix}-custom-picker__column-item--department `, onClick: () => {
+                                                            setSelectIndex(item === null || item === void 0 ? void 0 : item.key);
+                                                            setChecked(true);
+                                                        }, children: [_jsx(WdRadio, { ...{}, labelVisible: true, value: "1", layout: 'horizontal', option: {
+                                                                    value: '1',
+                                                                }, name: "demo", size: 'lg', getChangeHandler: () => { } }), _jsx("div", { className: `${classPrefix}-custom-picker__column-item-text-department`, children: item.label })] }, index));
+                                                }) }) })), [type].includes('checkbox') && (_jsx("div", { className: `${classPrefix}-custom-picker__columns ${classPrefix}-custom-picker__columns--select`, style: {
+                                                height: 'auto',
+                                            }, children: _jsx("ul", { className: `${classPrefix}-custom-picker__column`, style: {
+                                                    height: checked
+                                                        ? 'calc(100vh - 245px)'
+                                                        : 'calc(100vh - 190px)',
+                                                }, children: mockOptionData.map((item, index) => {
+                                                    return (_jsx("li", { className: `${classPrefix}-custom-picker__column-item ${classPrefix}-custom-picker__column-item-multiple ${(item === null || item === void 0 ? void 0 : item.key) === selectIndex ? 'is-selected' : ''} `, onClick: () => {
+                                                            setSelectIndex(item === null || item === void 0 ? void 0 : item.key);
+                                                        }, children: _jsx("p", { className: `${classPrefix}-custom-picker__column-item-text-multiple`, children: item.label }) }, index));
+                                                }) }) }))] })), checked && (_jsxs("div", { className: `${classPrefix}-custom-picker__checked-box`, children: [_jsx("div", { className: `${classPrefix}-custom-picker__checked-label`, children: "\u5DF2\u9009\u62E9" }), _jsx("div", { className: `${classPrefix}-custom-picker__checked-tag`, children: _jsxs("div", { className: `${classPrefix}-form-select__tag-group `, children: [_jsx("div", { className: `${classPrefix}-form-select__tag-item `, children: _jsx("span", { className: `${classPrefix}-form-select__tag-text `, children: "\u6D4B\u8BD51" }) }), _jsx("div", { className: `${classPrefix}-form-select__tag-item `, children: _jsx("span", { className: `${classPrefix}-form-select__tag-text `, children: "\u6D4B\u8BD51" }) }), _jsx("div", { className: `${classPrefix}-form-select__tag-item `, children: _jsx("span", { className: `${classPrefix}-form-select__tag-text `, children: "\u6D4B\u8BD51" }) }), _jsx("div", { className: `${classPrefix}-form-select__tag-item `, children: _jsx("span", { className: `${classPrefix}-form-select__tag-text `, children: "+4" }) })] }) }), _jsx("div", { className: `${classPrefix}-custom-picker__checked-count`, children: "\u51715\u4EBA" }), _jsx(WdIcon, { name: "td:chevron-right", size: "sm" })] }))] })] }))] }) })) : null;
+}

package/dist/web/components/wd-member-select/index.d.ts

@@ -0,0 +1,3 @@
+import { WdMemberSelect } from './wd-member-select';
+export { WdMemberSelect, type WdMemberSelectProps } from './wd-member-select';
+export default WdMemberSelect;

package/dist/web/components/wd-member-select/index.js

@@ -0,0 +1,3 @@
+import { WdMemberSelect } from './wd-member-select';
+export { WdMemberSelect } from './wd-member-select';
+export default WdMemberSelect;

package/dist/web/components/wd-member-select/wd-member-select.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import type { CommonPropsType } from '../../types';
+export declare const WdMemberSelect: () => JSX.Element;
+export interface WdMemberSelectProps extends CommonPropsType {
+    defaultValue?: string;
+    size?: string;
+    layout?: string;
+}

package/dist/web/components/wd-member-select/wd-member-select.js

@@ -0,0 +1,73 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import * as React from 'react';
+import classNames from '../../utils/classnames';
+import { useConfig } from '../../utils/config-context';
+import { WdInputWrap, WdIcon, WdButton, WdCheckbox } from '../index';
+import { WdFormItem } from '../wd-form-item';
+import { Modal, ConfigProvider } from 'tea-component';
+import StatusContent from '../statusContent';
+import { MemberPickerH5 } from './h5';
+import { usePlatform } from '../../utils/platform';
+const mockMemberList = [
+    {
+        name: '测试人员1',
+        close: true,
+    },
+    {
+        name: '测试人员2',
+        close: true,
+    },
+    {
+        name: '测试人员3',
+        close: true,
+    },
+    {
+        name: '测试人员4',
+        close: false,
+    },
+    {
+        name: '测试人员5',
+        close: false,
+    },
+    {
+        name: '测试人员6',
+        close: false,
+    },
+];
+const FormItemMockData = {
+    classRoot: 'member',
+    labelVisible: true,
+    label: '成员',
+    testId: 'form-upload-file',
+    borderedPc: true,
+    layout: 'horizontal',
+    // layout: 'vertical',
+};
+export const WdMemberSelect = () => {
+    const { classPrefix } = useConfig();
+    const [isShowDialog, setIsShowDialog] = React.useState(false);
+    const [isShowH5Dialog, setIsShowH5Dialog] = React.useState(false);
+    const platform = usePlatform();
+    const isH5 = platform === 'h5'; // 响应式判定
+    const compClassName = `${classPrefix}-member-input-wrap `;
+    // 类名
+    const classList = [compClassName];
+    // 待删，为组件 ts 不报错
+    const extra = {};
+    return (_jsx(_Fragment, { children: _jsxs(WdFormItem, { ...FormItemMockData, children: [_jsx(WdInputWrap, { className: classNames(...classList), 
+                    // 移入改变after图标为【清空】icon即可<WdIcon name="td:close-circle-filled" />
+                    after: _jsx(WdIcon, { name: "td:usergroup" }), onClick: () => {
+                        isH5 ? setIsShowH5Dialog(true) : setIsShowDialog(true);
+                    }, children: _jsxs("div", { className: `${classPrefix}-member__tag-group size-md`, children: [_jsxs("div", { className: `${classPrefix}-member__tag-item `, children: [_jsx("span", { className: `${classPrefix}-member__tag-text `, children: "\u6D4B\u8BD51" }), _jsx(WdIcon, { name: "td:close" })] }), _jsxs("div", { className: `${classPrefix}-member__tag-item `, children: [_jsx("span", { className: `${classPrefix}-member__tag-text `, children: "\u6D4B\u8BD51" }), _jsx(WdIcon, { name: "td:close" })] }), _jsxs("div", { className: `${classPrefix}-member__tag-item `, children: [_jsx("span", { className: `${classPrefix}-member__tag-text `, children: "\u6D4B\u8BD51" }), _jsx(WdIcon, { name: "td:close" })] }), _jsx("div", { className: `${classPrefix}-member__tag-item `, children: _jsx("span", { className: `${classPrefix}-member__tag-text `, children: "+4" }) })] }) }), _jsx(ConfigProvider, { classPrefix: "wedatea2td", children: _jsxs(Modal, { className: `${classPrefix}-member-dialog `, visible: isShowDialog, caption: "\u9009\u62E9\u6210\u5458", onClose: () => {
+                            setIsShowDialog(false);
+                        }, children: [_jsx(Modal.Body, { children: _jsxs("div", { className: `${classPrefix}-member__control `, children: [_jsx("div", { className: `${classPrefix}-member__control-empty `, children: _jsx(StatusContent, { emptyText: '暂无成员', component: "table", icon: "noMember" }) }), _jsxs("div", { className: `${classPrefix}-member__control-select `, children: [_jsx(WdInputWrap, { className: `${classPrefix}-member__control-search is-borderless size-width-hundred`, after: _jsx(WdIcon, { name: "td:search" }), children: _jsx("input", { type: "text", placeholder: "\u641C\u7D22\u6210\u5458" }) }), _jsxs("div", { className: `${classPrefix}-member__control-select-control`, children: [_jsx("div", { className: `${classPrefix}-member__control-select-left ` }), _jsxs("div", { className: `${classPrefix}-member__control-select-right `, children: [_jsxs("div", { className: `${classPrefix}-member__control-select-item`, children: [_jsx(WdCheckbox, { ...extra, index: 0, option: {
+                                                                                label: '全选',
+                                                                            }, name: 'demo', size: 'md', getChangeHandler: () => { }, checkedItemValue: [] }), _jsxs("div", { className: `${classPrefix}-member__pagination`, children: [_jsx(WdIcon, { name: "td:chevron-left" }), _jsx("div", { className: `${classPrefix}-member__pagination-control`, children: "1/2" }), _jsx(WdIcon, { name: "td:chevron-right" })] })] }), _jsx("div", { className: `${classPrefix}-member__control-select-item`, children: _jsx(WdCheckbox, { ...{}, index: 0, option: {
+                                                                            label: (_jsxs(_Fragment, { children: ["\u4EBA\u54581", _jsx("span", { style: {
+                                                                                            paddingLeft: '8px',
+                                                                                            color: 'rgba(0, 0, 0, 0.4)',
+                                                                                        }, children: "\u90E8\u95E81" })] })),
+                                                                        }, name: 'demo', size: 'md', getChangeHandler: () => { }, checkedItemValue: [] }) }), _jsx("div", { className: `${classPrefix}-member__control-select-item`, children: _jsx(WdCheckbox, { ...extra, index: 0, option: { label: '人员2' }, name: 'demo', size: 'md', getChangeHandler: () => { }, checkedItemValue: [] }) })] })] })] }), _jsx("div", { className: `${classPrefix}-member__control-selected `, children: _jsx("div", { className: `${classPrefix}-member__tag-group`, children: mockMemberList.length !== 0 ? (_jsx(_Fragment, { children: '暂无人员' })) : (mockMemberList === null || mockMemberList === void 0 ? void 0 : mockMemberList.map((item, index) => (_jsx(_Fragment, { children: _jsxs("div", { className: `${classPrefix}-member__tag-item `, children: [_jsx("span", { className: `${classPrefix}-member__tag-text `, children: item.name }), _jsx(WdIcon, { name: "td:close" })] }, index) })))) }) })] }) }), _jsxs(Modal.Footer, { children: [_jsx(WdButton, { text: "\u53D6\u6D88", size: "md", theme: "secondary" }), _jsx(WdButton, { text: "\u786E\u5B9A", size: "md", theme: "primary" })] })] }) }), _jsx(MemberPickerH5, { isShow: isShowH5Dialog, close: () => {
+                        setIsShowH5Dialog(false);
+                    } })] }) }));
+};

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

@@ -0,0 +1,3 @@
+import { WdModal } from './wd-modal';
+export { WdModal, type WdModalProps } from './wd-modal';
+export default WdModal;

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

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

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

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

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

@@ -0,0 +1,131 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { forwardRef, useImperativeHandle, useEffect, useState, useCallback, } from 'react';
+import classNames from '../../utils/classnames';
+import { useConfig } from '../../utils/config-context';
+import { usePlatform } from '../../utils/platform';
+let timer = null;
+const MAKS_SHOW_TIME = 200;
+const ESC_KEYBORD_NUM = 27;
+export const WdModal = forwardRef(function WdModal(props, ref) {
+    const { className = '', style, id } = props;
+    const platform = usePlatform();
+    // 弹窗主体内容显示控制
+    const [isBdShow, setIsBdShow] = useState(true);
+    // 弹窗遮罩层显示控制
+    const [isMaskShow, setIsMaskShow] = useState(false);
+    // 弹窗遮罩层预显示控制，为了动画
+    const [maskPreToShow, setMaskPreToShow] = useState(false);
+    const [positionInner, setPositionInner] = useState(platform === 'pc' ? 'center' : props.position);
+    const [openInfo, setOpenInfo] = useState(null);
+    const [closeInfo, setCloseInfo] = useState(null);
+    // 样式
+    const { classPrefix } = useConfig();
+    // 响应式css api
+    const classes = {
+        [`${classPrefix}-modal`]: true,
+        [`${classPrefix}-modal-center`]: positionInner === 'center',
+        [`${classPrefix}-${platform}-modal`]: true,
+    };
+    useEffect(() => {
+        dealShow(props.defaultShow);
+    }, [props.defaultShow]);
+    useEffect(() => {
+        setPositionInner(platform === 'pc' ? 'center' : props.position);
+    }, [platform, props.position]);
+    /**
+     * 控制弹窗打开/关闭
+     * @param {Boolean} isOpen
+     */
+    const dealShow = (isOpen) => {
+        setIsBdShow(isOpen);
+        setIsMaskShow(!isOpen);
+        if (isOpen) {
+            setMaskPreToShow(true);
+        }
+        else {
+            // 延迟控制遮罩层消失，为了动画效果
+            timer && clearTimeout(timer);
+            // eslint-disable-next-line rulesdir/no-timer
+            timer = setTimeout(() => {
+                setMaskPreToShow(false);
+            }, MAKS_SHOW_TIME);
+        }
+    };
+    /**
+     * 关闭弹窗
+     */
+    const close = useCallback((params) => {
+        var _a;
+        dealShow(false);
+        setCloseInfo((params === null || params === void 0 ? void 0 : params.info) || params);
+        (_a = props.events) === null || _a === void 0 ? void 0 : _a.close(params);
+    }, [props.events]);
+    /**
+     * 开启弹窗
+     */
+    const open = useCallback((params) => {
+        var _a;
+        dealShow(true);
+        setOpenInfo((params === null || params === void 0 ? void 0 : params.info) || params);
+        (_a = props.events) === null || _a === void 0 ? void 0 : _a.open(params);
+    }, [props.events]);
+    /**
+     * 按下ESC判断是否关闭弹窗
+     */
+    const escKeyDown = useCallback((e) => {
+        if (e.keyCode !== ESC_KEYBORD_NUM)
+            return;
+        close();
+    }, [close]);
+    useEffect(() => {
+        if (platform === 'pc' && props.closeType.includes('esc')) {
+            window === null || window === void 0 ? void 0 : window.removeEventListener('keydown', escKeyDown);
+            window === null || window === void 0 ? void 0 : window.addEventListener('keydown', escKeyDown);
+        }
+        return () => {
+            window === null || window === void 0 ? void 0 : window.removeEventListener('keydown', escKeyDown);
+        };
+    }, [escKeyDown, platform, props.closeType]);
+    // Widget API，挂载组件只读属性和组件方法
+    useImperativeHandle(ref, () => {
+        return {
+            close,
+            open,
+            modalState: isBdShow ? 'open' : 'close',
+            openInfo,
+            closeInfo,
+        };
+    }, [close, open, isBdShow, openInfo, closeInfo]);
+    const renderNode = () => {
+        const modalMaskClasses = {
+            [`${classPrefix}-modal-mask`]: true,
+            [`${classPrefix}-modal-mask__fadein`]: true,
+            [`${classPrefix}-modal-mask__fadeout`]: isMaskShow,
+            [`${classPrefix}-modal-mask__hide`]: !props.defaultMaskShow,
+        };
+        const modalBdClasses = {
+            [`${classPrefix}-modal-bd`]: true,
+            [`${classPrefix}-modal-bd__toggle`]: isBdShow,
+            [`${classPrefix}-modal-bd__box`]: !props.defaultMaskShow && positionInner === 'center',
+        };
+        return (_jsxs(_Fragment, { children: [_jsx("div", { className: classNames(modalMaskClasses), onClick: () => {
+                        if (props.closeType.includes('mask')) {
+                            close();
+                        }
+                    } }), _jsx("div", { className: `${classPrefix}-modal-content`, onClick: () => {
+                        if (props.closeType.includes('mask')) {
+                            close();
+                        }
+                    }, children: _jsxs("div", { style: {
+                            width: {
+                                center_h5: 'calc(100% - 4.57rem)',
+                                bottom_h5: '100%',
+                                center_pc: !(style === null || style === void 0 ? void 0 : style.width) ? '680px' : 'auto',
+                            }[`${positionInner}_${platform}`],
+                            ...style,
+                        }, className: classNames(modalBdClasses), onClick: (e) => {
+                            e.stopPropagation();
+                        }, children: [_jsx("div", { className: `${classPrefix}-modal-bd__hd`, children: props.headerSlot }), _jsx("div", { className: `${classPrefix}-modal-bd__main`, children: props.contentSlot }), _jsx("div", { className: `${classPrefix}-modal-bd__ft`, children: props.footerSlot })] }) })] }));
+    };
+    return (_jsx("div", { id: id, className: classNames(classes, className), style: { display: (style === null || style === void 0 ? void 0 : style.display) || 'block' }, "data-testid": "wd-modal-test", children: maskPreToShow && renderNode() }));
+});

package/dist/web/components/wd-official-account/index.css

@@ -0,0 +1,29 @@
+.weda-official-account {
+  height: 106px;
+  background-color: #fff;
+  padding: 10px 15px;
+  border: 1px solid #f2f2f2;
+  border-radius: 2px;
+}
+.weda-official-account__title {
+  margin-bottom: 12px;
+  font-size: 12px;
+}
+.weda-official-account__left {
+  display: flex;
+}
+.weda-official-account__left__img {
+  height: 54px;
+  width: 54px;
+  border-radius: 100%;
+  margin-right: 8px;
+}
+.weda-official-account .weda-official-account__label {
+  font-size: 12px;
+}
+.weda-official-account
+  .wedatea2td-justify-grid__col--right
+  .weda-official-account__btn {
+  border-color: var(--weui-WECHAT);
+  color: var(--weui-WECHAT);
+}

package/dist/web/components/wd-official-account/index.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import type { CommonPropsType } from '../../types';
+import './style';
+export type PropsType = CommonPropsType;
+export default function WdOfficialAccount(props: PropsType): JSX.Element;

package/dist/web/components/wd-official-account/index.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/*
+ * @Date: 2023-04-18 19:14:42
+ * @LastEditTime: 2023-05-04 11:54:50
+ * @Description:
+ */
+import * as React from 'react';
+import { Text, Justify, ConfigProvider, Bubble } from 'tea-component';
+import classNames from '../../utils/classnames';
+import { WdButton } from '../../components/wd-button';
+// @ts-ignore忽略ts交验
+// eslint-disable-next-line rulesdir/no-phantom-deps
+import { autorun } from 'mobx';
+import './style';
+export default function WdOfficialAccount(props) {
+    var _a, _b;
+    const { className, id, style } = props;
+    const [editorPlatforms, setEditorPlatforms] = React.useState([]);
+    const dispose = React.useMemo(() => {
+        return autorun(() => {
+            var _a, _b;
+            setEditorPlatforms((_b = (_a = window === null || window === void 0 ? void 0 : window.$w) === null || _a === void 0 ? void 0 : _a.wedaContext) === null || _b === void 0 ? void 0 : _b.editorPlatforms);
+        });
+    }, []);
+    React.useEffect(() => {
+        return () => {
+            dispose();
+        };
+    }, [dispose]);
+    return (_jsx(ConfigProvider, { classPrefix: "wedatea2td", children: ((_b = (_a = window.$w) === null || _a === void 0 ? void 0 : _a.wedaContext) === null || _b === void 0 ? void 0 : _b.isEditorMode) ||
+            (editorPlatforms === null || editorPlatforms === void 0 ? void 0 : editorPlatforms.includes('MP')) ? (_jsx(Bubble, { content: _jsxs(_Fragment, { children: ["\u8BF7\u53D1\u5E03\u540E\u5728\u5FAE\u4FE1\u4E2D\u67E5\u770B\u8BE5\u7EC4\u4EF6\u5B9E\u9645\u6548\u679C\uFF0C\u5F53\u524D\u7EC4\u4EF6\u4EC5\u5728\u7279\u5B9A\u5C0F\u7A0B\u5E8F\u6253\u5F00\u573A\u666F\u4E0B\u5C55\u793A\uFF0C", _jsx("br", {}), _jsx("a", { href: "https://developers.weixin.qq.com/miniprogram/dev/component/official-account.html", target: "_blank", rel: "noreferrer", children: "\u67E5\u770B\u8BF4\u660E" })] }), children: _jsxs("div", { className: classNames({
+                    [className]: className,
+                    'weda-ui': true,
+                    'weda-official-account': true,
+                }), id: id, style: style, children: [_jsx(Text, { parent: "p", theme: "label", className: "weda-official-account__title", children: "\u67D0\u67D0\u5C0F\u7A0B\u5E8F\u5173\u8054\u7684\u516C\u4F17\u53F7" }), _jsx(Justify, { left: _jsxs("div", { className: "weda-official-account__left", children: [_jsx("img", { className: "weda-official-account__left__img", src: "https://qcloudimg.tencent-cloud.cn/raw/4a29d51b504f12b4933ce4490110b4dc.svg", alt: "" }), _jsxs("div", { children: [_jsx(Text, { reset: true, parent: "p", children: "\u516C\u4F17\u53F7\u540D\u79F0" }), _jsx(Text, { className: "weda-official-account__label", reset: true, parent: "p", theme: "label", children: "\u516C\u4F17\u53F7\u7B80\u4ECB" })] })] }), right: _jsx(WdButton, { theme: "primary", variant: "outline", style: { fontSize: '14px' }, text: "\u5173\u6CE8", size: "mini", className: "weda-official-account__btn" }) })] }) })) : null }));
+}

package/dist/web/components/wd-official-account/style.d.ts

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

package/dist/web/components/wd-official-account/style.js

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

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

@@ -0,0 +1,3 @@
+import { WdRadio } from './wd-radio';
+export { WdRadio, type WdRadioProps } from './wd-radio';
+export default WdRadio;

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

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

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

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import type { CommonPropsType } from '../../types';
+import type { DataType } from '../../../configs/components/wd-radio';
+export declare const WdRadio: ({ index, option, name, size, disabled, checkedItemValue, getChangeHandler, }: WdRadioProps) => JSX.Element;
+export interface WdRadioProps extends CommonPropsType, DataType {
+    option?: object;
+    index?: number;
+    checkedItemValue?: string;
+    getChangeHandler?: (val: any) => any;
+    disabled?: boolean;
+}

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

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import classNames from '../../utils/classnames';
+import { useConfig } from '../../utils/config-context';
+import getLocalCounter from '../../utils/getLocalCounter';
+export const WdRadio = ({ index, option, name, size, disabled, checkedItemValue, getChangeHandler, }) => {
+    const { classPrefix } = useConfig();
+    const { label, value: optionValue } = option;
+    // 类名
+    const classList = [];
+    switch (size) {
+        case 'sm':
+            classList.push(`size-sm `);
+            break;
+        case 'md':
+            classList.push(`size-md `);
+            break;
+        case 'lg':
+            classList.push(`size-lg `);
+            break;
+        default:
+            classList.push();
+    }
+    // 现在低码组件往源码组件传入的id不唯一, 暂时使用hashcode替代
+    const hashcode = useMemo(() => getLocalCounter(), []);
+    const _id = `radio-${hashcode}-${index}`;
+    const _name = `radio-${hashcode}-${name}`;
+    const NUMBER_1 = 1;
+    return (_jsxs("label", { className: `${classPrefix}-radio-wrap ${classNames(classList)} ${`${checkedItemValue}` === `${optionValue}` ? 'is-checked' : ''} ${disabled ? 'is-disabled' : ''} ${'radio' + (index + NUMBER_1)}`, onClick: getChangeHandler(optionValue), children: [_jsx("input", { className: `${classPrefix}-radio-input `, id: _id, name: _name, type: "radio", value: optionValue, disabled: disabled, checked: `${checkedItemValue}` === `${optionValue}`, onChange: (e) => e.stopPropagation(), onClick: (e) => e.stopPropagation() }), _jsx("span", { className: `${classPrefix}-radio-inner ` }), label && _jsx("span", { className: `${classPrefix}-radio-label`, children: label })] }));
+};

package/dist/web/components/wd-radio-list/index.d.ts

@@ -0,0 +1,3 @@
+import { WdRadioList } from './wd-radio-list';
+export { WdRadioList, type WdRadioListProps } from './wd-radio-list';
+export default WdRadioList;

package/dist/web/components/wd-radio-list/index.js

@@ -0,0 +1,3 @@
+import { WdRadioList } from './wd-radio-list';
+export { WdRadioList } from './wd-radio-list';
+export default WdRadioList;

package/dist/web/components/wd-radio-list/wd-radio-list.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { CommonPropsType } from '../../types';
+import type { DataType } from '../../../configs/components/wd-radio';
+export declare const WdRadioList: React.ForwardRefExoticComponent<WdRadioListProps & React.RefAttributes<any>>;
+export interface WdRadioListProps extends CommonPropsType, DataType {
+    onChange?: (val: any) => void;
+}

package/dist/web/components/wd-radio-list/wd-radio-list.js

@@ -0,0 +1,125 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createElement as _createElement } from "react";
+import React, { useState, useEffect } from 'react';
+import classNames from '../../utils/classnames';
+import { useConfig } from '../../utils/config-context';
+import { WdRadio } from '../index';
+import { WdFormItem } from '../wd-form-item';
+import { emptyObject } from '../../utils/constant';
+import { usePlatform } from '../../utils/platform';
+import { useSize } from '../../utils/hooks/useFormLegacy';
+import { useFormInputTrait } from '../form-input-hooks';
+import { callWedaApi } from '../../utils/tcb';
+import destr from 'destr';
+export const WdRadioList = React.forwardRef(function WdRadioList(props, inputRef) {
+    var _a;
+    const { range, direction, events = emptyObject, format = '', enumName = '', label, } = props;
+    const size = useSize(props);
+    const [innerHandle, setInnerHandle] = React.useState({}); // hook里挂出的属性
+    /** 兼容从 Form 获取属性，必须引入，自动挂载组件方法 */
+    const traitProps = { ...props, inputRef, setInnerHandle };
+    const { value: defaultValue, onChange: outerOnChange, disabled, readOnly, validateErrorMsg, validateState, visible, name, value, required, layout, } = useFormInputTrait(traitProps);
+    const [options, setOptions] = React.useState(format === 'x-enum' ? [] : range);
+    const [checkedItemValue, setCheckedItemValue] = useState(defaultValue);
+    const { classPrefix } = useConfig();
+    const platform = usePlatform();
+    const compClassName = `${classPrefix}-radio-group `;
+    // 类名
+    const classList = [compClassName];
+    ['inline'].includes(direction) &&
+        classList.push(`${classPrefix}-radio-group--inner  `);
+    /**
+     * 在ios h5端, label和input的绑定不生效
+     * 导致 onChange 事件触发有问题, 所以改为监听 onClick 事件
+     */
+    const getChangeHandler = function (value) {
+        const onChange = function (e) {
+            var _a, _b;
+            e.stopPropagation();
+            if (!disabled && !readOnly) {
+                if (checkedItemValue && `${checkedItemValue}` === `${value}`) {
+                    setCheckedItemValue('');
+                    outerOnChange === null || outerOnChange === void 0 ? void 0 : outerOnChange('');
+                    (_a = events.change) === null || _a === void 0 ? void 0 : _a.call(events, { value: '' }, { originEvent: e });
+                }
+                else {
+                    setCheckedItemValue(value);
+                    outerOnChange === null || outerOnChange === void 0 ? void 0 : outerOnChange(value);
+                    (_b = events.change) === null || _b === void 0 ? void 0 : _b.call(events, { value }, { originEvent: e });
+                }
+            }
+        };
+        return onChange;
+    };
+    useEffect(() => {
+        setCheckedItemValue(defaultValue);
+    }, [defaultValue, options]);
+    useEffect(() => {
+        if (format !== 'x-enum') {
+            setOptions(range);
+        }
+    }, [range, format]);
+    useEffect(() => {
+        // 如果绑定字段类型为枚举，且传入自定义选项集的名称则默认使用自定义选项集的内容作为选项
+        if (format === 'x-enum' && enumName) {
+            fetchData({ OptNameList: [enumName], PageIndex: 1, PageSize: 10 });
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    React.useImperativeHandle(inputRef, () => {
+        var _a;
+        return ({
+            ...innerHandle,
+            name,
+            value,
+            label,
+            required,
+            visible,
+            disabled,
+            readOnly,
+            selectedLabel: (Array.isArray(options) &&
+                ((_a = options === null || options === void 0 ? void 0 : options.find((option) => `${option.value}` === `${value}`)) === null || _a === void 0 ? void 0 : _a.label)) ||
+                '',
+        });
+    }, [
+        innerHandle,
+        name,
+        value,
+        label,
+        required,
+        visible,
+        disabled,
+        readOnly,
+        options,
+    ]);
+    const fetchData = async (param) => {
+        var _a, _b, _c;
+        const data = await callWedaApi({
+            action: 'DescribeGeneralOptionsDetailList',
+            data: param,
+        });
+        const config = (_c = destr((_b = (_a = data === null || data === void 0 ? void 0 : data.Items) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.Config)) !== null && _c !== void 0 ? _c : [];
+        const enumOption = config.map((item) => {
+            return {
+                label: item.value,
+                value: item.key,
+            };
+        });
+        setOptions(enumOption);
+    };
+    const labelSize = () => {
+        if (['h5'].includes(platform) ||
+            (['horizontal', ''].includes(layout) &&
+                ['vertical'].includes(direction))) {
+            return 'xs';
+        }
+        return size;
+    };
+    return (visible && (_jsx(WdFormItem, { ...props, testId: "form-radio-group", validateErrorMsg: validateErrorMsg, validateState: validateState, readValue: (readOnly &&
+            Array.isArray(options) &&
+            ((_a = options === null || options === void 0 ? void 0 : options.find((option) => `${option.value}` === `${value}`)) === null || _a === void 0 ? void 0 : _a.label)) ||
+            '-', disabled: disabled, readOnly: readOnly, classRoot: 'radio', size: labelSize(), layout: layout, children: _jsx("div", { className: classNames(classList), children: Array.isArray(options) &&
+                (options === null || options === void 0 ? void 0 : options.map((Item, Index) => {
+                    return (_createElement(WdRadio, { ...props, key: Index, index: Index, size: ['h5'].includes(platform) ? 'lg' : props === null || props === void 0 ? void 0 : props.size, option: Item, disabled: disabled, getChangeHandler: getChangeHandler, checkedItemValue: checkedItemValue }));
+                })) }) })));
+});