@cloudbase/weda-ui 3.1.9 → 3.2.1

package/dist/src/web/components/form/enumSelect/props/propsTypes.d.ts

@@ -0,0 +1,39 @@
+export namespace propTypes {
+    const events: PropTypes.Requireable<object>;
+    const defaultValue: PropTypes.Requireable<NonNullable<string | number>>;
+    const name: PropTypes.Requireable<string>;
+    const placeholder: PropTypes.Requireable<string>;
+    const disabled: PropTypes.Requireable<boolean>;
+    const onChange: PropTypes.Requireable<(...args: any[]) => any>;
+    const options: PropTypes.Requireable<any[]>;
+    const clearable: PropTypes.Requireable<boolean>;
+    const appearance: PropTypes.Requireable<string>;
+    const allOption: PropTypes.Requireable<object>;
+    const matchButtonWidth: PropTypes.Requireable<boolean>;
+    const virtual: PropTypes.Requireable<boolean>;
+    const searchable: PropTypes.Requireable<boolean>;
+    const size: PropTypes.Requireable<string>;
+    const value: PropTypes.Requireable<NonNullable<string | any[]>>;
+    const enumType: PropTypes.Requireable<string>;
+    const customEnum: PropTypes.Requireable<any[]>;
+    const optionId: PropTypes.Requireable<string>;
+    const isModelApp: PropTypes.Requireable<boolean>;
+    const id: PropTypes.Requireable<string>;
+    const style: PropTypes.Requireable<string>;
+    const className: PropTypes.Requireable<string>;
+    const label: PropTypes.Requireable<string>;
+    const labelVisible: PropTypes.Requireable<boolean>;
+    const layout: PropTypes.Requireable<string>;
+    const requiredFlag: PropTypes.Requireable<boolean>;
+}
+export namespace formContainerPropsTypes {
+    const children: PropTypes.Requireable<PropTypes.ReactElementLike>;
+    const decorator: PropTypes.Requireable<PropTypes.ReactElementLike>;
+}
+export namespace selectContainerPropsTypes {
+    const children_1: PropTypes.Requireable<PropTypes.ReactElementLike>;
+    export { children_1 as children };
+    const decorator_1: PropTypes.Requireable<PropTypes.ReactElementLike>;
+    export { decorator_1 as decorator };
+}
+import * as PropTypes from "prop-types";

package/dist/src/web/components/form/enumSelect/props/propsTypes.js

@@ -0,0 +1,47 @@
+import * as PropTypes from 'prop-types';
+const commonPropsTypes = {
+    // 系统属性
+    id: PropTypes.string,
+    style: PropTypes.string,
+    className: PropTypes.string,
+    // weda 组件属性
+    label: PropTypes.string,
+    labelVisible: PropTypes.bool,
+    layout: PropTypes.string,
+    requiredFlag: PropTypes.bool,
+};
+export const propTypes = {
+    ...commonPropsTypes,
+    // 系统属性
+    events: PropTypes.object,
+    // tea组件属性
+    defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    name: PropTypes.string,
+    placeholder: PropTypes.string,
+    disabled: PropTypes.bool,
+    onChange: PropTypes.func,
+    options: PropTypes.array,
+    clearable: PropTypes.bool,
+    appearance: PropTypes.string,
+    allOption: PropTypes.object,
+    matchButtonWidth: PropTypes.bool,
+    virtual: PropTypes.bool,
+    searchable: PropTypes.bool,
+    size: PropTypes.string,
+    value: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
+    // 业务属性
+    enumType: PropTypes.string,
+    customEnum: PropTypes.array,
+    optionId: PropTypes.string,
+    isModelApp: PropTypes.bool,
+};
+export const formContainerPropsTypes = {
+    ...commonPropsTypes,
+    children: PropTypes.element,
+    decorator: PropTypes.element,
+};
+export const selectContainerPropsTypes = {
+    ...commonPropsTypes,
+    children: PropTypes.element,
+    decorator: PropTypes.element,
+};

package/dist/src/web/components/form/form/index.d.ts

@@ -0,0 +1,32 @@
+/// <reference types="react" />
+import type { CommonFormPropsType } from '../types';
+import './index.css';
+/**
+ * 表单容器组件
+ */
+export default function Form({ className, contentSlot, style, id, layout, formType, datasourceType, dataSourceName, _id, methodGetItem, paramGetItem, events, appCloud, }: {
+    className: any;
+    contentSlot: any;
+    style: any;
+    id: any;
+    layout: any;
+    formType: any;
+    datasourceType: any;
+    dataSourceName: any;
+    _id: any;
+    methodGetItem: any;
+    paramGetItem: any;
+    events: any;
+    appCloud?: any;
+}): JSX.Element;
+export interface PropsType extends CommonFormPropsType {
+    contentSlot?: any;
+    formType?: string;
+    datasourceType?: string;
+    dataSourceName?: string;
+    _id?: string;
+    methodCreate?: string;
+    methodGetItem?: string;
+    paramGetItem?: any;
+    methodUpdate?: string;
+}

