yc-design-vue 1.7.5 → 1.7.7

package/es/Select/SelectVirtualList.vue.js

@@ -1,7 +1,62 @@
-import _sfc_main from "./SelectVirtualList.vue2.js";
-/* empty css                       */
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-const SelectVirtualList = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-79815f72"]]);
+import { defineComponent, toRefs, createElementBlock, openBlock, mergeProps, unref, createElementVNode, Fragment, renderList, createBlock, withCtx, resolveDynamicComponent } from "vue";
+import { useVirtualList } from "../node_modules/@vueuse/core/index.js";
+import "../node_modules/tinycolor2/esm/tinycolor.js";
+import "../_shared/utils/dom.js";
+import "../_shared/utils/time.js";
+import { getSlotFunction } from "../_shared/utils/vue-utils.js";
+import "../Empty/index.js";
+/* empty css                             */
+import useContext from "./hooks/useContext.js";
+import "./index.js";
+import _sfc_main$1 from "./Option.vue.js";
+/* empty css            */
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SelectVirtualList",
+  props: {
+    virtualListProps: {}
+  },
+  setup(__props) {
+    var _a, _b;
+    const props = __props;
+    const { virtualListProps } = toRefs(props);
+    const { fieldKey, renderOptions, slots, emits } = useContext().inject();
+    const { list, wrapperProps, containerProps } = useVirtualList(renderOptions, {
+      overscan: ((_a = virtualListProps.value) == null ? void 0 : _a.buffer) ?? 10,
+      itemHeight: ((_b = virtualListProps.value) == null ? void 0 : _b.itemHeight) || 36
+    });
+    const renderLabel = (option) => {
+      if (slots.option) {
+        return () => {
+          var _a2;
+          return ((_a2 = slots.option) == null ? void 0 : _a2.call(slots, {
+            data: option
+          })) || [];
+        };
+      }
+      const { render, label } = fieldKey.value;
+      return option[render] ? getSlotFunction(option[render]) : getSlotFunction(option[label]);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps({ class: "yc-select-dropdown-virtual-list" }, unref(containerProps)), [
+        createElementVNode("div", mergeProps({ class: "yc-select-dropdown-list" }, unref(wrapperProps)), [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(list), ({ data: v }) => {
+            return openBlock(), createBlock(unref(_sfc_main$1), {
+              key: v[unref(fieldKey).value],
+              value: v[unref(fieldKey).value],
+              disabled: v[unref(fieldKey).disabled],
+              "is-fallback-option": v[unref(fieldKey).isFallbackOption]
+            }, {
+              default: withCtx(() => [
+                (openBlock(), createBlock(resolveDynamicComponent(renderLabel(v))))
+              ]),
+              _: 2
+            }, 1032, ["value", "disabled", "is-fallback-option"]);
+          }), 128))
+        ], 16)
+      ], 16);
+    };
+  }
+});
 export {
-  SelectVirtualList as default
+  _sfc_main as default
 };

package/es/Select/SelectVirtualList.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./SelectVirtualList.vue.js";
+/* empty css                       */
+export {
+  _sfc_main as default
+};

package/es/Select/index.css

