import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
import t from "../button/button.js";
import { createBlock as n, createTextVNode as r, openBlock as i, renderSlot as a, resolveComponent as o, resolveDirective as s, resolveDynamicComponent as c, toDisplayString as l, withCtx as u, withDirectives as d, withKeys as f, withModifiers as p } from "vue";
//#region recipes/conversation_view/editor/EditorToolbarButton.vue
var m = {
	name: "EditorToolbarButton",
	components: { DtButton: t },
	props: {
		isActive: {
			type: Boolean,
			default: !1
		},
		tooltipMessage: {
			type: String,
			required: !0
		},
		dataQA: {
			type: String,
			default: ""
		},
		tabindex: {
			type: Number,
			default: -1
		},
		icon: {
			type: Object,
			required: !0
		},
		label: {
			type: String,
			default: ""
		},
		onClick: {
			type: Function,
			required: !0
		}
	},
	emits: ["shift-focus-right", "shift-focus-left"]
};
function h(e, t, m, h, g, _) {
	let v = o("dt-button"), y = s("dt-tooltip");
	return d((i(), n(v, {
		ref: "buttonRef",
		active: m.isActive,
		"aria-label": m.tooltipMessage,
		"data-qa": m.dataQA,
		tabindex: m.tabindex,
		importance: "clear",
		kind: "muted",
		size: "xs",
		onClick: m.onClick,
		onKeydown: [t[0] || (t[0] = f(p((t) => e.$emit("shift-focus-right"), ["stop"]), ["right"])), t[1] || (t[1] = f(p((t) => e.$emit("shift-focus-left"), ["stop"]), ["left"]))]
	}, {
		icon: u(() => [(i(), n(c(m.icon), { size: "200" })), a(e.$slots, "extra")]),
		default: u(() => [r(" " + l(m.label), 1)]),
		_: 3
	}, 8, [
		"active",
		"aria-label",
		"data-qa",
		"tabindex",
		"onClick"
	])), [[y, {
		message: m.tooltipMessage,
		placement: "top",
		externalAnchorElement: e.$refs.buttonRef?.$el
	}]]);
}
var g = /* @__PURE__ */ e(m, [["render", h]]);
//#endregion
export { g as default };

//# sourceMappingURL=EditorToolbarButton.js.map