package/dist/src/web/components/form/form/index.js

@@ -0,0 +1,141 @@
+import * as React from 'react';
+import classNames from '../../../utils/classnames';
+import { ConfigProvider, Form as TeaForm, message as TeaMessage, } from 'tea-component';
+import { usePlatform, isInIde } from '../../../utils/platform';
+import { callDataSource, callConnector, getDataSourceByName, } from '../../../utils/tcb';
+import weui from '../../../utils/weui';
+import './index.css';
+const formTypeWithInitValue = ['edit', 'read'];
+/**
+ * 表单容器组件
+ */
+export default function Form({ className, contentSlot, style, id, layout, formType, datasourceType, dataSourceName, _id, methodGetItem, paramGetItem, events, appCloud = { callDataSource, callConnector }, }) {
+    const platform = usePlatform(); // h5 | web
+    const isDataModel = !['connector', 'custom-connector'].includes(datasourceType); // 是否为数据模型，兼容历史 undefined
+    const cls = classNames({
+        'weda-ui': true,
+        'weda-form': true,
+        'weui-form': platform === 'h5',
+        'weda-form-pc': platform === 'pc',
+        'gsd-h5-react-form-pc': platform === 'pc',
+        [className]: className,
+    });
+    const timeRef = React.useRef(null);
+    React.useEffect(() => {
+        const getData = async () => {
+            var _a, _b;
+            try {
+                let initValue = {};
+                if (isDataModel) {
+                    // 数据模型查询条件
+                    if (formTypeWithInitValue.includes(formType) && dataSourceName) {
+                        initValue = await appCloud.callDataSource({
+                            dataSourceName,
+                            methodName: 'wedaGetItem',
+                            params: { _id },
+                        }, true);
+                        if (Object.keys(initValue).length !== 0) {
+                            (_a = events === null || events === void 0 ? void 0 : events.onInitValue) === null || _a === void 0 ? void 0 : _a.call(events, initValue);
+                        }
+                        else {
+                            alertError(platform, '表单容器数据查询失败');
+                        }
+                    }
+                }
+                else {
+                    // 连接器查询条件
+                    if (formTypeWithInitValue.includes(formType) &&
+                        dataSourceName &&
+                        methodGetItem &&
+                        paramGetItem) {
+                        initValue = await appCloud.callConnector({
+                            dataSourceName,
+                            methodName: methodGetItem,
+                            params: paramGetItem,
+                        }, true);
+                        if (Object.keys(initValue).length !== 0) {
+                            (_b = events === null || events === void 0 ? void 0 : events.onInitValue) === null || _b === void 0 ? void 0 : _b.call(events, initValue);
+                        }
+                    }
+                }
+            }
+            catch (e) {
+                alertError(platform, '表单容器数据查询失败');
+            }
+        };
+        if (dataSourceName && formTypeWithInitValue.includes(formType)) {
+            if ((isDataModel && _id) ||
+                (!isDataModel && paramGetItem && methodGetItem)) {
+                clearTimeout(timeRef.current);
+                // 防抖
+                // eslint-disable-next-line rulesdir/no-timer
+                timeRef.current = setTimeout(() => getData(), 100);
+            }
+        }
+    }, [
+        formType,
+        isDataModel,
+        dataSourceName,
+        _id,
+        platform,
+        methodGetItem,
+        paramGetItem,
+    ]);
+    React.useEffect(() => {
+        // 获取字段权限
+        async () => {
+            var _a, _b, _c, _d;
+            const authValue = {
+                isDataModel,
+                dataSourceFields: [],
+                dataSourceFieldsWidthAuthList: [],
+            };
+            try {
+                const datasource = await getDataSourceByName(dataSourceName);
+                if (!isInIde()) {
+                    // 判断是否是预览区，编辑器编辑区 dataSourceName 查询的返回一致，编辑区用的本地的数据源数据返回固定
+                    authValue.dataSourceFieldsWidthAuthList =
+                        (_a = datasource === null || datasource === void 0 ? void 0 : datasource.resourceCheckInfos) === null || _a === void 0 ? void 0 : _a.map((item) => item.ReadWrite);
+                    authValue.dataSourceFields = Object.keys(((_b = datasource === null || datasource === void 0 ? void 0 : datasource.schema) === null || _b === void 0 ? void 0 : _b.properties) || {});
+                }
+                (_c = events === null || events === void 0 ? void 0 : events.onInitDataSourceFieldsWithAuth) === null || _c === void 0 ? void 0 : _c.call(events, authValue);
+            }
+            catch (err) {
+                (_d = events === null || events === void 0 ? void 0 : events.onInitDataSourceFieldsWithAuth) === null || _d === void 0 ? void 0 : _d.call(events, authValue);
+                alertError(platform, `获取数据源字段权限信息失败,字段权限可能无法正确展示,错误信息:${err}`);
+                console.log('getDataSourceFieldsWithAuth err', err);
+            }
+        };
+        // 权限功能，待sdk兼容问题解决后上线
+        // if (isDataModel && dataSourceName) {
+        //   getDataSourceFieldsWithAuth();
+        // } else {
+        //   // 在表单容器里面的表单元素 if 默认是 false，需要通过onInitDataSourceFieldsWithAuth设置为true
+        //   events?.onInitDataSourceFieldsWithAuth?.({ isDataModel });
+        // }
+    }, [formType, isDataModel, platform, dataSourceName]);
+    // pc 渲染
+    const renderPc = () => {
+        return (React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
+            React.createElement(TeaForm, { layout: layout, className: cls, style: style, id: id }, contentSlot)));
+    };
+    // h5 渲染
+    const renderH5 = () => {
+        return (React.createElement("div", { className: cls, style: style, id: id },
+            React.createElement("div", { className: "weui-cells__group weui-cells__group_form" }, contentSlot)));
+    };
+    return platform === 'pc' ? renderPc() : renderH5();
+}
+/**
+ * 根据平台不同，展示不同的错误提示消息
+ */
+function alertError(platform = 'h5', message) {
+    if (isInIde())
+        return;
+    if (platform === 'h5') {
+        weui.toast(message, { duration: 2000, className: 'weda-form-toast' });
+    }
+    else {
+        TeaMessage.error({ content: message });
+    }
+}

