@luzmo/vue-embed
Version:
This is a Vue.js library for embedding [Luzmo](https://luzmo.com) dashboards in your Vue 2 or Vue 3 application.
394 lines (393 loc) • 9.31 kB
JavaScript
import * as F from "@luzmo/embed";
export * from "@luzmo/embed";
import { defineComponent as c, ref as d, onMounted as v, nextTick as h, onUnmounted as q, createElementBlock as z, openBlock as f, mergeProps as b, resolveComponent as D, createBlock as E } from "vue";
function R(i, n) {
for (var s = 0; s < n.length; s++) {
const r = n[s];
if (typeof r != "string" && !Array.isArray(r)) {
for (const t in r)
if (t !== "default" && !(t in i)) {
const e = Object.getOwnPropertyDescriptor(r, t);
e && Object.defineProperty(i, t, e.get ? e : {
enumerable: !0,
get: () => r[t]
});
}
}
}
return Object.freeze(Object.defineProperty(i, Symbol.toStringTag, { value: "Module" }));
}
const l = "5.7.2";
class V {
constructor() {
this._dashboardComponents = [];
}
/* ------------------
| External Methods |
------------------*/
// // Get all active dashboards
getDashboards() {
return Promise.resolve(this._dashboardComponents);
}
/* --------------------
| Set Luzmo Object |
--------------------*/
_setComponentContext(n) {
this._dashboardComponents.includes(n) || this._dashboardComponents.push(n);
}
// remove component context from array after unmounting
_removeComponentContext(n) {
this._dashboardComponents.includes(n) && (this._dashboardComponents = this._dashboardComponents.filter(
(s) => s !== n
));
}
}
const S = new V(), M = ["lib-version"], P = c({
name: "LuzmoDashboard"
}), $ = /* @__PURE__ */ c({
...P,
props: {
// Params from <luzmo-dashboard>
dashboardId: {
type: String,
default: null
},
dashboardSlug: {
type: String,
default: null
},
itemId: {
type: String,
default: null
},
language: {
type: String,
default: "auto"
},
qeVersion: {
type: Number,
default: null
},
editMode: {
type: String,
default: "view"
},
screenMode: {
type: String,
default: "auto"
},
switchScreenModeOnResize: {
type: Boolean,
default: !0
},
itemDimensions: {
type: Object,
default: () => ({
width: "auto",
height: "auto"
})
},
theme: String,
mainColor: String,
accentColor: String,
// optional params
authToken: String,
authKey: String,
loaderBackground: String,
loaderFontColor: String,
loaderSpinnerColor: String,
loaderSpinnerBackground: String,
appServer: {
type: String,
default: "https://app.luzmo.com/"
},
timezoneId: String,
apiHost: {
type: String,
default: "https://api.luzmo.com/"
},
embedMode: {
type: String,
default: "iframe"
}
},
emits: [
"customEvent",
"itemsRendered",
"load",
"filters",
"exported",
"changedFilters",
"dashboardAction"
],
setup(i, { expose: n, emit: s }) {
const r = i, t = s, e = d(), m = d(l + "-vue-luzmo");
v(() => {
h(() => {
e.value.setAttribute("version", l + "-vue-embed"), e.value.addEventListener("load", (o) => t("load", o.detail)), e.value.addEventListener("itemsRendered", (o) => t("itemsRendered", o.detail)), e.value.addEventListener("customEvent", (o) => t("customEvent", o.detail)), e.value.addEventListener("changedFilters", (o) => t("changedFilters", o.detail)), e.value.addEventListener("dashboardAction", (o) => t("dashboardAction", o.detail)), e.value.addEventListener("export", (o) => t("exported", o.detail));
});
}), q(() => {
S._removeComponentContext(this);
});
function p() {
return S.getDashboards();
}
function g(o) {
return e.value.getData(o);
}
function _() {
return e.value.getFilters();
}
function a(o, u) {
return e.value.setSelectedData(o, u);
}
function y(o, u) {
return e.value.setAuthorization(o, u);
}
function x(o) {
return e.value.refreshData(o);
}
function L() {
return e.value.reloadDashboard();
}
function C(o) {
return e.value.exportDashboard(o);
}
function I() {
return e.value.getAccessibleDashboards();
}
function A(o) {
return e.value.setEditMode(o);
}
function O(o, u) {
return e.value.addFilters(o, u);
}
function j(o) {
return e.value.setPreview(o);
}
function k(o, u, w) {
return e.value.sendExportEmail(o, u, w);
}
return n({
addFilters: O,
exportDashboard: C,
getAccessibleDashboards: I,
getDashboards: p,
getData: g,
getFilters: _,
refreshData: x,
reloadDashboard: L,
sendExportEmail: k,
setAuthorization: y,
setEditMode: A,
setPreview: j,
setSelectedData: a,
luzmoDashboard: e,
libVersion: m
}), (o, u) => (f(), z("luzmo-embed-dashboard", b(r, {
ref_key: "luzmoDashboard",
ref: e,
"lib-version": m.value
}), null, 16, M));
}
}), B = ["lib-version"], T = /* @__PURE__ */ c({
__name: "luzmo-viz-item",
props: {
type: {
type: String
},
appServer: {
type: String,
default: "https://app.luzmo.com"
},
apiHost: {
type: String,
default: "https://api.luzmo.com"
},
slots: {
type: Object
},
options: {
type: Object
},
autKey: {
type: String
},
authToken: {
type: String
},
contextId: {
type: String
},
canFilter: {
type: Object
},
filters: {
type: Object
},
dashboardId: {
type: String
},
itemId: {
type: String
},
selectedData: {
type: Object
},
dashboardContentsVersion: {
type: String
}
},
emits: [
"rendered",
"load",
"exported",
"changedFilters",
"customEvent"
],
setup(i, { expose: n, emit: s }) {
const r = s, t = d(), e = d(l + "-vue-luzmo");
v(() => {
h(() => {
t.value.setAttribute("version", l + "-vue-embed"), t.value.addEventListener("load", (a) => r("load", a.detail)), t.value.addEventListener("rendered", (a) => r("rendered", a.detail)), t.value.addEventListener("changedFilters", (a) => r("changedFilters", a.detail)), t.value.addEventListener("exported", (a) => r("exported", a.detail)), t.value.addEventListener("customEvent", (a) => r("customEvent", a.detail));
});
});
function m() {
return t.value.getData();
}
function p() {
return t.value.getFilters();
}
function g() {
return t.value.refreshData();
}
function _(a = "png") {
return t.value.export(a);
}
return n({
getData: m,
getFilters: p,
refreshData: g,
export: _,
luzmoVizItemRef: t,
libVersion: e
}), (a, y) => (f(), z("luzmo-embed-viz-item", b(a.$props, {
ref_key: "luzmoVizItemRef",
ref: t,
"lib-version": e.value
}), null, 16, B));
}
}), H = /* @__PURE__ */ c({
__name: "luzmo-iq-chat",
props: {
appServer: {
type: String,
default: "https://app.luzmo.com"
},
apiHost: {
type: String,
default: "https://api.luzmo.com"
},
options: {
type: Object
},
autKey: {
type: String
},
authToken: {
type: String
},
initialSuggestionsDatasetId: {
type: String
},
availableDatasets: {
type: Object
}
},
emits: [
"rendered",
"load"
],
setup(i, { expose: n, emit: s }) {
const r = d(), t = d(l + "-vue-luzmo");
return v(() => {
h(() => {
r.value.setAttribute("version", l + "-vue-embed");
});
}), n({
luzmoIQChatRef: r,
libVersion: t
}), (e, m) => {
const p = D("luzmo-iq-embed-chat");
return f(), E(p, b(e.$props, {
ref_key: "luzmoIQChatRef",
ref: r,
"lib-version": t.value
}), null, 16, ["lib-version"]);
};
}
}), K = /* @__PURE__ */ c({
__name: "luzmo-iq-answer",
props: {
appServer: {
type: String,
default: "https://app.luzmo.com"
},
apiHost: {
type: String,
default: "https://api.luzmo.com"
},
options: {
type: Object
},
autKey: {
type: String
},
authToken: {
type: String
},
messages: {
type: Object
}
},
emits: [
"rendered",
"load"
],
setup(i, { expose: n, emit: s }) {
const r = d(), t = d(l + "-vue-luzmo");
return v(() => {
h(() => {
r.value.setAttribute("version", l + "-vue-embed");
});
}), n({
luzmoIQAnswerRef: r,
libVersion: t
}), (e, m) => {
const p = D("luzmo-iq-embed-answer");
return f(), E(p, b(e.$props, {
ref_key: "luzmoIQAnswerRef",
ref: r,
"lib-version": t.value
}), null, 16, ["lib-version"]);
};
}
}), Q = /* @__PURE__ */ R({
__proto__: null,
LuzmoDashboard: $,
LuzmoIqAnswer: K,
LuzmoIqChat: H,
LuzmoVizItem: T
}, [F]), U = (i) => {
const n = Object.entries(Q);
for (const [s, r] of n)
i.component(s, r);
};
export {
$ as LuzmoDashboard,
S as LuzmoDashboardService,
K as LuzmoIqAnswer,
H as LuzmoIqChat,
T as LuzmoVizItem,
U as default
};