vant 4.0.0-alpha.2 → 4.0.0-beta.0

package/es/popup/index.less

@@ -1,139 +0,0 @@
-body {
-  --van-popup-background: var(--van-background-2);
-  --van-popup-transition: transform var(--van-duration-base);
-  --van-popup-round-radius: 16px;
-  --van-popup-close-icon-size: 22px;
-  --van-popup-close-icon-color: var(--van-gray-5);
-  --van-popup-close-icon-margin: 16px;
-  --van-popup-close-icon-z-index: 1;
-}
-
-.van {
-  &-overflow-hidden {
-    overflow: hidden !important;
-  }
-
-  &-popup {
-    position: fixed;
-    max-height: 100%;
-    overflow-y: auto;
-    background: var(--van-popup-background);
-    transition: var(--van-popup-transition);
-    -webkit-overflow-scrolling: touch;
-
-    &--center {
-      top: 50%;
-      left: 50%;
-      transform: translate3d(-50%, -50%, 0);
-
-      &.van-popup--round {
-        border-radius: var(--van-popup-round-radius);
-      }
-    }
-
-    &--top {
-      top: 0;
-      left: 0;
-      width: 100%;
-
-      &.van-popup--round {
-        border-radius: 0 0 var(--van-popup-round-radius)
-          var(--van-popup-round-radius);
-      }
-    }
-
-    &--right {
-      top: 50%;
-      right: 0;
-      transform: translate3d(0, -50%, 0);
-
-      &.van-popup--round {
-        border-radius: var(--van-popup-round-radius) 0 0
-          var(--van-popup-round-radius);
-      }
-    }
-
-    &--bottom {
-      bottom: 0;
-      left: 0;
-      width: 100%;
-
-      &.van-popup--round {
-        border-radius: var(--van-popup-round-radius)
-          var(--van-popup-round-radius) 0 0;
-      }
-    }
-
-    &--left {
-      top: 50%;
-      left: 0;
-      transform: translate3d(0, -50%, 0);
-
-      &.van-popup--round {
-        border-radius: 0 var(--van-popup-round-radius)
-          var(--van-popup-round-radius) 0;
-      }
-    }
-
-    &-slide-top-enter-active,
-    &-slide-left-enter-active,
-    &-slide-right-enter-active,
-    &-slide-bottom-enter-active {
-      transition-timing-function: var(--van-ease-out);
-    }
-
-    &-slide-top-leave-active,
-    &-slide-left-leave-active,
-    &-slide-right-leave-active,
-    &-slide-bottom-leave-active {
-      transition-timing-function: var(--van-ease-in);
-    }
-
-    &-slide-top-enter-from,
-    &-slide-top-leave-active {
-      transform: translate3d(0, -100%, 0);
-    }
-
-    &-slide-right-enter-from,
-    &-slide-right-leave-active {
-      transform: translate3d(100%, -50%, 0);
-    }
-
-    &-slide-bottom-enter-from,
-    &-slide-bottom-leave-active {
-      transform: translate3d(0, 100%, 0);
-    }
-
-    &-slide-left-enter-from,
-    &-slide-left-leave-active {
-      transform: translate3d(-100%, -50%, 0);
-    }
-
-    &__close-icon {
-      position: absolute;
-      z-index: var(--van-popup-close-icon-z-index);
-      color: var(--van-popup-close-icon-color);
-      font-size: var(--van-popup-close-icon-size);
-
-      &--top-left {
-        top: var(--van-popup-close-icon-margin);
-        left: var(--van-popup-close-icon-margin);
-      }
-
-      &--top-right {
-        top: var(--van-popup-close-icon-margin);
-        right: var(--van-popup-close-icon-margin);
-      }
-
-      &--bottom-left {
-        bottom: var(--van-popup-close-icon-margin);
-        left: var(--van-popup-close-icon-margin);
-      }
-
-      &--bottom-right {
-        right: var(--van-popup-close-icon-margin);
-        bottom: var(--van-popup-close-icon-margin);
-      }
-    }
-  }
-}

