@web-utils/component 4.0.15 → 5.0.0-beta01

package/e-charts/index.mjs

@@ -1,202 +1,176 @@
-import * as s from "echarts/core";
-import { isString as r } from "@web-utils/core";
+import { t as e } from "../chunks/_plugin-vue_export-helper.7vrlOII_.mjs";
+import { createElementBlock as t, normalizeStyle as n, openBlock as r } from "vue";
+import { isString as i } from "@web-utils/core";
 import { debounce as a } from "@web-utils/integrations/lodash";
-import { removeListener as n, addListener as o } from "resize-detector";
-import { n as d } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
-const c = ["theme", "initOptions", "autoResize"], l = ["manualUpdate", "watchShallow"], p = {
-  name: "ECharts",
-  props: {
-    options: {
-      type: Object
-    },
-    theme: {
-      type: [String, Object]
-    },
-    initOptions: {
-      type: Object
-    },
-    group: {
-      type: String
-    },
-    width: {
-      type: String,
-      default: "100%"
-    },
-    height: {
-      type: String,
-      default: "100%"
-    },
-    autoResize: Boolean,
-    watchShallow: Boolean,
-    manualUpdate: Boolean
-  },
-  data() {
-    return {
-      lastArea: 0
-    };
-  },
-  watch: {
-    group(t) {
-      this.chart.group = t;
-    }
-  },
-  created() {
-    this.initOptionsWatcher(), c.forEach((t) => {
-      this.$watch(
-        t,
-        () => {
-          this.refresh();
-        },
-        { deep: !0 }
-      );
-    }), l.forEach((t) => {
-      this.$watch(t, () => {
-        this.initOptionsWatcher(), this.refresh();
-      });
-    });
-  },
-  mounted() {
-    this.options && this.init();
-  },
-  activated() {
-    var t;
-    this.autoResize && ((t = this.chart) == null || t.resize());
-  },
-  destroyed() {
-    this.chart && this.destroy();
-  },
-  methods: {
-    // provide an explicit merge option method
-    mergeOptions(t, e, i) {
-      this.manualUpdate && (this.manualOptions = t), this.chart ? this.delegateMethod("setOption", t, e, i) : this.init(t);
-    },
-    // just delegates ECharts methods to Vue component
-    // use explicit params to reduce transpiled size for now
-    appendData(t) {
-      this.delegateMethod("appendData", t);
-    },
-    resize(t) {
-      this.delegateMethod("resize", t);
-    },
-    dispatchAction(t) {
-      this.delegateMethod("dispatchAction", t);
-    },
-    convertToPixel(t, e) {
-      return this.delegateMethod("convertToPixel", t, e);
-    },
-    convertFromPixel(t, e) {
-      return this.delegateMethod("convertFromPixel", t, e);
-    },
-    containPixel(t, e) {
-      return this.delegateMethod("containPixel", t, e);
-    },
-    showLoading(t, e) {
-      this.delegateMethod("showLoading", t, e);
-    },
-    hideLoading() {
-      this.delegateMethod("hideLoading");
-    },
-    getDataURL(t) {
-      return this.delegateMethod("getDataURL", t);
-    },
-    getConnectedDataURL(t) {
-      return this.delegateMethod("getConnectedDataURL", t);
-    },
-    clear() {
-      this.delegateMethod("clear");
-    },
-    dispose() {
-      this.delegateMethod("dispose");
-    },
-    delegateMethod(t, ...e) {
-      return this.chart || this.init(), this.chart[t](...e);
-    },
-    delegateGet(t) {
-      return this.chart || this.init(), this.chart[t]();
-    },
-    getArea() {
-      return this.$el.offsetWidth * this.$el.offsetHeight;
-    },
-    init(t) {
-      if (this.chart)
-        return;
-      const e = s.init(this.$el, this.theme, this.initOptions);
-      this.group && (e.group = this.group), e.setOption(t || this.manualOptions || this.options || {}, !0), Object.keys(this.$listeners).forEach((i) => {
-        const h = this.$listeners[i];
-        i.indexOf("zr:") === 0 ? e.getZr().on(i.slice(3), h) : e.on(i, h);
-      }), this.autoResize && (this.lastArea = this.getArea(), this.__resizeHandler = a(
-        () => {
-          this.lastArea === 0 ? (this.mergeOptions({}, !0), this.resize(), this.mergeOptions(this.options || this.manualOptions || {}, !0)) : this.resize(), this.lastArea = this.getArea();
-        },
-        100,
-        { leading: !0 }
-      ), o(this.$el, this.__resizeHandler)), Object.defineProperties(this, {
-        // Only recalculated when accessed from JavaScript.
-        // Won't update DOM on value change because getters
-        // don't depend on reactive values
-        width: {
-          configurable: !0,
-          get: () => this.delegateGet("getWidth")
-        },
-        height: {
-          configurable: !0,
-          get: () => this.delegateGet("getHeight")
-        },
-        isDisposed: {
-          configurable: !0,
-          get: () => !!this.delegateGet("isDisposed")
-        },
-        computedOptions: {
-          configurable: !0,
-          get: () => this.delegateGet("getOption")
-        }
-      }), this.chart = e;
-    },
-    initOptionsWatcher() {
-      this.__unwatchOptions && (this.__unwatchOptions(), this.__unwatchOptions = null), this.manualUpdate || (this.__unwatchOptions = this.$watch(
-        "options",
-        (t, e) => {
-          !this.chart && t ? this.init() : this.chart.setOption(t, t !== e);
-        },
-        { deep: !this.watchShallow }
-      ));
-    },
-    destroy() {
-      this.autoResize && n(this.$el, this.__resizeHandler), this.dispose(), this.chart = null;
-    },
-    refresh() {
-      this.chart && (this.destroy(), this.init());
-    }
-  },
-  connect(t) {
-    r(t) || (t = t.map((e) => e.chart)), s.connect(t);
-  },
-  disconnect(t) {
-    s.disConnect(t);
-  },
-  getMap(t) {
-    return s.getMap(t);
-  },
-  registerMap(t, e, i) {
-    s.registerMap(t, e, i);
-  },
-  registerTheme(t, e) {
-    s.registerTheme(t, e);
-  },
-  graphic: s.graphic
-};
-var g = function() {
-  var e = this, i = e._self._c;
-  return i("div", { staticClass: "echarts", style: { width: e.width, height: e.height } });
-}, u = [], f = /* @__PURE__ */ d(
-  p,
-  g,
-  u,
-  !1,
-  null,
-  null
-);
-const M = f.exports;
-export {
-  M as default
+import * as o from "echarts/core";
+import { addListener as s, removeListener as c } from "resize-detector";
+//#region src/components/ECharts.vue
+var l = [
+	"theme",
+	"initOptions",
+	"autoResize"
+], u = ["manualUpdate", "watchShallow"], d = {
+	name: "ECharts",
+	props: {
+		options: { type: Object },
+		theme: { type: [String, Object] },
+		initOptions: { type: Object },
+		group: { type: String },
+		width: {
+			type: String,
+			default: "100%"
+		},
+		height: {
+			type: String,
+			default: "100%"
+		},
+		autoResize: Boolean,
+		watchShallow: Boolean,
+		manualUpdate: Boolean
+	},
+	data() {
+		return { lastArea: 0 };
+	},
+	watch: { group(e) {
+		this.chart.group = e;
+	} },
+	created() {
+		this.initOptionsWatcher(), l.forEach((e) => {
+			this.$watch(e, () => {
+				this.refresh();
+			}, { deep: !0 });
+		}), u.forEach((e) => {
+			this.$watch(e, () => {
+				this.initOptionsWatcher(), this.refresh();
+			});
+		});
+	},
+	mounted() {
+		this.options && this.init();
+	},
+	activated() {
+		if (this.autoResize) {
+			var e;
+			(e = this.chart) == null || e.resize();
+		}
+	},
+	unmounted() {
+		this.chart && this.destroy();
+	},
+	methods: {
+		mergeOptions(e, t, n) {
+			this.manualUpdate && (this.manualOptions = e), this.chart ? this.delegateMethod("setOption", e, t, n) : this.init(e);
+		},
+		appendData(e) {
+			this.delegateMethod("appendData", e);
+		},
+		resize(e) {
+			this.delegateMethod("resize", e);
+		},
+		dispatchAction(e) {
+			this.delegateMethod("dispatchAction", e);
+		},
+		convertToPixel(e, t) {
+			return this.delegateMethod("convertToPixel", e, t);
+		},
+		convertFromPixel(e, t) {
+			return this.delegateMethod("convertFromPixel", e, t);
+		},
+		containPixel(e, t) {
+			return this.delegateMethod("containPixel", e, t);
+		},
+		showLoading(e, t) {
+			this.delegateMethod("showLoading", e, t);
+		},
+		hideLoading() {
+			this.delegateMethod("hideLoading");
+		},
+		getDataURL(e) {
+			return this.delegateMethod("getDataURL", e);
+		},
+		getConnectedDataURL(e) {
+			return this.delegateMethod("getConnectedDataURL", e);
+		},
+		clear() {
+			this.delegateMethod("clear");
+		},
+		dispose() {
+			this.delegateMethod("dispose");
+		},
+		delegateMethod(e, ...t) {
+			return this.chart || this.init(), this.chart[e](...t);
+		},
+		delegateGet(e) {
+			return this.chart || this.init(), this.chart[e]();
+		},
+		getArea() {
+			return this.$el.offsetWidth * this.$el.offsetHeight;
+		},
+		init(e) {
+			if (this.chart) return;
+			let t = o.init(this.$el, this.theme, this.initOptions);
+			this.group && (t.group = this.group), t.setOption(e || this.manualOptions || this.options || {}, !0), Object.keys(this.$listeners).forEach((e) => {
+				let n = this.$listeners[e];
+				e.indexOf("zr:") === 0 ? t.getZr().on(e.slice(3), n) : t.on(e, n);
+			}), this.autoResize && (this.lastArea = this.getArea(), this.__resizeHandler = a(() => {
+				this.lastArea === 0 ? (this.mergeOptions({}, !0), this.resize(), this.mergeOptions(this.options || this.manualOptions || {}, !0)) : this.resize(), this.lastArea = this.getArea();
+			}, 100, { leading: !0 }), s(this.$el, this.__resizeHandler)), Object.defineProperties(this, {
+				width: {
+					configurable: !0,
+					get: () => this.delegateGet("getWidth")
+				},
+				height: {
+					configurable: !0,
+					get: () => this.delegateGet("getHeight")
+				},
+				isDisposed: {
+					configurable: !0,
+					get: () => !!this.delegateGet("isDisposed")
+				},
+				computedOptions: {
+					configurable: !0,
+					get: () => this.delegateGet("getOption")
+				}
+			}), this.chart = t;
+		},
+		initOptionsWatcher() {
+			this.__unwatchOptions && (this.__unwatchOptions(), this.__unwatchOptions = null), this.manualUpdate || (this.__unwatchOptions = this.$watch("options", (e, t) => {
+				!this.chart && e ? this.init() : this.chart.setOption(e, e !== t);
+			}, { deep: !this.watchShallow }));
+		},
+		destroy() {
+			this.autoResize && c(this.$el, this.__resizeHandler), this.dispose(), this.chart = null;
+		},
+		refresh() {
+			this.chart && (this.destroy(), this.init());
+		}
+	},
+	connect(e) {
+		i(e) || (e = e.map((e) => e.chart)), o.connect(e);
+	},
+	disconnect(e) {
+		o.disConnect(e);
+	},
+	getMap(e) {
+		return o.getMap(e);
+	},
+	registerMap(e, t, n) {
+		o.registerMap(e, t, n);
+	},
+	registerTheme(e, t) {
+		o.registerTheme(e, t);
+	},
+	graphic: o.graphic
 };
+function f(e, i, a, o, s, c) {
+	return r(), t("div", {
+		class: "echarts",
+		style: n({
+			width: a.width,
+			height: a.height
+		})
+	}, null, 4);
+}
+var p = /* @__PURE__ */ e(d, [["render", f]]);
+//#endregion
+export { p as default };

package/easy-popup/index.mjs

@@ -1,103 +1,92 @@
-import { getComputedWidth as o, getComputedHeight as n } from "@web-utils/core";
-import { n as a } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
-const r = {
-  name: "EasyPopup",
-  props: {
-    /**
-     * 是否开启边界检测
-     */
-    border: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * 显示点偏移量
-     */
-    offset: {
-      type: Object,
-      default: () => ({ x: 6, y: 2 })
-    },
-    /**
-     * 边界距离
-     */
-    borderWidth: {
-      type: Number,
-      default: 6
-    },
-    /**
-     * 是否添加到 body
-     */
-    appendToBody: Boolean,
-    flexRow: Boolean,
-    flexColumn: Boolean,
-    /**
-     * 鼠标离开后隐藏
-     */
-    hideOnMouseLeave: {
-      type: Boolean,
-      default: !0
-    },
-    interactive: Boolean
-  },
-  data() {
-    return {
-      /**
-       * 是否显示
-       */
-      visible: !1,
-      rendered: !1,
-      /**
-       * 触发点坐标
-       */
-      axis: { x: 0, y: 0 }
-    };
-  },
-  computed: {
-    position() {
-      return {
-        top: `${this.axis.y + this.offset.y}px`,
-        left: `${this.axis.x + this.offset.x}px`
-      };
-    }
-  },
-  watch: {
-    async axis() {
-      if (this.border) {
-        await this.$nextTick();
-        const t = o(this.$refs.container), e = n(this.$refs.container), i = document.body.offsetWidth, s = document.body.offsetHeight;
-        this.axis.x + this.offset.x + t >= i && (this.axis.x = i - t - this.borderWidth - this.offset.x), this.axis.y + this.offset.y + e >= s && (this.axis.y = s - e - this.borderWidth - this.offset.y);
-      }
-    }
-  },
-  destroyed() {
-    this.$el.remove();
-  },
-  methods: {
-    show({ clientX: t, clientY: e }) {
-      this.axis = { x: t, y: e }, this.visible || (document.addEventListener("click", this.doHide, !0), this.rendered = !0, this.visible = !0), this.appendToBody && document.body.appendChild(this.$el);
-    },
-    hide() {
-      this.visible = !1, document.removeEventListener("click", this.doHide);
-    },
-    doHide(t) {
-      this.interactive && this.$el.contains(t.target) || this.hide();
-    }
-  }
-};
-var d = function() {
-  var e = this, i = e._self._c;
-  return i("Transition", { attrs: { name: "easy-popup" } }, [e.rendered ? i("div", { directives: [{ name: "show", rawName: "v-show", value: e.visible, expression: "visible" }], ref: "container", class: ["easy-popup", { "easy-popup__visible": e.visible, "easy-popup__hide": !e.visible, "flex-row": e.flexRow, "flex-column": e.flexColumn }], style: e.position, on: { mouseleave: function(s) {
-    e.hideOnMouseLeave && e.hide();
-  } } }, [e._t("default")], 2) : e._e()]);
-}, h = [], l = /* @__PURE__ */ a(
-  r,
-  d,
-  h,
-  !1,
-  null,
-  null
-);
-const u = l.exports;
-export {
-  u as default
+import { t as e } from "../chunks/_plugin-vue_export-helper.7vrlOII_.mjs";
+import { Transition as t, createBlock as n, createCommentVNode as r, createElementBlock as i, normalizeClass as a, normalizeStyle as o, openBlock as s, renderSlot as c, vShow as l, withCtx as u, withDirectives as d } from "vue";
+import { getComputedHeight as f, getComputedWidth as p } from "@web-utils/core";
+//#region src/components/EasyPopup.vue
+var m = {
+	name: "EasyPopup",
+	props: {
+		border: {
+			type: Boolean,
+			default: !0
+		},
+		offset: {
+			type: Object,
+			default: () => ({
+				x: 6,
+				y: 2
+			})
+		},
+		borderWidth: {
+			type: Number,
+			default: 6
+		},
+		appendToBody: Boolean,
+		flexRow: Boolean,
+		flexColumn: Boolean,
+		hideOnMouseLeave: {
+			type: Boolean,
+			default: !0
+		},
+		interactive: Boolean
+	},
+	data() {
+		return {
+			visible: !1,
+			rendered: !1,
+			axis: {
+				x: 0,
+				y: 0
+			}
+		};
+	},
+	computed: { position() {
+		return {
+			top: `${this.axis.y + this.offset.y}px`,
+			left: `${this.axis.x + this.offset.x}px`
+		};
+	} },
+	watch: { async axis() {
+		if (this.border) {
+			await this.$nextTick();
+			let e = p(this.$refs.container), t = f(this.$refs.container), n = document.body.offsetWidth, r = document.body.offsetHeight;
+			this.axis.x + this.offset.x + e >= n && (this.axis.x = n - e - this.borderWidth - this.offset.x), this.axis.y + this.offset.y + t >= r && (this.axis.y = r - t - this.borderWidth - this.offset.y);
+		}
+	} },
+	unmounted() {
+		this.$el.remove();
+	},
+	methods: {
+		show({ clientX: e, clientY: t }) {
+			this.axis = {
+				x: e,
+				y: t
+			}, this.visible || (document.addEventListener("click", this.doHide, !0), this.rendered = !0, this.visible = !0), this.appendToBody && document.body.appendChild(this.$el);
+		},
+		hide() {
+			this.visible = !1, document.removeEventListener("click", this.doHide);
+		},
+		doHide(e) {
+			this.interactive && this.$el.contains(e.target) || this.hide();
+		}
+	}
 };
+function h(e, f, p, m, h, g) {
+	return s(), n(t, { name: "easy-popup" }, {
+		default: u(() => [h.rendered ? d((s(), i("div", {
+			key: 0,
+			ref: "container",
+			class: a(["easy-popup", {
+				"easy-popup__visible": h.visible,
+				"easy-popup__hide": !h.visible,
+				"flex-row": p.flexRow,
+				"flex-column": p.flexColumn
+			}]),
+			style: o(g.position),
+			onMouseleave: f[0] || (f[0] = (e) => p.hideOnMouseLeave ? g.hide() : null)
+		}, [c(e.$slots, "default")], 38)), [[l, h.visible]]) : r("v-if", !0)]),
+		_: 3
+	});
+}
+var g = /* @__PURE__ */ e(m, [["render", h]]);
+//#endregion
+export { g as default };