vant 4.0.0-alpha.3 → 4.0.0-beta.1

package/es/uploader/UploaderPreviewItem.js

@@ -1,125 +0,0 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from "vue";
-import { t, bem, isImageFile } from "./utils";
-import { isDef, extend, numericProp, getSizeStyle, callInterceptor, makeRequiredProp } from "../utils";
-import { Icon } from "../icon";
-import { Image } from "../image";
-import { Loading } from "../loading";
-var stdin_default = defineComponent({
-  props: {
-    name: numericProp,
-    item: makeRequiredProp(Object),
-    index: Number,
-    imageFit: String,
-    lazyLoad: Boolean,
-    deletable: Boolean,
-    previewSize: [Number, String, Array],
-    beforeDelete: Function
-  },
-  emits: ["delete", "preview"],
-  setup(props, {
-    emit,
-    slots
-  }) {
-    const renderMask = () => {
-      const {
-        status,
-        message
-      } = props.item;
-      if (status === "uploading" || status === "failed") {
-        const MaskIcon = status === "failed" ? _createVNode(Icon, {
-          "name": "close",
-          "class": bem("mask-icon")
-        }, null) : _createVNode(Loading, {
-          "class": bem("loading")
-        }, null);
-        const showMessage = isDef(message) && message !== "";
-        return _createVNode("div", {
-          "class": bem("mask")
-        }, [MaskIcon, showMessage && _createVNode("div", {
-          "class": bem("mask-message")
-        }, [message])]);
-      }
-    };
-    const onDelete = (event) => {
-      const {
-        name,
-        item,
-        index,
-        beforeDelete
-      } = props;
-      event.stopPropagation();
-      callInterceptor(beforeDelete, {
-        args: [item, {
-          name,
-          index
-        }],
-        done: () => emit("delete")
-      });
-    };
-    const onPreview = () => emit("preview");
-    const renderDeleteIcon = () => {
-      if (props.deletable && props.item.status !== "uploading") {
-        return _createVNode("div", {
-          "role": "button",
-          "class": bem("preview-delete"),
-          "tabindex": 0,
-          "aria-label": t("delete"),
-          "onClick": onDelete
-        }, [_createVNode(Icon, {
-          "name": "cross",
-          "class": bem("preview-delete-icon")
-        }, null)]);
-      }
-    };
-    const renderCover = () => {
-      if (slots["preview-cover"]) {
-        const {
-          index,
-          item
-        } = props;
-        return _createVNode("div", {
-          "class": bem("preview-cover")
-        }, [slots["preview-cover"](extend({
-          index
-        }, item))]);
-      }
-    };
-    const renderPreview = () => {
-      const {
-        item,
-        lazyLoad,
-        imageFit,
-        previewSize
-      } = props;
-      if (isImageFile(item)) {
-        return _createVNode(Image, {
-          "fit": imageFit,
-          "src": item.content || item.url,
-          "class": bem("preview-image"),
-          "width": Array.isArray(previewSize) ? previewSize[0] : previewSize,
-          "height": Array.isArray(previewSize) ? previewSize[1] : previewSize,
-          "lazyLoad": lazyLoad,
-          "onClick": onPreview
-        }, {
-          default: renderCover
-        });
-      }
-      return _createVNode("div", {
-        "class": bem("file"),
-        "style": getSizeStyle(props.previewSize)
-      }, [_createVNode(Icon, {
-        "class": bem("file-icon"),
-        "name": "description"
-      }, null), _createVNode("div", {
-        "class": [bem("file-name"), "van-ellipsis"]
-      }, [item.file ? item.file.name : item.url]), renderCover()]);
-    };
-    return () => _createVNode("div", {
-      "class": bem("preview")
-    }, [renderPreview(), renderMask(), renderDeleteIcon()]);
-  }
-});
-export {
-  stdin_default as default
-};

package/es/uploader/index.js

@@ -1,8 +0,0 @@
-import { withInstall } from "../utils";
-import _Uploader from "./Uploader";
-const Uploader = withInstall(_Uploader);
-var stdin_default = Uploader;
-export {
-  Uploader,
-  stdin_default as default
-};

package/es/uploader/index.less

