rappel-ui 1.0.29 → 1.0.30

package/es/components/message/src/message.vue_vue_type_script_setup_true_lang.mjs

@@ -1,20 +1,28 @@
 import { toPx as e } from "../../../utils/util.mjs";
 import "../../../utils/index.mjs";
 import { useNamespace as t } from "../../../composables/use-namespace/index.mjs";
-import { useZIndex as n } from "../../../composables/use-z-index/index.mjs";
-import { useTheme as r } from "../../../composables/use-theme/index.mjs";
+import { useZIndex as ee } from "../../../composables/use-z-index/index.mjs";
+import { useTheme as te } from "../../../composables/use-theme/index.mjs";
 import "../../../composables/index.mjs";
-import { ReTransition as i } from "../../transition/index.mjs";
-import { verticalPlacement as a } from "./constants.mjs";
-import { useMessageEmits as o } from "./use-message-emit.mjs";
-import { Fragment as s, computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, defineComponent as f, mergeModels as p, mergeProps as m, nextTick as h, normalizeClass as g, normalizeStyle as _, onMounted as v, onUnmounted as y, openBlock as b, ref as x, renderSlot as S, resolveDynamicComponent as C, toDisplayString as w, unref as T, useModel as E, watch as D, withCtx as O } from "vue";
-import { CloseShort as k, InfoCircle as A } from "@rappel-ui/svg-icons";
+import { ReTransition as ne } from "../../transition/index.mjs";
+import { verticalPlacement as n } from "./constants.mjs";
+import { useMessageEmits as re } from "./use-message-emit.mjs";
+import { Fragment as r, computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, defineComponent as c, isVNode as l, mergeModels as u, mergeProps as d, nextTick as f, normalizeClass as p, normalizeStyle as ie, onMounted as ae, onUnmounted as oe, openBlock as m, ref as h, renderSlot as g, resolveDynamicComponent as _, toDisplayString as se, unref as v, useModel as ce, useTemplateRef as y, watch as b, withCtx as le } from "vue";
+import { useElementHover as ue } from "@vueuse/core";
+import { CheckFill as x, CloseFill as S, CloseShort as C, ExclamFill as de, InfoFill as w } from "@rappel-ui/svg-icons";
 //#region packages/components/message/src/message.vue?vue&type=script&setup=true&lang.ts
