@v-c/notification 0.0.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 antdv-community
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/bump.config.ts

@@ -0,0 +1,6 @@
+import { defineConfig } from 'bumpp'
+
+export default defineConfig({
+  commit: 'chore(release): @v-c/notification %s',
+  tag: '@v-c/notification@%s',
+})

package/dist/Notice.cjs

@@ -0,0 +1,230 @@
+Object.defineProperty(exports, "__esModule", { value: true });
+const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
+let vue = require("vue");
+let __v_c_util = require("@v-c/util");
+let __v_c_util_dist_KeyCode = require("@v-c/util/dist/KeyCode");
+__v_c_util_dist_KeyCode = require_rolldown_runtime.__toESM(__v_c_util_dist_KeyCode);
+let __v_c_util_dist_pickAttrs = require("@v-c/util/dist/pickAttrs");
+__v_c_util_dist_pickAttrs = require_rolldown_runtime.__toESM(__v_c_util_dist_pickAttrs);
+var defaults = {
+	duration: 4.5,
+	pauseOnHover: true,
+	closeIcon: "x"
+};
+var Notify = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs }) => {
+	const hovering = (0, vue.shallowRef)(false);
+	const percent = (0, vue.shallowRef)(0);
+	const spentTime = (0, vue.shallowRef)(0);
+	const mergedHovering = (0, vue.computed)(() => props.hovering || hovering.value);
+	const mergedDuration = (0, vue.computed)(() => {
+		if (typeof props.duration === "number") return props.duration;
+		if (props.duration === void 0) return defaults.duration;
+		return 0;
+	});
+	const mergedPauseOnHover = (0, vue.computed)(() => props.pauseOnHover === void 0 ? defaults.pauseOnHover : props.pauseOnHover);
+	const mergedShowProgress = (0, vue.computed)(() => mergedDuration.value > 0 && props.showProgress);
+	const mergedCloseIcon = (0, vue.computed)(() => props.closeIcon ?? defaults.closeIcon);
+	const onInternalClose = () => {
+		props.onNoticeClose?.(props.eventKey);
+	};
+	const onCloseKeyDown = (e) => {
+		if (e.key === "Enter" || e.code === "Enter" || e.keyCode === __v_c_util_dist_KeyCode.default.ENTER) onInternalClose();
+	};
+	(0, vue.watch)([
+		() => props.times,
+		mergedDuration,
+		mergedHovering
+	], (_n, _, onCleanup) => {
+		const duration = mergedDuration.value;
+		const hoveringValue = mergedHovering.value;
+		const pauseOnHover = mergedPauseOnHover.value;
+		if (!hoveringValue && duration > 0) {
+			const start = Date.now() - spentTime.value;
+			const timeoutId = window.setTimeout(() => {
+				onInternalClose();
+			}, duration * 1e3 - spentTime.value);
+			onCleanup(() => {
+				if (pauseOnHover) clearTimeout(timeoutId);
+				spentTime.value = Date.now() - start;
+			});
+		}
+	}, { immediate: true });
+	(0, vue.watch)([
+		() => props.times,
+		mergedDuration,
+		spentTime,
+		mergedHovering,
+		mergedShowProgress
+	], (_n, _, onCleanup) => {
+		const hoveringValue = mergedHovering.value;
+		const showProgress = mergedShowProgress.value;
+		const pauseOnHover = mergedPauseOnHover.value;
+		const duration = mergedDuration.value;
+		const baseSpentTime = spentTime.value;
+		if (!hoveringValue && showProgress && (pauseOnHover || baseSpentTime === 0)) {
+			const start = performance.now();
+			let animationFrame = 0;
+			const calculate = () => {
+				cancelAnimationFrame(animationFrame);
+				animationFrame = requestAnimationFrame((timestamp) => {
+					const runtime = timestamp + baseSpentTime - start;
+					const progress = Math.min(runtime / (duration * 1e3), 1);
+					percent.value = progress * 100;
+					if (progress < 1) calculate();
+				});
+			};
+			calculate();
+			onCleanup(() => {
+				if (pauseOnHover) cancelAnimationFrame(animationFrame);
+			});
+		}
+	}, { immediate: true });
+	return () => {
+		const { closable, prefixCls, props: divProps, onClick, content, className, style } = props;
+		const closableConfig = typeof closable === "object" && closable !== null ? closable : closable ? { closeIcon: mergedCloseIcon.value } : {};
+		const ariaProps = (0, __v_c_util_dist_pickAttrs.default)(closableConfig, true);
+		const validPercent = 100 - (percent.value <= 0 ? 0 : percent.value > 100 ? 100 : percent.value);
+		const noticePrefixCls = `${prefixCls}-notice`;
+		const mergedStyle = {
+			...typeof divProps?.style === "object" && divProps?.style ? divProps.style : {},
+			...typeof attrs.style === "object" && attrs.style ? attrs.style : {},
+			...typeof style === "object" && style ? style : {}
+		};
+		return (0, vue.createVNode)("div", (0, vue.mergeProps)(divProps, {
+			"class": (0, __v_c_util.classNames)(noticePrefixCls, className, attrs.class, { [`${noticePrefixCls}-closable`]: !!closable }),
+			"style": mergedStyle,
+			"onMouseenter": (e) => {
+				hovering.value = true;
+				divProps?.onMouseEnter?.(e);
+			},
+			"onMouseleave": (e) => {
+				hovering.value = false;
+				divProps?.onMouseLeave?.(e);
+			},
+			"onClick": onClick
+		}), [
+			(0, vue.createVNode)("div", { "class": `${noticePrefixCls}-content` }, [content]),
+			closable && (0, vue.createVNode)("button", (0, vue.mergeProps)({
+				"type": "button",
+				"class": `${noticePrefixCls}-close`,
+				"onKeydown": onCloseKeyDown,
+				"aria-label": "Close"
+			}, ariaProps, { "onClick": (e) => {
+				e.preventDefault();
+				e.stopPropagation();
+				onInternalClose();
+			} }), [closableConfig.closeIcon ?? mergedCloseIcon.value]),
+			mergedShowProgress.value && (0, vue.createVNode)("progress", {
+				"class": `${noticePrefixCls}-progress`,
+				"max": "100",
+				"value": validPercent
+			}, [`${validPercent}%`])
+		]);
+	};
+}, { props: {
+	prefixCls: {
+		type: String,
+		required: true,
+		default: void 0
+	},
+	eventKey: {
+		type: [String, Number],
+		required: true,
+		default: void 0
+	},
+	onClick: {
+		type: Function,
+		required: false,
+		default: void 0
+	},
+	onNoticeClose: {
+		type: Function,
+		required: false,
+		default: void 0
+	},
+	hovering: {
+		type: Boolean,
+		required: false,
+		default: void 0
+	},
+	props: {
+		type: Object,
+		required: false,
+		default: void 0
+	},
+	content: {
+		type: [
+			String,
+			Number,
+			null,
+			Boolean,
+			Array
+		],
+		required: false,
+		skipCheck: true,
+		default: void 0
+	},
+	duration: {
+		type: [
+			Number,
+			Boolean,
+			null
+		],
+		required: false,
+		default: void 0
+	},
+	showProgress: {
+		type: Boolean,
+		required: false,
+		default: void 0
+	},
+	pauseOnHover: {
+		type: Boolean,
+		required: false,
+		default: void 0
+	},
+	closeIcon: {
+		type: [
+			String,
+			Number,
+			null,
+			Boolean,
+			Array
+		],
+		required: false,
+		skipCheck: true,
+		default: void 0
+	},
+	closable: {
+		type: [Boolean, Object],
+		required: false,
+		default: void 0
+	},
+	className: {
+		type: String,
+		required: false,
+		default: void 0
+	},
+	style: {
+		type: null,
+		required: false,
+		default: void 0
+	},
+	classNames: {
+		type: null,
+		required: false,
+		default: void 0
+	},
+	styles: {
+		type: null,
+		required: false,
+		default: void 0
+	},
+	times: {
+		type: Number,
+		required: false,
+		default: void 0
+	}
+} });
+var Notice_default = Notify;
+exports.default = Notice_default;

