@brumaombra/ui-vintage 0.6.7 → 0.7.1

package/dist/Slider.vue_vue_type_script_setup_true_lang-CSOSwGGr.js

@@ -1,803 +0,0 @@
-import { defineComponent, toRefs, ref, computed, openBlock, createBlock, unref, normalizeStyle, withCtx, renderSlot, resolveDynamicComponent, mergeProps, createCommentVNode, toRaw, onMounted, onUnmounted, createVNode, createElementBlock, Fragment, renderList } from "vue";
-import { u as useForwardPropsEmits } from "./useForwardPropsEmits-GlUGKcIz.js";
-import { c as clamp } from "./clamp-D5Ye0kJT.js";
-import { c as createContext } from "./createContext-BabAT1K8.js";
-import { u as useDirection } from "./useDirection-B2bMgzzV.js";
-import { u as useFormControl } from "./useFormControl-DZ4LnB9F.js";
-import { u as useForwardExpose } from "./useForwardExpose-BcX3VRdS.js";
-import { u as useCollection } from "./Collection-4P3HQ4uU.js";
-import { V as VisuallyHiddenInput_default } from "./VisuallyHiddenInput-D5eipDQU.js";
-import { P as Primitive } from "./Primitive-D3IcFg81.js";
-import { a as useVModel, b as useMounted } from "./index-Dw56kNV0.js";
-import { u as useSize } from "./useSize-DUgGY9t1.js";
-import { c as cn } from "./utils-Bz4m9VPB.js";
-import { r as reactiveOmit } from "./index-DDJjWaIl.js";
-function getNextSortedValues(prevValues = [], nextValue, atIndex) {
-  const nextValues = [...prevValues];
-  nextValues[atIndex] = nextValue;
-  return nextValues.sort((a, b) => a - b);
-}
-function convertValueToPercentage(value, min, max) {
-  const maxSteps = max - min;
-  const percentPerStep = 100 / maxSteps;
-  const percentage = percentPerStep * (value - min);
-  return clamp(percentage, 0, 100);
-}
-function getLabel(index, totalValues) {
-  if (totalValues > 2) return `Value ${index + 1} of ${totalValues}`;
-  else if (totalValues === 2) return ["Minimum", "Maximum"][index];
-  else return void 0;
-}
-function getClosestValueIndex(values, nextValue) {
-  if (values.length === 1) return 0;
-  const distances = values.map((value) => Math.abs(value - nextValue));
-  const closestDistance = Math.min(...distances);
-  return distances.indexOf(closestDistance);
-}
-function getThumbInBoundsOffset(width, left, direction) {
-  const halfWidth = width / 2;
-  const halfPercent = 50;
-  const offset = linearScale([0, halfPercent], [0, halfWidth]);
-  return (halfWidth - offset(left) * direction) * direction;
-}
-function getStepsBetweenValues(values) {
-  return values.slice(0, -1).map((value, index) => values[index + 1] - value);
-}
-function hasMinStepsBetweenValues(values, minStepsBetweenValues) {
-  if (minStepsBetweenValues > 0) {
-    const stepsBetweenValues = getStepsBetweenValues(values);
-    const actualMinStepsBetweenValues = Math.min(...stepsBetweenValues);
-    return actualMinStepsBetweenValues >= minStepsBetweenValues;
-  }
-  return true;
-}
-function linearScale(input, output) {
-  return (value) => {
-    if (input[0] === input[1] || output[0] === output[1]) return output[0];
-    const ratio = (output[1] - output[0]) / (input[1] - input[0]);
-    return output[0] + ratio * (value - input[0]);
-  };
-}
-function getDecimalCount(value) {
-  return (String(value).split(".")[1] || "").length;
-}
-function roundValue(value, decimalCount) {
-  const rounder = 10 ** decimalCount;
-  return Math.round(value * rounder) / rounder;
-}
-const PAGE_KEYS = ["PageUp", "PageDown"];
-const ARROW_KEYS = [
-  "ArrowUp",
-  "ArrowDown",
-  "ArrowLeft",
-  "ArrowRight"
-];
-const BACK_KEYS = {
-  "from-left": [
-    "Home",
-    "PageDown",
-    "ArrowDown",
-    "ArrowLeft"
-  ],
-  "from-right": [
-    "Home",
-    "PageDown",
-    "ArrowDown",
-    "ArrowRight"
-  ],
-  "from-bottom": [
-    "Home",
-    "PageDown",
-    "ArrowDown",
-    "ArrowLeft"
-  ],
-  "from-top": [
-    "Home",
-    "PageUp",
-    "ArrowUp",
-    "ArrowLeft"
-  ]
-};
-const [injectSliderOrientationContext, provideSliderOrientationContext] = createContext(["SliderVertical", "SliderHorizontal"]);
-var SliderHorizontal_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-  __name: "SliderHorizontal",
-  props: {
-    dir: {
-      type: String,
-      required: false
-    },
-    min: {
-      type: Number,
-      required: true
-    },
-    max: {
-      type: Number,
-      required: true
-    },
-    inverted: {
-      type: Boolean,
-      required: true
-    }
-  },
-  emits: [
-    "slideEnd",
-    "slideStart",
-    "slideMove",
-    "homeKeyDown",
-    "endKeyDown",
-    "stepKeyDown"
-  ],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emits = __emit;
-    const { max, min, dir, inverted } = toRefs(props);
-    const { forwardRef, currentElement: sliderElement } = useForwardExpose();
-    const rootContext = injectSliderRootContext();
-    const offsetPosition = ref();
-    const rectRef = ref();
-    const isSlidingFromLeft = computed(() => (dir == null ? void 0 : dir.value) !== "rtl" && !inverted.value || (dir == null ? void 0 : dir.value) !== "ltr" && inverted.value);
-    function getValueFromPointerEvent(event, slideStart) {
-      const rect = rectRef.value || sliderElement.value.getBoundingClientRect();
-      const thumb = [...rootContext.thumbElements.value][rootContext.valueIndexToChangeRef.value];
-      const thumbWidth = rootContext.thumbAlignment.value === "contain" ? thumb.clientWidth : 0;
-      if (!offsetPosition.value && !slideStart && rootContext.thumbAlignment.value === "contain") offsetPosition.value = event.clientX - thumb.getBoundingClientRect().left;
-      const input = [0, rect.width - thumbWidth];
-      const output = isSlidingFromLeft.value ? [min.value, max.value] : [max.value, min.value];
-      const value = linearScale(input, output);
-      rectRef.value = rect;
-      const position = slideStart ? event.clientX - rect.left - thumbWidth / 2 : event.clientX - rect.left - (offsetPosition.value ?? 0);
-      return value(position);
-    }
-    const startEdge = computed(() => isSlidingFromLeft.value ? "left" : "right");
-    const endEdge = computed(() => isSlidingFromLeft.value ? "right" : "left");
-    const direction = computed(() => isSlidingFromLeft.value ? 1 : -1);
-    provideSliderOrientationContext({
-      startEdge,
-      endEdge,
-      direction,
-      size: "width"
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(SliderImpl_default, {
-        ref: unref(forwardRef),
-        dir: unref(dir),
-        "data-orientation": "horizontal",
-        style: normalizeStyle({ ["--reka-slider-thumb-transform"]: !isSlidingFromLeft.value && unref(rootContext).thumbAlignment.value === "overflow" ? "translateX(50%)" : "translateX(-50%)" }),
-        onSlideStart: _cache[0] || (_cache[0] = (event) => {
-          const value = getValueFromPointerEvent(event, true);
-          emits("slideStart", value);
-        }),
-        onSlideMove: _cache[1] || (_cache[1] = (event) => {
-          const value = getValueFromPointerEvent(event);
-          emits("slideMove", value);
-        }),
-        onSlideEnd: _cache[2] || (_cache[2] = () => {
-          rectRef.value = void 0;
-          offsetPosition.value = void 0;
-          emits("slideEnd");
-        }),
-        onStepKeyDown: _cache[3] || (_cache[3] = (event) => {
-          const slideDirection = isSlidingFromLeft.value ? "from-left" : "from-right";
-          const isBackKey = unref(BACK_KEYS)[slideDirection].includes(event.key);
-          emits("stepKeyDown", event, isBackKey ? -1 : 1);
-        }),
-        onEndKeyDown: _cache[4] || (_cache[4] = ($event) => emits("endKeyDown", $event)),
-        onHomeKeyDown: _cache[5] || (_cache[5] = ($event) => emits("homeKeyDown", $event))
-      }, {
-        default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
-        _: 3
-      }, 8, ["dir", "style"]);
-    };
-  }
-});
-var SliderHorizontal_default = SliderHorizontal_vue_vue_type_script_setup_true_lang_default;
-var SliderVertical_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-  __name: "SliderVertical",
-  props: {
-    min: {
-      type: Number,
-      required: true
-    },
-    max: {
-      type: Number,
-      required: true
-    },
-    inverted: {
-      type: Boolean,
-      required: true
-    }
-  },
-  emits: [
-    "slideEnd",
-    "slideStart",
-    "slideMove",
-    "homeKeyDown",
-    "endKeyDown",
-    "stepKeyDown"
-  ],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emits = __emit;
-    const { max, min, inverted } = toRefs(props);
-    const rootContext = injectSliderRootContext();
-    const { forwardRef, currentElement: sliderElement } = useForwardExpose();
-    const offsetPosition = ref();
-    const rectRef = ref();
-    const isSlidingFromBottom = computed(() => !inverted.value);
-    function getValueFromPointerEvent(event, slideStart) {
-      const rect = rectRef.value || sliderElement.value.getBoundingClientRect();
-      const thumb = [...rootContext.thumbElements.value][rootContext.valueIndexToChangeRef.value];
-      const thumbHeight = rootContext.thumbAlignment.value === "contain" ? thumb.clientHeight : 0;
-      if (!offsetPosition.value && !slideStart && rootContext.thumbAlignment.value === "contain") offsetPosition.value = event.clientY - thumb.getBoundingClientRect().top;
-      const input = [0, rect.height - thumbHeight];
-      const output = isSlidingFromBottom.value ? [max.value, min.value] : [min.value, max.value];
-      const value = linearScale(input, output);
-      const position = slideStart ? event.clientY - rect.top - thumbHeight / 2 : event.clientY - rect.top - (offsetPosition.value ?? 0);
-      rectRef.value = rect;
-      return value(position);
-    }
-    const startEdge = computed(() => isSlidingFromBottom.value ? "bottom" : "top");
-    const endEdge = computed(() => isSlidingFromBottom.value ? "top" : "bottom");
-    const direction = computed(() => isSlidingFromBottom.value ? 1 : -1);
-    provideSliderOrientationContext({
-      startEdge,
-      endEdge,
-      direction,
-      size: "height"
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(SliderImpl_default, {
-        ref: unref(forwardRef),
-        "data-orientation": "vertical",
-        style: normalizeStyle({ ["--reka-slider-thumb-transform"]: !isSlidingFromBottom.value && unref(rootContext).thumbAlignment.value === "overflow" ? "translateY(-50%)" : "translateY(50%)" }),
-        onSlideStart: _cache[0] || (_cache[0] = (event) => {
-          const value = getValueFromPointerEvent(event, true);
-          emits("slideStart", value);
-        }),
-        onSlideMove: _cache[1] || (_cache[1] = (event) => {
-          const value = getValueFromPointerEvent(event);
-          emits("slideMove", value);
-        }),
-        onSlideEnd: _cache[2] || (_cache[2] = () => {
-          rectRef.value = void 0;
-          offsetPosition.value = void 0;
-          emits("slideEnd");
-        }),
-        onStepKeyDown: _cache[3] || (_cache[3] = (event) => {
-          const slideDirection = isSlidingFromBottom.value ? "from-bottom" : "from-top";
-          const isBackKey = unref(BACK_KEYS)[slideDirection].includes(event.key);
-          emits("stepKeyDown", event, isBackKey ? -1 : 1);
-        }),
-        onEndKeyDown: _cache[4] || (_cache[4] = ($event) => emits("endKeyDown", $event)),
-        onHomeKeyDown: _cache[5] || (_cache[5] = ($event) => emits("homeKeyDown", $event))
-      }, {
-        default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
-        _: 3
-      }, 8, ["style"]);
-    };
-  }
-});
-var SliderVertical_default = SliderVertical_vue_vue_type_script_setup_true_lang_default;
-const [injectSliderRootContext, provideSliderRootContext] = createContext("SliderRoot");
-var SliderRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-  inheritAttrs: false,
-  __name: "SliderRoot",
-  props: {
-    defaultValue: {
-      type: Array,
-      required: false,
-      default: () => [0]
-    },
-    modelValue: {
-      type: [Array, null],
-      required: false
-    },
-    disabled: {
-      type: Boolean,
-      required: false,
-      default: false
-    },
-    orientation: {
-      type: String,
-      required: false,
-      default: "horizontal"
-    },
-    dir: {
-      type: String,
-      required: false
-    },
-    inverted: {
-      type: Boolean,
-      required: false,
-      default: false
-    },
-    min: {
-      type: Number,
-      required: false,
-      default: 0
-    },
-    max: {
-      type: Number,
-      required: false,
-      default: 100
-    },
-    step: {
-      type: Number,
-      required: false,
-      default: 1
-    },
-    minStepsBetweenThumbs: {
-      type: Number,
-      required: false,
-      default: 0
-    },
-    thumbAlignment: {
-      type: String,
-      required: false,
-      default: "contain"
-    },
-    asChild: {
-      type: Boolean,
-      required: false
-    },
-    as: {
-      type: null,
-      required: false,
-      default: "span"
-    },
-    name: {
-      type: String,
-      required: false
-    },
-    required: {
-      type: Boolean,
-      required: false
-    }
-  },
-  emits: ["update:modelValue", "valueCommit"],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emits = __emit;
-    const { min, max, step, minStepsBetweenThumbs, orientation, disabled, thumbAlignment, dir: propDir } = toRefs(props);
-    const dir = useDirection(propDir);
-    const { forwardRef, currentElement } = useForwardExpose();
-    const isFormControl = useFormControl(currentElement);
-    const { CollectionSlot } = useCollection({ isProvider: true });
-    const modelValue = useVModel(props, "modelValue", emits, {
-      defaultValue: props.defaultValue,
-      passive: props.modelValue === void 0
-    });
-    const currentModelValue = computed(() => Array.isArray(modelValue.value) ? [...modelValue.value] : []);
-    const valueIndexToChangeRef = ref(0);
-    const valuesBeforeSlideStartRef = ref(currentModelValue.value);
-    function handleSlideStart(value) {
-      const closestIndex = getClosestValueIndex(currentModelValue.value, value);
-      updateValues(value, closestIndex);
-    }
-    function handleSlideMove(value) {
-      updateValues(value, valueIndexToChangeRef.value);
-    }
-    function handleSlideEnd() {
-      const prevValue = valuesBeforeSlideStartRef.value[valueIndexToChangeRef.value];
-      const nextValue = currentModelValue.value[valueIndexToChangeRef.value];
-      const hasChanged = nextValue !== prevValue;
-      if (hasChanged) emits("valueCommit", toRaw(currentModelValue.value));
-    }
-    function updateValues(value, atIndex, { commit } = { commit: false }) {
-      var _a;
-      const decimalCount = getDecimalCount(step.value);
-      const snapToStep = roundValue(Math.round((value - min.value) / step.value) * step.value + min.value, decimalCount);
-      const nextValue = clamp(snapToStep, min.value, max.value);
-      const nextValues = getNextSortedValues(currentModelValue.value, nextValue, atIndex);
-      if (hasMinStepsBetweenValues(nextValues, minStepsBetweenThumbs.value * step.value)) {
-        valueIndexToChangeRef.value = nextValues.indexOf(nextValue);
-        const hasChanged = String(nextValues) !== String(modelValue.value);
-        if (hasChanged && commit) emits("valueCommit", nextValues);
-        if (hasChanged) {
-          (_a = thumbElements.value[valueIndexToChangeRef.value]) == null ? void 0 : _a.focus();
-          modelValue.value = nextValues;
-        }
-      }
-    }
-    const thumbElements = ref([]);
-    provideSliderRootContext({
-      modelValue,
-      currentModelValue,
-      valueIndexToChangeRef,
-      thumbElements,
-      orientation,
-      min,
-      max,
-      disabled,
-      thumbAlignment
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(CollectionSlot), null, {
-        default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(unref(orientation) === "horizontal" ? SliderHorizontal_default : SliderVertical_default), mergeProps(_ctx.$attrs, {
-          ref: unref(forwardRef),
-          "as-child": _ctx.asChild,
-          as: _ctx.as,
-          min: unref(min),
-          max: unref(max),
-          dir: unref(dir),
-          inverted: _ctx.inverted,
-          "aria-disabled": unref(disabled),
-          "data-disabled": unref(disabled) ? "" : void 0,
-          onPointerdown: _cache[0] || (_cache[0] = () => {
-            if (!unref(disabled)) valuesBeforeSlideStartRef.value = currentModelValue.value;
-          }),
-          onSlideStart: _cache[1] || (_cache[1] = ($event) => !unref(disabled) && handleSlideStart($event)),
-          onSlideMove: _cache[2] || (_cache[2] = ($event) => !unref(disabled) && handleSlideMove($event)),
-          onSlideEnd: _cache[3] || (_cache[3] = ($event) => !unref(disabled) && handleSlideEnd()),
-          onHomeKeyDown: _cache[4] || (_cache[4] = ($event) => !unref(disabled) && updateValues(unref(min), 0, { commit: true })),
-          onEndKeyDown: _cache[5] || (_cache[5] = ($event) => !unref(disabled) && updateValues(unref(max), currentModelValue.value.length - 1, { commit: true })),
-          onStepKeyDown: _cache[6] || (_cache[6] = (event, direction) => {
-            if (!unref(disabled)) {
-              const isPageKey = unref(PAGE_KEYS).includes(event.key);
-              const isSkipKey = isPageKey || event.shiftKey && unref(ARROW_KEYS).includes(event.key);
-              const multiplier = isSkipKey ? 10 : 1;
-              const atIndex = valueIndexToChangeRef.value;
-              const value = currentModelValue.value[atIndex];
-              const stepInDirection = unref(step) * multiplier * direction;
-              updateValues(value + stepInDirection, atIndex, { commit: true });
-            }
-          })
-        }), {
-          default: withCtx(() => [renderSlot(_ctx.$slots, "default", { modelValue: unref(modelValue) }), unref(isFormControl) && _ctx.name ? (openBlock(), createBlock(unref(VisuallyHiddenInput_default), {
-            key: 0,
-            type: "number",
-            value: unref(modelValue),
-            name: _ctx.name,
-            required: _ctx.required,
-            disabled: unref(disabled),
-            step: unref(step)
-          }, null, 8, [
-            "value",
-            "name",
-            "required",
-            "disabled",
-            "step"
-          ])) : createCommentVNode("v-if", true)]),
-          _: 3
-        }, 16, [
-          "as-child",
-          "as",
-          "min",
-          "max",
-          "dir",
-          "inverted",
-          "aria-disabled",
-          "data-disabled"
-        ]))]),
-        _: 3
-      });
-    };
-  }
-});
-var SliderRoot_default = SliderRoot_vue_vue_type_script_setup_true_lang_default;
-var SliderImpl_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-  __name: "SliderImpl",
-  props: {
-    asChild: {
-      type: Boolean,
-      required: false
-    },
-    as: {
-      type: null,
-      required: false,
-      default: "span"
-    }
-  },
-  emits: [
-    "slideStart",
-    "slideMove",
-    "slideEnd",
-    "homeKeyDown",
-    "endKeyDown",
-    "stepKeyDown"
-  ],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emits = __emit;
-    const rootContext = injectSliderRootContext();
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(Primitive), mergeProps({ "data-slider-impl": "" }, props, {
-        onKeydown: _cache[0] || (_cache[0] = (event) => {
-          if (event.key === "Home") {
-            emits("homeKeyDown", event);
-            event.preventDefault();
-          } else if (event.key === "End") {
-            emits("endKeyDown", event);
-            event.preventDefault();
-          } else if (unref(PAGE_KEYS).concat(unref(ARROW_KEYS)).includes(event.key)) {
-            emits("stepKeyDown", event);
-            event.preventDefault();
-          }
-        }),
-        onPointerdown: _cache[1] || (_cache[1] = (event) => {
-          const target = event.target;
-          target.setPointerCapture(event.pointerId);
-          event.preventDefault();
-          if (unref(rootContext).thumbElements.value.includes(target)) target.focus();
-          else emits("slideStart", event);
-        }),
-        onPointermove: _cache[2] || (_cache[2] = (event) => {
-          const target = event.target;
-          if (target.hasPointerCapture(event.pointerId)) emits("slideMove", event);
-        }),
-        onPointerup: _cache[3] || (_cache[3] = (event) => {
-          const target = event.target;
-          if (target.hasPointerCapture(event.pointerId)) {
-            target.releasePointerCapture(event.pointerId);
-            emits("slideEnd", event);
-          }
-        })
-      }), {
-        default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
-        _: 3
-      }, 16);
-    };
-  }
-});
-var SliderImpl_default = SliderImpl_vue_vue_type_script_setup_true_lang_default;
-var SliderRange_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-  __name: "SliderRange",
-  props: {
-    asChild: {
-      type: Boolean,
-      required: false
-    },
-    as: {
-      type: null,
-      required: false,
-      default: "span"
-    }
-  },
-  setup(__props) {
-    const rootContext = injectSliderRootContext();
-    const orientation = injectSliderOrientationContext();
-    useForwardExpose();
-    const percentages = computed(() => rootContext.currentModelValue.value.map((value) => convertValueToPercentage(value, rootContext.min.value, rootContext.max.value)));
-    const offsetStart = computed(() => rootContext.currentModelValue.value.length > 1 ? Math.min(...percentages.value) : 0);
-    const offsetEnd = computed(() => 100 - Math.max(...percentages.value, 0));
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(Primitive), {
-        "data-disabled": unref(rootContext).disabled.value ? "" : void 0,
-        "data-orientation": unref(rootContext).orientation.value,
-        "as-child": _ctx.asChild,
-        as: _ctx.as,
-        style: normalizeStyle({
-          [unref(orientation).startEdge.value]: `${offsetStart.value}%`,
-          [unref(orientation).endEdge.value]: `${offsetEnd.value}%`
-        })
-      }, {
-        default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
-        _: 3
-      }, 8, [
-        "data-disabled",
-        "data-orientation",
-        "as-child",
-        "as",
-        "style"
-      ]);
-    };
-  }
-});
-var SliderRange_default = SliderRange_vue_vue_type_script_setup_true_lang_default;
-var SliderThumbImpl_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-  inheritAttrs: false,
-  __name: "SliderThumbImpl",
-  props: {
-    index: {
-      type: Number,
-      required: true
-    },
-    asChild: {
-      type: Boolean,
-      required: false
-    },
-    as: {
-      type: null,
-      required: false
-    }
-  },
-  setup(__props) {
-    const props = __props;
-    const rootContext = injectSliderRootContext();
-    const orientation = injectSliderOrientationContext();
-    const { forwardRef, currentElement: thumbElement } = useForwardExpose();
-    const { CollectionItem } = useCollection();
-    const value = computed(() => {
-      var _a, _b;
-      return (_b = (_a = rootContext.modelValue) == null ? void 0 : _a.value) == null ? void 0 : _b[props.index];
-    });
-    const percent = computed(() => value.value === void 0 ? 0 : convertValueToPercentage(value.value, rootContext.min.value ?? 0, rootContext.max.value ?? 100));
-    const label = computed(() => {
-      var _a, _b;
-      return getLabel(props.index, ((_b = (_a = rootContext.modelValue) == null ? void 0 : _a.value) == null ? void 0 : _b.length) ?? 0);
-    });
-    const size = useSize(thumbElement);
-    const orientationSize = computed(() => size[orientation.size].value);
-    const thumbInBoundsOffset = computed(() => {
-      if (rootContext.thumbAlignment.value === "overflow" || !orientationSize.value) return 0;
-      else return getThumbInBoundsOffset(orientationSize.value, percent.value, orientation.direction.value);
-    });
-    const isMounted = useMounted();
-    onMounted(() => {
-      rootContext.thumbElements.value.push(thumbElement.value);
-    });
-    onUnmounted(() => {
-      const i = rootContext.thumbElements.value.findIndex((i$1) => i$1 === thumbElement.value) ?? -1;
-      rootContext.thumbElements.value.splice(i, 1);
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(CollectionItem), null, {
-        default: withCtx(() => [createVNode(unref(Primitive), mergeProps(_ctx.$attrs, {
-          ref: unref(forwardRef),
-          role: "slider",
-          tabindex: unref(rootContext).disabled.value ? void 0 : 0,
-          "aria-label": _ctx.$attrs["aria-label"] || label.value,
-          "data-disabled": unref(rootContext).disabled.value ? "" : void 0,
-          "data-orientation": unref(rootContext).orientation.value,
-          "aria-valuenow": value.value,
-          "aria-valuemin": unref(rootContext).min.value,
-          "aria-valuemax": unref(rootContext).max.value,
-          "aria-orientation": unref(rootContext).orientation.value,
-          "as-child": _ctx.asChild,
-          as: _ctx.as,
-          style: {
-            transform: "var(--reka-slider-thumb-transform)",
-            position: "absolute",
-            [unref(orientation).startEdge.value]: `calc(${percent.value}% + ${thumbInBoundsOffset.value}px)`,
-            display: !unref(isMounted) && value.value === void 0 ? "none" : void 0
-          },
-          onFocus: _cache[0] || (_cache[0] = () => {
-            unref(rootContext).valueIndexToChangeRef.value = _ctx.index;
-          })
-        }), {
-          default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
-          _: 3
-        }, 16, [
-          "tabindex",
-          "aria-label",
-          "data-disabled",
-          "data-orientation",
-          "aria-valuenow",
-          "aria-valuemin",
-          "aria-valuemax",
-          "aria-orientation",
-          "as-child",
-          "as",
-          "style"
-        ])]),
-        _: 3
-      });
-    };
-  }
-});
-var SliderThumbImpl_default = SliderThumbImpl_vue_vue_type_script_setup_true_lang_default;
-var SliderThumb_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-  __name: "SliderThumb",
-  props: {
-    asChild: {
-      type: Boolean,
-      required: false
-    },
-    as: {
-      type: null,
-      required: false,
-      default: "span"
-    }
-  },
-  setup(__props) {
-    const props = __props;
-    const { getItems } = useCollection();
-    const { forwardRef, currentElement: thumbElement } = useForwardExpose();
-    const index = computed(() => thumbElement.value ? getItems(true).findIndex((i) => i.ref === thumbElement.value) : -1);
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(SliderThumbImpl_default, mergeProps({ ref: unref(forwardRef) }, props, { index: index.value }), {
-        default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
-        _: 3
-      }, 16, ["index"]);
-    };
-  }
-});
-var SliderThumb_default = SliderThumb_vue_vue_type_script_setup_true_lang_default;
-var SliderTrack_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-  __name: "SliderTrack",
-  props: {
-    asChild: {
-      type: Boolean,
-      required: false
-    },
-    as: {
-      type: null,
-      required: false,
-      default: "span"
-    }
-  },
-  setup(__props) {
-    const rootContext = injectSliderRootContext();
-    useForwardExpose();
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(Primitive), {
-        "as-child": _ctx.asChild,
-        as: _ctx.as,
-        "data-disabled": unref(rootContext).disabled.value ? "" : void 0,
-        "data-orientation": unref(rootContext).orientation.value
-      }, {
-        default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
-        _: 3
-      }, 8, [
-        "as-child",
-        "as",
-        "data-disabled",
-        "data-orientation"
-      ]);
-    };
-  }
-});
-var SliderTrack_default = SliderTrack_vue_vue_type_script_setup_true_lang_default;
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "Slider",
-  props: {
-    defaultValue: {},
-    modelValue: {},
-    disabled: { type: Boolean },
-    orientation: {},
-    dir: {},
-    inverted: { type: Boolean },
-    min: {},
-    max: {},
-    step: {},
-    minStepsBetweenThumbs: {},
-    thumbAlignment: {},
-    asChild: { type: Boolean },
-    as: {},
-    name: {},
-    required: { type: Boolean },
-    class: {}
-  },
-  emits: ["update:modelValue", "valueCommit"],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emits = __emit;
-    const delegatedProps = reactiveOmit(props, "class");
-    const forwarded = useForwardPropsEmits(delegatedProps, emits);
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(SliderRoot_default), mergeProps({
-        "data-slot": "slider",
-        class: unref(cn)(
-          "relative flex w-full cursor-pointer touch-none items-center select-none data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col",
-          props.class
-        )
-      }, unref(forwarded)), {
-        default: withCtx(({ modelValue }) => [
-          createVNode(unref(SliderTrack_default), {
-            "data-slot": "slider-track",
-            class: "bg-muted relative grow overflow-hidden rounded data-[orientation=horizontal]:h-2 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-2"
-          }, {
-            default: withCtx(() => [
-              createVNode(unref(SliderRange_default), {
-                "data-slot": "slider-range",
-                class: "bg-primary absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full"
-              })
-            ]),
-            _: 1
-          }),
-          (openBlock(true), createElementBlock(Fragment, null, renderList(modelValue, (_, key) => {
-            return openBlock(), createBlock(unref(SliderThumb_default), {
-              key,
-              "data-slot": "slider-thumb",
-              class: "bg-white border-primary ring-ring/50 block size-5 shrink-0 rounded border shadow-sm transition-[color,box-shadow,transform] hover:scale-105 hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"
-            });
-          }), 128))
-        ]),
-        _: 1
-      }, 16, ["class"]);
-    };
-  }
-});
-export {
-  _sfc_main as _
-};