import e from "../../common/utils/index.js";
import { t } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
import n from "../../common/mixins/modal.js";
import { NOTICE_KINDS as r } from "../notice/notice-constants.js";
import i from "../notice/notice-icon.js";
import a from "../notice/notice-content.js";
import o from "../notice/notice-action.js";
import { createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createVNode as d, normalizeClass as f, normalizeStyle as p, openBlock as m, renderSlot as h, resolveComponent as g, withCtx as _, withKeys as v } from "vue";
//#region components/banner/banner.vue
var y = {
	compatConfig: { MODE: 3 },
	name: "DtBanner",
	components: {
		DtNoticeIcon: i,
		DtNoticeContent: a,
		DtNoticeAction: o
	},
	mixins: [n],
	props: {
		titleId: {
			type: String,
			default() {
				return e.getUniqueString();
			}
		},
		contentId: {
			type: String,
			default() {
				return e.getUniqueString();
			}
		},
		title: {
			type: String,
			default: ""
		},
		important: {
			type: Boolean,
			default: !1
		},
		pinned: {
			type: Boolean,
			default: !1
		},
		kind: {
			type: String,
			default: "base",
			validate(e) {
				return r.includes(e);
			}
		},
		hideClose: {
			type: Boolean,
			default: !1
		},
		hideIcon: {
			type: Boolean,
			default: !1
		},
		hideAction: {
			type: Boolean,
			default: !1
		},
		dialogClass: {
			type: String,
			default: ""
		},
		backgroundImage: {
			type: String,
			default: ""
		},
		backgroundSize: {
			type: String,
			default: "cover"
		}
	},
	emits: ["close"],
	computed: {
		role() {
			return this.important ? "alertdialog" : "status";
		},
		bannerClass() {
			return [
				"d-banner",
				{
					error: "d-banner--error",
					info: "d-banner--info",
					success: "d-banner--success",
					warning: "d-banner--warning",
					base: "d-banner--base"
				}[this.kind],
				{
					"d-banner--important": this.important,
					"d-banner--pinned": this.pinned
				}
			];
		},
		bannerBackgroundImage() {
			return this.backgroundImage === "" ? null : `background-image: url(${this.backgroundImage});
              background-size: ${this.backgroundSize};`;
		}
	},
	mounted() {
		this.important && this.focusFirstElement();
	},
	methods: { trapFocus(e) {
		this.important && this.focusTrappedTabPress(e);
	} }
}, b = [
	"role",
	"aria-labelledby",
	"aria-describedby"
];
function x(e, t, n, r, i, a) {
	let o = g("dt-notice-icon"), y = g("dt-notice-content"), x = g("dt-notice-action");
	return m(), l("aside", {
		class: f(a.bannerClass),
		style: p(a.bannerBackgroundImage),
		onKeydown: t[1] || (t[1] = v((...e) => a.trapFocus && a.trapFocus(...e), ["tab"]))
	}, [u("div", {
		class: f(["d-banner__dialog", n.dialogClass]),
		role: a.role,
		"aria-labelledby": n.titleId,
		"aria-describedby": n.contentId
	}, [
		n.hideIcon ? c("", !0) : (m(), s(o, {
			key: 0,
			kind: n.kind
		}, {
			default: _(() => [h(e.$slots, "icon")]),
			_: 3
		}, 8, ["kind"])),
		d(y, {
			"title-id": n.titleId,
			"content-id": n.contentId,
			title: n.title
		}, {
			titleOverride: _(() => [h(e.$slots, "titleOverride")]),
			default: _(() => [h(e.$slots, "default")]),
			_: 3
		}, 8, [
			"title-id",
			"content-id",
			"title"
		]),
		d(x, {
			"hide-action": n.hideAction,
			"hide-close": n.hideClose,
			onClose: t[0] || (t[0] = (t) => e.$emit("close"))
		}, {
			default: _(() => [h(e.$slots, "action")]),
			_: 3
		}, 8, ["hide-action", "hide-close"])
	], 10, b)], 38);
}
var S = /* @__PURE__ */ t(y, [["render", x]]);
//#endregion
export { S as default };

//# sourceMappingURL=banner.js.map