package/dist/Notice.d.ts

@@ -0,0 +1,15 @@
+import { Key, NoticeConfig } from './interface.ts';
+export interface NoticeProps extends Omit<NoticeConfig, 'onClose'> {
+    prefixCls: string;
+    eventKey: Key;
+    onClick?: (event: Event) => void;
+    onNoticeClose?: (key: Key) => void;
+    hovering?: boolean;
+    props?: Record<string, any>;
+}
+declare const Notify: import('vue').DefineSetupFnComponent<NoticeProps & {
+    times?: number;
+}, {}, {}, NoticeProps & {
+    times?: number;
+} & {}, import('vue').PublicProps>;
+export default Notify;

package/dist/Notice.js

@@ -0,0 +1,225 @@
+import { computed, createVNode, defineComponent, mergeProps, shallowRef, watch } from "vue";
+import { classNames } from "@v-c/util";
+import KeyCode from "@v-c/util/dist/KeyCode";
+import pickAttrs from "@v-c/util/dist/pickAttrs";
+var defaults = {
+	duration: 4.5,
+	pauseOnHover: true,
+	closeIcon: "x"
+};
+var Notice_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
+	const hovering = shallowRef(false);
+	const percent = shallowRef(0);
+	const spentTime = shallowRef(0);
+	const mergedHovering = computed(() => props.hovering || hovering.value);
+	const mergedDuration = computed(() => {
+		if (typeof props.duration === "number") return props.duration;
+		if (props.duration === void 0) return defaults.duration;
+		return 0;
+	});
+	const mergedPauseOnHover = computed(() => props.pauseOnHover === void 0 ? defaults.pauseOnHover : props.pauseOnHover);
+	const mergedShowProgress = computed(() => mergedDuration.value > 0 && props.showProgress);
+	const mergedCloseIcon = computed(() => props.closeIcon ?? defaults.closeIcon);
+	const onInternalClose = () => {
+		props.onNoticeClose?.(props.eventKey);
+	};
+	const onCloseKeyDown = (e) => {
+		if (e.key === "Enter" || e.code === "Enter" || e.keyCode === KeyCode.ENTER) onInternalClose();
+	};
+	watch([
+		() => props.times,
+		mergedDuration,
+		mergedHovering
+	], (_n, _, onCleanup) => {
+		const duration = mergedDuration.value;
+		const hoveringValue = mergedHovering.value;
+		const pauseOnHover = mergedPauseOnHover.value;
+		if (!hoveringValue && duration > 0) {
+			const start = Date.now() - spentTime.value;
+			const timeoutId = window.setTimeout(() => {
+				onInternalClose();
+			}, duration * 1e3 - spentTime.value);
+			onCleanup(() => {
+				if (pauseOnHover) clearTimeout(timeoutId);
+				spentTime.value = Date.now() - start;
+			});
+		}
+	}, { immediate: true });
+	watch([
+		() => props.times,
+		mergedDuration,
+		spentTime,
+		mergedHovering,
+		mergedShowProgress
+	], (_n, _, onCleanup) => {
+		const hoveringValue = mergedHovering.value;
+		const showProgress = mergedShowProgress.value;
+		const pauseOnHover = mergedPauseOnHover.value;
+		const duration = mergedDuration.value;
+		const baseSpentTime = spentTime.value;
+		if (!hoveringValue && showProgress && (pauseOnHover || baseSpentTime === 0)) {
+			const start = performance.now();
+			let animationFrame = 0;
+			const calculate = () => {
+				cancelAnimationFrame(animationFrame);
+				animationFrame = requestAnimationFrame((timestamp) => {
+					const runtime = timestamp + baseSpentTime - start;
+					const progress = Math.min(runtime / (duration * 1e3), 1);
+					percent.value = progress * 100;
+					if (progress < 1) calculate();
+				});
+			};
+			calculate();
+			onCleanup(() => {
+				if (pauseOnHover) cancelAnimationFrame(animationFrame);
+			});
+		}
+	}, { immediate: true });
+	return () => {
+		const { closable, prefixCls, props: divProps, onClick, content, className, style } = props;
+		const closableConfig = typeof closable === "object" && closable !== null ? closable : closable ? { closeIcon: mergedCloseIcon.value } : {};
+		const ariaProps = pickAttrs(closableConfig, true);
+		const validPercent = 100 - (percent.value <= 0 ? 0 : percent.value > 100 ? 100 : percent.value);
+		const noticePrefixCls = `${prefixCls}-notice`;
+		const mergedStyle = {
+			...typeof divProps?.style === "object" && divProps?.style ? divProps.style : {},
+			...typeof attrs.style === "object" && attrs.style ? attrs.style : {},
+			...typeof style === "object" && style ? style : {}
+		};
+		return createVNode("div", mergeProps(divProps, {
+			"class": classNames(noticePrefixCls, className, attrs.class, { [`${noticePrefixCls}-closable`]: !!closable }),
+			"style": mergedStyle,
+			"onMouseenter": (e) => {
+				hovering.value = true;
+				divProps?.onMouseEnter?.(e);
+			},
+			"onMouseleave": (e) => {
+				hovering.value = false;
+				divProps?.onMouseLeave?.(e);
+			},
+			"onClick": onClick
+		}), [
+			createVNode("div", { "class": `${noticePrefixCls}-content` }, [content]),
+			closable && createVNode("button", mergeProps({
+				"type": "button",
+				"class": `${noticePrefixCls}-close`,
+				"onKeydown": onCloseKeyDown,
+				"aria-label": "Close"
+			}, ariaProps, { "onClick": (e) => {
+				e.preventDefault();
+				e.stopPropagation();
+				onInternalClose();
+			} }), [closableConfig.closeIcon ?? mergedCloseIcon.value]),
+			mergedShowProgress.value && createVNode("progress", {
+				"class": `${noticePrefixCls}-progress`,
+				"max": "100",
+				"value": validPercent
+			}, [`${validPercent}%`])
+		]);
+	};
+}, { props: {
+	prefixCls: {
+		type: String,
+		required: true,
+		default: void 0
+	},
+	eventKey: {
+		type: [String, Number],
+		required: true,
+		default: void 0
+	},
+	onClick: {
+		type: Function,
+		required: false,
+		default: void 0
+	},
+	onNoticeClose: {
+		type: Function,
+		required: false,
+		default: void 0
+	},
+	hovering: {
+		type: Boolean,
+		required: false,
+		default: void 0
+	},
+	props: {
+		type: Object,
+		required: false,
+		default: void 0
+	},
+	content: {
+		type: [
+			String,
+			Number,
+			null,
+			Boolean,
+			Array
+		],
+		required: false,
+		skipCheck: true,
+		default: void 0
+	},
+	duration: {
+		type: [
+			Number,
+			Boolean,
+			null
+		],
+		required: false,
+		default: void 0
+	},
+	showProgress: {
+		type: Boolean,
+		required: false,
+		default: void 0
+	},
+	pauseOnHover: {
+		type: Boolean,
+		required: false,
+		default: void 0
+	},
+	closeIcon: {
+		type: [
+			String,
+			Number,
+			null,
+			Boolean,
+			Array
+		],
+		required: false,
+		skipCheck: true,
+		default: void 0
+	},
+	closable: {
+		type: [Boolean, Object],
+		required: false,
+		default: void 0
+	},
+	className: {
+		type: String,
+		required: false,
+		default: void 0
+	},
+	style: {
+		type: null,
+		required: false,
+		default: void 0
+	},
+	classNames: {
+		type: null,
+		required: false,
+		default: void 0
+	},
+	styles: {
+		type: null,
+		required: false,
+		default: void 0
+	},
+	times: {
+		type: Number,
+		required: false,
+		default: void 0
+	}
+} });
+export { Notice_default as default };

