vant 2.13.2 → 2.13.3

package/lib/skeleton-paragraph/index.d.ts

@@ -0,0 +1,24 @@
+export declare const SkeletonParagraph: import("../utils").WithInstall<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    round: BooleanConstructor;
+    rowWidth: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    round: BooleanConstructor;
+    rowWidth: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    round: boolean;
+    rowWidth: string | number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
+export default SkeletonParagraph;
+export { skeletonParagraphProps, DEFAULT_ROW_WIDTH } from './SkeletonParagraph';
+export type { SkeletonParagraphProps } from './SkeletonParagraph';
+declare module 'vue' {
+    interface GlobalComponents {
+        VanSkeletonParagraph: typeof SkeletonParagraph;
+    }
+}

package/lib/skeleton-paragraph/index.js

@@ -0,0 +1,40 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var stdin_exports = {};
+__export(stdin_exports, {
+  DEFAULT_ROW_WIDTH: () => import_SkeletonParagraph2.DEFAULT_ROW_WIDTH,
+  SkeletonParagraph: () => SkeletonParagraph,
+  default: () => stdin_default,
+  skeletonParagraphProps: () => import_SkeletonParagraph2.skeletonParagraphProps
+});
+module.exports = __toCommonJS(stdin_exports);
+var import_SkeletonParagraph = __toESM(require("./SkeletonParagraph"));
+var import_utils = require("../utils");
+var import_SkeletonParagraph2 = require("./SkeletonParagraph");
+const SkeletonParagraph = (0, import_utils.withInstall)(import_SkeletonParagraph.default);
+var stdin_default = SkeletonParagraph;

package/lib/skeleton-paragraph/style/index.d.ts

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

package/lib/skeleton-paragraph/style/index.js

@@ -0,0 +1,2 @@
+require("../../style/base.css");
+require("../index.css");

package/lib/skeleton-title/SkeletonTitle.d.ts

