Newer
Older
gnexus-ui-kit / src / vue / components / GnConfirmDialog.js
@Eugene Sukhodolskiy Eugene Sukhodolskiy 14 hours ago 1 KB Add Vue adapter foundation
import { defineComponent, h } from "vue";
import GnButton from "./GnButton.js";
import GnModal from "./GnModal.js";

export default defineComponent({
	name: "GnConfirmDialog",
	props: {
		open: { type: Boolean, default: false },
		title: { type: String, default: "Requires confirmation" },
		message: { type: String, default: "" },
		confirmText: { type: String, default: "YES" },
		cancelText: { type: String, default: "NO" },
		confirmVariant: { type: String, default: "warning" }
	},
	emits: ["update:open", "confirm", "cancel"],
	setup(props, { emit, slots }) {
		const close = () => emit("update:open", false);
		const cancel = () => {
			emit("cancel");
			close();
		};
		const confirm = () => {
			emit("confirm");
			close();
		};

		return () => h(GnModal, {
			open: props.open,
			title: props.title,
			"onUpdate:open": value => emit("update:open", value)
		}, {
			default: () => slots.default?.() || h("p", {}, props.message),
			actions: () => [
				h(GnButton, { variant: "primary", onClick: cancel }, () => props.cancelText),
				h(GnButton, { variant: props.confirmVariant, onClick: confirm }, () => props.confirmText)
			]
		});
	}
});