@@ -1 +1 @@
-.yc-select{width:100%;display:inline-flex;align-items:center}.yc-select:deep(.yc-input-outer) .yc-input-wrapper .yc-input::placeholder{color:var(--color-text-3)}.yc-select .yc-input-placeholder{color:var(--color-text-3)}.yc-select .yc-select-suffix-icon,.yc-select .yc-select-search-icon,.yc-select .yc-select-clear-icon,.yc-select .yc-spin{font-size:12px;color:inherit;flex-shrink:0}.yc-select-no-border .yc-input-tag{background-color:transparent;box-shadow:none;border:none}.yc-select-no-border:deep(.yc-input-outer) .yc-input-wrapper{background-color:transparent;box-shadow:none;border:none}.yc-select-allow-search:deep(.yc-select-search-icon){display:none}.yc-select-allow-search:focus-within:deep(.yc-select-clear-icon),.yc-select-allow-search:focus-within:deep(.yc-select-suffix-icon){display:none}.yc-select-allow-search:focus-within:deep(.yc-select-search-icon){display:block}.yc-select-allow-search:deep(.yc-input-outer) .yc-input-wrapper .yc-input::placeholder{color:var(--color-text-3)}.yc-select-allow-clear:deep(.yc-select-clear-icon){display:none}.yc-select-allow-clear:hover:deep(.yc-select-search-icon),.yc-select-allow-clear:hover:deep(.yc-select-suffix-icon){display:none}.yc-select-allow-clear:hover:deep(.yc-select-clear-icon){display:flex}.yc-select-dropdown{width:100%;padding:4px 0;background-color:var(--color-bg-popup);border:1px solid var(--color-fill-3);border-radius:4px;box-shadow:0 4px 10px rgba(0,0,0,0.1)}.yc-select-dropdown .yc-select-dropdown-header{border-bottom:1px solid var(--color-fill-3)}.yc-select-dropdown .yc-select-dropdown-footer{border-top:1px solid var(--color-fill-3)}.yc-select-dropdown .yc-scrollbar:deep(.yc-scrollbar-container){max-height:200px;overflow-x:hidden}.yc-select-dropdown .yc-scrollbar:deep(.yc-scrollbar-container) .yc-scrollbar-content{max-width:100%}.yc-select-dropdown .yc-select-dropdown-virtual-list{max-height:200px}.yc-select-dropdown .yc-select-dropdown-list{display:flex;flex-direction:column}.yc-select-dropdown .yc-select-dropdown-list .yc-select-option{flex-shrink:0}.yc-select-dropdown-loading{height:50px;width:100%;display:flex;justify-content:center;align-items:center}.yc-select-option{padding:0 12px;background-color:var(--color-bg-popup);line-height:36px;font-size:14px;color:var(--color-text-1);text-align:left;display:flex;align-items:center;transition:all .1s cubic-bezier(0, 0, 1, 1)}.yc-select-option:not(.yc-select-option-disabled):hover{background-color:var(--color-fill-2);color:var(--color-text-1)}.yc-select-option .yc-select-option-icon,.yc-select-option .yc-select-option-content,.yc-select-option .yc-select-option-suffix{flex-shrink:0;color:inherit}.yc-select-option .yc-select-option-icon{margin-right:8px}.yc-select-option .yc-select-option-suffix{margin-left:12px}.yc-select-option .yc-select-option-content{flex:1;display:flex;align-items:center}.yc-select-option .yc-checkbox{overflow:hidden}.yc-select-option .yc-checkbox:deep(.yc-checkbox-label){flex:1;flex-shrink:0}.yc-select-option-disabled{color:var(--color-text-4);background-color:var(--color-bg-popup);cursor:not-allowed}.yc-select-option-active{background-color:var(--color-fill-2)}.yc-option-group-label{width:100%;margin-top:8px;padding:0 12px;color:var(--color-text-3);font-size:12px;line-height:20px}
+.yc-select{width:100%;display:inline-flex;align-items:center}.yc-select .yc-input-outer .yc-input-wrapper .yc-input::placeholder{color:var(--color-text-3)}.yc-select .yc-input-placeholder{color:var(--color-text-3)}.yc-select .yc-select-suffix-icon,.yc-select .yc-select-search-icon,.yc-select .yc-select-clear-icon,.yc-select .yc-spin{font-size:12px;color:inherit;flex-shrink:0}.yc-select-no-border .yc-input-tag{background-color:transparent;box-shadow:none;border:none}.yc-select-no-border .yc-input-outer .yc-input-wrapper{background-color:transparent;box-shadow:none;border:none}.yc-select-allow-search .yc-select-search-icon{display:none}.yc-select-allow-search:focus-within .yc-select-clear-icon,.yc-select-allow-search:focus-within .yc-select-suffix-icon{display:none}.yc-select-allow-search:focus-within .yc-select-search-icon{display:block}.yc-select-allow-search .yc-input-outer .yc-input-wrapper .yc-input::placeholder{color:var(--color-text-3)}.yc-select-allow-clear .yc-select-clear-icon{display:none}.yc-select-allow-clear:hover .yc-select-search-icon,.yc-select-allow-clear:hover .yc-select-suffix-icon{display:none}.yc-select-allow-clear:hover .yc-select-clear-icon{display:flex}.yc-select-dropdown{width:100%;padding:4px 0;background-color:var(--color-bg-popup);border:1px solid var(--color-fill-3);border-radius:4px;box-shadow:0 4px 10px rgba(0,0,0,0.1)}.yc-select-dropdown .yc-select-dropdown-header{border-bottom:1px solid var(--color-fill-3)}.yc-select-dropdown .yc-select-dropdown-footer{border-top:1px solid var(--color-fill-3)}.yc-select-dropdown .yc-scrollbar .yc-scrollbar-container{max-height:200px;overflow-x:hidden}.yc-select-dropdown .yc-scrollbar .yc-scrollbar-container .yc-scrollbar-content{max-width:100%}.yc-select-dropdown .yc-select-dropdown-virtual-list{max-height:200px}.yc-select-dropdown .yc-select-dropdown-list{display:flex;flex-direction:column}.yc-select-dropdown .yc-select-dropdown-list .yc-select-option{flex-shrink:0}.yc-select-dropdown-loading{height:50px;width:100%;display:flex;justify-content:center;align-items:center}.yc-select-option{padding:0 12px;background-color:var(--color-bg-popup);line-height:36px;font-size:14px;color:var(--color-text-1);text-align:left;display:flex;align-items:center;transition:all .1s cubic-bezier(0, 0, 1, 1)}.yc-select-option:not(.yc-select-option-disabled):hover{background-color:var(--color-fill-2);color:var(--color-text-1)}.yc-select-option .yc-select-option-icon,.yc-select-option .yc-select-option-content,.yc-select-option .yc-select-option-suffix{flex-shrink:0;color:inherit}.yc-select-option .yc-select-option-icon{margin-right:8px}.yc-select-option .yc-select-option-suffix{margin-left:12px}.yc-select-option .yc-select-option-content{flex:1;display:flex;align-items:center}.yc-select-option .yc-checkbox{overflow:hidden}.yc-select-option .yc-checkbox .yc-checkbox-label{flex:1;flex-shrink:0}.yc-select-option-disabled{color:var(--color-text-4);background-color:var(--color-bg-popup);cursor:not-allowed}.yc-select-option-active{background-color:var(--color-fill-2)}.yc-option-group-label{width:100%;margin-top:8px;padding:0 12px;color:var(--color-text-3);font-size:12px;line-height:20px}