package/es/popup/shared.js

@@ -1,20 +0,0 @@
-import { truthProp, unknownProp, numericProp } from "../utils";
-const popupSharedProps = {
-  show: Boolean,
-  zIndex: numericProp,
-  overlay: truthProp,
-  duration: numericProp,
-  teleport: [String, Object],
-  lockScroll: truthProp,
-  lazyRender: truthProp,
-  beforeClose: Function,
-  overlayStyle: Object,
-  overlayClass: unknownProp,
-  transitionAppear: Boolean,
-  closeOnClickOverlay: truthProp
-};
-const popupSharedPropKeys = Object.keys(popupSharedProps);
-export {
-  popupSharedPropKeys,
-  popupSharedProps
-};

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

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

package/es/popup/style/less.js

@@ -1,5 +0,0 @@
-import "../../style/base.less";
-import "../../badge/index.less";
-import "../../icon/index.less";
-import "../../overlay/index.less";
-import "../index.less";

package/es/progress/Progress.js

@@ -1,76 +0,0 @@
-import { createVNode as _createVNode } from "vue";
-import { computed, defineComponent } from "vue";
-import { addUnit, truthProp, numericProp, createNamespace } from "../utils";
-const [name, bem] = createNamespace("progress");
-const progressProps = {
-  color: String,
-  inactive: Boolean,
-  pivotText: String,
-  textColor: String,
-  showPivot: truthProp,
-  pivotColor: String,
-  trackColor: String,
-  strokeWidth: numericProp,
-  percentage: {
-    type: numericProp,
-    default: 0,
-    validator: (value) => value >= 0 && value <= 100
-  }
-};
-var stdin_default = defineComponent({
-  name,
-  props: progressProps,
-  setup(props) {
-    const background = computed(() => props.inactive ? void 0 : props.color);
-    const renderPivot = () => {
-      const {
-        textColor,
-        pivotText,
-        pivotColor,
-        percentage
-      } = props;
-      const text = pivotText != null ? pivotText : `${percentage}%`;
-      if (props.showPivot && text) {
-        const style = {
-          color: textColor,
-          left: `${+percentage}%`,
-          transform: `translate(-${+percentage}%,-50%)`,
-          background: pivotColor || background.value
-        };
-        return _createVNode("span", {
-          "style": style,
-          "class": bem("pivot", {
-            inactive: props.inactive
-          })
-        }, [text]);
-      }
-    };
-    return () => {
-      const {
-        trackColor,
-        percentage,
-        strokeWidth
-      } = props;
-      const rootStyle = {
-        background: trackColor,
-        height: addUnit(strokeWidth)
-      };
-      const portionStyle = {
-        width: `${percentage}%`,
-        background: background.value
-      };
-      return _createVNode("div", {
-        "class": bem(),
-        "style": rootStyle
-      }, [_createVNode("span", {
-        "class": bem("portion", {
-          inactive: props.inactive
-        }),
-        "style": portionStyle
-      }, null), renderPivot()]);
-    };
-  }
-});
-export {
-  stdin_default as default
-};

package/es/progress/index.js

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

package/es/progress/index.less

@@ -1,53 +0,0 @@
-body {
-  --van-progress-height: 4px;
-  --van-progress-color: var(--van-primary-color);
-  --van-progress-inactive-color: var(--van-gray-5);
-  --van-progress-background: var(--van-gray-3);
-  --van-progress-pivot-padding: 0 5px;
-  --van-progress-pivot-text-color: var(--van-white);
-  --van-progress-pivot-font-size: var(--van-font-size-xs);
-  --van-progress-pivot-line-height: 1.6;
-  --van-progress-pivot-background: var(--van-primary-color);
-}
-
-.van-progress {
-  position: relative;
-  height: var(--van-progress-height);
-  background: var(--van-progress-background);
-  border-radius: var(--van-progress-height);
-
-  &__portion {
-    position: absolute;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: var(--van-progress-color);
-    border-radius: inherit;
-    transform-origin: 0;
-    transition: all var(--van-duration-base) var(--van-ease-out);
-
-    &--inactive {
-      background: var(--van-progress-inactive-color);
-    }
-  }
-
-  &__pivot {
-    position: absolute;
-    top: 50%;
-    box-sizing: border-box;
-    min-width: 3.6em;
-    padding: var(--van-progress-pivot-padding);
-    color: var(--van-progress-pivot-text-color);
-    font-size: var(--van-progress-pivot-font-size);
-    line-height: var(--van-progress-pivot-line-height);
-    text-align: center;
-    word-break: keep-all;
-    background: var(--van-progress-pivot-background);
-    border-radius: 1em;
-    transition: all var(--van-duration-base) var(--van-ease-out);
-
-    &--inactive {
-      background: var(--van-progress-inactive-color);
-    }
-  }
-}

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

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

