@web-utils/component 4.0.16 → 5.0.0-beta02

package/swiper/index.mjs

@@ -1,120 +1,128 @@
-import { getEleWidth as r } from "@web-utils/core";
-import a from "../resize-observer/index.mjs";
-import "../resize-observer/style.css";
-import { n as o } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
-const h = {
-  name: "Swiper",
-  components: {
-    ResizeObserver: a
-  },
-  data() {
-    return {
-      mouseDown: !1,
-      swiperBoxWith: 0,
-      swiperContentWidth: 0,
-      translateX: 0,
-      reachedLeft: !0,
-      reachedRight: !1,
-      childrenWidth: [],
-      swiperContentStyle: {
-        transitionDuration: "0ms",
-        transform: "translate3d(0px, 0px, 0px)"
-      }
-    };
-  },
-  async mounted() {
-    await this.layout();
-  },
-  updated() {
-    this.computeContentWidth();
-  },
-  methods: {
-    async layout() {
-      await this.$nextTick(), this.computeContentWidth(), this.resize();
-    },
-    resize() {
-      this.swiperBoxWith = this.$refs.swiperBox.offsetWidth;
-    },
-    computeContentWidth() {
-      let e = 0;
-      const t = [], { children: s } = this.$refs.swiperContent;
-      Array.prototype.forEach.call(s, (i) => {
-        const n = r(i);
-        e += n, t.push(n);
-      }), this.childrenWidth = t, this.swiperContentWidth = e;
-    },
-    updateDuration(e) {
-      this.swiperContentStyle.transitionDuration = e ? "300ms" : "0ms";
-    },
-    setTranslateX(e) {
-      this.swiperContentWidth <= this.swiperBoxWith || (e > 0 ? (this.translateX = 0, this.reachedLeft = !0, this.reachedRight = !1) : e - this.swiperBoxWith < -this.swiperContentWidth ? (this.translateX = -this.swiperContentWidth + this.swiperBoxWith, this.reachedLeft = !1, this.reachedRight = !0) : (this.translateX = e, this.reachedLeft = !1, this.reachedRight = !1), this.swiperContentStyle.transform = `translate3d(${this.translateX}px, 0px, 0px)`);
-    },
-    clickLeft() {
-      this.updateDuration(!0);
-      let e = this.translateX + this.swiperBoxWith, t = e;
-      if (e < 0) {
-        t = 0, e = -e;
-        for (let s = 0, i = this.childrenWidth.length; s < i && (t += this.childrenWidth[s], !(t >= e)); s++)
-          ;
-        t = -t;
-      }
-      this.setTranslateX(t);
-    },
-    clickRight() {
-      this.updateDuration(!0);
-      const e = Math.abs(this.translateX - this.swiperBoxWith);
-      let t = 0;
-      for (let s = 0, i = this.childrenWidth.length; s < i; s++)
-        if (t += this.childrenWidth[s], t >= e) {
-          t > e && (t -= this.childrenWidth[s]);
-          break;
-        }
-      this.setTranslateX(-t);
-    },
-    onMouseWheel(e) {
-      this.updateDuration(!0), e.deltaMode === WheelEvent.DOM_DELTA_LINE ? this.setTranslateX(this.translateX - e.deltaY * 30) : e.deltaMode === WheelEvent.DOM_DELTA_PAGE ? e.deltaY > 0 ? this.clickRight() : this.clickLeft() : this.setTranslateX(this.translateX - e.deltaY);
-    },
-    onMouseDown(e) {
-      this.mouseDown = !0, this.startX = e.clientX, this.translateXRaw = this.translateX, window.addEventListener("mousemove", this.onMouseMove, { passive: !1 }), window.addEventListener("mouseup", this.onMouseUp, { passive: !1 });
-    },
-    onMouseUp(e) {
-      this.mouseDown = !1, this.updateDuration(!0), this.$refs.swiperContent.addEventListener("transitionend", this.transitionend), this.$refs.swiperContent.addEventListener("webkitTransitionEnd", this.transitionend);
-      const t = e.clientX - this.startX;
-      if (t < 0) {
-        const s = this.translateX + t;
-        this.setTranslateX(s);
-      }
-      if (t > 0) {
-        const s = this.translateX + t;
-        this.setTranslateX(s);
-      }
-      window.removeEventListener("mousemove", this.onMouseMove), window.removeEventListener("mouseup", this.onMouseUp);
-    },
-    onMouseMove(e) {
-      this.mouseDown && requestAnimationFrame(() => {
-        const t = e.clientX - this.startX, s = this.translateXRaw + t;
-        this.setTranslateX(s);
-      });
-    },
-    transitionend() {
-      this.updateDuration(!1), this.$refs.swiperContent.removeEventListener("transitionend", this.transitionend), this.$refs.swiperContent.removeEventListener("webkitTransitionEnd", this.transitionend);
-    }
-  }
-};
-var l = function() {
-  var t = this, s = t._self._c;
-  return s("div", { staticClass: "egd-swiper" }, [s("ElButton", { staticClass: "el-carousel__arrow el-carousel__arrow--left", attrs: { disabled: t.reachedLeft, icon: "el-icon-arrow-left" }, on: { click: t.clickLeft } }), s("div", { ref: "swiperBox", staticClass: "egd-swiper-box", on: { wheel: function(i) {
-    return i.stopPropagation(), i.preventDefault(), t.onMouseWheel.apply(null, arguments);
-  } } }, [s("div", { ref: "swiperContent", staticClass: "egd-swiper-content", style: t.swiperContentStyle }, [t._t("default")], 2)]), s("ElButton", { staticClass: "el-carousel__arrow el-carousel__arrow--right", attrs: { disabled: t.reachedRight, icon: "el-icon-arrow-right" }, on: { click: t.clickRight } }), s("ResizeObserver", { on: { notify: t.resize } })], 1);
-}, d = [], c = /* @__PURE__ */ o(
-  h,
-  l,
-  d,
-  !1,
-  null,
-  null
-);
-const m = c.exports;
-export {
-  m as default
-};
+import { t as e } from "../chunks/_plugin-vue_export-helper.7vrlOII_.mjs";
+import t from "../resize-observer/index.mjs";
+import { createElementBlock as n, createElementVNode as r, createVNode as i, normalizeStyle as a, openBlock as o, renderSlot as s, resolveComponent as c, withModifiers as l } from "vue";
+import { getEleWidth as u } from "@web-utils/core";
+//#region src/components/Swiper.vue
+var d = {
+	name: "Swiper",
+	components: { ResizeObserver: t },
+	data() {
+		return {
+			mouseDown: !1,
+			swiperBoxWith: 0,
+			swiperContentWidth: 0,
+			translateX: 0,
+			reachedLeft: !0,
+			reachedRight: !1,
+			childrenWidth: [],
+			swiperContentStyle: {
+				transitionDuration: "0ms",
+				transform: "translate3d(0px, 0px, 0px)"
+			}
+		};
+	},
+	async mounted() {
+		await this.layout();
+	},
+	updated() {
+		this.computeContentWidth();
+	},
+	methods: {
+		async layout() {
+			await this.$nextTick(), this.computeContentWidth(), this.resize();
+		},
+		resize() {
+			this.swiperBoxWith = this.$refs.swiperBox.offsetWidth;
+		},
+		computeContentWidth() {
+			let e = 0, t = [], { children: n } = this.$refs.swiperContent;
+			Array.prototype.forEach.call(n, (n) => {
+				let r = u(n);
+				e += r, t.push(r);
+			}), this.childrenWidth = t, this.swiperContentWidth = e;
+		},
+		updateDuration(e) {
+			this.swiperContentStyle.transitionDuration = e ? "300ms" : "0ms";
+		},
+		setTranslateX(e) {
+			this.swiperContentWidth <= this.swiperBoxWith || (e > 0 ? (this.translateX = 0, this.reachedLeft = !0, this.reachedRight = !1) : e - this.swiperBoxWith < -this.swiperContentWidth ? (this.translateX = -this.swiperContentWidth + this.swiperBoxWith, this.reachedLeft = !1, this.reachedRight = !0) : (this.translateX = e, this.reachedLeft = !1, this.reachedRight = !1), this.swiperContentStyle.transform = `translate3d(${this.translateX}px, 0px, 0px)`);
+		},
+		clickLeft() {
+			this.updateDuration(!0);
+			let e = this.translateX + this.swiperBoxWith, t = e;
+			if (e < 0) {
+				t = 0, e = -e;
+				for (let n = 0, r = this.childrenWidth.length; n < r && (t += this.childrenWidth[n], !(t >= e)); n++);
+				t = -t;
+			}
+			this.setTranslateX(t);
+		},
+		clickRight() {
+			this.updateDuration(!0);
+			let e = Math.abs(this.translateX - this.swiperBoxWith), t = 0;
+			for (let n = 0, r = this.childrenWidth.length; n < r; n++) if (t += this.childrenWidth[n], t >= e) {
+				t > e && (t -= this.childrenWidth[n]);
+				break;
+			}
+			this.setTranslateX(-t);
+		},
+		onMouseWheel(e) {
+			this.updateDuration(!0), e.deltaMode === WheelEvent.DOM_DELTA_LINE ? this.setTranslateX(this.translateX - e.deltaY * 30) : e.deltaMode === WheelEvent.DOM_DELTA_PAGE ? e.deltaY > 0 ? this.clickRight() : this.clickLeft() : this.setTranslateX(this.translateX - e.deltaY);
+		},
+		onMouseDown(e) {
+			this.mouseDown = !0, this.startX = e.clientX, this.translateXRaw = this.translateX, window.addEventListener("mousemove", this.onMouseMove, { passive: !1 }), window.addEventListener("mouseup", this.onMouseUp, { passive: !1 });
+		},
+		onMouseUp(e) {
+			this.mouseDown = !1, this.updateDuration(!0), this.$refs.swiperContent.addEventListener("transitionend", this.transitionend), this.$refs.swiperContent.addEventListener("webkitTransitionEnd", this.transitionend);
+			let t = e.clientX - this.startX;
+			if (t < 0) {
+				let e = this.translateX + t;
+				this.setTranslateX(e);
+			}
+			if (t > 0) {
+				let e = this.translateX + t;
+				this.setTranslateX(e);
+			}
+			window.removeEventListener("mousemove", this.onMouseMove), window.removeEventListener("mouseup", this.onMouseUp);
+		},
+		onMouseMove(e) {
+			this.mouseDown && requestAnimationFrame(() => {
+				let t = e.clientX - this.startX, n = this.translateXRaw + t;
+				this.setTranslateX(n);
+			});
+		},
+		transitionend() {
+			this.updateDuration(!1), this.$refs.swiperContent.removeEventListener("transitionend", this.transitionend), this.$refs.swiperContent.removeEventListener("webkitTransitionEnd", this.transitionend);
+		}
+	}
+}, f = { class: "egd-swiper" };
+function p(e, t, u, d, p, m) {
+	let h = c("ElButton"), g = c("ResizeObserver");
+	return o(), n("div", f, [
+		i(h, {
+			class: "el-carousel__arrow el-carousel__arrow--left",
+			disabled: p.reachedLeft,
+			icon: "el-icon-arrow-left",
+			onClick: m.clickLeft
+		}, null, 8, ["disabled", "onClick"]),
+		r("div", {
+			ref: "swiperBox",
+			class: "egd-swiper-box",
+			onWheel: t[0] || (t[0] = l((...e) => m.onMouseWheel && m.onMouseWheel(...e), ["stop", "prevent"]))
+		}, [r("div", {
+			ref: "swiperContent",
+			class: "egd-swiper-content",
+			style: a(p.swiperContentStyle)
+		}, [s(e.$slots, "default")], 4)], 544),
+		i(h, {
+			class: "el-carousel__arrow el-carousel__arrow--right",
+			disabled: p.reachedRight,
+			icon: "el-icon-arrow-right",
+			onClick: m.clickRight
+		}, null, 8, ["disabled", "onClick"]),
+		i(g, { onNotify: m.resize }, null, 8, ["onNotify"])
+	]);
+}
+var m = /* @__PURE__ */ e(d, [["render", p]]);
+//#endregion
+export { m as default };