package/dist/src/web/components/form/formcell/index.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import './index.css';
+import type { CommonFormPropsType } from '../types';
+export default function FormCell({ className, style, label, layout, children, multiCell, requiredFlag, size, }: PropsType): JSX.Element;
+export interface PropsType extends CommonFormPropsType {
+    multiCell?: boolean;
+    size?: string;
+}

package/dist/src/web/components/form/formcell/index.js

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import classNames from '../../../utils/classnames';
+import './index.css';
+import { usePlatform } from '../../../utils/platform';
+import { ConfigProvider, Form as TeaForm } from 'tea-component';
+export default function FormCell({ className, style, label, layout, children, multiCell, requiredFlag, size, }) {
+    const platform = usePlatform();
+    const isFlex = layout !== 'vertical';
+    if (platform === 'pc') {
+        return (React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
+            React.createElement(TeaForm.Item, { style: style, className: classNames({
+                    'weda-ui': true,
+                    'weui-cells_forms': !multiCell,
+                    'weui-cells_checkbox': multiCell,
+                    'weda-formcells__pc': !!label,
+                    'weda-formcells__full-width': size === 'full',
+                    [layout]: layout,
+                    [className]: [className],
+                }), label: label, required: requiredFlag }, children)));
+    }
+    return (React.createElement("div", { className: className, style: style },
+        React.createElement("div", { className: classNames({
+                'weda-formcells': true,
+                'weui-cells': true,
+                'weui-cells_forms': !multiCell,
+                'weui-cells_checkbox': multiCell,
+                'weui-flex': isFlex,
+            }) },
+            label ? (React.createElement("div", { className: classNames({
+                    'weda-formcells__label': true,
+                    // 标题也采用使用weui-cell的样式
+                    'weui-cell': true,
+                }) },
+                React.createElement("label", null, label),
+                requiredFlag ? (React.createElement("label", { className: "weda-formcells__flag" }, "*")) : null)) : null,
+            React.createElement("div", { className: classNames({
+                    'weda-formcells__content': true,
+                    'weui-flex__item': isFlex,
+                }) }, children))));
+}

package/dist/src/web/components/form/input/index.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import './index.css';
+import type { CommonFormPropsType } from '../types';
+export default function Input({ id, className, style, events, label, labelVisible, name, defaultValue, password, placeholder, type, maxLength, disabled, focus: autoFocus, layout, requiredFlag, size, clearable, decorator, }: PropsType): JSX.Element;
+export interface PropsType extends CommonFormPropsType {
+    defaultValue?: string;
+    password?: boolean;
+    placeholder?: string;
+    type?: 'text' | 'number' | 'idcard' | 'digit';
+    maxLength?: number;
+    focus?: boolean;
+    size?: 's' | 'm' | 'l' | 'full';
+    clearable?: boolean;
+}