package/es/Select/index.js

@@ -1,17 +1,20 @@
-import _Select from "./Select.vue.js";
-import Option from "./Option.vue.js";
-import Optgroup from "./Optgroup.vue.js";
-const Select = Object.assign(_Select, {
-  option: Option,
-  group: Optgroup,
+import _sfc_main from "./Select.vue.js";
+/* empty css            */
+import _sfc_main$2 from "./Option.vue.js";
+/* empty css            */
+import _sfc_main$1 from "./Optgroup.vue.js";
+/* empty css              */
+const Select = Object.assign(_sfc_main, {
+  option: _sfc_main$2,
+  group: _sfc_main$1,
   install: (app) => {
-    app.component("Yc" + _Select.name, _Select);
-    app.component("Yc" + Option.name, Option);
-    app.component("Yc" + Optgroup.name, Optgroup);
+    app.component("Yc" + _sfc_main.name, _sfc_main);
+    app.component("Yc" + _sfc_main$2.name, _sfc_main$2);
+    app.component("Yc" + _sfc_main$1.name, _sfc_main$1);
   }
 });
 export {
-  Optgroup,
-  Option,
+  _sfc_main$1 as Optgroup,
+  _sfc_main$2 as Option,
   Select as default
 };

package/es/Skeleton/SkeletonLine.vue.js

@@ -1,7 +1,45 @@
-import _sfc_main from "./SkeletonLine.vue2.js";
-/* empty css                  */
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-const SkeletonLine = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-963b904e"]]);
+import { defineComponent, toRefs, computed, createElementBlock, openBlock, normalizeStyle, Fragment, renderList, unref } from "vue";
+import "../node_modules/tinycolor2/esm/tinycolor.js";
+import { valueToPx } from "../_shared/utils/dom.js";
+import "../_shared/utils/time.js";
+import "../Empty/index.js";
+/* empty css                             */
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "SkeletonLine"
+  },
+  __name: "SkeletonLine",
+  props: {
+    rows: { default: 1 },
+    widths: { default: () => [] },
+    lineHeight: { default: 20 },
+    lineSpacing: { default: 15 }
+  },
+  setup(__props) {
+    const props = __props;
+    const { lineSpacing } = toRefs(props);
+    const gap = computed(() => valueToPx(lineSpacing.value));
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "yc-skeleton-line",
+        style: normalizeStyle({
+          gap: gap.value
+        })
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.rows, (i) => {
+          return openBlock(), createElementBlock("div", {
+            class: "yc-skeleton-line-row",
+            key: i,
+            style: normalizeStyle({
+              height: unref(valueToPx)(_ctx.lineHeight),
+              width: _ctx.widths[i] ? unref(valueToPx)(_ctx.widths[i]) : "100%"
+            })
+          }, null, 4);
+        }), 128))
+      ], 4);
+    };
+  }
+});
 export {
-  SkeletonLine as default
+  _sfc_main as default
 };