@@ -1,188 +0,0 @@
-body {
-  --van-uploader-size: 80px;
-  --van-uploader-icon-size: 24px;
-  --van-uploader-icon-color: var(--van-gray-4);
-  --van-uploader-text-color: var(--van-text-color-2);
-  --van-uploader-text-font-size: var(--van-font-size-sm);
-  --van-uploader-upload-background: var(--van-gray-1);
-  --van-uploader-upload-active-color: var(--van-active-color);
-  --van-uploader-delete-color: var(--van-white);
-  --van-uploader-delete-icon-size: 14px;
-  --van-uploader-delete-background: rgba(0, 0, 0, 0.7);
-  --van-uploader-file-background: var(--van-background);
-  --van-uploader-file-icon-size: 20px;
-  --van-uploader-file-icon-color: var(--van-gray-7);
-  --van-uploader-file-name-padding: 0 var(--van-padding-base);
-  --van-uploader-file-name-margin-top: var(--van-padding-xs);
-  --van-uploader-file-name-font-size: var(--van-font-size-sm);
-  --van-uploader-file-name-text-color: var(--van-gray-7);
-  --van-uploader-mask-text-color: var(--van-white);
-  --van-uploader-mask-background: rgba(50, 50, 51, 0.88);
-  --van-uploader-mask-icon-size: 22px;
-  --van-uploader-mask-message-font-size: var(--van-font-size-sm);
-  --van-uploader-mask-message-line-height: var(--van-line-height-xs);
-  --van-uploader-loading-icon-size: 22px;
-  --van-uploader-loading-icon-color: var(--van-white);
-  --van-uploader-disabled-opacity: var(--van-disabled-opacity);
-}
-
-.van-uploader {
-  position: relative;
-  display: inline-block;
-
-  &__wrapper {
-    display: flex;
-    flex-wrap: wrap;
-
-    &--disabled {
-      opacity: var(--van-uploader-disabled-opacity);
-    }
-  }
-
-  &__input {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    overflow: hidden; // to clip file-upload-button
-    cursor: pointer;
-    opacity: 0;
-
-    &-wrapper {
-      position: relative;
-    }
-
-    &:disabled {
-      cursor: not-allowed;
-    }
-  }
-
-  &__upload {
-    position: relative;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    box-sizing: border-box;
-    width: var(--van-uploader-size);
-    height: var(--van-uploader-size);
-    margin: 0 var(--van-padding-xs) var(--van-padding-xs) 0;
-    background: var(--van-uploader-upload-background);
-
-    &:active {
-      background-color: var(--van-uploader-upload-active-color);
-    }
-
-    &--readonly:active {
-      background-color: var(--van-uploader-upload-background);
-    }
-
-    &-icon {
-      color: var(--van-uploader-icon-color);
-      font-size: var(--van-uploader-icon-size);
-    }
-
-    &-text {
-      margin-top: var(--van-padding-xs);
-      color: var(--van-uploader-text-color);
-      font-size: var(--van-uploader-text-font-size);
-    }
-  }
-
-  &__preview {
-    position: relative;
-    margin: 0 var(--van-padding-xs) var(--van-padding-xs) 0;
-    cursor: pointer;
-
-    &-image {
-      display: block;
-      width: var(--van-uploader-size);
-      height: var(--van-uploader-size);
-      overflow: hidden;
-    }
-
-    &-delete {
-      position: absolute;
-      top: 0;
-      right: 0;
-      width: var(--van-uploader-delete-icon-size);
-      height: var(--van-uploader-delete-icon-size);
-      background: var(--van-uploader-delete-background);
-      border-radius: 0 0 0 12px;
-
-      &-icon {
-        position: absolute;
-        top: 0;
-        right: 0;
-        color: var(--van-uploader-delete-color);
-        font-size: var(--van-uploader-delete-icon-size);
-        transform: scale(0.7) translate(10%, -10%);
-      }
-    }
-
-    &-cover {
-      position: absolute;
-      top: 0;
-      right: 0;
-      bottom: 0;
-      left: 0;
-    }
-  }
-
-  &__mask {
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    color: var(--van-uploader-mask-text-color);
-    background: var(--van-uploader-mask-background);
-
-    &-icon {
-      font-size: var(--van-uploader-mask-icon-size);
-    }
-
-    &-message {
-      margin-top: 6px;
-      padding: 0 var(--van-padding-base);
-      font-size: var(--van-uploader-mask-message-font-size);
-      line-height: var(--van-uploader-mask-message-line-height);
-    }
-  }
-
-  &__loading {
-    width: var(--van-uploader-loading-icon-size);
-    height: var(--van-uploader-loading-icon-size);
-    color: var(--van-uploader-loading-icon-color);
-  }
-
-  &__file {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    width: var(--van-uploader-size);
-    height: var(--van-uploader-size);
-    background: var(--van-uploader-file-background);
-
-    &-icon {
-      color: var(--van-uploader-file-icon-color);
-      font-size: var(--van-uploader-file-icon-size);
-    }
-
-    &-name {
-      box-sizing: border-box;
-      width: 100%;
-      margin-top: var(--van-uploader-file-name-margin-top);
-      padding: var(--van-uploader-file-name-padding);
-      color: var(--van-uploader-file-name-text-color);
-      font-size: var(--van-uploader-file-name-font-size);
-      text-align: center;
-    }
-  }
-}