package/dist/src/web/components/form/input/index.js

@@ -0,0 +1,86 @@
+import * as React from 'react';
+import classNames from '../../../utils/classnames';
+import { usePlatform } from '../../../utils/platform';
+import { Input as TeaInput, ConfigProvider } from 'tea-component';
+import { renderDecorator } from '../renderDecorator';
+import { useSyncValue } from '../../../utils/useSyncValue';
+import './index.css';
+import { emptyObject } from '../../../utils/constant';
+export default function Input({ id, className, style, events = emptyObject, 
+// 组件属性
+label = '标题', labelVisible = true, name = 'formInput', defaultValue = '', password = false, placeholder = '请输入', type = 'text', maxLength = 140, disabled = false, focus: autoFocus = false, layout = 'horizontal', requiredFlag = false, size = 'l', clearable = true, decorator, }) {
+    const platform = usePlatform();
+    const cls = classNames({
+        'weda-ui': true,
+        'weda-input': true,
+        [className]: className,
+    });
+    const subCls = classNames({
+        'weui-cell': true,
+        'weui-cell_active': true,
+        'weui-cell_form': true,
+        'weui-cell_disabled': disabled,
+    });
+    const inputType = getInputType(type, password);
+    // 两次默认值不同时, 需要刷新value
+    const [value, setValue] = useSyncValue(defaultValue);
+    const onChange = function (e) {
+        const text = typeof e === 'string' ? e : e.target.value;
+        if (maxLength > 0 && text.length > maxLength) {
+            return;
+        }
+        const newValue = text;
+        setValue(newValue);
+        events.change({ value: newValue }, { originEvent: e });
+    };
+    const onClear = function (e) {
+        events.clear({ originValue: value }, { originEvent: e });
+        setValue('');
+        e.preventDefault();
+    };
+    const onKeyDown = function (e) {
+        // 确认逻辑
+        if (e.key === 'enter' || e.keyCode === 13) {
+            events.confirm({ value: e.target.value }, { originEvent: e });
+        }
+        // 数字类型的键盘, 不能输入e
+        if (inputType === 'number' && e.key === 'e') {
+            e.preventDefault();
+        }
+    };
+    const onFocus = function (e) {
+        events.focus({ value: e.target.value }, { originEvent: e });
+    };
+    const onBlur = function (e) {
+        events.blur({ value: e.target.value }, { originEvent: e });
+    };
+    const fieldEl = platform === 'h5' ? (React.createElement("div", { className: subCls },
+        React.createElement("div", { className: "weui-cell__bd weui-flex" },
+            React.createElement("input", { className: "weui-input", "data-testid": "weui-input-test", type: inputType, placeholder: placeholder, value: value, disabled: disabled, name: name, autoFocus: autoFocus, onChange: onChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, role: "input" }),
+            clearable && (React.createElement("button", { "data-testid": "weui-btn_input-clear-test", className: "weui-btn_reset weui-btn_icon weui-btn_input-clear", onMouseDown: onClear },
+                React.createElement("i", { className: "weui-icon-clear" })))))) : (React.createElement(ConfigProvider, { classPrefix: "wedatea2td" },
+        React.createElement(TeaInput, { size: size, type: inputType, placeholder: placeholder, value: value, disabled: disabled, name: name, autoFocus: autoFocus, onChange: onChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown })));
+    return renderDecorator(fieldEl, decorator)({
+        id,
+        className: cls,
+        style,
+        label: labelVisible ? label : null,
+        layout,
+        multiCell: false,
+        requiredFlag,
+        size,
+    });
+}
+function getInputType(type, password) {
+    if (password) {
+        return 'password';
+    }
+    switch (type) {
+        case 'idcard':
+            return 'text';
+        case 'digit':
+            return 'number';
+        default:
+            return type;
+    }
+}

package/dist/src/web/components/form/location/common/mapChoose.d.ts

@@ -0,0 +1,15 @@
+export default function MapChoose({ changeLocation, onConfirm, onClose, currentLocations, latlng, isPC, APIKEY, locationRange, customRange, setConfirmStatus, }: {
+    changeLocation: any;
+    onConfirm: any;
+    onClose: any;
+    currentLocations: any;
+    latlng?: {
+        lat: any;
+        lng: any;
+    };
+    isPC: any;
+    APIKEY?: string;
+    locationRange: any;
+    customRange: any;
+    setConfirmStatus: any;
+}): JSX.Element;