@dialpad/dialtone/dist/vue3/common/mixins/modal.js

Dialpad's Dialtone design system monorepo

import { returnFirstEl as e } from "../utils/index.js";
//#region common/mixins/modal.js
var t = ":not(:disabled):not([aria-disabled=\"true\"]):not([role=\"presentation\"])", n = `${t}:not([tabindex="-1"])`, r = "button,[href],input,select,textarea,details,[tabindex]", i = { methods: {
	async getFirstFocusableElement(e) {
		await this.$nextTick();
		let t = this._getFocusableElements(e, !0);
		return this._getFirstFocusElement(t);
	},
	async focusFirstElement(t = this.$el) {
		(await this.getFirstFocusableElement(e(t)))?.focus({ preventScroll: !0 });
	},
	async focusElementById(t) {
		await this.$nextTick();
		let n = e(this.$el)?.querySelector(t);
		if (n) {
			n.focus();
			return;
		}
		console.warn("Could not find the element specified in dt-modal prop \"initialFocusElement\". Defaulting to focusing the first element."), await this.focusFirstElement();
	},
	_getFirstFocusElement(e) {
		if (!e.length) return;
		let t = e[0];
		return t.matches("[type=\"radio\"]:not(:checked)") && (t = e.find((e) => e.checked && e.name === t.name) || t), t;
	},
	_getFocusableElements(i = this.$el, a = !1) {
		return i = e(i), i ? [...i.querySelectorAll(r)].filter((e) => {
			let r = window.getComputedStyle(e);
			return r.getPropertyValue("display") !== "none" && r.getPropertyValue("visibility") !== "hidden" && e.matches(a ? t : n);
		}) : [];
	},
	focusTrappedTabPress(e, t) {
		if (e.key !== "Tab") return;
		let n = this._getFocusableElements(t);
		if (!n.length) {
			e.preventDefault();
			return;
		}
		let r = this._getFirstFocusElement(n), i = n[n.length - 1];
		e.shiftKey ? document.activeElement === r && (i.focus(), e.preventDefault()) : document.activeElement === i && (r.focus(), e.preventDefault());
	}
} };
//#endregion
export { i as default };

//# sourceMappingURL=modal.js.map