package/es/Skeleton/SkeletonLine.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./SkeletonLine.vue.js";
+/* empty css                  */
+export {
+  _sfc_main as default
+};

package/es/Skeleton/SkeletonShape.vue.js

@@ -1,7 +1,31 @@
-import _sfc_main from "./SkeletonShape.vue2.js";
-/* empty css                   */
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-const SkeletonShape = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-24b69272"]]);
+import { defineComponent, createElementBlock, openBlock, normalizeClass, unref } from "vue";
+import "../node_modules/tinycolor2/esm/tinycolor.js";
+import "../_shared/utils/dom.js";
+import "../_shared/utils/time.js";
+import { getGlobalConfig } from "../_shared/utils/global-config.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "SkeletonShape"
+  },
+  __name: "SkeletonShape",
+  props: {
+    shape: { default: "sqaure" },
+    size: { default: void 0 }
+  },
+  setup(__props) {
+    const props = __props;
+    const { size } = getGlobalConfig(props);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([
+          "yc-skeleton-shape",
+          `yc-skeleton-shape-shape-${_ctx.shape}`,
+          `yc-skeleton-shape-size-${unref(size)}`
+        ])
+      }, null, 2);
+    };
+  }
+});
 export {
-  SkeletonShape as default
+  _sfc_main as default
 };

package/es/Skeleton/SkeletonShape.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./SkeletonShape.vue.js";
+/* empty css                   */
+export {
+  _sfc_main as default
+};

package/es/Skeleton/index.js

@@ -1,17 +1,19 @@
 import _sfc_main from "./Skeleton.vue.js";
-import SkeletonShape from "./SkeletonShape.vue.js";
-import SkeletonLine from "./SkeletonLine.vue.js";
+import _sfc_main$2 from "./SkeletonShape.vue.js";
+/* empty css                   */
+import _sfc_main$1 from "./SkeletonLine.vue.js";
+/* empty css                  */
 const Skeleton = Object.assign(_sfc_main, {
-  shape: SkeletonShape,
-  line: SkeletonLine,
+  shape: _sfc_main$2,
+  line: _sfc_main$1,
   install: (app) => {
     app.component("Yc" + _sfc_main.name, _sfc_main);
-    app.component("Yc" + SkeletonShape.name, SkeletonShape);
-    app.component("Yc" + SkeletonLine.name, SkeletonLine);
+    app.component("Yc" + _sfc_main$2.name, _sfc_main$2);
+    app.component("Yc" + _sfc_main$1.name, _sfc_main$1);
   }
 });
 export {
-  SkeletonLine,
-  SkeletonShape,
+  _sfc_main$1 as SkeletonLine,
+  _sfc_main$2 as SkeletonShape,
   Skeleton as default
 };

package/es/Slider/Slider.vue.js

