@web-utils/component 4.0.16 → 5.0.0-beta01

package/element-dialog/index.mjs

@@ -1,306 +1,2 @@
-import s from "element-ui/lib/dialog";
-import { dialogDrag as a } from "@web-utils/vue/directives/dialog-drag";
-import { getComputedHeight as r, isDef as n } from "@web-utils/core";
-import { n as i } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
-import { g as d } from "../chunks/index.B2TRddqf.mjs";
-const p = {
-  name: "EmulateForm",
-  provide() {
-    return {
-      elForm: {
-        disabled: !1
-      }
-    };
-  },
-  render() {
-    return this.$slots.default;
-  }
-}, c = null, u = null;
-var f = /* @__PURE__ */ i(
-  p,
-  c,
-  u,
-  !1,
-  null,
-  null
-);
-const h = f.exports, m = {
-  props: {
-    /**
-     * 对话框是否可见
-     */
-    visible: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * 打开延迟
-     */
-    openDelay: {},
-    /**
-     * 关闭延迟
-     */
-    closeDelay: {},
-    /**
-     * 层级
-     */
-    zIndex: {},
-    /**
-     * 模态渐隐
-     */
-    modalFade: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * 模态样式
-     */
-    modalClass: {},
-    /**
-     * 模态
-     */
-    modal: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * 遮罩层添加到 body
-     */
-    modalAppendToBody: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * 锁定 body
-     */
-    lockScroll: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * 按 esc 键关闭
-     */
-    closeOnPressEscape: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * 最大高度
-     */
-    maxHeight: {
-      type: String,
-      default: "76vh"
-    }
-  }
-}, g = {
-  name: "ElementDialog",
-  components: { EmulateForm: h },
-  directives: {
-    dialogDrag: a
-  },
-  mixins: [...d(s).mixins, m],
-  props: {
-    /**
-     * 对话框标题
-     */
-    title: {
-      type: String,
-      default: ""
-    },
-    /**
-     * 添加到 body
-     */
-    appendToBody: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * 点击遮罩层关闭
-     */
-    closeOnClickModal: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * 显示关闭按钮
-     */
-    showClose: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * 显示全屏按钮
-     */
-    showFullScreen: Boolean,
-    /**
-     * 宽度
-     */
-    width: {
-      type: String
-    },
-    /**
-     * 高度
-     */
-    height: {
-      type: String
-    },
-    /**
-     * 自定义样式
-     */
-    customClass: {
-      type: String,
-      default: ""
-    },
-    /**
-     * 顶部距离
-     */
-    top: {
-      type: String,
-      default: "10vh"
-    },
-    /**
-     * 关闭前回调
-     */
-    beforeClose: {
-      type: Function
-    },
-    /**
-     * 居中
-     */
-    center: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * 关闭时销毁对话框
-     */
-    destroyOnClose: Boolean,
-    /**
-     * 对话框 body 设置为 flex-row
-     */
-    flexRow: Boolean,
-    /**
-     * 对话框 body 设置为 flex-column
-     */
-    flexColumn: Boolean,
-    /**
-     * body 留白
-     */
-    bodyPadding: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * 内嵌
-     */
-    embed: Boolean,
-    /**
-     * 垂直居中
-     */
-    verticalCenter: Boolean,
-    /**
-     * 顶部偏移
-     */
-    offsetTop: Number
-  },
-  data() {
-    return {
-      fullScreen: !1,
-      closed: !1,
-      marginTop: 0
-    };
-  },
-  computed: {
-    style() {
-      const t = {
-        maxHeight: "100%"
-      };
-      return this.fullScreen || (this.width && (t.width = this.width), t.maxHeight = this.maxHeight), t["margin-top"] = this.marginTop, t;
-    }
-  },
-  watch: {
-    async visible(t) {
-      t ? (this.closed = !1, this.$emit("open"), this.$el.addEventListener("scroll", this.updatePopper), await this.$nextTick(), this.$refs.dialog.scrollTop = 0, await this.computeTop(), this.appendToBody && document.body.appendChild(this.$el)) : (this.$el.removeEventListener("scroll", this.updatePopper), this.closed || this.$emit("close"));
-    },
-    fullScreen(t) {
-      this.$emit("toggle-fullscreen", t);
-    }
-  },
-  created() {
-    this.$watch(() => ({ offsetTop: this.offsetTop, verticalCenter: this.verticalCenter, top: this.top }), this.computeTop, { deep: !0 });
-  },
-  async mounted() {
-    this.visible && (this.rendered = !0, this.open(), await this.computeTop(), this.appendToBody && document.body.appendChild(this.$el));
-  },
-  destroyed() {
-    this.appendToBody && this.$el && this.$el.parentNode && this.$el.parentNode.removeChild(this.$el);
-  },
-  methods: {
-    async computeTop() {
-      await this.$nextTick(), this.verticalCenter ? this.marginTop = `${(document.body.offsetHeight - r(this.$refs.dialog)) / 2 + (n(this.offsetTop) ? this.offsetTop : 0)}px` : this.marginTop = this.top;
-    },
-    toggleFullScreen() {
-      this.fullScreen = !this.fullScreen;
-    },
-    enterFullScreen() {
-      this.fullScreen = !0;
-    },
-    exitFullScreen() {
-      this.fullScreen = !1;
-    },
-    shouldShowFooter() {
-      var t, e;
-      return !!((e = (t = this.$scopedSlots).footer) != null && e.call(t));
-    },
-    handleWrapperClick() {
-      this.closeOnClickModal && this.handleClose();
-    },
-    handleClose() {
-      typeof this.beforeClose == "function" ? this.beforeClose(this.hide) : this.hide();
-    },
-    hide(t) {
-      t !== !1 && (this.embed ? this.$parent.$emit("update:visible", !1) : this.$emit("update:visible", !1), this.$emit("close"), this.closed = !0);
-    },
-    updatePopper() {
-      this.broadcast("ElSelectDropdown", "updatePopper"), this.broadcast("ElDropdownMenu", "updatePopper");
-    },
-    afterEnter() {
-      this.$emit("opened");
-    },
-    afterLeave() {
-      this.exitFullScreen(), this.$emit("closed");
-    }
-  }
-};
-var y = function() {
-  var e = this, l = e._self._c;
-  return l("Transition", { attrs: { name: "dialog-fade" }, on: { "after-enter": e.afterEnter, "after-leave": e.afterLeave } }, [l("div", { directives: [{ name: "show", rawName: "v-show", value: e.visible, expression: "visible" }, { name: "dialog-drag", rawName: "v-dialog-drag:[fullScreen]", value: { onMove: e.updatePopper }, expression: "{ onMove: updatePopper }", arg: e.fullScreen }], staticClass: "el-dialog__wrapper", on: { click: function(o) {
-    return o.target !== o.currentTarget ? null : e.handleWrapperClick.apply(null, arguments);
-  } } }, [l("div", { ref: "dialog", class: [
-    "el-dialog",
-    "element-dialog",
-    "el-dialog-resizeable",
-    "normalize",
-    {
-      "is-fullscreen": e.fullScreen,
-      "el-dialog__body-padding": e.bodyPadding,
-      "el-dialog--center": e.center,
-      "el-dialog--flex-row": e.flexRow,
-      "el-dialog--flex-column": e.flexColumn
-    },
-    e.customClass
-  ], style: e.style, attrs: { role: "dialog", "aria-modal": "true", "aria-label": e.title || "dialog" } }, [l("div", { staticClass: "el-dialog__header" }, [e._t("title", function() {
-    return [l("span", { staticClass: "el-dialog__title" }, [e._v(e._s(e.title))])];
-  }), l("EmulateForm", [l("div", { staticClass: "header-button-wrapper" }, [e._t("header-button"), e.showFullScreen ? l("ElButton", { staticClass: "header-button", attrs: { disabled: !1, type: "text", icon: e.fullScreen ? "el-icon-copy-document" : "el-icon-full-screen", size: "medium", title: e.fullScreen ? "还原" : "最大化" }, on: { click: e.toggleFullScreen } }) : e._e(), e.showClose ? l("ElButton", { staticClass: "header-button header-dialog-close", attrs: { disabled: !1, "aria-label": "Close", type: "text", title: "关闭", icon: "el-icon-close", size: "medium" }, on: { click: e.handleClose } }) : e._e()], 2)])], 2), e.rendered ? l("div", { staticClass: "el-dialog__body", style: { height: e.fullScreen ? "100%" : e.height } }, [e.destroyOnClose ? [e.visible ? e._t("default") : e._e()] : e._t("default")], 2) : e._e(), e.shouldShowFooter() ? l("div", { staticClass: "el-dialog__footer" }, [e._t("footer", null, { handleClose: e.handleClose })], 2) : e._e()])])]);
-}, _ = [], v = /* @__PURE__ */ i(
-  g,
-  y,
-  _,
-  !1,
-  null,
-  null
-);
-const x = v.exports;
-export {
-  x as default
-};
+import { t as e } from "../chunks/ElementDialog.C0IjriTW.mjs";
+export { e as default };