-var j = ["data-placement"], M = ["innerHTML"], N = f({
+var fe = ["data-placement"], pe = ["innerHTML"], T = c({
 	name: "ReMessage",
 	__name: "message",
-	props: p({
-		content: { default: "" },
+	props: u({
+		content: {
+			type: [
+				String,
+				Object,
+				Function
+			],
+			default: ""
+		},
 		isHtml: {
 			type: Boolean,
 			default: !1
@@ -26,7 +34,11 @@ var j = ["data-placement"], M = ["innerHTML"], N = f({
 			default: !1
 		},
 		type: { default: "" },
-		offset: { default: 20 },
+		plain: {
+			type: Boolean,
+			default: !1
+		},
+		offset: { default: 16 },
 		zIndex: { default: () => void 0 },
 		width: { default: () => void 0 },
 		height: { default: () => void 0 },
@@ -34,12 +46,16 @@ var j = ["data-placement"], M = ["innerHTML"], N = f({
 		maxHeight: { default: () => void 0 },
 		floatingClass: { default: "" },
 		placement: { default: "top" },
-		closeIcon: { default: () => k },
+		closeIcon: { default: () => C },
 		showClose: {
 			type: Boolean,
 			default: !1
 		},
-		icon: { default: () => A },
+		autoClose: {
+			type: Boolean,
+			default: !0
+		},
+		icon: { default: () => void 0 },
 		showIcon: {
 			type: Boolean,
 			default: !0
@@ -69,7 +85,7 @@ var j = ["data-placement"], M = ["innerHTML"], N = f({
 		},
 		visibleModifiers: {}
 	}),
-	emits: p([
+	emits: u([
 		"iconUpdated",
 		"beforeEnter",
 		"enter",
@@ -80,36 +96,49 @@ var j = ["data-placement"], M = ["innerHTML"], N = f({
 		"leaveCancelled",
 		"afterLeave"
 	], ["update:visible"]),
-	setup(f, { expose: p, emit: k }) {
-		let { beforeEnter: A, enter: N, afterEnter: P, beforeLeave: F, leave: I, afterLeave: L } = o(k), { ns: R, n: z, nm: B, is: V } = t("message"), { currentTheme: H } = r(f.theme, f.reverseTheme), U = c(() => {
+	setup(c, { expose: u, emit: C }) {
+		let T = C, E = i(() => {
+			if (l(c.content)) return c.content;
+			if (typeof c.content == "function") {
+				let e = c.content();
+				return l(e) ? e : String(e);
+			}
+			return !1;
+		}), { beforeEnter: D, enter: O, afterEnter: k, beforeLeave: A, leave: j, afterLeave: M } = re(T), N = y("floatingRef"), { ns: P, n: F, nm: I, is: L } = t("message"), { currentTheme: R } = te(c.theme, c.reverseTheme), z = i(() => {
 			var e;
-			return (e = f.placement) == null || (e = e.split("-")) == null ? void 0 : e[0];
-		}), W = c(() => {
+			return (e = c.placement) == null || (e = e.split("-")) == null ? void 0 : e[0];
+		}), B = i(() => {
 			var e;
-			return (e = f.placement) == null || (e = e.split("-")) == null ? void 0 : e[1];
-		}), G = x(f.offset);
-		D(() => f.offset, (e) => {
-			G.value = e;
+			return (e = c.placement) == null || (e = e.split("-")) == null ? void 0 : e[1];
+		}), V = i(() => c.icon || {
+			success: x,
+			warning: de,
+			error: S,
+			info: w,
+			primary: w
+		}[c.type] || w), H = h(c.offset);
+		b(() => c.offset, (e) => {
+			H.value = e;
 		});
-		let K = (e) => {
-			G.value = e;
-		}, q = c(() => [{
-			width: e(f.width),
-			height: e(f.height),
-			maxWidth: e(f.maxWidth),
-			maxHeight: e(f.maxHeight),
-			zIndex: Y.value,
-			[a.includes(f.placement) ? W.value : U.value]: e(G.value),
+		let me = (e) => {
+			H.value = e;
+		}, he = i(() => [{
+			width: e(c.width),
+			height: e(c.height),
+			maxWidth: e(c.maxWidth),
+			maxHeight: e(c.maxHeight),
+			zIndex: W.value,
+			[n.includes(c.placement) ? B.value : z.value]: e(H.value),
 			position: "fixed",
-			transition: `opacity ${f.cssDuration / 2}ms,
-       transform ${f.cssDuration}ms,
-        bottom ${f.cssDuration}ms,
-        top ${f.cssDuration}ms,
-        left ${f.cssDuration}ms,
-        right ${f.cssDuration}ms`
-		}]), J = E(f, "visible"), Y = x(0), { zIndex: X } = n(), { stop: Z } = D(J, (e) => {
-			e && (Y.value = f.zIndex || X.value);
-		}), Q = [
+			transition: `opacity ${c.cssDuration / 2}ms,
+       transform ${c.cssDuration}ms,
+        bottom ${c.cssDuration}ms,
+        top ${c.cssDuration}ms,
+        left ${c.cssDuration}ms,
+        right ${c.cssDuration}ms`
+		}]), U = ce(c, "visible"), W = h(0), { zIndex: ge } = ee(), { stop: _e } = b(U, (e) => {
+			e && (W.value = c.zIndex || ge.value);
+		}), G = [
 			"top",
 			"bottom",
 			"left",
@@ -122,86 +151,100 @@ var j = ["data-placement"], M = ["innerHTML"], N = f({
 			leaveFrom: `${t}-leave-from`,
 			leaveActive: `${t}-leave-active`,
 			leaveTo: `${t}-leave-to`
-		}, e), {}), $ = () => {
-			J.value = !1;
-			let e = null;
-			h(() => {
-				J.value = !0, e && (clearTimeout(e), e = null), e = setTimeout(() => {
-					J.value = !1, e && (clearTimeout(e), e = null);
-				}, parseFloat(String(f.cssDuration)) + parseFloat(String(f.stayDuration)));
+		}, e), {}), ve = () => {
+			Z();
+		}, K = ue(N), { stop: q } = b(K, (e) => e ? ye() : Q()), J, Y = 0, X = parseFloat(String(c.cssDuration)) + parseFloat(String(c.stayDuration)), Z = () => {
+			U.value = !1, clearTimeout(J), J = void 0;
+		}, Q = () => {
+			if (X <= 0) {
+				Z();
+				return;
+			}
+			Y = Date.now(), J = setTimeout(Z, X);
+		}, ye = () => {
+			J && (clearTimeout(J), J = void 0, X -= Date.now() - Y);
+		}, $ = () => {
+			U.value = !1, f(() => {
+				if (U.value = !0, !c.autoClose) return q();
+				Q();
 			});
 		};
-		return v(() => {
+		return ae(() => {
 			$();
-		}), y(() => {
-			Z();
-		}), p({
+		}), oe(() => {
+			_e(), q(), Z(), K.value = !1;
+		}), u({
 			show: $,
-			setOffset: K,
-			close: () => {
-				J.value = !1;
-			}
-		}), (e, t) => (b(), l(T(i), m({
-			teleported: f.teleported,
-			"append-to": f.appendTo,
-			transition: f.transition,
-			"css-duration": f.cssDuration,
-			"css-transition": f.cssTransition,
-			"enter-from-class": T(Q)[U.value].enterFrom,
-			"enter-active-class": T(Q)[U.value].enterActive,
-			"enter-to-class": T(Q)[U.value].enterTo,
-			"leave-from-class": T(Q)[U.value].leaveFrom,
-			"leave-active-class": T(Q)[U.value].leaveActive,
-			"leave-to-class": T(Q)[U.value].leaveTo
+			setOffset: me,
+			close: ve,
+			isHovered: K,
+			zIndex: W.value
+		}), (e, t) => (m(), a(v(ne), d({
+			teleported: c.teleported,
+			"append-to": c.appendTo,
+			transition: c.transition,
+			"css-duration": c.cssDuration,
+			"css-transition": c.cssTransition,
+			"enter-from-class": v(G)[z.value].enterFrom,
+			"enter-active-class": v(G)[z.value].enterActive,
+			"enter-to-class": v(G)[z.value].enterTo,
+			"leave-from-class": v(G)[z.value].leaveFrom,
+			"leave-active-class": v(G)[z.value].leaveActive,
+			"leave-to-class": v(G)[z.value].leaveTo
 		}, e.$attrs, {
-			onBeforeEnter: T(A),
-			onEnter: T(N),
-			onAfterEnter: T(P),
-			onBeforeLeave: T(F),
-			onLeave: T(I),
-			onAfterLeave: T(L)
+			onBeforeEnter: v(D),
+			onEnter: v(O),
+			onAfterEnter: v(k),
+			onBeforeLeave: v(A),
+			onLeave: v(j),
+			onAfterLeave: v(M)
 		}), {
-			default: O(() => [J.value ? (b(), d("div", {
+			default: le(() => [U.value ? (m(), s("div", {
 				key: 0,
-				ref: "floatingRef",
-				style: _(q.value),
-				"data-placement": f.placement,
-				class: g([
-					T(z)(),
-					T(B)(f.type),
-					T(V)(T(H), !!T(H)),
-					f.floatingClass
+				ref_key: "floatingRef",
+				ref: N,
+				style: ie(he.value),
+				"data-placement": c.placement,
+				class: p([
+					v(F)(),
+					v(I)(c.type),
+					v(L)(v(R), !!v(R)),
+					v(L)("plain", !!c.plain),
+					c.floatingClass
 				])
 			}, [
-				S(e.$slots, "icon", {}, () => [f.showIcon ? (b(), d(s, { key: 0 }, [typeof f.icon == "string" ? (b(), d("i", {
+				g(e.$slots, "icon", {}, () => [c.showIcon ? (m(), s(r, { key: 0 }, [typeof V.value == "string" ? (m(), s("i", {
 					key: 0,
-					class: g([T(R)("icon"), f.icon]),
+					class: p([v(P)("icon"), V.value]),
 					"aria-hidden": "true"
-				}, null, 2)) : (b(), l(C(f.icon), {
+				}, null, 2)) : (m(), a(_(V.value), {
 					key: 1,
-					class: g([T(R)("icon")]),
+					class: p([v(P)("icon")]),
 					"aria-hidden": "true"
-				}, null, 8, ["class"]))], 64)) : u("", !0)]),
-				f.isHtml ? (b(), d("span", {
+				}, null, 8, ["class"]))], 64)) : o("", !0)]),
+				c.isHtml && typeof c.content == "string" ? (m(), s("span", {
 					key: 0,
-					class: g([T(R)("content")]),
-					innerHTML: f.content
-				}, null, 10, M)) : (b(), d("span", {
+					class: p([v(P)("content")]),
+					innerHTML: c.content
+				}, null, 10, pe)) : E.value ? (m(), a(_(E.value), {
 					key: 1,
-					class: g([T(R)("content")])
-				}, w(f.content), 3)),
-				S(e.$slots, "close", {}, () => [f.showClose ? (b(), d(s, { key: 0 }, [typeof f.closeIcon == "string" ? (b(), d("i", {
+					class: p([v(P)("content")])
+				}, null, 8, ["class"])) : (m(), s("span", {
+					key: 2,
+					class: p([v(P)("content")])
+				}, se(c.content), 3)),
+				g(e.$slots, "close", {}, () => [c.showClose ? (m(), s(r, { key: 0 }, [typeof c.closeIcon == "string" ? (m(), s("i", {
 					key: 0,
-					class: g([T(R)("close"), f.closeIcon]),
+					class: p([v(P)("close"), c.closeIcon]),
 					"aria-hidden": "true",
-					onClick: t[0] || (t[0] = (e) => J.value = !1)
-				}, null, 2)) : (b(), l(C(f.closeIcon), {
+					onClick: t[0] || (t[0] = (e) => U.value = !1)
+				}, null, 2)) : (m(), a(_(c.closeIcon), {
 					key: 1,
-					class: g([T(R)("close")]),
+					class: p([v(P)("close")]),
 					"aria-hidden": "true",
-					onClick: t[1] || (t[1] = (e) => J.value = !1)
-				}, null, 8, ["class"]))], 64)) : u("", !0)])
-			], 14, j)) : u("", !0)]),
+					onClick: t[1] || (t[1] = (e) => U.value = !1)
+				}, null, 8, ["class"]))], 64)) : o("", !0)])
+			], 14, fe)) : o("", !0)]),
 			_: 3
 		}, 16, [
 			"teleported",
@@ -225,4 +268,4 @@ var j = ["data-placement"], M = ["innerHTML"], N = f({
 	}
 });
 //#endregion
-export { N as default };
+export { T as default };

package/es/components/message/src/types.d.ts

@@ -1,4 +1,4 @@
-import { createVNode, Component } from 'vue';
+import { createVNode, Component, VNode } from 'vue';
 import { TransitionEmits, TransitionProps } from '../../transition';
 import { Placement } from '../../tooltip';
 import { Theme, MaybeClass } from '../../../types';
@@ -12,12 +12,13 @@ export type CreateMessageType = CreateMessageFn & MessageShortcuts & {
     closeAll: () => void;
 };
 export interface MessageOptions extends TransitionProps {
-    content?: string | HTMLElement;
+    content?: string | HTMLElement | VNode | (() => VNode);
     isHtml?: boolean;
     stayDuration?: number;
     theme?: Theme;
     reverseTheme?: boolean;
     type?: (typeof messageTypes)[number];
+    plain?: boolean;
     offset?: number | string;
     zIndex?: number;
     width?: number | string;
@@ -28,6 +29,7 @@ export interface MessageOptions extends TransitionProps {
     placement?: MessagePlacement;
     closeIcon?: string | Component;
     showClose?: boolean;
+    autoClose?: boolean;
     icon?: string | Component;
     showIcon?: boolean;
     onClose?: (el: HTMLElement) => void;
@@ -42,6 +44,7 @@ export interface MessageInstance {
     vnode: ReturnType<typeof createVNode>;
     props: MessageOptions;
     placement?: MessagePlacement;
+    actualOffset: number;
     close: () => void;
     show: () => void;
 }

package/es/components/popconfirm/index.d.ts

@@ -94,12 +94,12 @@ export declare const RePopconfirm: {
 }, string, {}, {}, string, {}, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & VNodeProps & AllowedComponentProps & ComponentCustomProps & (new () => {
     $slots: {
         header?: (props: {
-            icon: string | Component | undefined;
+            icon: string | Component | null | undefined;
             title: string;
         }) => any;
     } & {
         icon?: (props: {
-            icon: string | Component | undefined;
+            icon: string | Component | null | undefined;
         }) => any;
     } & {
         title?: (props: {
@@ -113,18 +113,18 @@ export declare const RePopconfirm: {
         footer?: (props: {
             cancel: (e: MouseEvent) => void;
             cancelSize: "" | "small" | "mini" | "large";
-            cancelType: "" | "primary" | "success" | "warning" | "danger" | "info";
+            cancelType: "" | "primary" | "success" | "warning" | "danger" | "error" | "info";
             cancelText: string;
             confirm: (e: MouseEvent) => void;
             confirmSize: "" | "small" | "mini" | "large";
-            confirmType: "" | "primary" | "success" | "warning" | "danger" | "info";
+            confirmType: "" | "primary" | "success" | "warning" | "danger" | "error" | "info";
             confirmText: string;
         }) => any;
     } & {
         cancel?: (props: {
             cancel: (e: MouseEvent) => void;
             cancelSize: "" | "small" | "mini" | "large";
-            cancelType: "" | "primary" | "success" | "warning" | "danger" | "info";
+            cancelType: "" | "primary" | "success" | "warning" | "danger" | "error" | "info";
             cancelText: string;
         }) => any;
     } & {
@@ -136,7 +136,7 @@ export declare const RePopconfirm: {
         confirm?: (props: {
             confirm: (e: MouseEvent) => void;
             confirmSize: "" | "small" | "mini" | "large";
-            confirmType: "" | "primary" | "success" | "warning" | "danger" | "info";
+            confirmType: "" | "primary" | "success" | "warning" | "danger" | "error" | "info";
             confirmText: string;
         }) => any;
     };

package/es/components/popconfirm/src/popconfirm.vue.d.ts

@@ -6,10 +6,10 @@ type __VLS_ModelProps = {
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare var __VLS_24: {
-    icon: string | Component | undefined;
+    icon: string | Component | null | undefined;
     title: string;
 }, __VLS_26: {
-    icon: string | Component | undefined;
+    icon: string | Component | null | undefined;
 }, __VLS_33: {
     title: string;
 }, __VLS_35: {
@@ -17,16 +17,16 @@ declare var __VLS_24: {
 }, __VLS_37: {
     cancel: (e: MouseEvent) => void;
     cancelSize: "" | "small" | "mini" | "large";
-    cancelType: "" | "primary" | "success" | "warning" | "danger" | "info";
+    cancelType: "" | "primary" | "success" | "warning" | "danger" | "error" | "info";
     cancelText: string;
     confirm: (e: MouseEvent) => void;
     confirmSize: "" | "small" | "mini" | "large";
-    confirmType: "" | "primary" | "success" | "warning" | "danger" | "info";
+    confirmType: "" | "primary" | "success" | "warning" | "danger" | "error" | "info";
     confirmText: string;
 }, __VLS_39: {
     cancel: (e: MouseEvent) => void;
     cancelSize: "" | "small" | "mini" | "large";
-    cancelType: "" | "primary" | "success" | "warning" | "danger" | "info";
+    cancelType: "" | "primary" | "success" | "warning" | "danger" | "error" | "info";
     cancelText: string;
 }, __VLS_49: {
     cancel: (e: MouseEvent) => void;
@@ -34,7 +34,7 @@ declare var __VLS_24: {
 }, __VLS_51: {
     confirm: (e: MouseEvent) => void;
     confirmSize: "" | "small" | "mini" | "large";
-    confirmType: "" | "primary" | "success" | "warning" | "danger" | "info";
+    confirmType: "" | "primary" | "success" | "warning" | "danger" | "error" | "info";
     confirmText: string;
 };
 type __VLS_Slots = {} & {

package/es/components/svg-icon/src/svg-icon.vue_vue_type_script_setup_true_lang.mjs

@@ -11,7 +11,8 @@ var l = [
 ], u = [
 	"d",
 	"name",
-	"fill"
+	"fill",
+	"fill-rule"
 ], d = a({
 	name: "ReSvgIcon",
 	__name: "svg-icon",
@@ -20,6 +21,7 @@ var l = [
 		path: { default: "" },
 		size: { default: 16 },
 		fill: { default: () => void 0 },
+		fillRule: { default: () => void 0 },
 		color: { default: "currentColor" },
 		spin: {
 			type: Boolean,
@@ -37,13 +39,14 @@ var l = [
 			"stroke-linecap": "round",
 			"stroke-linejoin": "round",
 			"stroke-width": "2",
-			stroke: a.color,
+			stroke: a.fill ? void 0 : a.color,
 			xmlns: "http://www.w3.org/2000/svg",
 			"aria-hidden": "true"
 		}, [i("path", {
 			d: a.path,
 			name: a.name,
-			fill: a.fill
+			fill: a.fill,
+			"fill-rule": a.fillRule
 		}, null, 8, u)], 10, l));
 	}
 });

package/es/components/svg-icon/src/types.d.ts

@@ -3,6 +3,7 @@ export interface SvgIconProps {
     path: string;
     size?: string | number;
     fill?: string;
+    fillRule?: 'inherit' | 'nonzero' | 'evenodd';
     color?: string;
     spin?: boolean;
 }