@@ -1,7 +1,148 @@
-import _sfc_main from "./Slider.vue2.js";
-/* empty css            */
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-const _Slider = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-66ebd5c2"]]);
+import { defineComponent, ref, computed, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createCommentVNode, createBlock, createVNode, normalizeStyle } from "vue";
+import useContext from "./hooks/useContext.js";
+import _sfc_main$1 from "./SliderTicks.vue.js";
+/* empty css                 */
+import _sfc_main$2 from "./SliderBtn.vue.js";
+/* empty css               */
+import _sfc_main$3 from "./SliderInput.vue.js";
+/* empty css                 */
+const _hoisted_1 = ["aria-disabled"];
+const _hoisted_2 = {
+  key: 0,
+  class: "yc-slider-input"
+};
+const _hoisted_3 = {
+  key: 0,
+  class: "yc-slider-input-divider"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "Slider"
+  },
+  __name: "Slider",
+  props: {
+    modelValue: { default: void 0 },
+    defaultValue: { default: 0 },
+    step: { default: 1 },
+    min: { default: 0 },
+    marks: { default: () => {
+      return {};
+    } },
+    max: { default: 100 },
+    direction: { default: "horizontal" },
+    disabled: { type: Boolean, default: false },
+    showTicks: { type: Boolean, default: false },
+    showInput: { type: Boolean, default: false },
+    range: { type: Boolean, default: false },
+    showTooltip: { type: Boolean, default: true },
+    formatTooltip: { type: Function, default: (val) => {
+      return val + "";
+    } }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const trackRef = ref();
+    const { ticks, marks, range, direction, min, normalizeValue } = useContext().provide(props, emits, trackRef);
+    const startPosition = ref({
+      bottom: 0,
+      left: 0,
+      top: 0,
+      right: 0
+    });
+    const endPosition = ref({
+      bottom: 0,
+      left: 0,
+      top: 0,
+      right: 0
+    });
+    const position = computed(() => {
+      const { left, right, top, bottom } = startPosition.value;
+      if (!range.value) {
+        return direction.value == "vertical" ? {
+          top: top + "%",
+          bottom: normalizeValue(min.value) + "%"
+        } : {
+          left: normalizeValue(min.value) + "%",
+          right: right + "%"
+        };
+      }
+      const {
+        left: left1,
+        right: right1,
+        top: top1,
+        bottom: bottom1
+      } = endPosition.value;
+      return direction.value == "vertical" ? {
+        top: `${top < top1 ? top : top1}%`,
+        bottom: `${bottom < bottom1 ? bottom : bottom1}%`
+      } : {
+        left: `${left < left1 ? left : left1}%`,
+        right: `${right < right1 ? right : right1}%`
+      };
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([
+          "yc-slider",
+          `yc-slider-direction-${unref(direction)}`,
+          {
+            "yc-slider-disabled": _ctx.disabled
+          }
+        ])
+      }, [
+        createElementVNode("div", {
+          class: "yc-slider-track",
+          ref_key: "trackRef",
+          ref: trackRef
+        }, [
+          _ctx.showTicks ? (openBlock(), createBlock(_sfc_main$1, {
+            key: 0,
+            type: "ticks",
+            data: unref(ticks)
+          }, null, 8, ["data"])) : createCommentVNode("", true),
+          unref(marks).length ? (openBlock(), createBlock(_sfc_main$1, {
+            key: 1,
+            type: "dots",
+            data: unref(marks)
+          }, null, 8, ["data"])) : createCommentVNode("", true),
+          unref(marks).length ? (openBlock(), createBlock(_sfc_main$1, {
+            key: 2,
+            type: "marks",
+            data: unref(marks)
+          }, null, 8, ["data"])) : createCommentVNode("", true),
+          createElementVNode("div", {
+            class: "yc-slider-bar",
+            role: "slider",
+            tabindex: "0",
+            "aria-disabled": _ctx.disabled,
+            style: normalizeStyle(position.value)
+          }, null, 12, _hoisted_1),
+          createVNode(_sfc_main$2, {
+            position: startPosition.value,
+            "onUpdate:position": _cache[0] || (_cache[0] = ($event) => startPosition.value = $event),
+            type: "start"
+          }, null, 8, ["position"]),
+          unref(range) ? (openBlock(), createBlock(_sfc_main$2, {
+            key: 3,
+            position: endPosition.value,
+            "onUpdate:position": _cache[1] || (_cache[1] = ($event) => endPosition.value = $event),
+            type: "end"
+          }, null, 8, ["position"])) : createCommentVNode("", true)
+        ], 512),
+        _ctx.showInput ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          createVNode(_sfc_main$3, { type: "start" }),
+          unref(range) ? (openBlock(), createElementBlock("div", _hoisted_3)) : createCommentVNode("", true),
+          unref(range) ? (openBlock(), createBlock(_sfc_main$3, {
+            key: 1,
+            type: "end"
+          })) : createCommentVNode("", true)
+        ])) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
 export {
-  _Slider as default
+  _sfc_main as default
 };