package/es/uploader/style/less.d.ts

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

package/es/uploader/style/less.js

@@ -1,11 +0,0 @@
-import "../../style/base.less";
-import "../../badge/index.less";
-import "../../icon/index.less";
-import "../../image/index.less";
-import "../../loading/index.less";
-import "../../overlay/index.less";
-import "../../popup/index.less";
-import "../../swipe/index.less";
-import "../../swipe-item/index.less";
-import "../../image-preview/index.less";
-import "../index.less";

package/es/uploader/utils.js

@@ -1,69 +0,0 @@
-import { toArray, createNamespace, isFunction } from "../utils";
-const [name, bem, t] = createNamespace("uploader");
-function readFileContent(file, resultType) {
-  return new Promise((resolve) => {
-    if (resultType === "file") {
-      resolve();
-      return;
-    }
-    const reader = new FileReader();
-    reader.onload = (event) => {
-      resolve(event.target.result);
-    };
-    if (resultType === "dataUrl") {
-      reader.readAsDataURL(file);
-    } else if (resultType === "text") {
-      reader.readAsText(file);
-    }
-  });
-}
-function isOversize(items, maxSize) {
-  return toArray(items).some((item) => {
-    if (item.file) {
-      if (isFunction(maxSize)) {
-        return maxSize(item.file);
-      }
-      return item.file.size > maxSize;
-    }
-    return false;
-  });
-}
-function filterFiles(items, maxSize) {
-  const valid = [];
-  const invalid = [];
-  items.forEach((item) => {
-    if (isOversize(item, maxSize)) {
-      invalid.push(item);
-    } else {
-      valid.push(item);
-    }
-  });
-  return { valid, invalid };
-}
-const IMAGE_REGEXP = /\.(jpeg|jpg|gif|png|svg|webp|jfif|bmp|dpg)/i;
-const isImageUrl = (url) => IMAGE_REGEXP.test(url);
-function isImageFile(item) {
-  if (item.isImage) {
-    return true;
-  }
-  if (item.file && item.file.type) {
-    return item.file.type.indexOf("image") === 0;
-  }
-  if (item.url) {
-    return isImageUrl(item.url);
-  }
-  if (typeof item.content === "string") {
-    return item.content.indexOf("data:image") === 0;
-  }
-  return false;
-}
-export {
-  bem,
-  filterFiles,
-  isImageFile,
-  isImageUrl,
-  isOversize,
-  name,
-  readFileContent,
-  t
-};

package/es/utils/create.js