package/es/progress/style/less.js

@@ -1,2 +0,0 @@
-import "../../style/base.less";
-import "../index.less";

package/es/pull-refresh/PullRefresh.js

@@ -1,185 +0,0 @@
-import { createVNode as _createVNode } from "vue";
-import { ref, watch, reactive, nextTick, defineComponent } from "vue";
-import { numericProp, getScrollTop, preventDefault, createNamespace, makeNumericProp } from "../utils";
-import { useScrollParent } from "@vant/use";
-import { useTouch } from "../composables/use-touch";
-import { Loading } from "../loading";
-const [name, bem, t] = createNamespace("pull-refresh");
-const DEFAULT_HEAD_HEIGHT = 50;
-const TEXT_STATUS = ["pulling", "loosing", "success"];
-const pullRefreshProps = {
-  disabled: Boolean,
-  modelValue: Boolean,
-  headHeight: makeNumericProp(DEFAULT_HEAD_HEIGHT),
-  successText: String,
-  pullingText: String,
-  loosingText: String,
-  loadingText: String,
-  pullDistance: numericProp,
-  successDuration: makeNumericProp(500),
-  animationDuration: makeNumericProp(300)
-};
-var stdin_default = defineComponent({
-  name,
-  props: pullRefreshProps,
-  emits: ["refresh", "update:modelValue"],
-  setup(props, {
-    emit,
-    slots
-  }) {
-    let reachTop;
-    const root = ref();
-    const scrollParent = useScrollParent(root);
-    const state = reactive({
-      status: "normal",
-      distance: 0,
-      duration: 0
-    });
-    const touch = useTouch();
-    const getHeadStyle = () => {
-      if (props.headHeight !== DEFAULT_HEAD_HEIGHT) {
-        return {
-          height: `${props.headHeight}px`
-        };
-      }
-    };
-    const isTouchable = () => state.status !== "loading" && state.status !== "success" && !props.disabled;
-    const ease = (distance) => {
-      const pullDistance = +(props.pullDistance || props.headHeight);
-      if (distance > pullDistance) {
-        if (distance < pullDistance * 2) {
-          distance = pullDistance + (distance - pullDistance) / 2;
-        } else {
-          distance = pullDistance * 1.5 + (distance - pullDistance * 2) / 4;
-        }
-      }
-      return Math.round(distance);
-    };
-    const setStatus = (distance, isLoading) => {
-      const pullDistance = +(props.pullDistance || props.headHeight);
-      state.distance = distance;
-      if (isLoading) {
-        state.status = "loading";
-      } else if (distance === 0) {
-        state.status = "normal";
-      } else if (distance < pullDistance) {
-        state.status = "pulling";
-      } else {
-        state.status = "loosing";
-      }
-    };
-    const getStatusText = () => {
-      const {
-        status
-      } = state;
-      if (status === "normal") {
-        return "";
-      }
-      return props[`${status}Text`] || t(status);
-    };
-    const renderStatus = () => {
-      const {
-        status,
-        distance
-      } = state;
-      if (slots[status]) {
-        return slots[status]({
-          distance
-        });
-      }
-      const nodes = [];
-      if (TEXT_STATUS.includes(status)) {
-        nodes.push(_createVNode("div", {
-          "class": bem("text")
-        }, [getStatusText()]));
-      }
-      if (status === "loading") {
-        nodes.push(_createVNode(Loading, {
-          "class": bem("loading")
-        }, {
-          default: getStatusText
-        }));
-      }
-      return nodes;
-    };
-    const showSuccessTip = () => {
-      state.status = "success";
-      setTimeout(() => {
-        setStatus(0);
-      }, +props.successDuration);
-    };
-    const checkPosition = (event) => {
-      reachTop = getScrollTop(scrollParent.value) === 0;
-      if (reachTop) {
-        state.duration = 0;
-        touch.start(event);
-      }
-    };
-    const onTouchStart = (event) => {
-      if (isTouchable()) {
-        checkPosition(event);
-      }
-    };
-    const onTouchMove = (event) => {
-      if (isTouchable()) {
-        if (!reachTop) {
-          checkPosition(event);
-        }
-        const {
-          deltaY
-        } = touch;
-        touch.move(event);
-        if (reachTop && deltaY.value >= 0 && touch.isVertical()) {
-          preventDefault(event);
-          setStatus(ease(deltaY.value));
-        }
-      }
-    };
-    const onTouchEnd = () => {
-      if (reachTop && touch.deltaY.value && isTouchable()) {
-        state.duration = +props.animationDuration;
-        if (state.status === "loosing") {
-          setStatus(+props.headHeight, true);
-          emit("update:modelValue", true);
-          nextTick(() => emit("refresh"));
-        } else {
-          setStatus(0);
-        }
-      }
-    };
-    watch(() => props.modelValue, (value) => {
-      state.duration = +props.animationDuration;
-      if (value) {
-        setStatus(+props.headHeight, true);
-      } else if (slots.success || props.successText) {
-        showSuccessTip();
-      } else {
-        setStatus(0, false);
-      }
-    });
-    return () => {
-      var _a;
-      const trackStyle = {
-        transitionDuration: `${state.duration}ms`,
-        transform: state.distance ? `translate3d(0,${state.distance}px, 0)` : ""
-      };
-      return _createVNode("div", {
-        "ref": root,
-        "class": bem()
-      }, [_createVNode("div", {
-        "class": bem("track"),
-        "style": trackStyle,
-        "onTouchstart": onTouchStart,
-        "onTouchmove": onTouchMove,
-        "onTouchend": onTouchEnd,
-        "onTouchcancel": onTouchEnd
-      }, [_createVNode("div", {
-        "class": bem("head"),
-        "style": getHeadStyle()
-      }, [renderStatus()]), (_a = slots.default) == null ? void 0 : _a.call(slots)])]);
-    };
-  }
-});
-export {
-  stdin_default as default
-};

