import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
import { Fragment as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, normalizeClass as o, openBlock as s, renderList as c, resolveDynamicComponent as l, toDisplayString as u } from "vue";
import { DtIconArrowDown as d, DtIconArrowLeft as f, DtIconArrowRight as p, DtIconArrowUp as m, DtIconCommand as h, DtIconLayoutGrid as g, DtIconOption as _, DtIconPlus as v } from "@dialpad/dialtone-icons/vue3";
//#region components/keyboard_shortcut/keyboard_shortcut.vue
var y = {
	"{win}": g,
	"{arrow-right}": p,
	"{arrow-left}": f,
	"{arrow-up}": m,
	"{arrow-down}": d,
	"{cmd}": h,
	"{opt}": _
}, b = {
	"{cmd}": "Command",
	"{opt}": "Option",
	"{win}": "Windows",
	"{arrow-right}": "Right Arrow",
	"{arrow-left}": "Left Arrow",
	"{arrow-up}": "Up Arrow",
	"{arrow-down}": "Down Arrow",
	"{plus}": "plus"
}, x = {
	ctrl: "Control",
	alt: "Alt",
	esc: "Escape",
	del: "Delete",
	ins: "Insert",
	pgup: "Page Up",
	pgdn: "Page Down",
	num: "Number",
	caps: "Caps Lock"
}, S = {
	compatConfig: { MODE: 3 },
	name: "DtKeyboardShortcut",
	components: {
		DtIconLayoutGrid: g,
		DtIconArrowRight: p,
		DtIconArrowLeft: f,
		DtIconArrowUp: m,
		DtIconArrowDown: d,
		DtIconCommand: h,
		DtIconOption: _,
		DtIconPlus: v
	},
	props: {
		inverted: {
			type: Boolean,
			default: !1
		},
		shortcut: {
			type: String,
			required: !0
		},
		screenReaderText: {
			type: String,
			default: null
		}
	},
	data() {
		return { separator: /\+/gi };
	},
	computed: {
		icons() {
			return {
				...y,
				"{plus}": v
			};
		},
		shortcutWithSeparator() {
			return this.shortcut.replace(this.separator, "{plus}");
		},
		formattedShortcut() {
			return Object.keys(y).reduce((e, t) => e.replace(RegExp("{" + t + "}", "gi"), y[t]), this.shortcutWithSeparator);
		},
		formattedShortcutSplit() {
			let e = Object.keys(this.icons).join("|"), t = RegExp(`(${e})`, "gi");
			return this.formattedShortcut.split(t).filter(Boolean);
		},
		generatedScreenReaderText() {
			return this.formattedShortcutSplit.map((e) => {
				let t = e.trim();
				if (b[t]) return b[t];
				let n = t.toLowerCase();
				return x[n] ? x[n] : t;
			}).filter((e) => e).join(" ");
		}
	}
}, C = { class: "d-keyboard-shortcut--sr-only" }, w = ["innerHTML"];
function T(e, d, f, p, m, h) {
	return s(), i("kbd", { class: o(["d-keyboard-shortcut", { "d-keyboard-shortcut--inverted": f.inverted }]) }, [a("span", C, u(f.screenReaderText || h.generatedScreenReaderText), 1), (s(!0), i(t, null, c(h.formattedShortcutSplit, (e, a) => (s(), i(t, null, [h.icons[e] ? (s(), n(l(h.icons[e]), {
		key: `icon-${a}-${e}`,
		size: "100",
		"aria-hidden": "true",
		class: o(["d-keyboard-shortcut__icon", { "d-keyboard-shortcut__icon--inverted": f.inverted }])
	}, null, 8, ["class"])) : e.trim() ? (s(), i("span", {
		key: `text-${a}-${e}`,
		"aria-hidden": "true",
		class: o(["d-keyboard-shortcut__item", { "d-keyboard-shortcut__item--inverted": f.inverted }]),
		innerHTML: e
	}, null, 10, w)) : r("", !0)], 64))), 256))], 2);
}
var E = /* @__PURE__ */ e(S, [["render", T]]);
//#endregion
export { E as default };

//# sourceMappingURL=keyboard-shortcut.js.map