@otwb/ui 2.0.7 → 2.0.9

package/dist/index.js

@@ -3,7 +3,7 @@ import { i as vTooltip, n as vSpin, r as TooltipDirectiveProvider, t as SpinDire
 import { g as useStyle, i as cM, n as cB, r as cE, t as c } from "./use-style-DcT-1dj4.js";
 import { Fragment, computed, createVNode, defineComponent, inject, isVNode, mergeProps, provide, reactive, ref, renderSlot, shallowRef, toRef, toValue, unref, useTemplateRef, watch, withDirectives } from "vue";
 import { computedAsync, promiseTimeout, useElementHover, useElementSize, useEventListener, useFullscreen, watchDebounced } from "@vueuse/core";
-import { NAvatar, NBadge, NBreadcrumb, NBreadcrumbItem, NButton, NDrawer, NDrawerContent, NDropdown, NEmpty, NIcon, NList, NListItem, NMenu, NPagination, NPopover, NScrollbar, NText, NThing, useThemeVars } from "ithinkdt-ui";
+import { NAvatar, NBadge, NBreadcrumb, NBreadcrumbItem, NButton, NDrawer, NDrawerContent, NDropdown, NEmpty, NIcon, NList, NListItem, NMenu, NPagination, NPopover, NScrollbar, NTabPane, NTabs, NText, NThing, useThemeVars } from "ithinkdt-ui";
 import { useAtomicBroadcast } from "@otwb/common/composables";
 import { RouterLink, useRouter } from "vue-router";
 import { walkTree } from "@otwb/common/tree";
@@ -869,7 +869,20 @@ var AppTab = /* @__PURE__ */ defineComponent({
 		}, [createVNode("span", {
 			class: "whitespace-nowrap",
 			style: q.value
-		}, [B.default?.()]), createVNode("span", { style: "line-height: 0; display: inline-block; text-align: right; padding-top: 2px" }, null)])])]);
+		}, [B.default?.()]), createVNode("span", { style: "line-height: 0; display: inline-block; text-align: right; padding-top: 2px" }, [createVNode(NButton, {
+			text: !0,
+			onClick: (d) => {
+				d.stopPropagation(), z("close");
+			}
+		}, { default: () => [createVNode(NIcon, { size: 18 }, { default: () => [createVNode("svg", {
+			xmlns: "http://www.w3.org/2000/svg",
+			width: "1em",
+			height: "1em",
+			viewBox: "0 0 24 24"
+		}, [createVNode("path", {
+			fill: "currentColor",
+			d: "m6.4 18.308l-.708-.708l5.6-5.6l-5.6-5.6l.708-.708l5.6 5.6l5.6-5.6l.708.708l-5.6 5.6l5.6 5.6l-.708.708l-5.6-5.6z"
+		}, null)])] })] })])])])]);
 	}
 });
 const AppMultiTabs = /* @__PURE__ */ defineComponent({
@@ -989,26 +1002,36 @@ const AppNotification = /* @__PURE__ */ defineComponent({
 				W("common.notification.tip", { count: q.unread }),
 				void 0,
 				{ bottom: !0 }
-			]]), X = () => {
-				let d, z;
-				return createVNode("div", { style: "display: flex; align-items: baseline; gap: 20px" }, [
-					createVNode("div", { style: "padding-right: 12px" }, [W("common.notification.title")]),
-					createVNode(NButton, {
-						text: !0,
-						type: K.value === "all" ? "primary" : "default",
-						onClick: () => {
-							K.value = "all", J();
-						}
-					}, _isSlot(d = W("common.notification.all")) ? d : { default: () => [d] }),
-					createVNode(NButton, {
-						text: !0,
-						type: K.value === "unread" ? "primary" : "default",
-						onClick: () => {
-							K.value = "unread", J();
-						}
-					}, _isSlot(z = W("common.notification.unread", { count: q.unread > 99 ? "99+" : q.unread.toString() })) ? z : { default: () => [z] })
-				]);
-			}, Z = (d) => createVNode(NListItem, {
+			]]), X = () => createVNode("div", { style: "display: flex; align-items:center; gap: 16px" }, [createVNode(NButton, {
+				text: !0,
+				onClick: () => {
+					G.value = !1;
+				}
+			}, { default: () => [createVNode(NIcon, {
+				size: "20",
+				color: "rgba(0,0,0,.45)",
+				onClick: () => {
+					G.value = !1;
+				}
+			}, { default: () => [createVNode("svg", {
+				xmlns: "http://www.w3.org/2000/svg",
+				"xmlns:xlink": "http://www.w3.org/1999/xlink",
+				viewBox: "0 0 512 512"
+			}, [createVNode("path", {
+				fill: "none",
+				stroke: "currentColor",
+				"stroke-linecap": "round",
+				"stroke-linejoin": "round",
+				"stroke-width": "32",
+				d: "M368 368L144 144"
+			}, null), createVNode("path", {
+				fill: "none",
+				stroke: "currentColor",
+				"stroke-linecap": "round",
+				"stroke-linejoin": "round",
+				"stroke-width": "32",
+				d: "M368 144L144 368"
+			}, null)])] })] }), createVNode("div", { style: "padding-right: 12px" }, [W("common.notification.title")])]), Z = (d) => createVNode(NListItem, {
 				key: d.key,
 				onClick: () => {
 					d.status === "unread" && (z.markRead?.([d.key]).then(() => {
@@ -1063,12 +1086,44 @@ const AppNotification = /* @__PURE__ */ defineComponent({
 				default: d.content,
 				footer: () => createVNode("span", { style: "color: gray" }, [d.hover ? format(d.date, W("common.notification.time")) : W("common.timeago", { time: d.date })])
 			})] }), Q = () => {
-				let d;
-				return withDirectives(q.records.length > 0 ? createVNode(NList, {
+				let d, z;
+				return withDirectives(q.records.length > 0 ? createVNode("div", null, [createVNode(NTabs, {
+					"onUpdate:value": [(d) => {
+						console.log(d), K.value = d, J();
+					}, (d) => K.value = d],
+					type: "line",
+					"default-value": "all",
+					animated: !0,
+					value: K.value
+				}, { default: () => [createVNode(NTabPane, {
+					name: "all",
+					tab: W("common.notification.all")
+				}, { default: () => [createVNode(NList, {
 					clickable: !0,
 					hoverable: !0,
 					style: "min-height: 50vh"
-				}, _isSlot(d = q.records.map((d) => Z(d))) ? d : { default: () => [d] }) : createVNode(NEmpty, { style: "margin-top: 30vh" }, null), [[vSpin, q.loading]]);
+				}, _isSlot(d = q.records.map((d) => Z(d))) ? d : { default: () => [d] })] }), createVNode(NTabPane, {
+					name: "unread",
+					tab: W("common.notification.unread", { count: q.unread > 99 ? "99+" : q.unread.toString() })
+				}, { default: () => [createVNode(NList, {
+					clickable: !0,
+					hoverable: !0,
+					style: "min-height: 50vh"
+				}, _isSlot(z = q.records.map((d) => Z(d))) ? z : { default: () => [z] })] })] })]) : createVNode("div", null, [createVNode(NTabs, {
+					"onUpdate:value": [(d) => {
+						console.log(d), K.value = d, J();
+					}, (d) => K.value = d],
+					type: "line",
+					"default-value": "all",
+					animated: !0,
+					value: K.value
+				}, { default: () => [createVNode(NTabPane, {
+					name: "all",
+					tab: W("common.notification.all")
+				}, { default: () => [createVNode(NEmpty, { style: "margin-top: 30vh" }, null)] }), createVNode(NTabPane, {
+					name: "unread",
+					tab: W("common.notification.unread", { count: q.unread > 99 ? "99+" : q.unread.toString() })
+				}, { default: () => [createVNode(NEmpty, { style: "margin-top: 30vh" }, null)] })] })]), [[vSpin, q.loading]]);
 			}, $ = () => createVNode("div", { style: "display: flex; justify-content: space-between; width: 100%" }, [K.value === "unread" ? createVNode(NButton, {
 				text: !0,
 				type: "primary",
@@ -1107,7 +1162,6 @@ const AppNotification = /* @__PURE__ */ defineComponent({
 				width: 400
 			}, { default: () => [createVNode(NDrawerContent, {
 				title: W("common.notification.title"),
-				closable: !0,
 				nativeScrollbar: !1,
 				bodyContentStyle: { padding: "0" }
 			}, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@otwb/ui",
-  "version": "2.0.7",
+  "version": "2.0.9",
   "type": "module",
   "license": "MIT",
   "description": "otwb UI",