import { defineComponent as X, ref as p, computed as a, onMounted as w, nextTick as C, onBeforeUnmount as g, openBlock as o, createElementBlock as n, normalizeClass as d, normalizeStyle as f, createElementVNode as i, createCommentVNode as s } from "vue";
import { C as L } from "../Shared/base-PQGakkrl.js";
const k = {
  key: 3,
  class: "fenceScrollX-cover"
}, W = /* @__PURE__ */ X({
  name: "ClScrollXFence",
  __name: "Index",
  props: {
    isShowLeft: {
      type: Boolean,
      default: !0
    },
    isShowRight: {
      type: Boolean,
      default: !0
    },
    isShowCorner: {
      type: Boolean,
      default: !1
    },
    isShowCover: {
      type: Boolean,
      default: !1
    },
    cornerType: {
      type: String,
      default: ""
      // right-top | right-bottom
    },
    leftWidth: {
      type: String,
      default: "0"
    },
    centerWidth: {
      type: String,
      default: "0"
    },
    rightWidth: {
      type: String,
      default: "0"
    },
    initLeft: String
  },
  emits: ["onScrollX"],
  setup(t, { expose: S, emit: h }) {
    const r = t, v = h, l = p(null), m = a(() => {
      const e = {
        "panel-fenceScrollX": !0
      };
      return r.isShowCorner && r.cornerType.length > 0 && (e[`fenceScrollX-showCorner-${r.cornerType}`] = !0), L.osType().isMobile && (e["fenceScrollX-mob"] = !0), e;
    }), y = a(() => {
      const e = {
        "fenceScrollX-corner": !0
      };
      return r.cornerType.length > 0 && (e[`fenceScrollX-corner-${r.cornerType}`] = !0), e;
    }), u = (e) => {
      v("onScrollX", e);
    };
    return w(() => {
      C(() => {
        l.value && (l.value.addEventListener("scroll", u), r.initLeft && (l.value.scrollLeft = parseInt(r.initLeft)));
      });
    }), g(() => {
      l.value && l.value.removeEventListener("scroll", u);
    }), S({
      setScrollLeft: (e) => {
        l.value && (l.value.scrollLeft = e);
      }
    }), (e, c) => (o(), n("div", {
      class: d(m.value)
    }, [
      t.isShowLeft ? (o(), n("div", {
        key: 0,
        class: "fenceScrollX-left",
        style: f({ width: t.leftWidth })
      }, [...c[0] || (c[0] = [
        i("div", null, null, -1)
      ])], 4)) : s("", !0),
      i("div", {
        class: "fenceScrollX-center",
        ref_key: "refElScrollX",
        ref: l
      }, [
        i("div", {
          style: f({ width: t.centerWidth })
        }, null, 4)
      ], 512),
      t.isShowRight ? (o(), n("div", {
        key: 1,
        class: "fenceScrollX-right",
        style: f({ width: t.rightWidth })
      }, [...c[1] || (c[1] = [
        i("div", null, null, -1)
      ])], 4)) : s("", !0),
      t.isShowCorner ? (o(), n("div", {
        key: 2,
        class: d(y.value)
      }, null, 2)) : s("", !0),
      t.isShowCover ? (o(), n("div", k)) : s("", !0)
    ], 2));
  }
});
export {
  W as default
};
//# sourceMappingURL=ClScrollXFence.js.map