package/es/Slider/Slider.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./Slider.vue.js";
+/* empty css            */
+export {
+  _sfc_main as default
+};

package/es/Slider/SliderBtn.vue.js

@@ -1,7 +1,98 @@
-import _sfc_main from "./SliderBtn.vue2.js";
-/* empty css               */
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-const SliderBtn = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9135a42c"]]);
+import { defineComponent, toRefs, ref, computed, watch, createBlock, openBlock, unref, isRef, withCtx, createElementVNode, normalizeStyle } from "vue";
+import useContext from "./hooks/useContext.js";
+import useSliderDraggable from "./hooks/useSliderDraggable.js";
+import Tooltip from "../Tooltip/index.js";
+import "../node_modules/tinycolor2/esm/tinycolor.js";
+import "../_shared/utils/dom.js";
+import "../_shared/utils/time.js";
+import "../Empty/index.js";
+/* empty css                             */
+import useControlValue from "../_shared/utils/control.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SliderBtn",
+  props: {
+    type: {},
+    position: {}
+  },
+  emits: ["update:position"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const { type } = toRefs(props);
+    const triggerRef = ref();
+    const {
+      trackRef,
+      min,
+      max,
+      direction,
+      disabled,
+      step,
+      showTooltip,
+      startValue,
+      endValue,
+      formatTooltip,
+      normalizeValue,
+      denormalizeValue
+    } = useContext().inject();
+    const computedValue = computed({
+      get() {
+        return type.value == "start" ? startValue.value : endValue.value;
+      },
+      set(val) {
+        if (type.value == "start") {
+          startValue.value = val;
+        } else {
+          endValue.value = val;
+        }
+      }
+    });
+    const { position, isDragging } = useSliderDraggable({
+      trackRef,
+      triggerRef,
+      computedValue,
+      direction,
+      step,
+      min,
+      max,
+      disabled,
+      denormalizeValue,
+      normalizeValue
+    });
+    const computedVisible = useControlValue(
+      ref(),
+      false,
+      () => {
+      },
+      (val) => {
+        return isDragging.value || val;
+      }
+    );
+    watch(position, () => {
+      emits("update:position", position);
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Tooltip), {
+        "popup-visible": unref(computedVisible),
+        "onUpdate:popupVisible": _cache[0] || (_cache[0] = ($event) => isRef(computedVisible) ? computedVisible.value = $event : null),
+        disabled: !unref(showTooltip),
+        position: unref(direction) == "vertical" ? "right" : "bottom",
+        content: unref(formatTooltip) ? unref(formatTooltip)(computedValue.value) : String(computedValue.value)
+      }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            class: "yc-slider-btn",
+            ref_key: "triggerRef",
+            ref: triggerRef,
+            style: normalizeStyle({
+              transform: unref(position).transform
+            })
+          }, null, 4)
+        ]),
+        _: 1
+      }, 8, ["popup-visible", "disabled", "position", "content"]);
+    };
+  }
+});
 export {
-  SliderBtn as default
+  _sfc_main as default
 };

package/es/Slider/SliderBtn.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./SliderBtn.vue.js";
+/* empty css               */
+export {
+  _sfc_main as default
+};

package/es/Slider/SliderInput.vue.js

