@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
88 lines (87 loc) • 2.43 kB
JavaScript
import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
import t from "../button/button.js";
import n from "../popover/popover.js";
import { createBlock as r, mergeProps as i, openBlock as a, renderSlot as o, resolveComponent as s, resolveDirective as c, resolveDynamicComponent as l, withCtx as u, withDirectives as d, withKeys as f, withModifiers as p } from "vue";
//#region recipes/conversation_view/editor/EditorToolbarPopoverButton.vue
var m = {
name: "EditorToolbarPopoverButton",
components: {
DtButton: t,
DtPopover: n
},
props: {
isActive: {
type: Boolean,
default: !1
},
tooltipMessage: {
type: String,
required: !0
},
dataQa: {
type: String,
default: ""
},
popoverDataQa: {
type: String,
default: ""
},
tabindex: {
type: Number,
default: -1
},
icon: {
type: Object,
required: !0
}
},
emits: ["shift-focus-right", "shift-focus-left"],
data() {
return { pendingCallback: null };
},
methods: { onPopoverOpened(e) {
!e && typeof this.pendingCallback == "function" && (this.pendingCallback(), this.pendingCallback = null);
} }
};
function h(e, t, n, m, h, g) {
let _ = s("dt-button"), v = s("dt-popover"), y = c("dt-tooltip");
return a(), r(v, {
"data-qa": n.popoverDataQa || `${n.dataQa}-popover`,
padding: "small",
"navigation-type": "arrow-keys",
placement: "bottom-start",
"open-with-arrow-keys": !0,
onOpened: g.onPopoverOpened
}, {
anchor: u(({ attrs: o }) => [d((a(), r(_, i({ ref: "buttonRef" }, o, {
active: n.isActive,
"aria-label": n.tooltipMessage,
"data-qa": n.dataQa,
tabindex: n.tabindex,
importance: "clear",
kind: "muted",
size: "xs",
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(() => [(a(), r(l(n.icon), { size: "200" }))]),
_: 1
}, 16, [
"active",
"aria-label",
"data-qa",
"tabindex"
])), [[y, {
message: n.tooltipMessage,
placement: "top",
externalAnchorElement: e.$refs.buttonRef?.$el
}]])]),
content: u(({ close: t }) => [o(e.$slots, "content", { close: (e) => {
h.pendingCallback = e, t();
} })]),
_: 3
}, 8, ["data-qa", "onOpened"]);
}
var g = /* @__PURE__ */ e(m, [["render", h]]);
//#endregion
export { g as default };
//# sourceMappingURL=EditorToolbarPopoverButton.js.map