@king-design/vue 3.1.4-beta.2 → 3.1.4

package/components/upload/index.vdt.js

@@ -11,37 +11,32 @@ import { Icon } from '../icon';
 import { UploadFileStatus } from './useUpload';
 export default function ($props, $blocks, $__proto__) {
   var _classNameObj, _$cn4;
-
   $blocks || ($blocks = {});
   $props || ($props = {});
   var $this = this;
   var _$blocks = {};
   var __$blocks = {};
-
   var _this$get = this.get(),
-      className = _this$get.className,
-      accept = _this$get.accept,
-      multiple = _this$get.multiple,
-      limit = _this$get.limit,
-      files = _this$get.files,
-      children = _this$get.children,
-      type = _this$get.type,
-      directory = _this$get.directory;
-
+    className = _this$get.className,
+    accept = _this$get.accept,
+    multiple = _this$get.multiple,
+    limit = _this$get.limit,
+    files = _this$get.files,
+    children = _this$get.children,
+    type = _this$get.type,
+    directory = _this$get.directory;
   var drag = this.drag;
   var k = this.config.k;
   var classNameObj = (_classNameObj = {}, _classNameObj[k + "-upload"] = true, _classNameObj[className] = className, _classNameObj[k + "-drag"] = type === 'drag', _classNameObj[k + "-dragover"] = drag.dragOver.value, _classNameObj[k + "-gallery"] = type === 'gallery', _classNameObj[makeStyles(k)] = true, _classNameObj);
   var events = {
     'ev-click': this.selectFile
   };
-
   if (type === 'drag') {
     events['ev-dragover'] = drag.stopEvent;
     events['ev-dragenter'] = drag.onDragEnter;
     events['ev-dragleave'] = drag.onDragLeave;
     events['ev-drop'] = drag.onDrop;
   }
-
   var handle = _$cv('div', _extends({
     'className': _$cn(k + "-upload-handle")
   }, events), (_$blocks['content'] = function ($super) {
@@ -49,11 +44,9 @@ export default function ($props, $blocks, $__proto__) {
       return children;
     }, __$blocks['children'] = function ($super, data) {
       var block = $blocks['children'];
-
       var callBlock = function callBlock() {
         return _$blocks['children'].call($this, $super, data);
       };
-
       return block ? block.call($this, callBlock, data) : callBlock();
     }, __$blocks['children'](_$no)) : type !== 'gallery' ? type === 'select' ? _$cc(Button, {
       'children': [_$cc(Icon, {
@@ -69,16 +62,12 @@ export default function ($props, $blocks, $__proto__) {
     }), _$ce(2, 'div', _$('上传图片'), 0)], 4, _$cn(k + "-upload-picture-card " + k + "-upload-add"));
   }, __$blocks['content'] = function ($super, data) {
     var block = $blocks['content'];
-
     var callBlock = function callBlock() {
       return _$blocks['content'].call($this, $super, data);
     };
-
     return block ? block.call($this, callBlock, data) : callBlock();
   }, __$blocks['content'](_$no)));
-
   var removeFile = this.files.removeFile;
-
   var closeBtn = function closeBtn(value, index) {
     return _$cc(Icon, {
       'className': _$cn(k + "-upload-close " + k + "-icon-delete"),
@@ -88,12 +77,11 @@ export default function ($props, $blocks, $__proto__) {
       'hoverable': true
     });
   };
-
   var _this$showImage = this.showImage,
-      show = _this$showImage.show,
-      close = _this$showImage.close,
-      image = _this$showImage.image,
-      isShow = _this$showImage.isShow;
+    show = _this$showImage.show,
+    close = _this$showImage.close,
+    image = _this$showImage.image,
+    isShow = _this$showImage.isShow;
   return _$cv('div', _extends({
     'className': _$cn(classNameObj)
   }, getRestProps(this)), [_$ce(64, 'input', null, 1, 'c-hidden', {
@@ -107,7 +95,6 @@ export default function ($props, $blocks, $__proto__) {
     'name': 'k-dropdown',
     'children': [_$ma(files, function ($value, $key) {
       var _$cn2;
-
       return _$ce(2, 'div', [_$ce(2, 'img', null, 1, _$cn(k + "-upload-img"), {
         'src': $value.url
       }), _$cc(Transition, {
@@ -130,16 +117,13 @@ export default function ($props, $blocks, $__proto__) {
     return null;
   }, __$blocks['tip'] = function ($super, data) {
     var block = $blocks['tip'];
-
     var callBlock = function callBlock() {
       return _$blocks['tip'].call($this, $super, data);
     };
-
     return block ? block.call($this, callBlock, data) : callBlock();
   }, __$blocks['tip'](_$no)), 0, _$cn(k + "-upload-tip")) : undefined, type !== 'gallery' ? _$ce(2, 'div', _$cc(TransitionGroup, _extends({}, expandAnimationCallbacks, {
     'children': _$ma(files, function ($value, $key) {
       var _$cn3;
-
       return _$ce(2, 'div', [_$ce(2, 'div', [_$ce(2, 'div', [_$cc(Icon, {
         'className': _$cn(k + "-upload-file-icon ion-document")
       }), _$ce(2, 'span', $value.name, 0, _$cn(k + "-upload-file-name")), $value.status === UploadFileStatus.Done ? _$cc(Icon, {

package/components/upload/styles.js

@@ -1,5 +1,4 @@
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-
 import { css } from '@emotion/css';
 import { theme, setDefault } from '../../styles/theme';
 import { deepDefaults } from '../../styles/utils';
@@ -9,13 +8,10 @@ var defaults = {
   get transition() {
     return theme.transition.middle;
   },
-
   fontSize: '12px',
-
   get color() {
     return theme.color.lightBlack;
   },
-
   tip: {
     gap: '8px'
   },
@@ -23,32 +19,25 @@ var defaults = {
   filesGap: '16px',
   file: {
     margin: '4px 0',
-
     get borderRadius() {
       return theme.borderRadius;
     },
-
     get bgColor() {
       return theme.color.bg;
     },
-
     padding: '0 4px',
-
     get height() {
       return theme.default.height;
     },
-
     fileIconGap: '8px',
     status: {
       // width: '16px',
       get color() {
         return theme.color.success;
       },
-
       get errorColor() {
         return theme.color.danger;
       },
-
       offsetRight: '2px'
     },
     delete: {
@@ -56,71 +45,56 @@ var defaults = {
       top: '7px',
       right: '2px'
     },
-
     get errorColor() {
       return theme.color.danger;
     }
-
   },
   // drag
   drag: {
     get border() {
       return "1px dashed " + theme.color.border;
     },
-
     get borderRadius() {
       return theme.borderRadius;
     },
-
     get hoverBorderColor() {
       return theme.color.primary;
     },
-
     get bgColor() {
       return theme.color.bg;
     },
-
     padding: "42px 0",
     icon: {
       fontSize: '40px',
       gap: '16px'
     },
-
     get overBorderColor() {
       return theme.color.primary;
     }
-
   },
   // gallery
   gallery: {
     width: '100px',
     height: '100px',
-
     get borderRadius() {
       return theme.borderRadius;
     },
-
     get border() {
       return "1px solid " + theme.color.border;
     },
-
     margin: '0px 8px 8px 0',
     padding: '8px',
     bgColor: '#fff',
-
     get errorBorderColor() {
       return theme.color.danger;
     },
-
     add: {
       get border() {
         return "1px dashed " + theme.color.border;
       },
-
       get hoverBorderColor() {
         return theme.color.primary;
       }
-
     }
   },
   // overlap
@@ -135,8 +109,8 @@ setDefault(function () {
   upload = deepDefaults(theme, {
     upload: defaults
   }).upload;
-  makeStyles == null ? void 0 : makeStyles.clearCache();
-  makeUploadDialogStyles == null ? void 0 : makeUploadDialogStyles.clearCache();
+  makeStyles == null || makeStyles.clearCache();
+  makeUploadDialogStyles == null || makeUploadDialogStyles.clearCache();
 });
 export var makeStyles = cache(function makeStyles(k) {
   return /*#__PURE__*/css("font-size:", upload.fontSize, ";position:relative;.", k, "-icon-upload{position:relative;top:-1px;}.", k, "-upload-handle{display:inline-block;vertical-align:middle;color:", upload.color, ";}.", k, "-upload-tip{margin-top:", upload.tip.gap, ";color:", upload.color, ";}.", k, "-upload-files{margin-top:", upload.filesGap, ";}.", k, "-upload-file{margin:", upload.file.margin, ";padding-right:", upload.file.delete.width, ";position:relative;&:hover{.", k, "-upload-close{display:inline-flex;position:absolute;right:", upload.file.delete.right, ";top:", upload.file.delete.top, ";}.", k, "-upload-file-main{background:", upload.file.bgColor, ";}}}.", k, "-upload-file-main{padding:", upload.file.padding, ";border-radius:", upload.file.borderRadius, ";}.", k, "-upload-name{display:flex;align-items:center;height:", upload.file.height, ";}.", k, "-upload-file-icon{margin-right:", upload.file.fileIconGap, ";}.", k, "-upload-file-name{flex:1;}.", k, "-upload-status-icon{color:", upload.file.status.color, ";margin-right:", upload.file.status.offsetRight, ";}.", k, "-upload-close{display:none;}.", k, "-upload-file.", k, "-error{color:", upload.file.errorColor, ";.", k, "-upload-status-icon{color:", upload.file.status.errorColor, ";}}.", k, "-upload-progress{.", k, "-progress-text{width:auto!important;}}&.", k, "-drag{.", k, "-upload-handle{display:block;border:", upload.drag.border, ";border-radius:", upload.drag.borderRadius, ";cursor:pointer;text-align:center;transition:border-color ", upload.transition, ";background:", upload.drag.bgColor, ";&:hover{border-color:", upload.drag.hoverBorderColor, ";}}.", k, "-upload-area{padding:", upload.drag.padding, ";.", k, "-icon{display:inline-block;font-size:", upload.drag.icon.fontSize, ";margin-bottom:", upload.drag.icon.gap, ";}}&.", k, "-dragover{.", k, "-upload-handle{border-color:", upload.drag.overBorderColor, ";}}}.", k, "-upload-pictures{display:inline-block;vertical-align:middle;}.", k, "-upload-picture{padding:", upload.gallery.padding, ";position:relative;vertical-align:middle;&.", k, "-error{border-color:", upload.gallery.errorBorderColor, ";}.", k, "-upload-close{display:inline-flex;}&:hover{.", k, "-upload-icons{opacity:1;}}.", k, "-upload-img{display:inline-block;width:100%;height:100%;}.", k, "-upload-icons{opacity:0;transition:opacity ", upload.transition, ";}}.", k, "-upload-picture-card{display:inline-flex;width:", upload.gallery.width, ";height:", upload.gallery.height, ";border-radius:", upload.gallery.borderRadius, ";border:", upload.gallery.border, ";margin:", upload.gallery.margin, ";background:", upload.gallery.bgColor, ";align-items:center;justify-content:center;flex-direction:column;}.", k, "-upload-add{border:", upload.gallery.add.border, ";cursor:pointer;&:hover{border-color:", upload.gallery.add.hoverBorderColor, ";}}.", k, "-upload-overlap{position:absolute;width:100%;height:100%;left:0;top:0;background:", upload.overlap.bgColor, ";display:flex;align-items:center;justify-content:center;gap:", upload.overlap.iconGap, ";color:", upload.overlap.color, ";.", k, "-icon:not(:hover){color:inherit;}.", k, "-upload-progress{position:absolute;width:100%;top:50%;padding:", upload.gallery.padding, ";transform:translateY(-50%);}}");

package/components/upload/useAccept.js

@@ -7,23 +7,19 @@ export function useAccept() {
   var mimeTypes = [];
   var groupTypes = [];
   instance.on('$receive:accept', parseAccept);
-
   function parseAccept(accept) {
     extensions = [];
     mimeTypes = [];
     groupTypes = [];
-
     if (accept) {
       accept.split(',').forEach(function (item) {
         item = _trimInstanceProperty(item).call(item).toLowerCase();
-
         if (item[0] === '.') {
           extensions.push(item.substring(1));
         } else {
           var _item$split = item.split('/'),
-              type = _item$split[0],
-              extension = _item$split[1];
-
+            type = _item$split[0],
+            extension = _item$split[1];
           if (extension === '*') {
             groupTypes.push(type);
           } else {
@@ -33,20 +29,16 @@ export function useAccept() {
       });
     }
   }
-
   function isValidType(type, name) {
     if (_includesInstanceProperty(mimeTypes).call(mimeTypes, type)) return true;
     var index = name.lastIndexOf('.');
     type = type.split('/')[0];
-
     if (index > -1) {
       var extension = name.substring(index + 1).toLowerCase();
       if (_includesInstanceProperty(extensions).call(extensions, extension)) return true;
     }
-
     return _includesInstanceProperty(groupTypes).call(groupTypes, type);
   }
-
   return {
     isValidType: isValidType
   };

package/components/upload/useDrag.js

@@ -4,37 +4,30 @@ export function useDrag(addFiles) {
   var instance = useInstance();
   var dragOver = useState(false);
   var counter = 0;
-
   function onDragEnter(e) {
     e.preventDefault();
     counter++;
     if (dragOver.value || instance.get('disabled')) return;
     dragOver.set(true);
   }
-
   function onDragLeave(e) {
     counter--;
-
     if (!counter) {
       dragOver.set(false);
     }
   }
-
   function onDrop(e) {
     stopEvent(e);
     counter = 0;
-
     if (!instance.get('disabled')) {
       dragOver.set(false);
       addFiles(e.dataTransfer.files);
     }
   }
-
   function stopEvent(e) {
     e.stopPropagation();
     e.preventDefault();
   }
-
   return {
     onDragEnter: onDragEnter,
     onDragLeave: onDragLeave,

package/components/upload/useFiles.js

@@ -14,204 +14,159 @@ var uid = 0;
 export function useFiles(isValidType, upload) {
   var instance = useInstance();
   initFiles();
-
   function initFiles() {
     var _instance$get = instance.get(),
-        files = _instance$get.files,
-        defaultFiles = _instance$get.defaultFiles;
-
+      files = _instance$get.files,
+      defaultFiles = _instance$get.defaultFiles;
     var _files = _sliceInstanceProperty(files).call(files, 0);
-
     if (defaultFiles) {
       if (process.env.NODE_ENV !== 'production') {
         console.warn("'defaultFiles' is deprecated, use 'files' instead for reactive updating.");
       }
-
       defaultFiles.forEach(function (file) {
         _files.push(normalizeFile(file));
       });
       instance.set('files', _files);
     }
   }
-
   instance.on("$receive:files", function (files, oldFiles) {
     if (!files || isEqualArray(files, oldFiles)) return;
     instance.set('files', _mapInstanceProperty(files).call(files, normalizeFile));
   });
-
   function addFiles(_x) {
     return _addFiles.apply(this, arguments);
   }
-
   function _addFiles() {
     _addFiles = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(fileList) {
       var _context;
-
       var files, newFiles, _instance$get2, maxSize, limit, autoUpload, accept, error, status, i, file, _error, _error2, obj;
-
       return _regeneratorRuntime.wrap(function _callee$(_context2) {
-        while (1) {
-          switch (_context2.prev = _context2.next) {
-            case 0:
-              files = _sliceInstanceProperty(_context = instance.get('files')).call(_context, 0);
-              newFiles = _Array$from(fileList);
-              _instance$get2 = instance.get(), maxSize = _instance$get2.maxSize, limit = _instance$get2.limit, autoUpload = _instance$get2.autoUpload, accept = _instance$get2.accept;
-
-              if (!(limit && files.length + newFiles.length > limit)) {
-                _context2.next = 6;
-                break;
-              }
-
-              error = new Error(_$('超出文件数量最大限制：{limit}', {
-                limit: limit
-              }));
-              return _context2.abrupt("return", instance.trigger('error', error, newFiles, files));
-
-            case 6:
-              status = autoUpload ? UploadFileStatus.Ready : UploadFileStatus.NotReady;
-              i = 0;
-
-            case 8:
-              if (!(i < newFiles.length)) {
-                _context2.next = 30;
-                break;
-              }
-
-              file = newFiles[i];
-
-              if (!(maxSize && file.size > maxSize * 1024)) {
-                _context2.next = 14;
-                break;
-              }
-
-              _error = new Error(_$('"{name}" 超出文件最大限制：{maxSize}kb', {
-                name: file.name,
-                maxSize: maxSize
-              }));
-              instance.trigger('error', _error, file, files);
-              return _context2.abrupt("continue", 27);
-
-            case 14:
-              if (!(accept && file.type && !isValidType(file.type, file.name))) {
-                _context2.next = 18;
-                break;
-              }
-
-              _error2 = new Error(_$('"{name}" 文件类型不合法', {
-                name: file.name
-              }));
-              instance.trigger('error', _error2, file, files);
-              return _context2.abrupt("continue", 27);
-
-            case 18:
-              obj = {
-                status: status,
-                name: file.name,
-                type: file.type,
-                size: file.size,
-                percent: 0,
-                uid: uid++,
-                raw: file
-              };
-
-              if (_URL && _URL.createObjectURL) {
-                obj.url = _URL.createObjectURL(file);
-              }
-
-              _context2.t0 = !autoUpload;
-
-              if (_context2.t0) {
-                _context2.next = 25;
-                break;
-              }
-
-              _context2.next = 24;
-              return upload(obj);
-
-            case 24:
-              _context2.t0 = _context2.sent;
-
-            case 25:
-              if (!_context2.t0) {
-                _context2.next = 27;
-                break;
-              }
-
-              files.push(obj);
-
-            case 27:
-              i++;
-              _context2.next = 8;
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            files = _sliceInstanceProperty(_context = instance.get('files')).call(_context, 0);
+            newFiles = _Array$from(fileList);
+            _instance$get2 = instance.get(), maxSize = _instance$get2.maxSize, limit = _instance$get2.limit, autoUpload = _instance$get2.autoUpload, accept = _instance$get2.accept;
+            if (!(limit && files.length + newFiles.length > limit)) {
+              _context2.next = 6;
               break;
-
-            case 30:
-              instance.set('files', files);
-
-            case 31:
-            case "end":
-              return _context2.stop();
-          }
+            }
+            error = new Error(_$('超出文件数量最大限制：{limit}', {
+              limit: limit
+            }));
+            return _context2.abrupt("return", instance.trigger('error', error, newFiles, files));
+          case 6:
+            status = autoUpload ? UploadFileStatus.Ready : UploadFileStatus.NotReady;
+            i = 0;
+          case 8:
+            if (!(i < newFiles.length)) {
+              _context2.next = 30;
+              break;
+            }
+            file = newFiles[i];
+            if (!(maxSize && file.size > maxSize * 1024)) {
+              _context2.next = 14;
+              break;
+            }
+            _error = new Error(_$('"{name}" 超出文件最大限制：{maxSize}kb', {
+              name: file.name,
+              maxSize: maxSize
+            }));
+            instance.trigger('error', _error, file, files);
+            return _context2.abrupt("continue", 27);
+          case 14:
+            if (!(accept && file.type && !isValidType(file.type, file.name))) {
+              _context2.next = 18;
+              break;
+            }
+            _error2 = new Error(_$('"{name}" 文件类型不合法', {
+              name: file.name
+            }));
+            instance.trigger('error', _error2, file, files);
+            return _context2.abrupt("continue", 27);
+          case 18:
+            obj = {
+              status: status,
+              name: file.name,
+              type: file.type,
+              size: file.size,
+              percent: 0,
+              uid: uid++,
+              raw: file
+            };
+            if (_URL && _URL.createObjectURL) {
+              obj.url = _URL.createObjectURL(file);
+            }
+            _context2.t0 = !autoUpload;
+            if (_context2.t0) {
+              _context2.next = 25;
+              break;
+            }
+            _context2.next = 24;
+            return upload(obj);
+          case 24:
+            _context2.t0 = _context2.sent;
+          case 25:
+            if (!_context2.t0) {
+              _context2.next = 27;
+              break;
+            }
+            files.push(obj);
+          case 27:
+            i++;
+            _context2.next = 8;
+            break;
+          case 30:
+            instance.set('files', files);
+          case 31:
+          case "end":
+            return _context2.stop();
         }
       }, _callee);
     }));
     return _addFiles.apply(this, arguments);
   }
-
   function removeFile(_x2, _x3) {
     return _removeFile.apply(this, arguments);
   }
-
   function _removeFile() {
     _removeFile = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(file, index) {
       var _context3;
-
       var beforeRemove, files, shouldRemove;
       return _regeneratorRuntime.wrap(function _callee2$(_context4) {
-        while (1) {
-          switch (_context4.prev = _context4.next) {
-            case 0:
-              beforeRemove = instance.get('beforeRemove');
-              files = _sliceInstanceProperty(_context3 = instance.get('files')).call(_context3, 0);
-              shouldRemove = true;
-
-              if (!beforeRemove) {
-                _context4.next = 7;
-                break;
-              }
-
-              _context4.next = 6;
-              return beforeRemove(file, files);
-
-            case 6:
-              shouldRemove = _context4.sent;
-
-            case 7:
-              if (shouldRemove) {
-                _spliceInstanceProperty(files).call(files, index, 1);
-
-                if (file.status === UploadFileStatus.Uploading) {
-                  file.request.abort();
-                }
-
-                instance.set('files', files);
+        while (1) switch (_context4.prev = _context4.next) {
+          case 0:
+            beforeRemove = instance.get('beforeRemove');
+            files = _sliceInstanceProperty(_context3 = instance.get('files')).call(_context3, 0);
+            shouldRemove = true;
+            if (!beforeRemove) {
+              _context4.next = 7;
+              break;
+            }
+            _context4.next = 6;
+            return beforeRemove(file, files);
+          case 6:
+            shouldRemove = _context4.sent;
+          case 7:
+            if (shouldRemove) {
+              _spliceInstanceProperty(files).call(files, index, 1);
+              if (file.status === UploadFileStatus.Uploading) {
+                file.request.abort();
               }
-
-            case 8:
-            case "end":
-              return _context4.stop();
-          }
+              instance.set('files', files);
+            }
+          case 8:
+          case "end":
+            return _context4.stop();
         }
       }, _callee2);
     }));
     return _removeFile.apply(this, arguments);
   }
-
   return {
     addFiles: addFiles,
     removeFile: removeFile
   };
 }
-
 function normalizeFile(file) {
   return _extends({
     status: UploadFileStatus.Done,

package/components/upload/useShowImage.js

@@ -4,16 +4,13 @@ export function useShowImage() {
   var instance = useInstance();
   var isShow = useState(false);
   var image = useState(null);
-
   function show(file) {
     isShow.set(true);
     image.set(file);
   }
-
   function close() {
     isShow.set(false);
   }
-
   return {
     show: show,
     close: close,