package/ellipsis/index.mjs

@@ -1,148 +1,124 @@
-import { n as c } from "../chunks/_plugin-vue2_normalizer.CeySl7Fu.mjs";
-const d = (t) => {
-  if (!t) return 0;
-  const e = t.match(/^\d*(\.\d*)?/);
-  return e ? Number(e[0]) : 0;
-}, a = {
-  name: "Ellipsis",
-  props: {
-    content: {
-      type: String,
-      default: ""
-    },
-    direction: {
-      type: String,
-      default: "end"
-    },
-    rows: {
-      type: [Number, String],
-      default: 1
-    },
-    expandText: {
-      type: String,
-      default: ""
-    },
-    collapseText: {
-      type: String,
-      default: ""
-    },
-    symbol: {
-      type: String,
-      default: "..."
-    },
-    lineHeight: {
-      type: [Number, String],
-      default: "20"
-    }
-  },
-  emits: ["click", "change"],
-  data() {
-    return {
-      ellipsis: {
-        leading: "",
-        tailing: ""
-      },
-      maxHeight: 0,
-      // 当行的最大高度
-      exceeded: !1,
-      // 是否超出
-      expanded: !1
-      // 是否折叠
-    };
-  },
-  watch: {
-    content(t, e) {
-      t !== e && this.createContainer();
-    }
-  },
-  mounted() {
-    this.createContainer();
-  },
-  methods: {
-    /**
-     * 创建虚拟 container，内容为 props.content 的内容
-     */
-    createContainer() {
-      if (!this.$refs.root) return;
-      const t = window.getComputedStyle(this.$refs.root), e = document.createElement("div");
-      Array.prototype.slice.apply(t).forEach((l) => {
-        e.style.setProperty(l, t.getPropertyValue(l));
-      }), e.style.position = "fixed", e.style.left = "999999px", e.style.top = "999999px", e.style.zIndex = "-1000", e.style.height = "auto", e.style.minHeight = "auto", e.style.maxHeight = "auto", e.style.textOverflow = "clip", e.style.whiteSpace = "normal", e.style.webkitLineClamp = "unset", e.style.display = "block";
-      const s = d(t.lineHeight === "normal" ? this.lineHeight : t.lineHeight);
-      this.maxHeight = Math.floor(s * (Number(this.rows) + 0.5) + d(t.paddingTop) + d(t.paddingBottom)), e.innerText = this.content, document.body.appendChild(e), this.calcEllipse(e);
-    },
-    /**
-     * 展开收起
-     * @param type
-     */
-    clickHandle(t) {
-      t === 1 ? (this.expanded = !0, this.$emit("change", "expand")) : (this.expanded = !1, this.$emit("change", "collapse"));
-    },
-    /**
-     * 文本点击
-     */
-    handleClick() {
-      this.$emit("click");
-    },
-    /**
-     * 计算省略号的位置
-     * @param container
-     */
-    calcEllipse(t) {
-      if (t.offsetHeight <= this.maxHeight)
-        this.exceeded = !1, document.body.removeChild(t);
-      else {
-        this.exceeded = !0;
-        const e = this.content.length, i = Math.floor(e / 2);
-        this.ellipsis = this.direction === "middle" ? this.tailorMiddle([0, i], [i, e], t) : this.tailor(0, e, t), document.body.removeChild(t);
-      }
-    },
-    tailorMiddle(t, e, i) {
-      const s = this.expanded ? this.collapseText : this.expandText, l = this.content.length;
-      if (t[1] - t[0] <= 1 && e[1] - e[0] <= 1)
-        return {
-          leading: this.content.slice(0, t[0]) + this.symbol,
-          tailing: this.symbol + this.content.slice(e[1], l)
-        };
-      const n = Math.floor((t[0] + t[1]) / 2), o = Math.ceil((e[0] + e[1]) / 2);
-      return i.innerText = this.content.slice(0, n) + this.symbol + s + this.symbol + this.content.slice(o, l), i.offsetHeight <= this.maxHeight ? this.tailorMiddle([n, t[1]], [e[0], o], i) : this.tailorMiddle([t[0], n], [o, e[1]], i);
-    },
-    /**
-     * 计算 start/end 省略
-     * @param left
-     * @param right
-     * @param container
-     * @return {{leading: string}|{tailing: string}|*}
-     */
-    tailor(t, e, i) {
-      const s = this.expanded ? this.collapseText : this.expandText, l = this.content.length;
-      if (e - t <= 1)
-        return this.direction === "end" ? {
-          leading: this.content.slice(0, t) + this.symbol
-        } : {
-          tailing: this.symbol + this.content.slice(e, l)
-        };
-      const n = Math.round((t + e) / 2);
-      return this.direction === "end" ? i.innerText = this.content.slice(0, n) + this.symbol + s : i.innerText = s + this.symbol + this.content.slice(n, l), i.offsetHeight <= this.maxHeight ? this.direction === "end" ? this.tailor(n, e, i) : this.tailor(t, n, i) : this.direction === "end" ? this.tailor(t, n, i) : this.tailor(n, e, i);
-    }
-  }
-};
-var h = function() {
-  var e = this, i = e._self._c;
-  return i("div", { ref: "root", staticClass: "fy-ellipsis", on: { click: e.handleClick } }, [e.exceeded ? e._e() : i("div", [e._v(e._s(e.content))]), e.exceeded && !e.expanded ? i("div", [e._v(" " + e._s(e.ellipsis && e.ellipsis.leading)), e.expandText ? i("span", { staticClass: "fy-ellipsis__text", on: { click: function(s) {
-    return s.stopPropagation(), e.clickHandle(1);
-  } } }, [e._v(e._s(e.expandText))]) : e._e(), e._v(e._s(e.ellipsis && e.ellipsis.tailing) + " ")]) : e._e(), e.exceeded && e.expanded ? i("div", [e._v(" " + e._s(e.content) + " "), e.expandText ? i("span", { staticClass: "fy-ellipsis__text", on: { click: function(s) {
-    return s.stopPropagation(), e.clickHandle(2);
-  } } }, [e._v(e._s(e.collapseText))]) : e._e()]) : e._e()]);
-}, r = [], p = /* @__PURE__ */ c(
-  a,
-  h,
-  r,
-  !1,
-  null,
-  null
-);
-const x = p.exports;
-export {
-  x as default
-};
+import { t as e } from "../chunks/_plugin-vue_export-helper.7vrlOII_.mjs";
+import { createCommentVNode as t, createElementBlock as n, createTextVNode as r, openBlock as i, toDisplayString as a, withModifiers as o } from "vue";
+//#region src/components/Ellipsis.vue
+var s = (e) => {
+	if (!e) return 0;
+	let t = e.match(/^\d*(\.\d*)?/);
+	return t ? Number(t[0]) : 0;
+}, c = {
+	name: "Ellipsis",
+	props: {
+		content: {
+			type: String,
+			default: ""
+		},
+		direction: {
+			type: String,
+			default: "end"
+		},
+		rows: {
+			type: [Number, String],
+			default: 1
+		},
+		expandText: {
+			type: String,
+			default: ""
+		},
+		collapseText: {
+			type: String,
+			default: ""
+		},
+		symbol: {
+			type: String,
+			default: "..."
+		},
+		lineHeight: {
+			type: [Number, String],
+			default: "20"
+		}
+	},
+	emits: ["click", "change"],
+	data() {
+		return {
+			ellipsis: {
+				leading: "",
+				tailing: ""
+			},
+			maxHeight: 0,
+			exceeded: !1,
+			expanded: !1
+		};
+	},
+	watch: { content(e, t) {
+		e !== t && this.createContainer();
+	} },
+	mounted() {
+		this.createContainer();
+	},
+	methods: {
+		createContainer() {
+			if (!this.$refs.root) return;
+			let e = window.getComputedStyle(this.$refs.root), t = document.createElement("div");
+			Array.prototype.slice.apply(e).forEach((n) => {
+				t.style.setProperty(n, e.getPropertyValue(n));
+			}), t.style.position = "fixed", t.style.left = "999999px", t.style.top = "999999px", t.style.zIndex = "-1000", t.style.height = "auto", t.style.minHeight = "auto", t.style.maxHeight = "auto", t.style.textOverflow = "clip", t.style.whiteSpace = "normal", t.style.webkitLineClamp = "unset", t.style.display = "block";
+			let n = s(e.lineHeight === "normal" ? this.lineHeight : e.lineHeight);
+			this.maxHeight = Math.floor(n * (Number(this.rows) + .5) + s(e.paddingTop) + s(e.paddingBottom)), t.innerText = this.content, document.body.appendChild(t), this.calcEllipse(t);
+		},
+		clickHandle(e) {
+			e === 1 ? (this.expanded = !0, this.$emit("change", "expand")) : (this.expanded = !1, this.$emit("change", "collapse"));
+		},
+		handleClick() {
+			this.$emit("click");
+		},
+		calcEllipse(e) {
+			if (e.offsetHeight <= this.maxHeight) this.exceeded = !1, document.body.removeChild(e);
+			else {
+				this.exceeded = !0;
+				let t = this.content.length, n = Math.floor(t / 2);
+				this.ellipsis = this.direction === "middle" ? this.tailorMiddle([0, n], [n, t], e) : this.tailor(0, t, e), document.body.removeChild(e);
+			}
+		},
+		tailorMiddle(e, t, n) {
+			let r = this.expanded ? this.collapseText : this.expandText, i = this.content.length;
+			if (e[1] - e[0] <= 1 && t[1] - t[0] <= 1) return {
+				leading: this.content.slice(0, e[0]) + this.symbol,
+				tailing: this.symbol + this.content.slice(t[1], i)
+			};
+			let a = Math.floor((e[0] + e[1]) / 2), o = Math.ceil((t[0] + t[1]) / 2);
+			return n.innerText = this.content.slice(0, a) + this.symbol + r + this.symbol + this.content.slice(o, i), n.offsetHeight <= this.maxHeight ? this.tailorMiddle([a, e[1]], [t[0], o], n) : this.tailorMiddle([e[0], a], [o, t[1]], n);
+		},
+		tailor(e, t, n) {
+			let r = this.expanded ? this.collapseText : this.expandText, i = this.content.length;
+			if (t - e <= 1) return this.direction === "end" ? { leading: this.content.slice(0, e) + this.symbol } : { tailing: this.symbol + this.content.slice(t, i) };
+			let a = Math.round((e + t) / 2);
+			return this.direction === "end" ? n.innerText = this.content.slice(0, a) + this.symbol + r : n.innerText = r + this.symbol + this.content.slice(a, i), n.offsetHeight <= this.maxHeight ? this.direction === "end" ? this.tailor(a, t, n) : this.tailor(e, a, n) : this.direction === "end" ? this.tailor(e, a, n) : this.tailor(a, t, n);
+		}
+	}
+}, l = { key: 0 }, u = { key: 1 }, d = { key: 2 };
+function f(e, s, c, f, p, m) {
+	return i(), n("div", {
+		ref: "root",
+		class: "fy-ellipsis",
+		onClick: s[2] || (s[2] = (...e) => m.handleClick && m.handleClick(...e))
+	}, [
+		p.exceeded ? t("v-if", !0) : (i(), n("div", l, a(c.content), 1)),
+		p.exceeded && !p.expanded ? (i(), n("div", u, [
+			r(a(p.ellipsis && p.ellipsis.leading), 1),
+			c.expandText ? (i(), n("span", {
+				key: 0,
+				class: "fy-ellipsis__text",
+				onClick: s[0] || (s[0] = o((e) => m.clickHandle(1), ["stop"]))
+			}, a(c.expandText), 1)) : t("v-if", !0),
+			r(a(p.ellipsis && p.ellipsis.tailing), 1)
+		])) : t("v-if", !0),
+		p.exceeded && p.expanded ? (i(), n("div", d, [r(a(c.content) + " ", 1), c.expandText ? (i(), n("span", {
+			key: 0,
+			class: "fy-ellipsis__text",
+			onClick: s[1] || (s[1] = o((e) => m.clickHandle(2), ["stop"]))
+		}, a(c.collapseText), 1)) : t("v-if", !0)])) : t("v-if", !0)
+	], 512);
+}
+var p = /* @__PURE__ */ e(c, [["render", f]]);
+//#endregion
+export { p as default };