@@ -1,47 +0,0 @@
-import { get } from "./basic";
-import { camelize } from "./format";
-import { isFunction } from "./validate";
-import locale from "../locale";
-function createTranslate(name) {
-  const prefix = camelize(name) + ".";
-  return (path, ...args) => {
-    const messages = locale.messages();
-    const message = get(messages, prefix + path) || get(messages, path);
-    return isFunction(message) ? message(...args) : message;
-  };
-}
-function genBem(name, mods) {
-  if (!mods) {
-    return "";
-  }
-  if (typeof mods === "string") {
-    return ` ${name}--${mods}`;
-  }
-  if (Array.isArray(mods)) {
-    return mods.reduce((ret, item) => ret + genBem(name, item), "");
-  }
-  return Object.keys(mods).reduce((ret, key) => ret + (mods[key] ? genBem(name, key) : ""), "");
-}
-function createBEM(name) {
-  return (el, mods) => {
-    if (el && typeof el !== "string") {
-      mods = el;
-      el = "";
-    }
-    el = el ? `${name}__${el}` : name;
-    return `${el}${genBem(el, mods)}`;
-  };
-}
-function createNamespace(name) {
-  const prefixedName = `van-${name}`;
-  return [
-    prefixedName,
-    createBEM(prefixedName),
-    createTranslate(prefixedName)
-  ];
-}
-export {
-  createBEM,
-  createNamespace,
-  createTranslate
-};

package/es/utils/deep-assign.js

@@ -1,22 +0,0 @@
-import { isDef, isObject } from "./validate";
-const { hasOwnProperty } = Object.prototype;
-function assignKey(to, from, key) {
-  const val = from[key];
-  if (!isDef(val)) {
-    return;
-  }
-  if (!hasOwnProperty.call(to, key) || !isObject(val)) {
-    to[key] = val;
-  } else {
-    to[key] = deepAssign(Object(to[key]), val);
-  }
-}
-function deepAssign(to, from) {
-  Object.keys(from).forEach((key) => {
-    assignKey(to, from, key);
-  });
-  return to;
-}
-export {
-  deepAssign
-};

package/es/utils/deep-clone.js

@@ -1,20 +0,0 @@
-import { isDef, isObject } from "./validate";
-function deepClone(obj) {
-  if (!isDef(obj)) {
-    return obj;
-  }
-  if (Array.isArray(obj)) {
-    return obj.map((item) => deepClone(item));
-  }
-  if (isObject(obj)) {
-    const to = {};
-    Object.keys(obj).forEach((key) => {
-      to[key] = deepClone(obj[key]);
-    });
-    return to;
-  }
-  return obj;
-}
-export {
-  deepClone
-};

package/es/utils/dom.js

@@ -1,67 +0,0 @@
-import { useRect, useWindowSize } from "@vant/use";
-import { unref } from "vue";
-import { isIOS as checkIsIOS } from "./validate";
-function getScrollTop(el) {
-  const top = "scrollTop" in el ? el.scrollTop : el.pageYOffset;
-  return Math.max(top, 0);
-}
-function setScrollTop(el, value) {
-  if ("scrollTop" in el) {
-    el.scrollTop = value;
-  } else {
-    el.scrollTo(el.scrollX, value);
-  }
-}
-function getRootScrollTop() {
-  return window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
-}
-function setRootScrollTop(value) {
-  setScrollTop(window, value);
-  setScrollTop(document.body, value);
-}
-function getElementTop(el, scroller) {
-  if (el === window) {
-    return 0;
-  }
-  const scrollTop = scroller ? getScrollTop(scroller) : getRootScrollTop();
-  return useRect(el).top + scrollTop;
-}
-const isIOS = checkIsIOS();
-function resetScroll() {
-  if (isIOS) {
-    setRootScrollTop(getRootScrollTop());
-  }
-}
-const stopPropagation = (event) => event.stopPropagation();
-function preventDefault(event, isStopPropagation) {
-  if (typeof event.cancelable !== "boolean" || event.cancelable) {
-    event.preventDefault();
-  }
-  if (isStopPropagation) {
-    stopPropagation(event);
-  }
-}
-function isHidden(elementRef) {
-  const el = unref(elementRef);
-  if (!el) {
-    return false;
-  }
-  const style = window.getComputedStyle(el);
-  const hidden = style.display === "none";
-  const parentHidden = el.offsetParent === null && style.position !== "fixed";
-  return hidden || parentHidden;
-}
-const { width: windowWidth, height: windowHeight } = useWindowSize();
-export {
-  getElementTop,
-  getRootScrollTop,
-  getScrollTop,
-  isHidden,
-  preventDefault,
-  resetScroll,
-  setRootScrollTop,
-  setScrollTop,
-  stopPropagation,
-  windowHeight,
-  windowWidth
-};