package/es/pull-refresh/index.js

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

package/es/pull-refresh/index.less

@@ -1,36 +0,0 @@
-body {
-  --van-pull-refresh-head-height: 50px;
-  --van-pull-refresh-head-font-size: var(--van-font-size-md);
-  --van-pull-refresh-head-text-color: var(--van-text-color-2);
-  --van-pull-refresh-loading-icon-size: 16px;
-}
-
-.van-pull-refresh {
-  overflow: hidden;
-
-  &__track {
-    position: relative;
-    height: 100%;
-    transition-property: transform;
-  }
-
-  &__head {
-    position: absolute;
-    left: 0;
-    width: 100%;
-    height: var(--van-pull-refresh-head-height);
-    overflow: hidden;
-    color: var(--van-pull-refresh-head-text-color);
-    font-size: var(--van-pull-refresh-head-font-size);
-    line-height: var(--van-pull-refresh-head-height);
-    text-align: center;
-    transform: translateY(-100%);
-  }
-
-  &__loading {
-    .van-loading__spinner {
-      width: var(--van-pull-refresh-loading-icon-size);
-      height: var(--van-pull-refresh-loading-icon-size);
-    }
-  }
-}

package/es/pull-refresh/style/less.d.ts

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

package/es/pull-refresh/style/less.js