package/dist/NoticeList.cjs

@@ -0,0 +1,157 @@
+Object.defineProperty(exports, "__esModule", { value: true });
+const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
+const require_Notice = require("./Notice.cjs");
+const require_useStack = require("./hooks/useStack.cjs");
+const require_NotificationProvider = require("./NotificationProvider.cjs");
+let vue = require("vue");
+let __v_c_util = require("@v-c/util");
+let __v_c_util_dist_utils_transition = require("@v-c/util/dist/utils/transition");
+let __v_c_util_dist_vueuse_unref_element = require("@v-c/util/dist/vueuse/unref-element");
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
+}
+var NoticeList = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs }) => {
+	const ctx = require_NotificationProvider.useNotificationContext();
+	const dictRef = (0, vue.reactive)({});
+	const keys = (0, vue.computed)(() => (props.configList ?? []).map((config) => ({
+		config,
+		key: String(config.key)
+	})));
+	const latestNotice = (0, vue.shallowRef)(null);
+	const hoverKeys = (0, vue.ref)([]);
+	const [stackEnabled, stackOptions] = require_useStack.default((0, vue.toRef)(props, "stack"));
+	const expanded = (0, vue.computed)(() => stackEnabled.value && (hoverKeys.value.length > 0 || keys.value.length <= stackOptions.threshold.value));
+	const placementMotion = (0, vue.computed)(() => {
+		if (typeof props.motion === "function") return props.placement ? props.motion(props.placement) : void 0;
+		return props.motion;
+	});
+	(0, vue.watch)([
+		hoverKeys,
+		keys,
+		stackEnabled
+	], () => {
+		if (stackEnabled.value && hoverKeys.value.length > 1) hoverKeys.value = hoverKeys.value.filter((key) => keys.value.some(({ key: dataKey }) => key === dataKey));
+	});
+	(0, vue.watchEffect)(() => {
+		if (!stackEnabled.value) {
+			latestNotice.value = null;
+			return;
+		}
+		const lastKey = keys.value[keys.value.length - 1]?.key;
+		latestNotice.value = lastKey ? dictRef[lastKey] ?? null : null;
+	}, { flush: "post" });
+	const checkAllClosed = () => {
+		if (!props.placement) return;
+		if (keys.value.length === 0) props.onAllNoticeRemoved?.(props.placement);
+	};
+	return () => {
+		let _slot;
+		const { prefixCls = "", placement = "topRight", onNoticeClose } = props;
+		const renderNotify = () => keys.value.map(({ config }, motionIndex) => {
+			const { key, times } = config;
+			const strKey = String(key);
+			const { className: configClassName, style: configStyle, classNames: configClassNames, styles: configStyles,...restConfig } = config;
+			const dataIndex = keys.value.findIndex((item) => item.key === strKey);
+			const stackStyle = {};
+			if (stackEnabled.value) {
+				const index = keys.value.length - 1 - (dataIndex > -1 ? dataIndex : motionIndex - 1);
+				const transformX = placement === "top" || placement === "bottom" ? "-50%" : "0";
+				if (index > 0) {
+					stackStyle.height = expanded.value ? dictRef[strKey]?.offsetHeight : latestNotice.value?.offsetHeight;
+					if (stackStyle.height && typeof stackStyle.height === "number") stackStyle.height = `${stackStyle.height}px`;
+					let verticalOffset = 0;
+					for (let i = 0; i < index; i += 1) {
+						const targetKey = keys.value[keys.value.length - 1 - i]?.key;
+						const node = targetKey ? dictRef[targetKey] : null;
+						verticalOffset += (node?.offsetHeight ?? 0) + stackOptions.gap.value;
+					}
+					const transformY = (expanded.value ? verticalOffset : index * stackOptions.offset.value) * (placement.startsWith("top") ? 1 : -1);
+					const currentWidth = dictRef[strKey]?.offsetWidth;
+					const latestWidth = latestNotice.value?.offsetWidth;
+					stackStyle.transform = `translate3d(${transformX}, ${transformY}px, 0) scaleX(${!expanded.value && latestWidth && currentWidth ? (latestWidth - stackOptions.offset.value * 2 * (index < 3 ? index : 3)) / currentWidth : 1})`;
+				} else stackStyle.transform = `translate3d(${transformX}, 0, 0)`;
+			}
+			return (0, vue.createVNode)("div", {
+				"key": strKey,
+				"class": (0, __v_c_util.classNames)(`${prefixCls}-notice-wrapper`, configClassNames?.wrapper),
+				"style": {
+					...stackStyle,
+					...configStyles?.wrapper
+				},
+				"onMouseenter": () => {
+					hoverKeys.value = hoverKeys.value.includes(strKey) ? hoverKeys.value : [...hoverKeys.value, strKey];
+				},
+				"onMouseleave": () => {
+					hoverKeys.value = hoverKeys.value.filter((k) => k !== strKey);
+				}
+			}, [(0, vue.createVNode)(require_Notice.default, (0, vue.mergeProps)(restConfig, {
+				"ref": (el) => {
+					const element = (0, __v_c_util_dist_vueuse_unref_element.unrefElement)(el) ?? void 0;
+					if (dataIndex > -1) dictRef[strKey] = element;
+					else delete dictRef[strKey];
+				},
+				"prefixCls": prefixCls,
+				"classNames": configClassNames,
+				"styles": configStyles,
+				"class": (0, __v_c_util.classNames)(configClassName, ctx.value?.classNames?.notice),
+				"style": configStyle,
+				"times": times,
+				"eventKey": key,
+				"onNoticeClose": onNoticeClose,
+				"hovering": stackEnabled.value && hoverKeys.value.length > 0
+			}), null)]);
+		});
+		let motionGroupProps = {};
+		if (placementMotion.value) motionGroupProps = (0, __v_c_util_dist_utils_transition.getTransitionGroupProps)(placementMotion.value.name, placementMotion.value);
+		return (0, vue.createVNode)(vue.TransitionGroup, (0, vue.mergeProps)({
+			"key": placement,
+			"tag": "div",
+			"appear": true
+		}, {
+			class: (0, __v_c_util.classNames)(prefixCls, `${prefixCls}-${placement}`, ctx.value?.classNames?.list, attrs.class, {
+				[`${prefixCls}-stack-expanded`]: expanded.value,
+				[`${prefixCls}-stack`]: stackEnabled.value
+			}),
+			style: attrs.style
+		}, motionGroupProps, { "onAfterLeave": checkAllClosed }), _isSlot(_slot = renderNotify()) ? _slot : { default: () => [_slot] });
+	};
+}, { props: {
+	configList: {
+		type: Array,
+		required: false,
+		default: void 0
+	},
+	placement: {
+		type: String,
+		required: false,
+		default: void 0
+	},
+	prefixCls: {
+		type: String,
+		required: false,
+		default: void 0
+	},
+	motion: {
+		type: Function,
+		required: false,
+		skipCheck: true,
+		default: void 0
+	},
+	stack: {
+		type: [Boolean, Object],
+		required: false,
+		default: void 0
+	},
+	onAllNoticeRemoved: {
+		type: Function,
+		required: false,
+		default: void 0
+	},
+	onNoticeClose: {
+		type: Function,
+		required: false,
+		default: void 0
+	}
+} });
+var NoticeList_default = NoticeList;
+exports.default = NoticeList_default;

package/dist/NoticeList.d.ts

@@ -0,0 +1,13 @@
+import { TransitionGroupProps } from 'vue';
+import { Key, OpenConfig, Placement, StackConfig } from './interface.ts';
+export interface NoticeListProps {
+    configList?: OpenConfig[];
+    placement?: Placement;
+    prefixCls?: string;
+    motion?: TransitionGroupProps | ((placement: Placement) => TransitionGroupProps);
+    stack?: StackConfig;
+    onAllNoticeRemoved?: (placement: Placement) => void;
+    onNoticeClose?: (key: Key) => void;
+}
+declare const NoticeList: import('vue').DefineSetupFnComponent<NoticeListProps, {}, {}, NoticeListProps & {}, import('vue').PublicProps>;
+export default NoticeList;