@cloudbase/weda-ui 3.28.0 → 3.29.0

package/dist/web/components/form/uploaderFile/index.css

@@ -85,7 +85,7 @@
   align-items: center;
 }
 
-.weda-upload-file-pc .weda-upload-file-pc__btn-descripe {
+.weda-upload-file-pc .weda-upload-file-pc__btn-describe {
   line-height: 20px;
   color: var(--wd-color-text-placeholder, rgba(0, 0, 0, 0.4));
   font-size: var(--wd-font-size-2, 0.75em);
@@ -150,6 +150,7 @@
 .weda-upload-file-pc .weda-upload-file-pc--item .weda-upload-file-pc--item-action {
   width: 160px;
   padding: 10px 12px;
+  border-right: 0;
 }
 
 .weda-upload-file-pc .weda-upload-file-pc__btn--weak {
@@ -376,3 +377,12 @@
   width: 92px;
   height: 32px;
 }
+.weda-upload-file-pc .wedatea2td-form-upload-drag {
+  width: 100%;
+}
+.weda-upload-file-pc .wedatea2td-form-upload-drag .wedatea2td-form-upload__inner {
+  width: 100%;
+}
+.weda-upload-file-pc .wedatea2td-form-upload-drag .wedatea2td-form-upload__inner {
+  min-height: 210px;
+}

package/dist/web/components/form/uploaderFile/uploadFile.pc.d.ts

@@ -7,7 +7,7 @@ import type { DataType } from '../../../../configs/components/wd-upload-file';
  */
 export declare function UploadFilePc({ layout, id, style, labelVisible, label, requiredFlag, disabled, className, events, decorator, tips, btnTitle, uploadTipText, maxUploadCount, maxSize, single, defaultValue, // 组件默认初始化值
 value, // 用于模型组件中 formily 的值管理
-acceptTypes, downloadVisible, deleteVisible, uploadPath, onChange, isEdit, $node, readOnly, callbacks, storageType, }: IUploaderFilePc): JSX.Element;
+acceptTypes, downloadVisible, deleteVisible, uploadPath, onChange, isEdit, $node, readOnly, callbacks, storageType, draggable, }: IUploaderFilePc): JSX.Element;
 export interface IUploaderFilePc extends CommonFormPropsType {
     btnTitle?: string;
     maxUploadCount?: number;
@@ -26,6 +26,7 @@ export interface IUploaderFilePc extends CommonFormPropsType {
     callbacks?: DataType['callbacks'];
     uploadTipText?: string;
     storageType?: DataType['storageType'];
+    draggable?: DataType['draggable'];
 }
 export interface IUploadFileAction {
     status?: string;

package/dist/web/components/form/uploaderFile/uploadFile.pc.js

@@ -1,6 +1,6 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
-import { Upload, ConfigProvider, Icon, List } from 'tea-component';
+import { Upload, ConfigProvider, Icon, List, Text, Status } from 'tea-component';
 import { WdButton } from '../../wd-button';
 import { WdText } from '../../wd-text';
 import { useTranslation } from '../../../utils/i18n/translation';
@@ -36,7 +36,7 @@ layout, id = '', style, labelVisible = true, label, requiredFlag = false, disabl
 // 组件属性
 decorator, tips = '', btnTitle, uploadTipText, maxUploadCount = 9, maxSize = 1024, single = true, defaultValue = emptyArray, // 组件默认初始化值
 value = emptyArray, // 用于模型组件中 formily 的值管理
-acceptTypes = emptyArray, downloadVisible = true, deleteVisible = true, uploadPath = 'weda-uploader', onChange = null, isEdit = true, $node, readOnly, callbacks, storageType = 'cloudID', }) {
+acceptTypes = emptyArray, downloadVisible = true, deleteVisible = true, uploadPath = 'weda-uploader', onChange = null, isEdit = true, $node, readOnly, callbacks, storageType = 'cloudID', draggable = false, }) {
     var _a;
     const t = useTranslation();
     const _storageTypeIsHttps = storageTypeIsHttps(storageType);
@@ -44,6 +44,8 @@ acceptTypes = emptyArray, downloadVisible = true, deleteVisible = true, uploadPa
     const uploadFileLabel = label || t.uploadFile;
     const uploadBtnTitle = btnTitle || t.clickToUpload;
     const uploadSupportText = uploadTipText || t.supportBatchUpload;
+    const draggableText = t.draggableText;
+    // const [showFileList, setShowFileList] = React.useState(!draggable);
     const [fileIDList, setfileIDList] = React.useState(() => {
         let defaultVal = defaultValue;
         let val = value;
@@ -202,6 +204,8 @@ acceptTypes = emptyArray, downloadVisible = true, deleteVisible = true, uploadPa
             disabled ||
             readOnly);
     }, [disabled, fileIDList.length, fileList, maxUploadCount, single, readOnly]);