package/tab/index.mjs

@@ -1,119 +1,117 @@
-import { p as n } from "../chunks/tab-mixin.BNK6dxLN.mjs";
-import { n as a } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
-const s = {
-  name: "Tab",
-  mixins: [n],
-  props: {
-    lineWidth: {
-      type: Number,
-      default: 3
-    },
-    activeColor: String,
-    barActiveColor: String,
-    animate: {
-      type: Boolean,
-      default: !0
-    },
-    customBarWidth: [Function, String],
-    scrollThreshold: {
-      type: Number,
-      default: 4
-    },
-    barPosition: {
-      type: String,
-      default: "bottom",
-      validator(t) {
-        return ["bottom", "top"].indexOf(t) !== -1;
-      }
-    }
-  },
-  data() {
-    return {
-      direction: "forward",
-      hasReady: !1
-    };
-  },
-  computed: {
-    barLeft() {
-      if (this.hasReady) {
-        const t = this.scrollable ? window.innerWidth / this.$children[this.currentIndex || 0].$el.getBoundingClientRect().width : this.number;
-        return `${this.currentIndex * (100 / t)}%`;
-      }
-      return null;
-    },
-    barRight() {
-      if (this.hasReady) {
-        const t = this.scrollable ? window.innerWidth / this.$children[this.currentIndex || 0].$el.getBoundingClientRect().width : this.number;
-        return `${(t - this.currentIndex - 1) * (100 / t)}%`;
-      }
-      return null;
-    },
-    // when prop:custom-bar-width
-    innerBarStyle() {
-      return {
-        width: typeof this.customBarWidth == "function" ? this.customBarWidth(this.currentIndex) : this.customBarWidth,
-        backgroundColor: this.barActiveColor || this.activeColor
-      };
-    },
-    // end
-    barStyle() {
-      const t = {
-        left: this.barLeft,
-        right: this.barRight,
-        display: "block",
-        height: `${this.lineWidth}px`,
-        transition: this.hasReady ? null : "none"
-      };
-      return this.customBarWidth ? t.backgroundColor = "transparent" : t.backgroundColor = this.barActiveColor || this.activeColor, t;
-    },
-    barClass() {
-      return {
-        "vux-tab-ink-bar-transition-forward": this.direction === "forward",
-        "vux-tab-ink-bar-transition-backward": this.direction === "backward"
-      };
-    },
-    scrollable() {
-      return this.number > this.scrollThreshold;
-    }
-  },
-  watch: {
-    currentIndex(t, r) {
-      this.direction = t > r ? "forward" : "backward", this.$emit("on-index-change", t, r), this.hasReady && this.scrollToActiveTab();
-    }
-  },
-  mounted() {
-    this.$nextTick(() => {
-      setTimeout(() => {
-        this.hasReady = !0;
-      }, 0);
-    });
-  },
-  methods: {
-    scrollToActiveTab() {
-      if (!this.scrollable || !this.$children || !this.$children.length)
-        return;
-      const t = this.$children[this.currentIndex].$el;
-      let r = 0;
-      const i = () => {
-        const e = this.$refs.nav;
-        e.scrollLeft += (t.offsetLeft - (e.offsetWidth - t.offsetWidth) / 2 - e.scrollLeft) / 15, ++r < 15 && window.requestAnimationFrame(i);
-      };
-      window.requestAnimationFrame(i);
-    }
-  }
-};
-var o = function() {
-  var r = this, i = r._self._c;
-  return i("div", { staticClass: "vux-tab-wrap", class: r.barPosition === "top" ? "vux-tab-bar-top" : "" }, [i("div", { staticClass: "vux-tab-container" }, [i("div", { ref: "nav", staticClass: "vux-tab", class: [{ "vux-tab-no-animate": !r.animate, scrollable: r.scrollable }] }, [r._t("default"), r.animate ? i("div", { staticClass: "vux-tab-ink-bar", class: r.barClass, style: r.barStyle }, [r.customBarWidth ? i("span", { staticClass: "vux-tab-bar-inner", style: r.innerBarStyle }) : r._e()]) : r._e()], 2)])]);
-}, l = [], c = /* @__PURE__ */ a(
-  s,
-  o,
-  l,
-  !1,
-  null,
-  null
-);
-const b = c.exports;
-export {
-  b as default
-};
+import { t as e } from "../chunks/_plugin-vue_export-helper.7vrlOII_.mjs";
+import { n as t } from "../chunks/tab-mixin.7zuMMM1E.mjs";
+import { createCommentVNode as n, createElementBlock as r, createElementVNode as i, normalizeClass as a, normalizeStyle as o, openBlock as s, renderSlot as c } from "vue";
+//#region src/components/tab/Tab.vue
+var l = {
+	name: "Tab",
+	mixins: [t],
+	props: {
+		lineWidth: {
+			type: Number,
+			default: 3
+		},
+		activeColor: String,
+		barActiveColor: String,
+		animate: {
+			type: Boolean,
+			default: !0
+		},
+		customBarWidth: [Function, String],
+		scrollThreshold: {
+			type: Number,
+			default: 4
+		},
+		barPosition: {
+			type: String,
+			default: "bottom",
+			validator(e) {
+				return ["bottom", "top"].indexOf(e) !== -1;
+			}
+		}
+	},
+	data() {
+		return {
+			direction: "forward",
+			hasReady: !1
+		};
+	},
+	computed: {
+		barLeft() {
+			if (this.hasReady) {
+				let e = this.scrollable ? window.innerWidth / this.$children[this.currentIndex || 0].$el.getBoundingClientRect().width : this.number;
+				return `${this.currentIndex * (100 / e)}%`;
+			}
+			return null;
+		},
+		barRight() {
+			if (this.hasReady) {
+				let e = this.scrollable ? window.innerWidth / this.$children[this.currentIndex || 0].$el.getBoundingClientRect().width : this.number;
+				return `${(e - this.currentIndex - 1) * (100 / e)}%`;
+			}
+			return null;
+		},
+		innerBarStyle() {
+			return {
+				width: typeof this.customBarWidth == "function" ? this.customBarWidth(this.currentIndex) : this.customBarWidth,
+				backgroundColor: this.barActiveColor || this.activeColor
+			};
+		},
+		barStyle() {
+			let e = {
+				left: this.barLeft,
+				right: this.barRight,
+				display: "block",
+				height: `${this.lineWidth}px`,
+				transition: this.hasReady ? null : "none"
+			};
+			return this.customBarWidth ? e.backgroundColor = "transparent" : e.backgroundColor = this.barActiveColor || this.activeColor, e;
+		},
+		barClass() {
+			return {
+				"vux-tab-ink-bar-transition-forward": this.direction === "forward",
+				"vux-tab-ink-bar-transition-backward": this.direction === "backward"
+			};
+		},
+		scrollable() {
+			return this.number > this.scrollThreshold;
+		}
+	},
+	watch: { currentIndex(e, t) {
+		this.direction = e > t ? "forward" : "backward", this.$emit("on-index-change", e, t), this.hasReady && this.scrollToActiveTab();
+	} },
+	mounted() {
+		this.$nextTick(() => {
+			setTimeout(() => {
+				this.hasReady = !0;
+			}, 0);
+		});
+	},
+	methods: { scrollToActiveTab() {
+		if (!this.scrollable || !this.$children || !this.$children.length) return;
+		let e = this.$children[this.currentIndex].$el, t = 0, n = () => {
+			let r = this.$refs.nav;
+			r.scrollLeft += (e.offsetLeft - (r.offsetWidth - e.offsetWidth) / 2 - r.scrollLeft) / 15, ++t < 15 && window.requestAnimationFrame(n);
+		};
+		window.requestAnimationFrame(n);
+	} }
+}, u = { class: "vux-tab-container" };
+function d(e, t, l, d, f, p) {
+	return s(), r("div", { class: a([l.barPosition === "top" ? "vux-tab-bar-top" : "", "vux-tab-wrap"]) }, [i("div", u, [i("div", {
+		ref: "nav",
+		class: a([[{
+			"vux-tab-no-animate": !l.animate,
+			scrollable: p.scrollable
+		}], "vux-tab"])
+	}, [c(e.$slots, "default"), l.animate ? (s(), r("div", {
+		key: 0,
+		class: a([p.barClass, "vux-tab-ink-bar"]),
+		style: o(p.barStyle)
+	}, [l.customBarWidth ? (s(), r("span", {
+		key: 0,
+		style: o(p.innerBarStyle),
+		class: "vux-tab-bar-inner"
+	}, null, 4)) : n("v-if", !0)], 6)) : n("v-if", !0)], 2)])], 2);
+}
+var f = /* @__PURE__ */ e(l, [["render", d]]);
+//#endregion
+export { f as default };

