@duxweb/dvha-pro 1.1.30 → 1.2.0

package/dist/esm/components/media/media.js

@@ -1,103 +1,94 @@
-import { defineComponent as y, computed as r, ref as v, watch as h, createVNode as t, Fragment as b, nextTick as k, isVNode as A } from "vue";
-import { useResizeObserver as W } from "@vueuse/core";
-import w from "clsx";
-import { NImageGroup as C, NTooltip as j } from "naive-ui";
-import { DuxAvatar as s } from "../widget/avatar.js";
-import { DuxImage as N } from "../widget/image.js";
-function S(e) {
-  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !A(e);
+import { DuxAvatar as e } from "../widget/avatar.js";
+import { DuxImage as t } from "../widget/image.js";
+import "../widget/index.js";
+import { Fragment as n, computed as r, createVNode as i, defineComponent as a, isVNode as o, nextTick as s, ref as c, watch as l } from "vue";
+import { NImageGroup as u, NTooltip as d } from "naive-ui";
+import { useResizeObserver as f } from "@vueuse/core";
+import p from "clsx";
+function m(e) {
+	return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !o(e);
 }
-const I = /* @__PURE__ */ y({
-  name: "DuxMedia",
-  props: {
-    title: String,
-    avatar: Boolean,
-    // Support string(s) for default image/avatar rendering, or VNode / render fn for custom image area.
-    image: [String, Array, Object, Function],
-    desc: [String, Array],
-    extend: String,
-    onClick: Function,
-    imageWidth: {
-      type: Number,
-      default: 42
-    },
-    imageHeight: {
-      type: Number,
-      default: 42
-    }
-  },
-  setup(e, {
-    slots: i
-  }) {
-    const c = r(() => typeof e.image == "string" ? [e.image] : Array.isArray(e.image) ? e.image : []), d = r(() => Array.isArray(e.desc) ? e.desc : e.desc !== void 0 ? [e.desc] : []), f = r(() => typeof e.image == "function" || e.image && typeof e.image == "object" && !Array.isArray(e.image)), x = r(() => f.value || !!e.avatar || c.value.length > 0), u = r(() => !!d.value?.length || !!i.desc), m = v(null), g = v(!1), o = async () => {
-      await k();
-      const a = m.value;
-      if (!a) {
-        g.value = !1;
-        return;
-      }
-      g.value = u.value ? a.scrollWidth > a.clientWidth : a.scrollHeight > a.clientHeight;
-    };
-    return h([() => e.title, u], o, {
-      immediate: !0
-    }), W(m, o), () => {
-      let a;
-      return t("div", {
-        class: "flex gap-2 items-center"
-      }, [i?.image && t("div", {
-        class: "flex-none flex items-center gap-2"
-      }, [i?.image?.()]), x.value && t("div", {
-        class: "flex-none flex items-center gap-2"
-      }, [f.value ? typeof e.image == "function" ? e.image() : e.image : e.avatar ? t(b, null, [c.value.length > 0 ? c.value.map((l, n) => t(s, {
-        key: n,
-        src: l,
-        round: !0,
-        size: e.imageWidth
-      }, null)) : t(s, {
-        round: !0,
-        size: e.imageWidth
-      }, null)]) : t(C, null, S(a = c.value.map((l, n) => t(N, {
-        key: n,
-        src: l,
-        class: "rounded",
-        objectFit: "cover",
-        width: e.imageWidth,
-        height: e.imageHeight
-      }, null))) ? a : {
-        default: () => [a]
-      })]), t("div", {
-        class: "flex-1 flex flex-col min-w-0"
-      }, [t("div", {
-        class: "flex gap-2 items-center"
-      }, [i.prefix?.(), (e.title || i.default) && t(j, {
-        trigger: "hover",
-        disabled: !e.title || !g.value
-      }, {
-        default: () => e.title,
-        trigger: () => t("div", {
-          ref: m,
-          onClick: () => e.onClick?.(),
-          class: w(["transition-all", u.value ? "truncate" : "break-words", e?.onClick && "hover:text-primary cursor-pointer"]),
-          style: u.value ? void 0 : {
-            display: "-webkit-box",
-            overflow: "hidden",
-            WebkitBoxOrient: "vertical",
-            WebkitLineClamp: 2
-          }
-        }, [e.title || i.default?.()])
-      })]), (d?.value.length > 0 || i.desc) && t("div", {
-        class: "text-sm text-muted flex flex-col gap-0"
-      }, [d?.value.map?.((l, n) => t("div", {
-        key: n,
-        class: "truncate"
-      }, [l !== "" ? l : "-"])), i.desc?.()])]), e?.extend && t("div", {
-        class: "flex-none flex items-center gap-2 text-gray-7"
-      }, [e?.extend]), i?.extend && t("div", {
-        class: "flex-none flex items-center gap-2 text-gray-7"
-      }, [i?.extend?.()])]);
-    };
-  }
+const h = /* @__PURE__ */ a({
+	name: "DuxMedia",
+	props: {
+		title: String,
+		avatar: Boolean,
+		image: [
+			String,
+			Array,
+			Object,
+			Function
+		],
+		desc: [String, Array],
+		extend: String,
+		onClick: Function,
+		imageWidth: {
+			type: Number,
+			default: 42
+		},
+		imageHeight: {
+			type: Number,
+			default: 42
+		}
+	},
+	setup(a, { slots: o }) {
+		let h = r(() => typeof a.image == "string" ? [a.image] : Array.isArray(a.image) ? a.image : []), g = r(() => Array.isArray(a.desc) ? a.desc : a.desc === void 0 ? [] : [a.desc]), _ = r(() => typeof a.image == "function" || a.image && typeof a.image == "object" && !Array.isArray(a.image)), v = r(() => _.value || !!a.avatar || h.value.length > 0), y = r(() => !!g.value?.length || !!o.desc), b = c(null), x = c(!1), S = async () => {
+			await s();
+			let e = b.value;
+			if (!e) {
+				x.value = !1;
+				return;
+			}
+			x.value = y.value ? e.scrollWidth > e.clientWidth : e.scrollHeight > e.clientHeight;
+		};
+		return l([() => a.title, y], S, { immediate: !0 }), f(b, S), () => {
+			let r;
+			return i("div", { class: "flex gap-2 items-center" }, [
+				o?.image && i("div", { class: "flex-none flex items-center gap-2" }, [o?.image?.()]),
+				v.value && i("div", { class: "flex-none flex items-center gap-2" }, [_.value ? typeof a.image == "function" ? a.image() : a.image : a.avatar ? i(n, null, [h.value.length > 0 ? h.value.map((t, n) => i(e, {
+					key: n,
+					src: t,
+					round: !0,
+					size: a.imageWidth
+				}, null)) : i(e, {
+					round: !0,
+					size: a.imageWidth
+				}, null)]) : i(u, null, m(r = h.value.map((e, n) => i(t, {
+					key: n,
+					src: e,
+					class: "rounded",
+					objectFit: "cover",
+					width: a.imageWidth,
+					height: a.imageHeight
+				}, null))) ? r : { default: () => [r] })]),
+				i("div", { class: "flex-1 flex flex-col min-w-0" }, [i("div", { class: "flex gap-2 items-center" }, [o.prefix?.(), (a.title || o.default) && i(d, {
+					trigger: "hover",
+					disabled: !a.title || !x.value
+				}, {
+					default: () => a.title,
+					trigger: () => i("div", {
+						ref: b,
+						onClick: () => a.onClick?.(),
+						class: p([
+							"transition-all",
+							y.value ? "truncate" : "break-words",
+							a?.onClick && "hover:text-primary cursor-pointer"
+						]),
+						style: y.value ? void 0 : {
+							display: "-webkit-box",
+							overflow: "hidden",
+							WebkitBoxOrient: "vertical",
+							WebkitLineClamp: 2
+						}
+					}, [a.title || o.default?.()])
+				})]), (g?.value.length > 0 || o.desc) && i("div", { class: "text-sm text-muted flex flex-col gap-0" }, [g?.value.map?.((e, t) => i("div", {
+					key: t,
+					class: "truncate"
+				}, [e === "" ? "-" : e])), o.desc?.()])]),
+				a?.extend && i("div", { class: "flex-none flex items-center gap-2 text-gray-7" }, [a?.extend]),
+				o?.extend && i("div", { class: "flex-none flex items-center gap-2 text-gray-7" }, [o?.extend?.()])
+			]);
+		};
+	}
 });
-export {
-  I as DuxMedia
-};
+export { h as DuxMedia };

package/dist/esm/components/modal/index.js

@@ -0,0 +1,3 @@
+import "./modal.js";
+import "./modalPage.js";
+import "./modalTab.js";

package/dist/esm/components/modal/modal.js

@@ -1,82 +1,52 @@
-import { defineComponent as c, defineAsyncComponent as s, createVNode as t, mergeProps as n, Suspense as m } from "vue";
-import { useDisclosure as f } from "@overlastic/vue";
-import { NModal as g, NSpin as b } from "naive-ui";
-const y = /* @__PURE__ */ c({
-  name: "DuxModal",
-  props: {
-    title: {
-      type: String
-    },
-    component: {
-      type: [Function, Object]
-    },
-    componentProps: Object,
-    width: {
-      type: [Number, String],
-      default: 500
-    },
-    modalProps: {
-      type: Object
-    },
-    draggable: {
-      type: Boolean,
-      default: !0
-    }
-  },
-  setup(e) {
-    const {
-      visible: l,
-      confirm: d,
-      cancel: a,
-      vanish: i
-    } = f({
-      duration: 1e3
-    }), o = e?.componentProps || {};
-    o.title = e.title, o.onConfirm = d, o.onClose = a;
-    const r = typeof e.component == "function" ? s(e.component) : e.component;
-    return () => t(g, n({
-      displayDirective: "show",
-      show: l.value,
-      onAfterLeave: () => {
-        i();
-      },
-      onClose: () => {
-        a();
-      },
-      onEsc: () => {
-        a();
-      },
-      draggable: e.draggable,
-      class: "bg-white rounded dark:shadow-gray-950/80  dark:bg-gray-800/60 backdrop-blur",
-      role: "dialog",
-      "aria-modal": "true"
-    }, e.modalProps, {
-      autoFocus: !1
-    }), {
-      default: ({
-        draggableClass: u
-      }) => t("div", {
-        class: ["max-w-full shadow-lg"],
-        style: {
-          width: typeof e.width == "number" ? `${e.width}px` : e.width
-        }
-      }, [t(m, null, {
-        default: () => t(r, n(o, {
-          title: e.title,
-          handle: u
-        }), null),
-        fallback: () => t(b, {
-          show: !0
-        }, {
-          default: () => [t("div", {
-            class: "h-100"
-          }, null)]
-        })
-      })])
-    });
-  }
+import { Suspense as e, createVNode as t, defineAsyncComponent as n, defineComponent as r, mergeProps as i } from "vue";
+import { NModal as a, NSpin as o } from "naive-ui";
+import { useDisclosure as s } from "@overlastic/vue";
+const c = /* @__PURE__ */ r({
+	name: "DuxModal",
+	props: {
+		title: { type: String },
+		component: { type: [Function, Object] },
+		componentProps: Object,
+		width: {
+			type: [Number, String],
+			default: 500
+		},
+		modalProps: { type: Object },
+		draggable: {
+			type: Boolean,
+			default: !0
+		}
+	},
+	setup(r) {
+		let { visible: c, confirm: l, cancel: u, vanish: d } = s({ duration: 1e3 }), f = r?.componentProps || {};
+		f.title = r.title, f.onConfirm = l, f.onClose = u;
+		let p = typeof r.component == "function" ? n(r.component) : r.component;
+		return () => t(a, i({
+			displayDirective: "show",
+			show: c.value,
+			onAfterLeave: () => {
+				d();
+			},
+			onClose: () => {
+				u();
+			},
+			onEsc: () => {
+				u();
+			},
+			draggable: r.draggable,
+			class: "bg-white rounded dark:shadow-gray-950/80  dark:bg-gray-800/60 backdrop-blur",
+			role: "dialog",
+			"aria-modal": "true"
+		}, r.modalProps, { autoFocus: !1 }), { default: ({ draggableClass: n }) => t("div", {
+			class: ["max-w-full shadow-lg"],
+			style: { width: typeof r.width == "number" ? `${r.width}px` : r.width }
+		}, [t(e, null, {
+			default: () => t(p, i(f, {
+				title: r.title,
+				handle: n
+			}), null),
+			fallback: () => t(o, { show: !0 }, { default: () => [t("div", { class: "h-100" }, null)] })
+		})]) });
+	}
 });
-export {
-  y as DuxModal,
-  y as default
-};
+export { c as default };

package/dist/esm/components/modal/modalPage.js

@@ -1,57 +1,42 @@
-import { defineComponent as o, ref as r, watch as n, nextTick as i, createVNode as e } from "vue";
-import { NButton as f } from "naive-ui";
-const c = /* @__PURE__ */ o({
-  name: "DuxModalPage",
-  props: {
-    title: {
-      type: String,
-      default: ""
-    },
-    draggable: {
-      type: Boolean,
-      default: !1
-    },
-    handle: {
-      type: String
-    },
-    onClose: {
-      type: Function,
-      default: () => {
-      }
-    }
-  },
-  setup(t, {
-    slots: a
-  }) {
-    const l = r();
-    return n(l, (d) => {
-      d && i(() => {
-        d.$el?.focus?.();
-      });
-    }), () => e("div", {
-      class: "flex flex-col"
-    }, [e("div", {
-      class: ["px-4 py-3 border-b border-muted rounded-t flex justify-between items-center  bg-white dark:bg-gray-800/50", t.draggable && "cursor-move", t.handle]
-    }, [e("div", {
-      class: "text-base font-bold"
-    }, [t.title]), e("div", {
-      class: "flex justify-end gap-2"
-    }, [e(f, {
-      text: !0,
-      onClick: t.onClose,
-      "aria-label": "close",
-      ref: l
-    }, {
-      icon: () => e("div", {
-        class: "i-tabler:x"
-      }, null)
-    })])]), e("div", {
-      class: "p-4"
-    }, [a.default?.()]), a.footer?.() && e("div", {
-      class: "flex justify-end gap-2 p-3 rounded-b border-t border-muted bg-muted dark:bg-gray-800/50"
-    }, [a.footer?.()])]);
-  }
+import { createVNode as e, defineComponent as t, nextTick as n, ref as r, watch as i } from "vue";
+import { NButton as a } from "naive-ui";
+var o = /* @__PURE__ */ t({
+	name: "DuxModalPage",
+	props: {
+		title: {
+			type: String,
+			default: ""
+		},
+		draggable: {
+			type: Boolean,
+			default: !1
+		},
+		handle: { type: String },
+		onClose: {
+			type: Function,
+			default: () => {}
+		}
+	},
+	setup(t, { slots: o }) {
+		let s = r();
+		return i(s, (e) => {
+			e && n(() => {
+				e.$el?.focus?.();
+			});
+		}), () => e("div", { class: "flex flex-col" }, [
+			e("div", { class: [
+				"px-4 py-3 border-b border-muted rounded-t flex justify-between items-center  bg-white dark:bg-gray-800/50",
+				t.draggable && "cursor-move",
+				t.handle
+			] }, [e("div", { class: "text-base font-bold" }, [t.title]), e("div", { class: "flex justify-end gap-2" }, [e(a, {
+				text: !0,
+				onClick: t.onClose,
+				"aria-label": "close",
+				ref: s
+			}, { icon: () => e("div", { class: "i-tabler:x" }, null) })])]),
+			e("div", { class: "p-4" }, [o.default?.()]),
+			o.footer?.() && e("div", { class: "flex justify-end gap-2 p-3 rounded-b border-t border-muted bg-muted dark:bg-gray-800/50" }, [o.footer?.()])
+		]);
+	}
 });
-export {
-  c as default
-};
+export { o as default };

package/dist/esm/components/modal/modalTab.js

@@ -1,70 +1,51 @@
-import { defineComponent as d, createVNode as e } from "vue";
-import { NTabs as n, NButton as r } from "naive-ui";
-const o = /* @__PURE__ */ d({
-  name: "ModalTab",
-  props: {
-    draggable: {
-      type: Boolean,
-      default: !1
-    },
-    defaultTab: {
-      type: String,
-      default: "0"
-    },
-    handle: {
-      // `DuxModal` passes `draggableClass` (string). Keep backward compatibility with ref usage.
-      type: [String, Object],
-      default: ""
-    },
-    onClose: {
-      type: Function,
-      default: () => {
-      }
-    }
-  },
-  setup(a, {
-    slots: l
-  }) {
-    return () => e("div", {
-      class: "flex flex-col"
-    }, [e(n, {
-      type: "line",
-      defaultValue: a.defaultTab,
-      class: "app-modal-tabs",
-      size: "large",
-      style: {
-        "--n-pane-padding-right": "16px",
-        "--n-pane-padding-left": "16px"
-      }
-    }, {
-      default: () => l.default?.(),
-      prefix: () => {
-        if (!a.draggable)
-          return null;
-        const t = typeof a.handle == "object" && a.handle !== null;
-        return e("div", {
-          class: ["pl-4 cursor-move flex items-center", !t && a.handle],
-          ref: t ? a.handle : void 0
-        }, [e("div", {
-          class: "i-tabler:grid-dots size-4"
-        }, null)]);
-      },
-      suffix: () => e("div", {
-        class: "pr-4 flex items-center"
-      }, [e(r, {
-        text: !0,
-        onClick: a.onClose,
-        "aria-label": "close"
-      }, {
-        icon: () => e("div", {
-          class: "i-tabler:x size-4"
-        }, null)
-      })])
-    }), l.footer?.() && e("div", {
-      class: "flex justify-end gap-2 p-3 rounded-b border-t border-muted bg-muted dark:bg-gray-800/50"
-    }, [l.footer?.()])]);
-  }
+import { createVNode as e, defineComponent as t } from "vue";
+import { NButton as n, NTabs as r } from "naive-ui";
+var i = /* @__PURE__ */ t({
+	name: "ModalTab",
+	props: {
+		draggable: {
+			type: Boolean,
+			default: !1
+		},
+		defaultTab: {
+			type: String,
+			default: "0"
+		},
+		handle: {
+			type: [String, Object],
+			default: ""
+		},
+		onClose: {
+			type: Function,
+			default: () => {}
+		}
+	},
+	setup(t, { slots: i }) {
+		return () => e("div", { class: "flex flex-col" }, [e(r, {
+			type: "line",
+			defaultValue: t.defaultTab,
+			class: "app-modal-tabs",
+			size: "large",
+			style: {
+				"--n-pane-padding-right": "16px",
+				"--n-pane-padding-left": "16px"
+			}
+		}, {
+			default: () => i.default?.(),
+			prefix: () => {
+				if (!t.draggable) return null;
+				let n = typeof t.handle == "object" && t.handle !== null;
+				return e("div", {
+					class: ["pl-4 cursor-move flex items-center", !n && t.handle],
+					ref: n ? t.handle : void 0
+				}, [e("div", { class: "i-tabler:grid-dots size-4" }, null)]);
+			},
+			suffix: () => e("div", { class: "pr-4 flex items-center" }, [e(n, {
+				text: !0,
+				onClick: t.onClose,
+				"aria-label": "close"
+			}, { icon: () => e("div", { class: "i-tabler:x size-4" }, null) })])
+		}), i.footer?.() && e("div", { class: "flex justify-end gap-2 p-3 rounded-b border-t border-muted bg-muted dark:bg-gray-800/50" }, [i.footer?.()])]);
+	}
 });
-export {
-  o as default
-};
+export { i as default };

package/dist/esm/components/panel/alert.js

@@ -1,54 +1,31 @@
-import { defineComponent as i, computed as l, createVNode as t } from "vue";
-const s = /* @__PURE__ */ i({
-  name: "DuxPanelAlert",
-  props: {
-    type: {
-      type: String,
-      default: "default"
-    },
-    title: {
-      type: String,
-      default: ""
-    },
-    description: {
-      type: String,
-      default: ""
-    }
-  },
-  setup(r, {
-    slots: e
-  }) {
-    const a = l(() => {
-      switch (r.type) {
-        case "error":
-          return "to-error/20";
-        case "warning":
-          return "to-warning/20";
-        case "info":
-          return "to-info/20";
-        case "success":
-          return "to-success/20";
-        default:
-          return "to-gray/20";
-      }
-    });
-    return () => t("div", {
-      class: `relative flex rounded-lg ring ring-muted bg-linear-to-br from-transparent ${a.value}`
-    }, [t("div", {
-      class: "relative flex flex-col flex-1 lg:grid gap-x-8 gap-y-4 p-4 sm:p-6"
-    }, [t("div", {
-      class: "flex flex-col flex-1 items-start"
-    }, [t("div", {
-      class: "flex-1"
-    }, [t("div", {
-      class: "text-base text-pretty text-highlighted"
-    }, [e.title?.() || r.title]), t("div", {
-      class: "text-sm text-pretty text-muted mt-1"
-    }, [e.description?.() || r.description])]), e.actions && t("div", {
-      class: "pt-4 mt-auto"
-    }, [e.actions?.()])])])]);
-  }
+import { computed as e, createVNode as t, defineComponent as n } from "vue";
+const r = /* @__PURE__ */ n({
+	name: "DuxPanelAlert",
+	props: {
+		type: {
+			type: String,
+			default: "default"
+		},
+		title: {
+			type: String,
+			default: ""
+		},
+		description: {
+			type: String,
+			default: ""
+		}
+	},
+	setup(n, { slots: r }) {
+		let i = e(() => {
+			switch (n.type) {
+				case "error": return "to-error/20";
+				case "warning": return "to-warning/20";
+				case "info": return "to-info/20";
+				case "success": return "to-success/20";
+				default: return "to-gray/20";
+			}
+		});
+		return () => t("div", { class: `relative flex rounded-lg ring ring-muted bg-linear-to-br from-transparent ${i.value}` }, [t("div", { class: "relative flex flex-col flex-1 lg:grid gap-x-8 gap-y-4 p-4 sm:p-6" }, [t("div", { class: "flex flex-col flex-1 items-start" }, [t("div", { class: "flex-1" }, [t("div", { class: "text-base text-pretty text-highlighted" }, [r.title?.() || n.title]), t("div", { class: "text-sm text-pretty text-muted mt-1" }, [r.description?.() || n.description])]), r.actions && t("div", { class: "pt-4 mt-auto" }, [r.actions?.()])])])]);
+	}
 });
-export {
-  s as DuxPanelAlert
-};
+export { r as DuxPanelAlert };