+    // 是否显示文件列表
+    const showFileList = (((fileList === null || fileList === void 0 ? void 0 : fileList.length) || (fileIDList === null || fileIDList === void 0 ? void 0 : fileIDList.length)) && draggable) || !draggable;
     return renderDecorator(_jsx(ConfigProvider, { classPrefix: "wedatea2td", children: _jsx(FileContext.Provider, { value: {
                 uploadPath,
                 downloadVisible,
@@ -210,7 +214,7 @@ acceptTypes = emptyArray, downloadVisible = true, deleteVisible = true, uploadPa
                 isEdit,
                 events,
                 fileSizeObj,
-            }, "data-testid": "button-up", children: _jsxs("div", { className: `${CLASS_PREFIX} ${readOnly ? `${CLASS_PREFIX}__readOnly` : ''}`, "data-testid": "UploadFilePc", children: [isEdit && (_jsx("div", { className: `${CLASS_PREFIX}__input-box`, children: btnDisabled ? (readOnly ? null : (_jsx(WdButton, { disabled: true, text: btnTitle, theme: "secondary", variant: "outline" }))) : (_jsxs(Upload, { ...uploadProps, beforeUpload: handleBefore, "data-testid": "Upload", children: [_jsx(WdButton, { className: `${CLASS_PREFIX}__btn--weak`, text: uploadBtnTitle, theme: "secondary", variant: "outline" }), !single && _jsx(WdText, { text: uploadSupportText, className: `${CLASS_PREFIX}__btn-descripe` })] })) })), _jsxs(List, { split: "divide", children: [_jsx(List.Item, { children: _jsxs("div", { className: `${CLASS_PREFIX}--item ${CLASS_PREFIX}--item-header`, children: [_jsx("div", { className: `${CLASS_PREFIX}--item-title ${CLASS_PREFIX}--item-label`, children: t.fileName }), formType !== 'read' && (_jsx("div", { className: `${CLASS_PREFIX}--item-size ${CLASS_PREFIX}--item-label`, children: t.fileSize })), _jsx("div", { className: `${CLASS_PREFIX}--item-status ${CLASS_PREFIX}--item-label`, children: t.fileStatus }), _jsx("div", { className: `${CLASS_PREFIX}--item-action ${CLASS_PREFIX}--item-label`, children: t.fileOperation })] }) }), fileIDList.map((d) => (_jsx(List.Item, { children: _jsx(TcbFileEcho, { disabled: disabled, fileID: d, formType: formType }) }, d))), fileList.map((item) => (_jsx(List.Item, { children: _jsx(TcbFileUpload, { disabled: disabled, file: item, formType: formType, id: id }) }, item === null || item === void 0 ? void 0 : item._uuid))), !readOnly && isEdit && fileIDList.length === 0 && fileList.length === 0 && (_jsx(List.Item, { className: `${CLASS_PREFIX}--item-empty`, children: _jsxs("div", { className: `${CLASS_PREFIX}--item`, children: [t.clickTopBtn.replace('{btn}', uploadBtnTitle), " "] }) }))] })] }) }) }), decorator)({
+            }, "data-testid": "button-up", children: _jsxs("div", { className: `${CLASS_PREFIX} ${readOnly ? `${CLASS_PREFIX}__readOnly` : ''}`, "data-testid": "UploadFilePc", children: [isEdit && (_jsx("div", { className: `${CLASS_PREFIX}__input-box`, children: btnDisabled ? (readOnly ? null : (_jsx(WdButton, { disabled: true, text: btnTitle, theme: "secondary", variant: "outline" }))) : draggable ? (_jsx(Upload, { ...uploadProps, beforeUpload: handleBefore, "data-testid": "Upload", children: ({ open, isDragging }) => (_jsx(Upload.Dragger, { children: isDragging ? ('释放鼠标') : (_jsx(Status, { className: "upload-file", icon: 'blank', size: 's', operation: _jsxs(_Fragment, { children: [_jsx("a", { onClick: open, children: uploadBtnTitle }), " / ", _jsx(Text, { theme: "weak", children: draggableText })] }) })) })) })) : (_jsxs(_Fragment, { children: [_jsx(Upload, { ...uploadProps, beforeUpload: handleBefore, "data-testid": "Upload", children: _jsx(WdButton, { className: `${CLASS_PREFIX}__btn--weak`, text: uploadBtnTitle, theme: "secondary", variant: "outline" }) }), !single && _jsx(WdText, { text: uploadSupportText, className: `${CLASS_PREFIX}__btn-describe` })] })) })), _jsxs(List, { split: "divide", style: { display: showFileList ? 'block' : 'none' }, children: [_jsx(List.Item, { children: _jsxs("div", { className: `${CLASS_PREFIX}--item ${CLASS_PREFIX}--item-header`, children: [_jsx("div", { className: `${CLASS_PREFIX}--item-title ${CLASS_PREFIX}--item-label`, children: t.fileName }), formType !== 'read' && (_jsx("div", { className: `${CLASS_PREFIX}--item-size ${CLASS_PREFIX}--item-label`, children: t.fileSize })), _jsx("div", { className: `${CLASS_PREFIX}--item-status ${CLASS_PREFIX}--item-label`, children: t.fileStatus }), _jsx("div", { className: `${CLASS_PREFIX}--item-action ${CLASS_PREFIX}--item-label`, children: t.fileOperation })] }) }), fileIDList.map((d) => (_jsx(List.Item, { children: _jsx(TcbFileEcho, { disabled: disabled, fileID: d, formType: formType }) }, d))), fileList.map((item) => (_jsx(List.Item, { children: _jsx(TcbFileUpload, { disabled: disabled, file: item, formType: formType, id: id }) }, item === null || item === void 0 ? void 0 : item._uuid))), !readOnly && isEdit && fileIDList.length === 0 && fileList.length === 0 && (_jsx(List.Item, { className: `${CLASS_PREFIX}--item-empty`, children: _jsxs("div", { className: `${CLASS_PREFIX}--item`, children: [t.clickTopBtn.replace('{btn}', uploadBtnTitle), " "] }) }))] })] }) }) }), decorator)({
         id,
         className: cls,
         style,

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

@@ -4,7 +4,6 @@ import { UploadFilePc } from '../form/uploaderFile/uploadFile.pc';
 import { UploadFileH5 } from '../form/uploaderFile/uploadFile.h5';
 import { filterStrList, isCloudFileID, isHttpFileID, downloadFile, usePlatform, transFileCloudidToName, } from '../../utils/platform';
 import { useTempUrl } from '../../utils/hooks/use-cloud-id-temp-url';
-import { useTranslation } from '../../utils/i18n/translation';
 import './style';
 const CLASS_PREFIX = 'weda-uploader-file-view';
 /**
@@ -14,7 +13,6 @@ export default function UploaderFileView(props) {
     const { value, className, single = true, // 展示为单行 a 标签
     showType, // 展示端为 pc 还是 h5 样式
     ...rest } = props;
-    const t = useTranslation();
     const platform = usePlatform();
     const fileIDList = filterStrList(value);
     if (single) {

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

@@ -13,7 +13,7 @@ import './style';
  * 文件上传-标准化
  */
 export const WdUploadFile = forwardRef(function WdUploadFile(props, ref) {
-    const { classRoot = 'upload-file', acceptTypes: _acceptTypes = X_RUNTIME_DEFAULT._acceptTypesInFile, maxSize = X_RUNTIME_DEFAULT.maxSize, single = X_RUNTIME_DEFAULT.single, maxUploadCount = X_RUNTIME_DEFAULT.maxUploadCount, events = emptyObject, deleteVisible = X_RUNTIME_DEFAULT.deleteVisible, downloadVisible = X_RUNTIME_DEFAULT.downloadVisible, callbacks, uploadButtonText: _uploadButtonText, uploadTipText: _uploadTipText, storageType = 'cloudID', } = props;
+    const { classRoot = 'upload-file', acceptTypes: _acceptTypes = X_RUNTIME_DEFAULT._acceptTypesInFile, maxSize = X_RUNTIME_DEFAULT.maxSize, single = X_RUNTIME_DEFAULT.single, maxUploadCount = X_RUNTIME_DEFAULT.maxUploadCount, events = emptyObject, deleteVisible = X_RUNTIME_DEFAULT.deleteVisible, downloadVisible = X_RUNTIME_DEFAULT.downloadVisible, callbacks, uploadButtonText: _uploadButtonText, uploadTipText: _uploadTipText, storageType = 'cloudID', draggable = X_RUNTIME_DEFAULT.draggable, } = props;
     const t = useTranslation();
     const uploadButtonText = _uploadButtonText !== null && _uploadButtonText !== void 0 ? _uploadButtonText : t.clickToUpload;
     const uploadTipText = _uploadTipText !== null && _uploadTipText !== void 0 ? _uploadTipText : t.supportBatchUpload;
@@ -38,5 +38,5 @@ export const WdUploadFile = forwardRef(function WdUploadFile(props, ref) {
     };
     if (!visible)
         return null;
-    return (_jsx(WdFormItem, { ...formItemProps, children: _jsx(UploaderFile, { btnTitle: uploadButtonText, uploadTipText: uploadTipText, events: events, labelVisible: false, acceptTypes: acceptTypes, defaultValue: value, deleteVisible: deleteVisible, downloadVisible: downloadVisible, maxSize: maxSize, maxUploadCount: maxUploadCount, single: single, readOnly: readOnly, disabled: disabled, decorator: null, onChange: onChange, callbacks: callbacks, storageType: storageType }) }));
+    return (_jsx(WdFormItem, { ...formItemProps, children: _jsx(UploaderFile, { btnTitle: uploadButtonText, uploadTipText: uploadTipText, events: events, labelVisible: false, acceptTypes: acceptTypes, defaultValue: value, deleteVisible: deleteVisible, downloadVisible: downloadVisible, maxSize: maxSize, maxUploadCount: maxUploadCount, single: single, readOnly: readOnly, disabled: disabled, decorator: null, onChange: onChange, callbacks: callbacks, storageType: storageType, draggable: draggable }) }));
 });

package/dist/web/utils/i18n/locale/en_US.d.ts

@@ -115,5 +115,6 @@ declare const _default: {
     noRelated: string;
     noSelectable: string;
     uploadImage: string;
+    draggableText: string;
 };
 export default _default;

package/dist/web/utils/i18n/locale/en_US.js

@@ -184,4 +184,5 @@ export default {
     noSelectable: ('None Available'),
     // UploaderPC component
     uploadImage: ('Upload Image'),
+    draggableText: ('drag and drop to this area')
 };

package/dist/web/utils/i18n/locale/zh_CN.d.ts

@@ -116,5 +116,6 @@ declare const _default: {
     noRelated: string;
     noSelectable: string;
     uploadImage: string;
+    draggableText: string;
 };
 export default _default;

package/dist/web/utils/i18n/locale/zh_CN.js

@@ -185,4 +185,5 @@ export default {
     noSelectable: ('无可选'),
     // UploaderPC组件
     uploadImage: ('上传图片'),
+    draggableText: ('拖拽到此区域')
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudbase/weda-ui",
-  "version": "3.28.0",
+  "version": "3.29.0",
   "main": "./dist/index.js",
   "module": "./dist/index",
   "miniprogram": "mpdist",