@@ -0,0 +1,16 @@
+import { type ExtractPropTypes } from 'vue';
+export declare const skeletonTitleProps: {
+    round: BooleanConstructor;
+    titleWidth: (NumberConstructor | StringConstructor)[];
+};
+export type SkeletonTitleProps = ExtractPropTypes<typeof skeletonTitleProps>;
+declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
+    round: BooleanConstructor;
+    titleWidth: (NumberConstructor | StringConstructor)[];
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ExtractPropTypes<{
+    round: BooleanConstructor;
+    titleWidth: (NumberConstructor | StringConstructor)[];
+}>> & Readonly<{}>, {
+    round: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/lib/skeleton-title/SkeletonTitle.js

@@ -0,0 +1,44 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name2 in all)
+    __defProp(target, name2, { get: all[name2], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var stdin_exports = {};
+__export(stdin_exports, {
+  default: () => stdin_default,
+  skeletonTitleProps: () => skeletonTitleProps
+});
+module.exports = __toCommonJS(stdin_exports);
+var import_vue = require("vue");
+var import_utils = require("../utils");
+const [name, bem] = (0, import_utils.createNamespace)("skeleton-title");
+const skeletonTitleProps = {
+  round: Boolean,
+  titleWidth: import_utils.numericProp
+};
+var stdin_default = (0, import_vue.defineComponent)({
+  name,
+  props: skeletonTitleProps,
+  setup(props) {
+    return () => (0, import_vue.createVNode)("h3", {
+      "class": bem([{
+        round: props.round
+      }]),
+      "style": {
+        width: (0, import_utils.addUnit)(props.titleWidth)
+      }
+    }, null);
+  }
+});

package/lib/skeleton-title/index.css

@@ -0,0 +1 @@
+:root,:host{--van-skeleton-title-width: 40%}.van-skeleton-title{height:var(--van-skeleton-paragraph-height);background:var(--van-skeleton-paragraph-background)}.van-skeleton-title--round{border-radius:var(--van-radius-max)}.van-skeleton-title{width:var(--van-skeleton-title-width);margin:0}.van-skeleton-title+.van-skeleton-paragraph{margin-top:20px}

package/lib/skeleton-title/index.d.ts

@@ -0,0 +1,17 @@
+export declare const SkeletonTitle: import("../utils").WithInstall<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    round: BooleanConstructor;
+    titleWidth: (NumberConstructor | StringConstructor)[];
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    round: BooleanConstructor;
+    titleWidth: (NumberConstructor | StringConstructor)[];
+}>> & Readonly<{}>, {
+    round: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
+export default SkeletonTitle;
+export { skeletonTitleProps } from './SkeletonTitle';
+export type { SkeletonTitleProps } from './SkeletonTitle';
+declare module 'vue' {
+    interface GlobalComponents {
+        VanSkeletonTitle: typeof SkeletonTitle;
+    }
+}

package/lib/skeleton-title/index.js

@@ -0,0 +1,39 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var stdin_exports = {};
+__export(stdin_exports, {
+  SkeletonTitle: () => SkeletonTitle,
+  default: () => stdin_default,
+  skeletonTitleProps: () => import_SkeletonTitle2.skeletonTitleProps
+});
+module.exports = __toCommonJS(stdin_exports);
+var import_SkeletonTitle = __toESM(require("./SkeletonTitle"));
+var import_utils = require("../utils");
+var import_SkeletonTitle2 = require("./SkeletonTitle");
+const SkeletonTitle = (0, import_utils.withInstall)(import_SkeletonTitle.default);
+var stdin_default = SkeletonTitle;

package/lib/skeleton-title/style/index.d.ts

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

package/lib/skeleton-title/style/index.js

@@ -0,0 +1,2 @@
+require("../../style/base.css");
+require("../index.css");

package/lib/slider/Slider.d.ts

@@ -0,0 +1,100 @@
+import { type PropType, type ExtractPropTypes } from 'vue';
+type NumberRange = [number, number];
+type SliderValue = number | NumberRange;
+export declare const sliderProps: {
+    min: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    max: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    step: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    range: BooleanConstructor;
+    reverse: BooleanConstructor;
+    disabled: BooleanConstructor;
+    readonly: BooleanConstructor;
+    vertical: BooleanConstructor;
+    barHeight: (NumberConstructor | StringConstructor)[];
+    buttonSize: (NumberConstructor | StringConstructor)[];
+    activeColor: StringConstructor;
+    inactiveColor: StringConstructor;
+    modelValue: {
+        type: PropType<SliderValue>;
+        default: number;
+    };
+};
+export type SliderProps = ExtractPropTypes<typeof sliderProps>;
+declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
+    min: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    max: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    step: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    range: BooleanConstructor;
+    reverse: BooleanConstructor;
+    disabled: BooleanConstructor;
+    readonly: BooleanConstructor;
+    vertical: BooleanConstructor;
+    barHeight: (NumberConstructor | StringConstructor)[];
+    buttonSize: (NumberConstructor | StringConstructor)[];
+    activeColor: StringConstructor;
+    inactiveColor: StringConstructor;
+    modelValue: {
+        type: PropType<SliderValue>;
+        default: number;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "dragStart" | "dragEnd")[], "update:modelValue" | "change" | "dragStart" | "dragEnd", import("vue").PublicProps, Readonly<ExtractPropTypes<{
+    min: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    max: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    step: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    range: BooleanConstructor;
+    reverse: BooleanConstructor;
+    disabled: BooleanConstructor;
+    readonly: BooleanConstructor;
+    vertical: BooleanConstructor;
+    barHeight: (NumberConstructor | StringConstructor)[];
+    buttonSize: (NumberConstructor | StringConstructor)[];
+    activeColor: StringConstructor;
+    inactiveColor: StringConstructor;
+    modelValue: {
+        type: PropType<SliderValue>;
+        default: number;
+    };
+}>> & Readonly<{
+    onChange?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onDragStart?: ((...args: any[]) => any) | undefined;
+    onDragEnd?: ((...args: any[]) => any) | undefined;
+}>, {
+    reverse: boolean;
+    range: boolean;
+    max: string | number;
+    disabled: boolean;
+    vertical: boolean;
+    min: string | number;
+    modelValue: SliderValue;
+    readonly: boolean;
+    step: string | number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/lib/slider/Slider.js

@@ -0,0 +1,305 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name2 in all)
+    __defProp(target, name2, { get: all[name2], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var stdin_exports = {};
+__export(stdin_exports, {
+  default: () => stdin_default,
+  sliderProps: () => sliderProps
+});
+module.exports = __toCommonJS(stdin_exports);
+var import_vue = require("vue");
+var import_utils = require("../utils");
+var import_use = require("@vant/use");
+var import_use_touch = require("../composables/use-touch");
+const [name, bem] = (0, import_utils.createNamespace)("slider");
+const sliderProps = {
+  min: (0, import_utils.makeNumericProp)(0),
+  max: (0, import_utils.makeNumericProp)(100),
+  step: (0, import_utils.makeNumericProp)(1),
+  range: Boolean,
+  reverse: Boolean,
+  disabled: Boolean,
+  readonly: Boolean,
+  vertical: Boolean,
+  barHeight: import_utils.numericProp,
+  buttonSize: import_utils.numericProp,
+  activeColor: String,
+  inactiveColor: String,
+  modelValue: {
+    type: [Number, Array],
+    default: 0
+  }
+};
+var stdin_default = (0, import_vue.defineComponent)({
+  name,
+  props: sliderProps,
+  emits: ["change", "dragEnd", "dragStart", "update:modelValue"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    let buttonIndex;
+    let current;
+    let startValue;
+    const root = (0, import_vue.ref)();
+    const slider = [(0, import_vue.ref)(), (0, import_vue.ref)()];
+    const dragStatus = (0, import_vue.ref)();
+    const touch = (0, import_use_touch.useTouch)();
+    const scope = (0, import_vue.computed)(() => Number(props.max) - Number(props.min));
+    const wrapperStyle = (0, import_vue.computed)(() => {
+      const crossAxis = props.vertical ? "width" : "height";
+      return {
+        background: props.inactiveColor,
+        [crossAxis]: (0, import_utils.addUnit)(props.barHeight)
+      };
+    });
+    const isRange = (val) => props.range && Array.isArray(val);
+    const calcMainAxis = () => {
+      const {
+        modelValue,
+        min
+      } = props;
+      if (isRange(modelValue)) {
+        return `${(modelValue[1] - modelValue[0]) * 100 / scope.value}%`;
+      }
+      return `${(modelValue - Number(min)) * 100 / scope.value}%`;
+    };
+    const calcOffset = () => {
+      const {
+        modelValue,
+        min
+      } = props;
+      if (isRange(modelValue)) {
+        return `${(modelValue[0] - Number(min)) * 100 / scope.value}%`;
+      }
+      return "0%";
+    };
+    const barStyle = (0, import_vue.computed)(() => {
+      const mainAxis = props.vertical ? "height" : "width";
+      const style = {
+        [mainAxis]: calcMainAxis(),
+        background: props.activeColor
+      };
+      if (dragStatus.value) {
+        style.transition = "none";
+      }
+      const getPositionKey = () => {
+        if (props.vertical) {
+          return props.reverse ? "bottom" : "top";
+        }
+        return props.reverse ? "right" : "left";
+      };
+      style[getPositionKey()] = calcOffset();
+      return style;
+    });
+    const format = (value) => {
+      const min = +props.min;
+      const max = +props.max;
+      const step = +props.step;
+      value = (0, import_utils.clamp)(value, min, max);
+      const diff = Math.round((value - min) / step) * step;
+      return (0, import_utils.addNumber)(min, diff);
+    };
+    const updateStartValue = () => {
+      const current2 = props.modelValue;
+      if (isRange(current2)) {
+        startValue = current2.map(format);
+      } else {
+        startValue = format(current2);
+      }
+    };
+    const handleRangeValue = (value) => {
+      var _a, _b;
+      const left = (_a = value[0]) != null ? _a : Number(props.min);
+      const right = (_b = value[1]) != null ? _b : Number(props.max);
+      return left > right ? [right, left] : [left, right];
+    };
+    const updateValue = (value, end) => {
+      if (isRange(value)) {
+        value = handleRangeValue(value).map(format);
+      } else {
+        value = format(value);
+      }
+      if (!(0, import_utils.isSameValue)(value, props.modelValue)) {
+        emit("update:modelValue", value);
+      }
+      if (end && !(0, import_utils.isSameValue)(value, startValue)) {
+        emit("change", value);
+      }
+    };
+    const onClick = (event) => {
+      event.stopPropagation();
+      if (props.disabled || props.readonly) {
+        return;
+      }
+      updateStartValue();
+      const {
+        min,
+        reverse,
+        vertical,
+        modelValue
+      } = props;
+      const rect = (0, import_use.useRect)(root);
+      const getDelta = () => {
+        if (vertical) {
+          if (reverse) {
+            return rect.bottom - event.clientY;
+          }
+          return event.clientY - rect.top;
+        }
+        if (reverse) {
+          return rect.right - event.clientX;
+        }
+        return event.clientX - rect.left;
+      };
+      const total = vertical ? rect.height : rect.width;
+      const value = Number(min) + getDelta() / total * scope.value;
+      if (isRange(modelValue)) {
+        const [left, right] = modelValue;
+        const middle = (left + right) / 2;
+        if (value <= middle) {
+          updateValue([value, right], true);
+        } else {
+          updateValue([left, value], true);
+        }
+      } else {
+        updateValue(value, true);
+      }
+    };
+    const onTouchStart = (event) => {
+      if (props.disabled || props.readonly) {
+        return;
+      }
+      touch.start(event);
+      current = props.modelValue;
+      updateStartValue();
+      dragStatus.value = "start";
+    };
+    const onTouchMove = (event) => {
+      if (props.disabled || props.readonly) {
+        return;
+      }
+      if (dragStatus.value === "start") {
+        emit("dragStart", event);
+      }
+      (0, import_utils.preventDefault)(event, true);
+      touch.move(event);
+      dragStatus.value = "dragging";
+      const rect = (0, import_use.useRect)(root);
+      const delta = props.vertical ? touch.deltaY.value : touch.deltaX.value;
+      const total = props.vertical ? rect.height : rect.width;
+      let diff = delta / total * scope.value;
+      if (props.reverse) {
+        diff = -diff;
+      }
+      if (isRange(startValue)) {
+        const index = props.reverse ? 1 - buttonIndex : buttonIndex;
+        current[index] = startValue[index] + diff;
+      } else {
+        current = startValue + diff;
+      }
+      updateValue(current);
+    };
+    const onTouchEnd = (event) => {
+      if (props.disabled || props.readonly) {
+        return;
+      }
+      if (dragStatus.value === "dragging") {
+        updateValue(current, true);
+        emit("dragEnd", event);
+      }
+      dragStatus.value = "";
+    };
+    const getButtonClassName = (index) => {
+      if (typeof index === "number") {
+        const position = ["left", "right"];
+        return bem(`button-wrapper`, position[index]);
+      }
+      return bem("button-wrapper", props.reverse ? "left" : "right");
+    };
+    const renderButtonContent = (value, index) => {
+      const dragging = dragStatus.value === "dragging";
+      if (typeof index === "number") {
+        const slot = slots[index === 0 ? "left-button" : "right-button"];
+        let dragIndex;
+        if (dragging && Array.isArray(current)) {
+          dragIndex = current[0] > current[1] ? buttonIndex ^ 1 : buttonIndex;
+        }
+        if (slot) {
+          return slot({
+            value,
+            dragging,
+            dragIndex
+          });
+        }
+      }
+      if (slots.button) {
+        return slots.button({
+          value,
+          dragging
+        });
+      }
+      return (0, import_vue.createVNode)("div", {
+        "class": bem("button"),
+        "style": (0, import_utils.getSizeStyle)(props.buttonSize)
+      }, null);
+    };
+    const renderButton = (index) => {
+      const current2 = typeof index === "number" ? props.modelValue[index] : props.modelValue;
+      return (0, import_vue.createVNode)("div", {
+        "ref": slider[index != null ? index : 0],
+        "role": "slider",
+        "class": getButtonClassName(index),
+        "tabindex": props.disabled ? void 0 : 0,
+        "aria-valuemin": props.min,
+        "aria-valuenow": current2,
+        "aria-valuemax": props.max,
+        "aria-disabled": props.disabled || void 0,
+        "aria-readonly": props.readonly || void 0,
+        "aria-orientation": props.vertical ? "vertical" : "horizontal",
+        "onTouchstartPassive": (event) => {
+          if (typeof index === "number") {
+            buttonIndex = index;
+          }
+          onTouchStart(event);
+        },
+        "onTouchend": onTouchEnd,
+        "onTouchcancel": onTouchEnd,
+        "onClick": import_utils.stopPropagation
+      }, [renderButtonContent(current2, index)]);
+    };
+    updateValue(props.modelValue);
+    (0, import_use.useCustomFieldValue)(() => props.modelValue);
+    slider.forEach((item) => {
+      (0, import_use.useEventListener)("touchmove", onTouchMove, {
+        target: item
+      });
+    });
+    return () => (0, import_vue.createVNode)("div", {
+      "ref": root,
+      "style": wrapperStyle.value,
+      "class": bem({
+        vertical: props.vertical,
+        disabled: props.disabled
+      }),
+      "onClick": onClick
+    }, [(0, import_vue.createVNode)("div", {
+      "class": bem("bar"),
+      "style": barStyle.value
+    }, [props.range ? [renderButton(0), renderButton(1)] : renderButton()])]);
+  }
+});

package/lib/slider/index.css

@@ -1 +1 @@
-.van-slider{position:relative;width:100%;height:2px;background-color:#ebedf0;border-radius:999px;cursor:pointer}.van-slider::before{position:absolute;top:-8px;right:0;bottom:-8px;left:0;content:''}.van-slider__bar{position:relative;width:100%;height:100%;background-color:#1989fa;border-radius:inherit;-webkit-transition:all .2s;transition:all .2s}.van-slider__button{width:24px;height:24px;background-color:#fff;border-radius:50%;box-shadow:0 1px 2px rgba(0,0,0,.5)}.van-slider__button-wrapper,.van-slider__button-wrapper-right{position:absolute;top:50%;right:0;-webkit-transform:translate3d(50%,-50%,0);transform:translate3d(50%,-50%,0);cursor:grab}.van-slider__button-wrapper-left{position:absolute;top:50%;left:0;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0);cursor:grab}.van-slider--disabled{cursor:not-allowed;opacity:.5}.van-slider--disabled .van-slider__button-wrapper,.van-slider--disabled .van-slider__button-wrapper-left,.van-slider--disabled .van-slider__button-wrapper-right{cursor:not-allowed}.van-slider--vertical{display:inline-block;width:2px;height:100%}.van-slider--vertical .van-slider__button-wrapper,.van-slider--vertical .van-slider__button-wrapper-right{top:auto;right:50%;bottom:0;-webkit-transform:translate3d(50%,50%,0);transform:translate3d(50%,50%,0)}.van-slider--vertical .van-slider__button-wrapper-left{top:0;right:50%;left:auto;-webkit-transform:translate3d(50%,-50%,0);transform:translate3d(50%,-50%,0)}.van-slider--vertical::before{top:0;right:-8px;bottom:0;left:-8px}
+:root,:host{--van-slider-active-background: var(--van-primary-color);--van-slider-inactive-background: var(--van-gray-3);--van-slider-disabled-opacity: var(--van-disabled-opacity);--van-slider-bar-height: 2px;--van-slider-button-width: 24px;--van-slider-button-height: 24px;--van-slider-button-radius: 50%;--van-slider-button-background: var(--van-white);--van-slider-button-shadow: 0 1px 2px rgba(0, 0, 0, .5)}.van-theme-dark{--van-slider-inactive-background: var(--van-background-3)}.van-slider{position:relative;width:100%;height:var(--van-slider-bar-height);background:var(--van-slider-inactive-background);border-radius:var(--van-radius-max);cursor:pointer}.van-slider:before{position:absolute;top:calc(var(--van-padding-xs) * -1);right:0;bottom:calc(var(--van-padding-xs) * -1);left:0;content:""}.van-slider__bar{position:absolute;width:100%;height:100%;background:var(--van-slider-active-background);border-radius:inherit;transition:all var(--van-duration-fast)}.van-slider__button{width:var(--van-slider-button-width);height:var(--van-slider-button-height);background:var(--van-slider-button-background);border-radius:var(--van-slider-button-radius);box-shadow:var(--van-slider-button-shadow)}.van-slider__button-wrapper{position:absolute;cursor:-webkit-grab;cursor:grab;top:50%}.van-slider__button-wrapper--right{right:0;transform:translate3d(50%,-50%,0)}.van-slider__button-wrapper--left{left:0;transform:translate3d(-50%,-50%,0)}.van-slider--disabled{cursor:not-allowed;opacity:var(--van-slider-disabled-opacity)}.van-slider--disabled .van-slider__button-wrapper{cursor:not-allowed}.van-slider--vertical{display:inline-block;width:var(--van-slider-bar-height);height:100%}.van-slider--vertical .van-slider__button-wrapper--right{top:auto;right:50%;bottom:0;transform:translate3d(50%,50%,0)}.van-slider--vertical .van-slider__button-wrapper--left{top:0;right:50%;left:auto;transform:translate3d(50%,-50%,0)}.van-slider--vertical:before{top:0;right:calc(var(--van-padding-xs) * -1);bottom:0;left:calc(var(--van-padding-xs) * -1)}