@@ -1,7 +1,56 @@
-import _sfc_main from "./SliderInput.vue2.js";
-/* empty css                 */
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-const SliderInput = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1666bdc8"]]);
+import { defineComponent, toRefs, computed, createBlock, openBlock, unref } from "vue";
+import useContext from "./hooks/useContext.js";
+import InputNumber from "../InputNumber/index.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SliderInput",
+  props: {
+    type: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const { type } = toRefs(props);
+    const {
+      min,
+      max,
+      disabled,
+      startValue,
+      endValue,
+      tempStartValue,
+      tempEndValue
+    } = useContext().inject();
+    const computedValue = computed({
+      get() {
+        return type.value == "start" ? tempStartValue.value : tempEndValue.value;
+      },
+      set(val) {
+        if (type.value == "start") {
+          tempStartValue.value = val;
+        } else {
+          tempEndValue.value = val;
+        }
+      }
+    });
+    const handleSet = () => {
+      if (type.value == "start") {
+        startValue.value = computedValue.value;
+      } else {
+        endValue.value = computedValue.value;
+      }
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(InputNumber), {
+        modelValue: computedValue.value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => computedValue.value = $event),
+        min: unref(min),
+        max: unref(max),
+        disabled: unref(disabled),
+        "hide-button": "",
+        onBlur: handleSet,
+        onPressEnter: handleSet
+      }, null, 8, ["modelValue", "min", "max", "disabled"]);
+    };
+  }
+});
 export {
-  SliderInput as default
+  _sfc_main as default
 };

package/es/Slider/SliderInput.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./SliderInput.vue.js";
+/* empty css                 */
+export {
+  _sfc_main as default
+};

package/es/Slider/SliderTicks.vue.js

@@ -1,7 +1,66 @@
-import _sfc_main from "./SliderTicks.vue2.js";
-/* empty css                 */
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-const SliderTicks = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-fc1f66f9"]]);
+import { defineComponent, toRefs, createElementBlock, openBlock, normalizeClass, unref, Fragment, renderList, normalizeStyle, toDisplayString } from "vue";
+import useContext from "./hooks/useContext.js";
+const _hoisted_1 = ["onClick"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SliderTicks",
+  props: {
+    type: {},
+    data: {}
+  },
+  emits: ["labelClick"],
+  setup(__props) {
+    const props = __props;
+    const { type } = toRefs(props);
+    const { min, max, startValue, endValue, range, direction, normalizeValue } = useContext().inject();
+    const getPosition = (value) => {
+      const curValue = normalizeValue(value);
+      if (type.value == "ticks") {
+        return `calc(${curValue}% - 0.5px)`;
+      } else if (type.value == "dots") {
+        return `calc(${curValue}% - 4px)`;
+      } else {
+        return `calc(${curValue}% - 7px)`;
+      }
+    };
+    const isInRange = (value) => {
+      const curValue = normalizeValue(value);
+      const start = normalizeValue(startValue.value);
+      const end = normalizeValue(endValue.value);
+      const rangeMin = normalizeValue(min.value);
+      const rangeMax = normalizeValue(max.value);
+      if (!range.value) {
+        return start >= curValue && curValue >= rangeMin && curValue <= rangeMax;
+      } else {
+        const minVal = Math.min(start, end);
+        const maxVal = Math.max(start, end);
+        return curValue >= minVal && curValue <= maxVal;
+      }
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([`yc-slider-${unref(type)}`])
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.data, ({ label, value }) => {
+          return openBlock(), createElementBlock("span", {
+            key: value,
+            style: normalizeStyle({
+              left: unref(direction) == "horizontal" ? getPosition(value) : "",
+              bottom: unref(direction) == "vertical" ? getPosition(value) : ""
+            }),
+            class: normalizeClass([
+              `yc-slider-${unref(type).replace("s", "")}`,
+              {
+                "yc-slider-dot-active": unref(type) == "dots" && isInRange(value),
+                "yc-slider-tick-active": unref(type) == "ticks" && isInRange(value)
+              }
+            ]),
+            onClick: ($event) => _ctx.$emit("labelClick", value)
+          }, toDisplayString(unref(type) == "marks" ? label : ""), 15, _hoisted_1);
+        }), 128))
+      ], 2);
+    };
+  }
+});
 export {
-  SliderTicks as default
+  _sfc_main as default
 };