package/es/utils/format.js

@@ -1,120 +0,0 @@
-import { inBrowser } from "./basic";
-import { windowWidth, windowHeight } from "./dom";
-import { isDef, isNumeric } from "./validate";
-function addUnit(value) {
-  if (isDef(value)) {
-    return isNumeric(value) ? `${value}px` : String(value);
-  }
-  return void 0;
-}
-function getSizeStyle(originSize) {
-  if (isDef(originSize)) {
-    if (Array.isArray(originSize)) {
-      return {
-        width: addUnit(originSize[0]),
-        height: addUnit(originSize[1])
-      };
-    }
-    const size = addUnit(originSize);
-    return {
-      width: size,
-      height: size
-    };
-  }
-}
-function getZIndexStyle(zIndex) {
-  const style = {};
-  if (zIndex !== void 0) {
-    style.zIndex = +zIndex;
-  }
-  return style;
-}
-let rootFontSize;
-function getRootFontSize() {
-  if (!rootFontSize) {
-    const doc = document.documentElement;
-    const fontSize = doc.style.fontSize || window.getComputedStyle(doc).fontSize;
-    rootFontSize = parseFloat(fontSize);
-  }
-  return rootFontSize;
-}
-function convertRem(value) {
-  value = value.replace(/rem/g, "");
-  return +value * getRootFontSize();
-}
-function convertVw(value) {
-  value = value.replace(/vw/g, "");
-  return +value * windowWidth.value / 100;
-}
-function convertVh(value) {
-  value = value.replace(/vh/g, "");
-  return +value * windowHeight.value / 100;
-}
-function unitToPx(value) {
-  if (typeof value === "number") {
-    return value;
-  }
-  if (inBrowser) {
-    if (value.includes("rem")) {
-      return convertRem(value);
-    }
-    if (value.includes("vw")) {
-      return convertVw(value);
-    }
-    if (value.includes("vh")) {
-      return convertVh(value);
-    }
-  }
-  return parseFloat(value);
-}
-const camelizeRE = /-(\w)/g;
-const camelize = (str) => str.replace(camelizeRE, (_, c) => c.toUpperCase());
-const kebabCase = (str) => str.replace(/([A-Z])/g, "-$1").toLowerCase().replace(/^-/, "");
-function padZero(num, targetLength = 2) {
-  let str = num + "";
-  while (str.length < targetLength) {
-    str = "0" + str;
-  }
-  return str;
-}
-const clamp = (num, min, max) => Math.min(Math.max(num, min), max);
-function trimExtraChar(value, char, regExp) {
-  const index = value.indexOf(char);
-  if (index === -1) {
-    return value;
-  }
-  if (char === "-" && index !== 0) {
-    return value.slice(0, index);
-  }
-  return value.slice(0, index + 1) + value.slice(index).replace(regExp, "");
-}
-function formatNumber(value, allowDot = true, allowMinus = true) {
-  if (allowDot) {
-    value = trimExtraChar(value, ".", /\./g);
-  } else {
-    value = value.split(".")[0];
-  }
-  if (allowMinus) {
-    value = trimExtraChar(value, "-", /-/g);
-  } else {
-    value = value.replace(/-/, "");
-  }
-  const regExp = allowDot ? /[^-0-9.]/g : /[^-0-9]/g;
-  return value.replace(regExp, "");
-}
-function addNumber(num1, num2) {
-  const cardinal = 10 ** 10;
-  return Math.round((num1 + num2) * cardinal) / cardinal;
-}
-export {
-  addNumber,
-  addUnit,
-  camelize,
-  clamp,
-  formatNumber,
-  getSizeStyle,
-  getZIndexStyle,
-  kebabCase,
-  padZero,
-  unitToPx
-};

package/es/utils/index.js

@@ -1,9 +0,0 @@
-export * from "./basic";
-export * from "./props";
-export * from "./dom";
-export * from "./create";
-export * from "./format";
-export * from "./constant";
-export * from "./validate";
-export * from "./interceptor";
-export * from "./with-install";