ninemoon-ui 0.0.27 → 0.1.0

package/dist/js/popover-45f75f86.js

@@ -0,0 +1,345 @@
+import { defineComponent, h, normalizeClass, normalizeStyle, ref, computed, nextTick, openBlock, createElementBlock, withModifiers, renderSlot, createBlock, Teleport, createVNode, Transition, withCtx, withDirectives, unref, vShow } from "vue";
+import { d as debounce, u as usePotion, c as createEscapeDirective } from "./index-b4e420ce.js";
+const DEFAULT_DEBOUNCE_WAIT$1 = 100;
+const createBgClickDirective = (options) => {
+  const config = {
+    debounceWait: DEFAULT_DEBOUNCE_WAIT$1,
+    moveModel: false,
+    onCheckOut: () => {
+    },
+    ...options
+  };
+  const bindEvents = (el, binding) => {
+    if (el._checkout_handlers_)
+      return;
+    const clickDom = debounce((e) => {
+      e.preventDefault();
+      config.onCheckOut(e, el);
+    }, config.debounceWait);
+    el._checkout_handlers_ = {
+      click: clickDom
+    };
+    if (config.moveModel) {
+      document.addEventListener("mousemove", clickDom);
+    } else {
+      document.addEventListener("click", clickDom);
+    }
+  };
+  const unbindEvents = (el) => {
+    if (el._checkout_handlers_) {
+      if (config.moveModel) {
+        document.removeEventListener("mousemove", el._checkout_handlers_.click);
+      } else {
+        document.removeEventListener("click", el._checkout_handlers_.click);
+      }
+      delete el._checkout_handlers_;
+    }
+  };
+  return {
+    mounted(el, binding) {
+      bindEvents(el);
+    },
+    beforeUnmount(el) {
+      unbindEvents(el);
+    },
+    // 添加 updated 钩子处理配置变化
+    updated(el, binding) {
+      if (binding.value !== binding.oldValue) {
+        unbindEvents(el);
+        bindEvents(el);
+      }
+    }
+  };
+};
+const DEFAULT_DEBOUNCE_WAIT = 100;
+const createScrollDirective = (options) => {
+  const config = {
+    debounceWait: DEFAULT_DEBOUNCE_WAIT,
+    onMove: () => {
+    },
+    ...options
+  };
+  const bindEvents = (el, binding) => {
+    if (el._watchwindow_handlers_) {
+      return;
+    }
+    const moveDom = debounce((e) => {
+      e.preventDefault();
+      config.onMove();
+    }, config.debounceWait);
+    el._watchwindow_handlers_ = {
+      move: moveDom
+    };
+    window.addEventListener("resize", el._watchwindow_handlers_.move);
+    window.addEventListener("scroll", el._watchwindow_handlers_.move);
+  };
+  const unbindEvents = (el) => {
+    if (el._watchwindow_handlers_) {
+      window.removeEventListener("resize", el._watchwindow_handlers_.move);
+      window.removeEventListener("scroll", el._watchwindow_handlers_.move);
+      delete el._watchwindow_handlers_;
+    }
+  };
+  return {
+    mounted(el, binding) {
+      bindEvents(el);
+    },
+    beforeUnmount(el) {
+      unbindEvents(el);
+    },
+    // 添加 updated 钩子处理配置变化
+    updated(el, binding) {
+      if (binding.value !== binding.oldValue) {
+        unbindEvents(el);
+        bindEvents(el);
+      }
+    }
+  };
+};
+const PLACEMENT_GROUPS = {
+  top: ["topleft", "topmiddle", "topright"],
+  bottom: ["bottomleft", "bottommiddle", "bottomright"],
+  center: ["centerleft", "centerright"]
+};
+const ARROW_CLASSES = {
+  base: 'absolute w-2.5 h-2.5 before:z-[-1] before:border before:border-gray-300 before:bg-white before:content-border before:rotate-45 before:content-[" "] before:w-2.5 before:h-2.5 before:absolute',
+  top: {
+    normal: "before:border-t-transparent before:border-l-transparent before:rounded-br",
+    exchange: "before:border-b-transparent before:border-r-transparent before:rounded-tl"
+  },
+  bottom: {
+    normal: "before:border-b-transparent before:border-r-transparent before:rounded-tl",
+    exchange: "before:border-t-transparent before:border-l-transparent before:rounded-br"
+  },
+  center: {
+    right: "before:border-r-transparent before:border-t-transparent before:rounded-bl",
+    left: "before:border-l-transparent before:border-b-transparent before:rounded-tr"
+  }
+};
+const arrowComponent = defineComponent({
+  name: "PopArrow",
+  props: {
+    arrowLeft: { type: Number, required: true },
+    arrowTop: { type: Number, required: true },
+    placement: { type: String, required: true },
+    arrowshow: { type: Boolean, required: true },
+    exChange: { type: Boolean, required: true },
+    beforebgcolor: { type: String }
+  },
+  setup(props) {
+    const getArrowStyles = () => {
+      const { placement, exChange, arrowLeft, arrowTop } = props;
+      const isTopGroup = PLACEMENT_GROUPS.top.includes(placement);
+      const isBottomGroup = PLACEMENT_GROUPS.bottom.includes(placement);
+      const isCenterGroup = PLACEMENT_GROUPS.center.includes(placement);
+      return {
+        left: isTopGroup || isBottomGroup ? `${arrowLeft}px` : placement === "centerright" ? "-5px" : null,
+        right: placement === "centerleft" ? "-5px" : null,
+        top: isCenterGroup ? `${arrowTop}px` : isBottomGroup && !exChange || isTopGroup && exChange ? "-5px" : null,
+        bottom: isTopGroup && !exChange || isBottomGroup && exChange ? "-5px" : null
+      };
+    };
+    const getArrowClasses = () => {
+      const { placement, exChange, beforebgcolor } = props;
+      const classes = [ARROW_CLASSES.base, beforebgcolor];
+      if (PLACEMENT_GROUPS.top.includes(placement)) {
+        classes.push(exChange ? ARROW_CLASSES.top.exchange : ARROW_CLASSES.top.normal);
+      }
+      if (PLACEMENT_GROUPS.bottom.includes(placement)) {
+        classes.push(exChange ? ARROW_CLASSES.bottom.exchange : ARROW_CLASSES.bottom.normal);
+      }
+      if (placement === "centerright") {
+        classes.push(ARROW_CLASSES.center.right);
+      }
+      if (placement === "centerleft") {
+        classes.push(ARROW_CLASSES.center.left);
+      }
+      return classes;
+    };
+    if (!props.arrowshow)
+      return;
+    return () => h("span", {
+      class: normalizeClass(getArrowClasses()),
+      style: normalizeStyle(getArrowStyles())
+    });
+  }
+});
+const defaultWidth = "200px";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "popover",
+  props: {
+    trigger: { default: "click" },
+    width: {},
+    placement: { default: "topleft" },
+    insertClass: {},
+    beforeHidden: {},
+    modelValue: { type: Boolean },
+    beforebgcolor: {},
+    arrowshow: { type: Boolean, default: true },
+    isselectMode: { type: Boolean, default: false }
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const base = ref();
+    const pop = ref();
+    const isLocalOpen = ref(false);
+    const shouldShow = computed(() => {
+      if (isLocalOpen.value || props.trigger === "native" && props.modelValue) {
+        nextTick(setPosition);
+      }
+      if (props.trigger === "native") {
+        return props.modelValue;
+      } else {
+        return isLocalOpen.value;
+      }
+    });
+    const emitAct = __emit;
+    const marginClass = computed(() => {
+      const marginMap = {
+        topleft: "-mt-3",
+        topmiddle: "-mt-3",
+        topright: "-mt-3",
+        bottomleft: "mt-3",
+        bottommiddle: "mt-3",
+        bottomright: "mt-3",
+        centerleft: "-ml-3",
+        centerright: "ml-3"
+      };
+      return marginMap[props.placement];
+    });
+    const showHandle = () => {
+      isLocalOpen.value = true;
+    };
+    const hovershowHandle = () => {
+      if (props.trigger === "hover") {
+        isLocalOpen.value = true;
+      }
+    };
+    const Left = ref(0);
+    const Top = ref(0);
+    const arrowLeft = ref(0);
+    const arrowTop = ref(0);
+    const exChange = ref(false);
+    const setPosition = () => {
+      const { top, bottom } = base.value.getBoundingClientRect();
+      if (top < 0 || bottom > window.innerHeight) {
+        hideHandle();
+        return;
+      }
+      const position = usePotion(base.value, pop.value, {
+        position: props.placement
+      });
+      Top.value = position.Top;
+      Left.value = position.Left;
+      arrowTop.value = position.arrowTop;
+      arrowLeft.value = position.arrowLeft;
+      exChange.value = position.exChange;
+    };
+    const vScroll = createScrollDirective({
+      onMove: () => {
+        if (shouldShow.value == false)
+          return;
+        setPosition();
+      }
+    });
+    const vClickoutside = createBgClickDirective({
+      onCheckOut: (event, el) => {
+        if (shouldShow.value == false)
+          return;
+        if (el.contains(event.target)) {
+          return;
+        } else if (base.value.contains(event.target)) {
+          return;
+        } else {
+          closeCenter();
+        }
+      },
+      moveModel: props.trigger === "hover"
+    });
+    const vEsc = createEscapeDirective({
+      onEscape: () => {
+        if (shouldShow.value == false)
+          return;
+        console.log("work");
+        hideHandle();
+      }
+    });
+    const closeCenter = () => {
+      if (props.beforeHidden) {
+        props.beforeHidden(hideHandle);
+      } else {
+        hideHandle();
+      }
+    };
+    const hideHandle = (disablecancelflag) => {
+      if (disablecancelflag === true) {
+        return;
+      } else {
+        if (props.trigger === "native") {
+          emitAct("update:modelValue", false);
+        } else {
+          isLocalOpen.value = false;
+        }
+      }
+    };
+    const widthNum = computed(() => {
+      if (!props.width)
+        return defaultWidth;
+      if (typeof props.width === "number") {
+        return `${props.width}px`;
+      } else if (typeof props.width === "string") {
+        const validUnit = /^(?:\d+(?:\.\d+)?)(?:px|%|em|rem|vw|vh)$/.test(
+          props.width
+        );
+        return validUnit ? props.width : `${props.width}px`;
+      }
+      return defaultWidth;
+    });
+    __expose({
+      hideHandle
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "inline-block w-full h-full",
+        ref_key: "base",
+        ref: base,
+        onClick: showHandle,
+        onMouseenter: withModifiers(hovershowHandle, ["prevent"])
+      }, [
+        renderSlot(_ctx.$slots, "reference"),
+        (openBlock(), createBlock(Teleport, { to: "body" }, [
+          createVNode(Transition, { name: "opecity" }, {
+            default: withCtx(() => [
+              withDirectives((openBlock(), createElementBlock("div", {
+                ref_key: "pop",
+                ref: pop,
+                class: normalizeClass(["absolute z-1000 rounded bg-white p-4 drop-shadow border border-gray-300 box-border", [marginClass.value, _ctx.insertClass]]),
+                style: normalizeStyle({ width: widthNum.value, top: `${Top.value}px`, left: `${Left.value}px` })
+              }, [
+                renderSlot(_ctx.$slots, "default"),
+                createVNode(unref(arrowComponent), {
+                  arrowLeft: arrowLeft.value,
+                  arrowTop: arrowTop.value,
+                  exChange: exChange.value,
+                  beforebgcolor: _ctx.beforebgcolor,
+                  placement: _ctx.placement,
+                  arrowshow: _ctx.arrowshow
+                }, null, 8, ["arrowLeft", "arrowTop", "exChange", "beforebgcolor", "placement", "arrowshow"])
+              ], 6)), [
+                [vShow, shouldShow.value],
+                [unref(vClickoutside)],
+                [unref(vEsc)],
+                [unref(vScroll)]
+              ])
+            ]),
+            _: 3
+          })
+        ]))
+      ], 544);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/js/radiobox-8f11e726.js

@@ -0,0 +1,49 @@
+import { defineComponent, inject, ref, computed, openBlock, createElementBlock, normalizeClass, withDirectives, createElementVNode, vModelRadio, toDisplayString } from "vue";
+const _hoisted_1 = ["value", "disabled"];
+const _hoisted_2 = { class: "pl-2 peer-disabled:text-word9" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "radiobox",
+  props: {
+    label: {},
+    value: {},
+    modelValue: {},
+    disabled: { type: Boolean, default: false },
+    button: { type: Boolean }
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const changeHandle = inject("_changeHandle_", (_) => {
+    });
+    const checkedValues = inject("_checkedValues_", ref());
+    const checkedState = computed({
+      get: () => {
+        return props.modelValue || (checkedValues == null ? void 0 : checkedValues.value);
+      },
+      set: (val) => {
+        emit("update:modelValue", val);
+        changeHandle(val);
+      }
+    });
+    const emit = __emit;
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("label", {
+        class: normalizeClass(["select-none inline-flex items-center", { "cursor-not-allowed": _ctx.disabled }])
+      }, [
+        withDirectives(createElementVNode("input", {
+          type: "radio",
+          value: _ctx.value,
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => checkedState.value = $event),
+          disabled: _ctx.disabled,
+          class: "peer disabled:cursor-not-allowed form-tick appearance-none h-4 w-4 rounded-full border border-gray-300 checked:border-transparent checked:bg-blue-600 focus:outline-none"
+        }, null, 8, _hoisted_1), [
+          [vModelRadio, checkedState.value]
+        ]),
+        createElementVNode("span", _hoisted_2, toDisplayString(_ctx.label), 1)
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/js/radiogroup-727923c7.js

@@ -0,0 +1,33 @@
+import { defineComponent, inject, provide, computed, openBlock, createElementBlock, renderSlot } from "vue";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "radiogroup",
+  props: {
+    modelValue: {},
+    showinput: { type: Boolean, default: false },
+    disabled: { type: Boolean }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const ParentGetChangeHandle = inject("changHandle", () => null);
+    const emit = __emit;
+    const changeHandle = (newVal) => {
+      emit("update:modelValue", newVal);
+      emit("change", newVal);
+      ParentGetChangeHandle(newVal);
+    };
+    provide("_changeHandle_", changeHandle);
+    provide(
+      "_checkedValues_",
+      computed(() => props.modelValue)
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, [
+        renderSlot(_ctx.$slots, "default")
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/js/scrollBar-07906042.js

@@ -0,0 +1,252 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, normalizeClass, createElementVNode, normalizeStyle, onMounted, onUnmounted, renderSlot, createBlock, createCommentVNode } from "vue";
+import { o as on, b as off, e as useResizeObserver } from "./index-b4e420ce.js";
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "movebar",
+  props: {
+    vertical: { type: Boolean, default: false },
+    move: {},
+    size: {},
+    parent: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const BAR_MAP = {
+      //  垂直滚动块的属性
+      vertical: {
+        offset: "offsetHeight",
+        scroll: "scrollTop",
+        scrollSize: "scrollHeight",
+        size: "height",
+        key: "vertical",
+        axis: "Y",
+        client: "clientY",
+        direction: "top"
+      },
+      //  水平滚动块的属性
+      horizontal: {
+        offset: "offsetWidth",
+        scroll: "scrollLeft",
+        scrollSize: "scrollWidth",
+        size: "width",
+        key: "horizontal",
+        axis: "X",
+        client: "clientX",
+        direction: "left"
+      }
+    };
+    const el = ref();
+    const thumb = ref();
+    const bar = computed(() => {
+      return BAR_MAP[props.vertical ? "vertical" : "horizontal"];
+    });
+    const wrap = computed(() => props.parent);
+    let baraxis = 0;
+    const clickTrackHandler = (e) => {
+      const offset = Math.abs(
+        // @ts-ignore
+        e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]
+      );
+      const thumbHalf = thumb.value[bar.value.offset] / 2;
+      const thumbPositionPercentage = (
+        // @ts-ignore
+        (offset - thumbHalf) * 100 / el.value[bar.value.offset]
+      );
+      wrap.value[bar.value.scroll] = // @ts-ignore
+      thumbPositionPercentage * wrap.value[bar.value.scrollSize] / 100;
+    };
+    const clickThumbHandler = (e) => {
+      if (e.ctrlKey || e.button === 2) {
+        return;
+      }
+      startDrag(e);
+      baraxis = // @ts-ignore
+      //  滑块的高度
+      e.currentTarget[bar.value.offset] - //  点击滑块距离顶部的位置 减去 滑块元素距离顶部的位置
+      // @ts-ignore
+      (e[bar.value.client] - // @ts-ignore
+      e.currentTarget.getBoundingClientRect()[bar.value.direction]);
+    };
+    const cursorDown = ref(false);
+    const startDrag = (e) => {
+      e.stopImmediatePropagation();
+      cursorDown.value = true;
+      on(document, "mousemove", mouseMoveDocumentHandler);
+      on(document, "mouseup", mouseUpDocumentHandler);
+      document.onselectstart = () => false;
+    };
+    const mouseMoveDocumentHandler = (e) => {
+      if (cursorDown.value === false)
+        return;
+      const prevPage = baraxis;
+      if (!prevPage)
+        return;
+      const offset = (
+        // @ts-ignore
+        (el.value.getBoundingClientRect()[bar.value.direction] - // @ts-ignore
+        e[bar.value.client]) * -1
+      );
+      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage;
+      const thumbPositionPercentage = (
+        // @ts-ignore
+        (offset - thumbClickPosition) * 100 / el.value[bar.value.offset]
+      );
+      wrap.value[bar.value.scroll] = // @ts-ignore
+      thumbPositionPercentage * wrap.value[bar.value.scrollSize] / 100;
+    };
+    const mouseUpDocumentHandler = () => {
+      cursorDown.value = false;
+      baraxis = 0;
+      off(document, "mousemove", mouseMoveDocumentHandler);
+      document.onselectstart = null;
+    };
+    const renderThumbstyle = () => {
+      const style = {};
+      const translate = `translate${bar.value.axis}(${props.move}%)`;
+      style[bar.value.size] = props.size;
+      style.transform = translate;
+      style.msTransform = translate;
+      style.webkitTransform = translate;
+      return style;
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        onMousedown: clickTrackHandler,
+        ref_key: "el",
+        ref: el,
+        class: normalizeClass(["absolute right-0.5 bottom-0.5 rounded transition-transform", [_ctx.vertical ? "top-0.5 w-1.5" : "left-0.5 h-1.5"]])
+      }, [
+        createElementVNode("div", {
+          onMousedown: clickThumbHandler,
+          ref_key: "thumb",
+          ref: thumb,
+          class: normalizeClass([_ctx.vertical ? "w-full" : "h-full", "bg-[#9092984d] cursor-pointer rounded"]),
+          style: normalizeStyle(renderThumbstyle())
+        }, null, 38)
+      ], 34);
+    };
+  }
+});
+const _hoisted_1 = {
+  key: 0,
+  class: "group/scroll relative h-full overflow-hidden"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "scrollBar",
+  props: {
+    native: { type: Boolean, default: false },
+    height: {},
+    maxHeight: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const warpStyle = computed(() => {
+      return {
+        maxHeight: props.maxHeight,
+        height: props.height
+      };
+    });
+    const wrap = ref();
+    const contentBox = ref();
+    const moveX = ref(0);
+    const moveY = ref(0);
+    const isTouching = ref(false);
+    const heightPercentage = ref(100);
+    const widthPercentage = ref(100);
+    const hasHor = computed(() => {
+      return widthPercentage.value !== 100;
+    });
+    const hasVer = computed(() => {
+      return heightPercentage.value !== 100;
+    });
+    const sizeHeight = computed(() => {
+      return `${heightPercentage.value}%`;
+    });
+    const sizeWidth = computed(() => {
+      return `${widthPercentage.value}%`;
+    });
+    const handleScroll = () => {
+      moveY.value = wrap.value.scrollTop / wrap.value.clientHeight * 100;
+      moveX.value = wrap.value.scrollLeft / wrap.value.clientWidth * 100;
+    };
+    const update = () => {
+      if (wrap.value) {
+        const { clientWidth, clientHeight, scrollWidth, scrollHeight } = wrap.value;
+        heightPercentage.value = scrollHeight > 0 ? Math.min(clientHeight / scrollHeight * 100, 100) : 100;
+        widthPercentage.value = scrollWidth > 0 ? Math.min(clientWidth / scrollWidth * 100, 100) : 100;
+      }
+    };
+    const { observe, unobserve } = useResizeObserver(update);
+    onMounted(() => {
+      if (props.native)
+        return;
+      contentBox.value && observe(contentBox.value);
+    });
+    onUnmounted(() => {
+      if (props.native)
+        return;
+      contentBox.value && unobserve(contentBox.value);
+    });
+    const setScrollTop = (percentage, options = { behavior: "auto" }) => {
+      if (!wrap.value)
+        return;
+      const validPercentage = Math.max(0, Math.min(percentage, 100));
+      const maxScroll = wrap.value.scrollHeight - wrap.value.clientHeight;
+      wrap.value.scrollTo({
+        top: maxScroll * validPercentage / 100,
+        behavior: options.behavior
+      });
+    };
+    const setScrollLeft = (percentage, options = { behavior: "auto" }) => {
+      if (!wrap.value)
+        return;
+      const validPercentage = Math.max(0, Math.min(percentage, 100));
+      const maxScroll = wrap.value.scrollWidth - wrap.value.clientWidth;
+      wrap.value.scrollTo({
+        left: maxScroll * validPercentage / 100,
+        behavior: options.behavior
+      });
+    };
+    __expose({
+      setScrollTop,
+      setScrollLeft
+    });
+    return (_ctx, _cache) => {
+      return !_ctx.native ? (openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", {
+          ref_key: "wrap",
+          ref: wrap,
+          onScrollPassive: handleScroll,
+          class: "overscroll-contain overflow-auto h-full scrollbar-none uiscroll",
+          style: normalizeStyle(warpStyle.value),
+          onTouchstart: _cache[0] || (_cache[0] = ($event) => isTouching.value = true),
+          onTouchend: _cache[1] || (_cache[1] = ($event) => isTouching.value = false)
+        }, [
+          createElementVNode("div", {
+            ref_key: "contentBox",
+            ref: contentBox
+          }, [
+            renderSlot(_ctx.$slots, "default")
+          ], 512)
+        ], 36),
+        hasHor.value ? (openBlock(), createBlock(_sfc_main$1, {
+          key: 0,
+          move: moveX.value,
+          size: sizeWidth.value,
+          parent: wrap.value,
+          class: normalizeClass(["opacity-0 group-hover/scroll:opacity-100 max-sm:opacity-100 sm:group-hover/scroll:opacity-100 transition-opacity duration-300", { "opacity-100": isTouching.value }])
+        }, null, 8, ["move", "size", "parent", "class"])) : createCommentVNode("", true),
+        hasVer.value ? (openBlock(), createBlock(_sfc_main$1, {
+          key: 1,
+          vertical: "",
+          move: moveY.value,
+          size: sizeHeight.value,
+          parent: wrap.value,
+          class: normalizeClass(["opacity-0 group-hover/scroll:opacity-100 max-sm:opacity-100 sm:group-hover/scroll:opacity-100 transition-opacity duration-300", { "opacity-100": isTouching.value }])
+        }, null, 8, ["move", "size", "parent", "class"])) : createCommentVNode("", true)
+      ])) : renderSlot(_ctx.$slots, "default", { key: 1 });
+    };
+  }
+});
+export {
+  _sfc_main as default
+};