package/tab-item/index.mjs

@@ -1,57 +1,49 @@
-import { c as a } from "../chunks/tab-mixin.BNK6dxLN.mjs";
-import { n as r } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
-const l = {
-  name: "TabItem",
-  mixins: [a],
-  props: {
-    activeClass: {
-      type: String
-    },
-    disabled: Boolean,
-    badgeBackground: {
-      type: String,
-      default: "#f74c31"
-    },
-    badgeColor: {
-      type: String,
-      default: "#fff"
-    },
-    badgeLabel: {
-      type: String
-    }
-  },
-  computed: {
-    style() {
-      return {
-        borderWidth: `${this.$parent.lineWidth}px`,
-        borderColor: this.$parent.activeColor,
-        color: this.currentSelected ? this.$parent.activeColor : this.disabled ? this.$parent.disabledColor : this.$parent.defaultColor,
-        border: this.$parent.animate ? "none" : "auto"
-      };
-    }
-  }
-};
-var n = function() {
-  var e = this, t = e._self._c;
-  return t("div", { staticClass: "vux-tab-item", class: [
-    e.currentSelected ? e.activeClass : "",
-    {
-      "vux-tab-selected": e.currentSelected,
-      "vux-tab-disabled": e.disabled
-    }
-  ], style: e.style, on: { click: e.onItemClick } }, [e._t("default"), typeof e.badgeLabel < "u" && e.badgeLabel !== "" ? t("span", { staticClass: "vux-tab-item-badge", style: {
-    background: e.badgeBackground,
-    color: e.badgeColor
-  } }, [e._v(" " + e._s(e.badgeLabel) + " ")]) : e._e()], 2);
-}, s = [], o = /* @__PURE__ */ r(
-  l,
-  n,
-  s,
-  !1,
-  null,
-  null
-);
-const b = o.exports;
-export {
-  b as default
+import { t as e } from "../chunks/_plugin-vue_export-helper.7vrlOII_.mjs";
+import { t } from "../chunks/tab-mixin.7zuMMM1E.mjs";
+import { createCommentVNode as n, createElementBlock as r, normalizeClass as i, normalizeStyle as a, openBlock as o, renderSlot as s, toDisplayString as c } from "vue";
+//#region src/components/tab/TabItem.vue
+var l = {
+	name: "TabItem",
+	mixins: [t],
+	props: {
+		activeClass: { type: String },
+		disabled: Boolean,
+		badgeBackground: {
+			type: String,
+			default: "#f74c31"
+		},
+		badgeColor: {
+			type: String,
+			default: "#fff"
+		},
+		badgeLabel: { type: String }
+	},
+	computed: { style() {
+		return {
+			borderWidth: `${this.$parent.lineWidth}px`,
+			borderColor: this.$parent.activeColor,
+			color: this.currentSelected ? this.$parent.activeColor : this.disabled ? this.$parent.disabledColor : this.$parent.defaultColor,
+			border: this.$parent.animate ? "none" : "auto"
+		};
+	} }
 };
+function u(e, t, l, u, d, f) {
+	return o(), r("div", {
+		class: i([[e.currentSelected ? l.activeClass : "", {
+			"vux-tab-selected": e.currentSelected,
+			"vux-tab-disabled": l.disabled
+		}], "vux-tab-item"]),
+		style: a(f.style),
+		onClick: t[0] || (t[0] = (...t) => e.onItemClick && e.onItemClick(...t))
+	}, [s(e.$slots, "default"), l.badgeLabel !== void 0 && l.badgeLabel !== "" ? (o(), r("span", {
+		key: 0,
+		style: a({
+			background: l.badgeBackground,
+			color: l.badgeColor
+		}),
+		class: "vux-tab-item-badge"
+	}, c(l.badgeLabel), 5)) : n("v-if", !0)], 6);
+}
+var d = /* @__PURE__ */ e(l, [["render", u]]);
+//#endregion
+export { d as default };