@@ -1,3 +0,0 @@
-import "../../style/base.less";
-import "../../loading/index.less";
-import "../index.less";

package/es/radio/Radio.js

@@ -1,41 +0,0 @@
-import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
-import { defineComponent } from "vue";
-import { pick, createNamespace } from "../utils";
-import { RADIO_KEY } from "../radio-group/RadioGroup";
-import { useParent } from "@vant/use";
-import Checker, { checkerProps } from "../checkbox/Checker";
-const [name, bem] = createNamespace("radio");
-var stdin_default = defineComponent({
-  name,
-  props: checkerProps,
-  emits: ["update:modelValue"],
-  setup(props, {
-    emit,
-    slots
-  }) {
-    const {
-      parent
-    } = useParent(RADIO_KEY);
-    const checked = () => {
-      const value = parent ? parent.props.modelValue : props.modelValue;
-      return value === props.name;
-    };
-    const toggle = () => {
-      if (parent) {
-        parent.updateValue(props.name);
-      } else {
-        emit("update:modelValue", props.name);
-      }
-    };
-    return () => _createVNode(Checker, _mergeProps({
-      "bem": bem,
-      "role": "radio",
-      "parent": parent,
-      "checked": checked(),
-      "onToggle": toggle
-    }, props), pick(slots, ["default", "icon"]));
-  }
-});
-export {
-  stdin_default as default
-};

package/es/radio/index.js

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

package/es/radio/index.less

@@ -1,96 +0,0 @@
-body {
-  --van-radio-size: 20px;
-  --van-radio-border-color: var(--van-gray-5);
-  --van-radio-duration: var(--van-duration-fast);
-  --van-radio-label-margin: var(--van-padding-xs);
-  --van-radio-label-color: var(--van-text-color);
-  --van-radio-checked-icon-color: var(--van-primary-color);
-  --van-radio-disabled-icon-color: var(--van-gray-5);
-  --van-radio-disabled-label-color: var(--van-text-color-3);
-  --van-radio-disabled-background: var(--van-border-color);
-}
-
-.van-radio {
-  display: flex;
-  align-items: center;
-  overflow: hidden;
-  cursor: pointer;
-  user-select: none;
-
-  &--disabled {
-    cursor: not-allowed;
-  }
-
-  &--label-disabled {
-    cursor: default;
-  }
-
-  &--horizontal {
-    margin-right: var(--van-padding-sm);
-  }
-
-  &__icon {
-    flex: none;
-    height: 1em;
-    font-size: var(--van-radio-size);
-    line-height: 1em;
-    cursor: pointer;
-
-    .van-icon {
-      display: block;
-      box-sizing: border-box;
-      width: 1.25em;
-      height: 1.25em;
-      color: transparent;
-      font-size: 0.8em;
-      line-height: 1.25;
-      text-align: center;
-      border: 1px solid var(--van-radio-border-color);
-      transition-duration: var(--van-radio-duration);
-      transition-property: color, border-color, background-color;
-    }
-
-    &--round {
-      .van-icon {
-        border-radius: 100%;
-      }
-    }
-
-    &--checked {
-      .van-icon {
-        color: var(--van-white);
-        background-color: var(--van-radio-checked-icon-color);
-        border-color: var(--van-radio-checked-icon-color);
-      }
-    }
-
-    &--disabled {
-      cursor: not-allowed;
-
-      .van-icon {
-        background-color: var(--van-radio-disabled-background);
-        border-color: var(--van-radio-disabled-icon-color);
-      }
-    }
-
-    &--disabled&--checked {
-      .van-icon {
-        color: var(--van-radio-disabled-icon-color);
-      }
-    }
-  }
-
-  &__label {
-    margin-left: var(--van-radio-label-margin);
-    color: var(--van-radio-label-color);
-    line-height: var(--van-radio-size);
-
-    &--left {
-      margin: 0 var(--van-radio-label-margin) 0 0;
-    }
-
-    &--disabled {
-      color: var(--van-radio-disabled-label-color);
-    }
-  }
-}