import { defineComponent, h } from "vue";
import GnAvatar from "./GnAvatar.js";

export default defineComponent({
	name: "GnAvatarStack",
	props: {
		items: { type: Array, default: () => [] },
		count: { type: [Number, String], default: "" }
	},
	setup(props, { slots }) {
		return () => h("span", { class: "avatar-stack" }, [
			props.items.map(item => h(GnAvatar, { ...item, size: item.size || "sm" })),
			slots.default?.(),
			props.count && h("span", { class: "avatar-stack-count" }, `+${props.count}`)
		]);
	}
});