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

package/es/checkbox-group/CheckboxGroup.js

@@ -1,71 +0,0 @@
-import { createVNode as _createVNode } from "vue";
-import { watch, defineComponent } from "vue";
-import { numericProp, createNamespace, makeArrayProp } from "../utils";
-import { useChildren, useCustomFieldValue } from "@vant/use";
-import { useExpose } from "../composables/use-expose";
-const [name, bem] = createNamespace("checkbox-group");
-const checkboxGroupProps = {
-  max: numericProp,
-  disabled: Boolean,
-  iconSize: numericProp,
-  direction: String,
-  modelValue: makeArrayProp(),
-  checkedColor: String
-};
-const CHECKBOX_GROUP_KEY = Symbol(name);
-var stdin_default = defineComponent({
-  name,
-  props: checkboxGroupProps,
-  emits: ["change", "update:modelValue"],
-  setup(props, {
-    emit,
-    slots
-  }) {
-    const {
-      children,
-      linkChildren
-    } = useChildren(CHECKBOX_GROUP_KEY);
-    const updateValue = (value) => emit("update:modelValue", value);
-    const toggleAll = (options = {}) => {
-      if (typeof options === "boolean") {
-        options = {
-          checked: options
-        };
-      }
-      const {
-        checked,
-        skipDisabled
-      } = options;
-      const checkedChildren = children.filter((item) => {
-        if (!item.props.bindGroup) {
-          return false;
-        }
-        if (item.props.disabled && skipDisabled) {
-          return item.checked.value;
-        }
-        return checked != null ? checked : !item.checked.value;
-      });
-      const names = checkedChildren.map((item) => item.name);
-      updateValue(names);
-    };
-    watch(() => props.modelValue, (value) => emit("change", value));
-    useExpose({
-      toggleAll
-    });
-    useCustomFieldValue(() => props.modelValue);
-    linkChildren({
-      props,
-      updateValue
-    });
-    return () => {
-      var _a;
-      return _createVNode("div", {
-        "class": bem([props.direction])
-      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
-    };
-  }
-});
-export {
-  CHECKBOX_GROUP_KEY,
-  stdin_default as default
-};

package/es/checkbox-group/index.js

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

package/es/checkbox-group/index.less

@@ -1,6 +0,0 @@
-.van-checkbox-group {
-  &--horizontal {
-    display: flex;
-    flex-wrap: wrap;
-  }
-}

package/es/checkbox-group/style/less.d.ts

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

package/es/checkbox-group/style/less.js

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

package/es/circle/Circle.js

@@ -1,152 +0,0 @@
-import { createVNode as _createVNode } from "vue";
-import { watch, computed, defineComponent } from "vue";
-import { raf, cancelRaf } from "@vant/use";
-import { isObject, truthProp, numericProp, getSizeStyle, makeStringProp, makeNumberProp, makeNumericProp, createNamespace } from "../utils";
-const [name, bem] = createNamespace("circle");
-let uid = 0;
-const format = (rate) => Math.min(Math.max(+rate, 0), 100);
-function getPath(clockwise, viewBoxSize) {
-  const sweepFlag = clockwise ? 1 : 0;
-  return `M ${viewBoxSize / 2} ${viewBoxSize / 2} m 0, -500 a 500, 500 0 1, ${sweepFlag} 0, 1000 a 500, 500 0 1, ${sweepFlag} 0, -1000`;
-}
-const circleProps = {
-  text: String,
-  size: numericProp,
-  fill: makeStringProp("none"),
-  rate: makeNumericProp(100),
-  speed: makeNumericProp(0),
-  color: [String, Object],
-  clockwise: truthProp,
-  layerColor: String,
-  currentRate: makeNumberProp(0),
-  strokeWidth: makeNumericProp(40),
-  strokeLinecap: String,
-  startPosition: makeStringProp("top")
-};
-var stdin_default = defineComponent({
-  name,
-  props: circleProps,
-  emits: ["update:currentRate"],
-  setup(props, {
-    emit,
-    slots
-  }) {
-    const id = `van-circle-${uid++}`;
-    const viewBoxSize = computed(() => +props.strokeWidth + 1e3);
-    const path = computed(() => getPath(props.clockwise, viewBoxSize.value));
-    const svgStyle = computed(() => {
-      const ROTATE_ANGLE_MAP = {
-        top: 0,
-        right: 90,
-        bottom: 180,
-        left: 270
-      };
-      const angleValue = ROTATE_ANGLE_MAP[props.startPosition];
-      if (angleValue) {
-        return {
-          transform: `rotate(${angleValue}deg)`
-        };
-      }
-    });
-    watch(() => props.rate, (rate) => {
-      let rafId;
-      const startTime = Date.now();
-      const startRate = props.currentRate;
-      const endRate = format(rate);
-      const duration = Math.abs((startRate - endRate) * 1e3 / +props.speed);
-      const animate = () => {
-        const now = Date.now();
-        const progress = Math.min((now - startTime) / duration, 1);
-        const rate2 = progress * (endRate - startRate) + startRate;
-        emit("update:currentRate", format(parseFloat(rate2.toFixed(1))));
-        if (endRate > startRate ? rate2 < endRate : rate2 > endRate) {
-          rafId = raf(animate);
-        }
-      };
-      if (props.speed) {
-        if (rafId) {
-          cancelRaf(rafId);
-        }
-        rafId = raf(animate);
-      } else {
-        emit("update:currentRate", endRate);
-      }
-    }, {
-      immediate: true
-    });
-    const renderHover = () => {
-      const PERIMETER = 3140;
-      const {
-        strokeWidth,
-        currentRate,
-        strokeLinecap
-      } = props;
-      const offset = PERIMETER * currentRate / 100;
-      const color = isObject(props.color) ? `url(#${id})` : props.color;
-      const style = {
-        stroke: color,
-        strokeWidth: `${+strokeWidth + 1}px`,
-        strokeLinecap,
-        strokeDasharray: `${offset}px ${PERIMETER}px`
-      };
-      return _createVNode("path", {
-        "d": path.value,
-        "style": style,
-        "class": bem("hover"),
-        "stroke": color
-      }, null);
-    };
-    const renderLayer = () => {
-      const style = {
-        fill: props.fill,
-        stroke: props.layerColor,
-        strokeWidth: `${props.strokeWidth}px`
-      };
-      return _createVNode("path", {
-        "class": bem("layer"),
-        "style": style,
-        "d": path.value
-      }, null);
-    };
-    const renderGradient = () => {
-      const {
-        color
-      } = props;
-      if (!isObject(color)) {
-        return;
-      }
-      const Stops = Object.keys(color).sort((a, b) => parseFloat(a) - parseFloat(b)).map((key, index) => _createVNode("stop", {
-        "key": index,
-        "offset": key,
-        "stop-color": color[key]
-      }, null));
-      return _createVNode("defs", null, [_createVNode("linearGradient", {
-        "id": id,
-        "x1": "100%",
-        "y1": "0%",
-        "x2": "0%",
-        "y2": "0%"
-      }, [Stops])]);
-    };
-    const renderText = () => {
-      if (slots.default) {
-        return slots.default();
-      }
-      if (props.text) {
-        return _createVNode("div", {
-          "class": bem("text")
-        }, [props.text]);
-      }
-    };
-    return () => _createVNode("div", {
-      "class": bem(),
-      "style": getSizeStyle(props.size)
-    }, [_createVNode("svg", {
-      "viewBox": `0 0 ${viewBoxSize.value} ${viewBoxSize.value}`,
-      "style": svgStyle.value
-    }, [renderGradient(), renderLayer(), renderHover()]), renderText()]);
-  }
-});
-export {
-  stdin_default as default
-};

package/es/circle/index.js

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

package/es/circle/index.less

@@ -1,49 +0,0 @@
-body {
-  --van-circle-size: 100px;
-  --van-circle-color: var(--van-primary-color);
-  --van-circle-layer-color: var(--van-white);
-  --van-circle-text-color: var(--van-text-color);
-  --van-circle-text-font-weight: var(--van-font-bold);
-  --van-circle-text-font-size: var(--van-font-size-md);
-  --van-circle-text-line-height: var(--van-line-height-md);
-}
-
-.van-circle {
-  position: relative;
-  display: inline-block;
-  width: var(--van-circle-size);
-  height: var(--van-circle-size);
-  text-align: center;
-
-  svg {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-  }
-
-  &__layer {
-    stroke: var(--van-circle-layer-color);
-  }
-
-  &__hover {
-    fill: none;
-    stroke: var(--van-circle-color);
-    stroke-linecap: round;
-  }
-
-  &__text {
-    position: absolute;
-    top: 50%;
-    left: 0;
-    box-sizing: border-box;
-    width: 100%;
-    padding: 0 var(--van-padding-base);
-    color: var(--van-circle-text-color);
-    font-weight: var(--van-circle-text-font-weight);
-    font-size: var(--van-circle-text-font-size);
-    line-height: var(--van-circle-text-line-height);
-    transform: translateY(-50%);
-  }
-}

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

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

package/es/circle/style/less.js

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

package/es/col/Col.js

@@ -1,63 +0,0 @@
-import { createVNode as _createVNode } from "vue";
-import { computed, defineComponent } from "vue";
-import { numericProp, createNamespace, makeNumericProp, makeStringProp } from "../utils";
-import { useParent } from "@vant/use";
-import { ROW_KEY } from "../row/Row";
-const [name, bem] = createNamespace("col");
-const colProps = {
-  tag: makeStringProp("div"),
-  span: makeNumericProp(0),
-  offset: numericProp
-};
-var stdin_default = defineComponent({
-  name,
-  props: colProps,
-  setup(props, {
-    slots
-  }) {
-    const {
-      parent,
-      index
-    } = useParent(ROW_KEY);
-    const style = computed(() => {
-      if (!parent) {
-        return;
-      }
-      const {
-        spaces
-      } = parent;
-      if (spaces && spaces.value && spaces.value[index.value]) {
-        const {
-          left,
-          right
-        } = spaces.value[index.value];
-        return {
-          paddingLeft: left ? `${left}px` : null,
-          paddingRight: right ? `${right}px` : null
-        };
-      }
-    });
-    return () => {
-      const {
-        tag,
-        span,
-        offset
-      } = props;
-      return _createVNode(tag, {
-        "style": style.value,
-        "class": bem({
-          [span]: span,
-          [`offset-${offset}`]: offset
-        })
-      }, {
-        default: () => {
-          var _a;
-          return [(_a = slots.default) == null ? void 0 : _a.call(slots)];
-        }
-      });
-    };
-  }
-});
-export {
-  stdin_default as default
-};

package/es/col/index.js

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

package/es/col/index.less

@@ -1,19 +0,0 @@
-.van-col {
-  display: block;
-  box-sizing: border-box;
-  min-height: 1px;
-}
-
-.generate-col(24);
-.generate-col(@n, @i: 1) when (@i =< @n) {
-  .van-col--@{i} {
-    flex: 0 0 @i * (100% / 24);
-    max-width: @i * (100% / 24);
-  }
-
-  .van-col--offset-@{i} {
-    margin-left: @i * (100% / 24);
-  }
-
-  .generate-col(@n, (@i + 1));
-}

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

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

package/es/col/style/less.js

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

package/es/collapse/Collapse.js

@@ -1,81 +0,0 @@
-import { createVNode as _createVNode } from "vue";
-import { defineComponent } from "vue";
-import { truthProp, createNamespace, BORDER_TOP_BOTTOM } from "../utils";
-import { useChildren } from "@vant/use";
-const [name, bem] = createNamespace("collapse");
-const COLLAPSE_KEY = Symbol(name);
-const collapseProps = {
-  border: truthProp,
-  accordion: Boolean,
-  modelValue: {
-    type: [String, Number, Array],
-    default: ""
-  }
-};
-function validateModelValue(modelValue, accordion) {
-  if (accordion && Array.isArray(modelValue)) {
-    console.error('[Vant] Collapse: "v-model" should not be Array in accordion mode');
-    return false;
-  }
-  if (!accordion && !Array.isArray(modelValue)) {
-    console.error('[Vant] Collapse: "v-model" should be Array in non-accordion mode');
-    return false;
-  }
-  return true;
-}
-var stdin_default = defineComponent({
-  name,
-  props: collapseProps,
-  emits: ["change", "update:modelValue"],
-  setup(props, {
-    emit,
-    slots
-  }) {
-    const {
-      linkChildren
-    } = useChildren(COLLAPSE_KEY);
-    const updateName = (name2) => {
-      emit("change", name2);
-      emit("update:modelValue", name2);
-    };
-    const toggle = (name2, expanded) => {
-      const {
-        accordion,
-        modelValue
-      } = props;
-      if (accordion) {
-        updateName(name2 === modelValue ? "" : name2);
-      } else if (expanded) {
-        updateName(modelValue.concat(name2));
-      } else {
-        updateName(modelValue.filter((activeName) => activeName !== name2));
-      }
-    };
-    const isExpanded = (name2) => {
-      const {
-        accordion,
-        modelValue
-      } = props;
-      if (process.env.NODE_ENV !== "production" && !validateModelValue(modelValue, accordion)) {
-        return false;
-      }
-      return accordion ? modelValue === name2 : modelValue.includes(name2);
-    };
-    linkChildren({
-      toggle,
-      isExpanded
-    });
-    return () => {
-      var _a;
-      return _createVNode("div", {
-        "class": [bem(), {
-          [BORDER_TOP_BOTTOM]: props.border
-        }]
-      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
-    };
-  }
-});
-export {
-  COLLAPSE_KEY,
-  stdin_default as default
-};

package/es/collapse/index.js

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

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

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

package/es/collapse/style/less.js

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

package/es/collapse-item/CollapseItem.js

@@ -1,134 +0,0 @@
-import { withDirectives as _withDirectives, vShow as _vShow, createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
-import { ref, watch, computed, nextTick, defineComponent } from "vue";
-import { cellSharedProps } from "../cell/Cell";
-import { pick, extend, truthProp, numericProp, createNamespace } from "../utils";
-import { COLLAPSE_KEY } from "../collapse/Collapse";
-import { raf, doubleRaf, useParent } from "@vant/use";
-import { useExpose } from "../composables/use-expose";
-import { useLazyRender } from "../composables/use-lazy-render";
-import { Cell } from "../cell";
-const [name, bem] = createNamespace("collapse-item");
-const CELL_SLOTS = ["icon", "title", "value", "label", "right-icon"];
-const collapseItemProps = extend({}, cellSharedProps, {
-  name: numericProp,
-  isLink: truthProp,
-  disabled: Boolean,
-  readonly: Boolean,
-  lazyRender: truthProp
-});
-var stdin_default = defineComponent({
-  name,
-  props: collapseItemProps,
-  setup(props, {
-    slots
-  }) {
-    const wrapperRef = ref();
-    const contentRef = ref();
-    const {
-      parent,
-      index
-    } = useParent(COLLAPSE_KEY);
-    if (!parent) {
-      if (process.env.NODE_ENV !== "production") {
-        console.error("[Vant] <CollapseItem> must be a child component of <Collapse>.");
-      }
-      return;
-    }
-    const name2 = computed(() => {
-      var _a;
-      return (_a = props.name) != null ? _a : index.value;
-    });
-    const expanded = computed(() => parent.isExpanded(name2.value));
-    const show = ref(expanded.value);
-    const lazyRender = useLazyRender(() => show.value || !props.lazyRender);
-    const onTransitionEnd = () => {
-      if (!expanded.value) {
-        show.value = false;
-      } else if (wrapperRef.value) {
-        wrapperRef.value.style.height = "";
-      }
-    };
-    watch(expanded, (value, oldValue) => {
-      if (oldValue === null) {
-        return;
-      }
-      if (value) {
-        show.value = true;
-      }
-      const tick = value ? nextTick : raf;
-      tick(() => {
-        if (!contentRef.value || !wrapperRef.value) {
-          return;
-        }
-        const {
-          offsetHeight
-        } = contentRef.value;
-        if (offsetHeight) {
-          const contentHeight = `${offsetHeight}px`;
-          wrapperRef.value.style.height = value ? "0" : contentHeight;
-          doubleRaf(() => {
-            if (wrapperRef.value) {
-              wrapperRef.value.style.height = value ? contentHeight : "0";
-            }
-          });
-        } else {
-          onTransitionEnd();
-        }
-      });
-    });
-    const toggle = (newValue = !expanded.value) => {
-      parent.toggle(name2.value, newValue);
-    };
-    const onClickTitle = () => {
-      if (!props.disabled && !props.readonly) {
-        toggle();
-      }
-    };
-    const renderTitle = () => {
-      const {
-        border,
-        disabled,
-        readonly
-      } = props;
-      const attrs = pick(props, Object.keys(cellSharedProps));
-      if (readonly) {
-        attrs.isLink = false;
-      }
-      if (disabled || readonly) {
-        attrs.clickable = false;
-      }
-      return _createVNode(Cell, _mergeProps({
-        "role": "button",
-        "class": bem("title", {
-          disabled,
-          expanded: expanded.value,
-          borderless: !border
-        }),
-        "aria-expanded": String(expanded.value),
-        "onClick": onClickTitle
-      }, attrs), pick(slots, CELL_SLOTS));
-    };
-    const renderContent = lazyRender(() => {
-      var _a;
-      return _withDirectives(_createVNode("div", {
-        "ref": wrapperRef,
-        "class": bem("wrapper"),
-        "onTransitionend": onTransitionEnd
-      }, [_createVNode("div", {
-        "ref": contentRef,
-        "class": bem("content")
-      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)])]), [[_vShow, show.value]]);
-    });
-    useExpose({
-      toggle
-    });
-    return () => _createVNode("div", {
-      "class": [bem({
-        border: index.value && props.border
-      })]
-    }, [renderTitle(), renderContent()]);
-  }
-});
-export {
-  stdin_default as default
-};

package/es/collapse-item/index.js

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