UNPKG

@adyen/lume

Version:

Lume is a Vue data visualization component library, built with Typescript and D3.

1,551 lines 107 kB
import { defineComponent as N, ref as w, isRef as bt, computed as d, watch as H, toRefs as B, inject as Le, reactive as Oe, onMounted as ee, watchEffect as kt, onBeforeUnmount as xt, useSlots as M, nextTick as He, provide as Ee, defineAsyncComponent as Ne } from "vue"; import { sankeyLinkHorizontal as Mt, sankey as zt, sankeyJustify as Wt } from "d3-sankey"; import { format as Zt, ticks as Ut, scaleBand as fe, scaleLinear as pe, link as Xt, line as Yt, area as Kt } from "d3"; import { createPopper as Jt } from "@popperjs/core"; const Qt = /* @__PURE__ */ N({ __name: "lume-tick", props: { value: { type: [String, Number], required: !0 }, group: { type: Object, required: !0 }, ghost: { type: Object, required: !0 }, label: { type: Object, required: !0 }, gridline: { type: Object, required: !0 }, isHovered: { type: Boolean, default: !1 }, isHidden: { type: Boolean, default: !1 }, withGridlines: { type: Boolean, default: !0 } }, emits: ["click", "mouseenter"], setup(t, { expose: e, emit: r }) { const n = w(null); return e({ ref: n }), { __sfc: !0, emit: r, labelRef: n }; } }); function E(t, e, r, n, a, o, l, i) { var u = typeof t == "function" ? t.options : t; return e && (u.render = e, u.staticRenderFns = r, u._compiled = !0), o && (u._scopeId = "data-v-" + o), { exports: t, options: u }; } var qt = function() { var e = this, r = e._self._c, n = e._self._setupProxy; return r("g", e._b({ staticClass: "axis__tick", class: { "axis__tick--hovered": e.isHovered, "axis__tick--hidden": e.isHidden }, attrs: { "data-j-axis__tick": "" }, on: { mouseenter: function(a) { return n.emit("mouseenter", a); }, click: function(a) { return n.emit("click", a); } } }, "g", e.group, !1), [r("g", { staticClass: "axis__tick-label lume-typography--axis", attrs: { "pointer-events": "all", "data-j-axis__tick-label": "" } }, [r("rect", e._b({ staticClass: "axis__ghost", attrs: { fill: "url(#lume-tick-gradient)" } }, "rect", e.ghost, !1)), r("text", e._b({ ref: "labelRef", staticClass: "axis__label" }, "text", e.label, !1), [e._v(" " + e._s(e.value) + " ")])]), e.withGridlines ? r("line", e._b({ staticClass: "axis__grid-line" }, "line", e.gridline, !1)) : e._e()]); }, en = [], tn = /* @__PURE__ */ E( Qt, qt, en, !1, null, "59ddc0a6" ); const nn = tn.exports, rn = [ "controls", "legend", "axes", "groups", "tooltip", "tooltip-content" ]; function At() { return process.env.NODE_ENV === "production"; } function Tt(t) { return (t == null ? void 0 : t.map( (e) => e.values.map((r) => r == null ? void 0 : r.value).flat() ).flat()) || []; } function We(t) { return t.length === 1; } function an(t) { return !!t && t.every( (e) => "color" in e ); } function De(t) { return !!t && typeof t == "object" && !Array.isArray(t); } function Lt(t, e) { const r = { ...t }; return Object.entries(e).forEach(([n, a]) => { r[n] = De(t[n]) && De(a) ? Lt(t[n], a) : a; }), r; } function on(t) { return t != null && De(t) && "value" in t; } function U(t) { return (t == null ? void 0 : t.bandwidth) !== void 0; } function ln(t) { return U(t) ? t.step() : Math.max(...t.range()) / Math.max(...t.domain()); } function un(t) { const [e, r] = t.domain(); return e == null || r == null || e === 0 && r === 0; } const sn = (t, e) => { if (!t) throw new Error("Data is not a valid array"); if (t.length === 0) throw new Error("Cannot get highest value from empty array"); t.some( ({ values: n }) => n.length - 1 >= e ) || q(X.IndexExceedsLengthOfDataSets); }; function cn(t, e) { var r; return sn(t, e), ((r = t.reduce( (n, a) => { var o, l; return (((o = n.values[e]) == null ? void 0 : o.value) ?? 0) > (((l = a.values[e]) == null ? void 0 : l.value) ?? 0) ? n : a; } ).values[e]) == null ? void 0 : r.value) || 0; } function Ot(t) { const e = bt(t) ? t.value : t; if (!e) throw new Error("No empty array can be created from specified data value"); const r = Math.max( ...e.map((n) => n.values.length), 0 ); return Array(r).fill(null); } function dn(t) { return U(t) ? t.domain().length : Math.max(...t.domain()); } function vn(t, e) { return (r) => Math.round(t * (1 - r) + e * r); } function fn(t, e, r) { const n = e, a = t.slice(0, n); return t.slice(n).concat(a); } function ae(t) { if (t.groups) { const e = Object.keys(t); return Object.assign( {}, ...e.map((r) => r !== "groups" ? { [r]: t[r] } : {}) ); } return t; } function pn(t) { return Object.assign( {}, ...Object.keys(t).map( (e) => rn.includes(e) ? {} : { [e]: t[e] } ) ); } const mn = (t = 21) => crypto.getRandomValues(new Uint8Array(t)).reduce( (e, r) => e += (r &= 63) < 36 ? r.toString(36) : r < 62 ? (r - 26).toString(36).toUpperCase() : r > 62 ? "-" : "_", "" ); function Ze(t, e) { const r = e - t.length; return r > 0 ? [...t, ...Array(r).fill({ value: null })] : t; } var X = /* @__PURE__ */ ((t) => (t.DatasetLength = `Our guidelines highly recommend not having more than 5 datasets in one chart. Learn more: https://lume.design/guidelines/datasets`, t.ColorLoop = "Colors will loop around after the 5th dataset. You can prevent this by setting specific colors for your datasets.", t.Empty = "The dataset(s) provided are empty.", t.InvalidFormat = "The string provided to format is invalid. Please refer to https://github.com/d3/d3-format for valid arguments.", t.NotContainedInSvg = "This component is an `SVGElement`, thus it is required to be inside an `<svg>` container.", t.InvalidHoveredIndex = "The provided hovered index is not valid for the data of this chart.", t.InvalidHoveredElement = "The provided hovered element is not valid for the data of this diagram.", t.IndexExceedsLengthOfDataSets = "Index exceeds length of all of the datasets", t))(X || {}); const _n = "[lume] "; function q(t, e = !0) { e && At() || console.warn(_n + "Warning: " + t); } const Ae = (t) => { let e = null; switch (typeof t) { case "string": try { e = Zt(t); } catch { q(X.InvalidFormat), e = null; } break; case "function": e = t; break; default: e = null; } function r(...n) { return e ? e(...n) : n[0]; } return r; }, me = () => ({ options: { type: Object, default: () => ({}) } }); function Y(t, e) { return { allOptions: d(() => { const n = bt(e) ? e == null ? void 0 : e.value : e; return n ? Lt(n, t.value) : t.value; }) }; } const hn = 0.2; function gn(t, e, r) { const n = w(), a = d(() => Math.max(...t.value.range())), o = d(() => e.value.length); function l() { if (!e.value) return; const u = e.value.reduce( (v, s) => v + s.ref.getBoundingClientRect().width, 0 ), c = Math.ceil(u / o.value); n.value = c + c * hn; } function i(u) { if (!e.value) return !0; const c = r.value.skip, v = e.value.length; if (u === 0) return !0; const s = a.value / v, f = typeof c == "number" && c > 0 && c + 1 || Math.ceil(n.value / s); return u % f === 0; } return H(e, l), { showTick: i }; } const O = { HORIZONTAL: "horizontal", VERTICAL: "vertical" }, yn = { SINGLE: "single", GROUPED: "grouped", STACKED: "stacked" }, $t = "No data", rt = 20, It = 0.33, wt = 0.5, Et = 12, _e = 8, bn = 1, kn = [ "auto", "auto-start", "auto-end", "top", "top-start", "top-end", "right", "right-start", "right-end", "bottom", "bottom-start", "bottom-end", "left", "left-start", "left-end" ]; function $e(t) { t != null && t.closest("svg") || q(X.NotContainedInSvg); } const Nt = { /** Displays a line for each tick. */ gridLines: !1, /** Displays the axis title. */ withTitle: !0, // //// Tick settings // /** Controls if the tick labels should be displayed. */ showTicks: !0, /** Amount of ticks to display in the axis. */ tickCount: 10, /** Formatting string/function for the tick label. */ tickFormat: null, /** Space between the tick label and the axis line. */ tickPadding: 12 }, xn = { ...Nt, withTitle: !1, skip: !0 }, An = { ...Nt, gridLines: !0 }, Tn = function(t, e, r) { const n = d(() => t.value.step() * t.value.paddingInner() / 2); function a(u, c) { return { transform: `translate(${(t.value(c) ?? t.value(u)) - n.value}, 0)` }; } function o(u) { var v; const c = Math.max( t.value.step(), (u ? (v = u.getComputedTextLength) == null ? void 0 : v.call(u) : t.value.step()) + 20 ); return { x: -(c - t.value.step()) / 2, width: c, height: r.value.tickPadding + Et + _e }; } function l() { const u = t.value.step() / 2; return { x1: u, x2: u, y1: -e.value.height // Negative height means it goes from bottom to top }; } function i() { return { x: t.value.step() / 2, y: r.value.tickPadding, dy: "0.8em", "text-anchor": "middle" }; } return { getGridLinesAttributes: l, getTickGhostAttributes: o, getTickGroupAttributes: a, getTickLabelAttributes: i }; }, Ln = function(t, e, r) { const n = d(() => t.value.step() * t.value.paddingInner() / 2); function a(u, c) { return { transform: `translate(0, ${(t.value(c) ?? t.value(u)) - n.value})` }; } function o(u) { var v; const c = (u ? (v = u.getComputedTextLength) == null ? void 0 : v.call(u) : 42) + r.value.tickPadding + _e; return { x: -c, width: c, height: t.value.step() }; } function l() { const u = t.value.step() / 2; return { y1: u, y2: u, x1: e.value.width }; } function i() { return { x: -r.value.tickPadding, y: t.value.step() / 2, "text-anchor": "end", "alignment-baseline": "middle" }; } return { getGridLinesAttributes: l, getTickGhostAttributes: o, getTickGroupAttributes: a, getTickLabelAttributes: i }; }, On = function(t, e, r) { const n = d(() => { const u = t.value.ticks(); return u.length > 1 ? t.value(u[1]) - t.value(u[0]) : 0; }); function a(u) { return { transform: `translate(${t.value(u)}, 0)` }; } function o() { return { height: r.value.tickPadding + Et + _e, width: n.value, x: -(n.value / 2) }; } function l() { return { y1: -e.value.height }; } function i() { return { y: r.value.tickPadding, dy: "0.8em", "text-anchor": "middle" }; } return { getGridLinesAttributes: l, getTickGhostAttributes: o, getTickGroupAttributes: a, getTickLabelAttributes: i }; }, $n = function(t, e, r) { const n = d(() => { const u = t.value.ticks(); return u.length > 1 ? t.value(u[1]) - t.value(u[0]) : 0; }); function a(u) { return { transform: `translate(0, ${t.value(u)})` }; } function o(u) { var v; const c = (((v = u == null ? void 0 : u.getComputedTextLength) == null ? void 0 : v.call(u)) || 0) + r.value.tickPadding + _e; return { width: c, height: n.value, x: -c, y: -(n.value / 2) }; } function l() { return { x1: e.value.width }; } function i() { return { x: -r.value.tickPadding, dy: "0.4em", "text-anchor": "end" }; } return { getGridLinesAttributes: l, getTickGhostAttributes: o, getTickGroupAttributes: a, getTickLabelAttributes: i }; }, In = { "x-band-scale-axis": Tn, "y-band-scale-axis": Ln, "x-linear-scale-axis": On, "y-linear-scale-axis": $n }; var Re = /* @__PURE__ */ ((t) => (t.bandScale = "band-scale-axis", t.linearScale = "linear-scale-axis", t))(Re || {}), Se = /* @__PURE__ */ ((t) => (t.left = "left", t.bottom = "bottom", t))(Se || {}), xe = /* @__PURE__ */ ((t) => (t.x = "bottom", t.y = "left", t))(xe || {}); const wn = /* @__PURE__ */ N({ __name: "lume-axis", props: { scale: { type: Function, default: null }, type: { type: String, default: void 0, validator: (t) => t in xe }, position: { type: String, default: void 0, validator: (t) => t in Se }, containerSize: { type: Object, default: () => ({ width: 0, height: 0 }) }, hoveredIndex: { type: Number, default: -1 }, orientation: { type: String, default: O.VERTICAL }, ...me() }, emits: ["mouseenter", "click", "mouseleave", "lume__internal--axis-size"], setup(t, { emit: e }) { const r = t, n = 16, { scale: a, containerSize: o, hoveredIndex: l, options: i, orientation: u } = B(r), c = Le("isEmpty", w(!1)), v = Oe({}), s = w(null), f = w(null), m = w(null), _ = d( () => r.type ? xe[r.type] : r.position ), h = d( () => r.type || (_.value === "left" ? "y" : "x") ), y = d( () => h.value === "x" && u.value === O.VERTICAL || h.value === "y" && u.value === O.HORIZONTAL ), { allOptions: p } = Y( i, h.value === "x" ? xn : An ), { showTick: k } = gn(a, s, p), x = d( () => c.value || !a.value || un(a.value) ), T = d(() => { var g, A, $, C; return h.value === "y" && x.value ? `translate(0, ${((g = o.value) == null ? void 0 : g.height) / 2})` : h.value === "x" && x.value ? `translate(-${((A = o.value) == null ? void 0 : A.width) / 2}, ${($ = o.value) == null ? void 0 : $.height})` : `translate(0, ${h.value === "x" ? (C = o.value) == null ? void 0 : C.height : 0})`; }), I = d(() => { if (!a.value) return []; if (U(a.value)) return a.value.labels || a.value.domain(); const { tickCount: g } = p.value, [A, $] = a.value.domain(); return Ut(A, $, g); }), L = d(() => { const { tickFormat: g } = p.value; return Ae(g); }), D = d( () => p.value.withHover && y.value && l.value > -1 ), R = d( () => p.value.tickPadding + _e || n ), P = d(() => h.value === "x" ? ( // If x axis, get the tick height Math.max( ...(s.value || []).map( (g) => { var A, $; return (($ = (A = g.ref).getBBox) == null ? void 0 : $.call(A).height) + R.value; } ) ) ) : ( // If y axis, get the tick width Math.max( ...(s.value || []).map( (g) => { var A, $; return (($ = (A = g.ref).getBBox) == null ? void 0 : $.call(A).width) + R.value; } ) ) )); function G(g) { const { showTicks: A } = p.value; return A === !1 ? "" : L.value(g); } function j(g, A, $) { e("mouseenter", { index: y.value ? g : null, value: A, event: $ }); } function J(g, A, $) { e("click", { index: g, value: A, event: $ }); } function oe(g) { var A; if (!(!s.value || !s.value.length)) return (A = s.value[g]) == null ? void 0 : A.ref; } function W() { m.value = I.value.map( (g, A) => ({ value: G(g), group: v.getTickGroupAttributes(g, A), ghost: v.getTickGhostAttributes(oe(A)), label: v.getTickLabelAttributes(), gridline: v.getGridLinesAttributes() }) ); } function te() { m.value && m.value.map((g) => (g.gridline = v.getGridLinesAttributes(), g)); } function Q() { if (!a.value) return; const g = a.value.step ? "bandScale" : "linearScale", A = In[`${h.value}-${Re[g]}`]; Object.entries(A(a, o, p) || []).forEach( ([$, C]) => { v[$] = C; } ); } return H(a, Q, { flush: "sync", immediate: !0 }), H(a, W, { immediate: !0 }), H(s, W), H(P, (g) => e("lume__internal--axis-size", g)), H(r.containerSize, te), ee(() => $e(f.value)), { __sfc: !0, SCALE_MIXIN_MAP: Re, POSITIONS: Se, TYPES: xe, AXIS_LABEL_OFFSET: n, props: r, emit: e, scale: a, containerSize: o, hoveredIndex: l, options: i, orientation: u, isEmpty: c, mixins: v, tickRefs: s, root: f, ticksWithAttributes: m, computedPosition: _, computedType: h, shouldHover: y, allOptions: p, showTick: k, alignAxisBaseline: x, axisTransform: T, ticks: I, tickFormatter: L, isHovering: D, axisLabelOffset: R, axisSize: P, formatTick: G, handleTickMouseenter: j, handleTickClick: J, getTextNode: oe, setTicks: W, updateGridlines: te, init: Q, LumeTick: nn }; } }); var En = function() { var e = this, r = e._self._c, n = e._self._setupProxy; return n.scale ? r("g", { ref: "root", staticClass: "axis", attrs: { transform: n.axisTransform, "data-j-axis": "" }, on: { mouseleave: function(a) { return n.emit("mouseleave", a); } } }, [n.computedType === "x" ? r("defs", [r("linearGradient", { attrs: { id: "lume-tick-gradient" } }, [r("stop", { attrs: { offset: "0%", "stop-color": "rgba(255,255,255,0)" } }), r("stop", { attrs: { offset: "10%", "stop-color": "var(--lume-chart-background-color)" } }), r("stop", { attrs: { offset: "90%", "stop-color": "var(--lume-chart-background-color)" } }), r("stop", { attrs: { offset: "100%", "stop-color": "rgba(255,255,255,0)" } })], 1)], 1) : e._e(), e._l(n.ticksWithAttributes, function(a, o) { return r(n.LumeTick, e._b({ key: `${a.value}_${o}`, ref: "tickRefs", refInFor: !0, attrs: { "is-hidden": n.allOptions.skip && !n.showTick(o), "with-gridlines": n.allOptions.gridLines }, on: { mouseenter: function(l) { return n.handleTickMouseenter(o, a.value, l); }, click: function(l) { return n.handleTickClick(o, a.value, l); } } }, "lume-tick", a, !1)); }), n.isHovering ? r(n.LumeTick, e._b({ attrs: { "with-gridlines": !1, "is-hovered": "" }, on: { click: function(a) { return n.handleTickClick( n.hoveredIndex, n.ticksWithAttributes[n.hoveredIndex].value, a ); } } }, "lume-tick", n.ticksWithAttributes[n.hoveredIndex], !1)) : e._e()], 2) : e._e(); }, Nn = [], Hn = /* @__PURE__ */ E( wn, En, Nn, !1, null, null ); const Dn = Hn.exports; function Rn(t, e, r, n) { const a = d(() => r.value > 0 && r.value < 1), o = d( () => n.value > 0 && n.value < 1 ), l = d( () => a.value ? t.value - 0.5 : t.value // draws the 1px bar closer to the axis ), i = d( () => o.value ? e.value - 0.5 : e.value // draws the 1px bar closer to the axis ); return { computedX: l, computedY: i, shouldHaveMinWidth: a, shouldHaveMinHeight: o }; } function Sn(t, e, r, n) { const a = w(0), o = w(0), l = d(() => `${t.value + r.value / 2}px ${e.value + n.value / 2}px`); return ee(() => { a.value = r.value, o.value = n.value; }), H(r, (i) => a.value = i), H(n, (i) => o.value = i), { computedWidth: a, computedHeight: o, transformOrigin: l }; } const Pn = /* @__PURE__ */ N({ __name: "lume-bar", props: { x: { type: Number, default: 0 }, y: { type: Number, default: 0 }, width: { type: Number, required: !0 }, height: { type: Number, required: !0 }, classList: { type: [String, Array], default: "" }, isFaded: { type: Boolean, default: !1 }, isNegative: { type: Boolean, default: !1 }, transition: { type: [String, Boolean], default: !1 } }, emits: ["click", "mouseover", "mouseleave"], setup(t, { emit: e }) { const r = t, { x: n, y: a, width: o, height: l, transition: i, classList: u } = B(r), c = w(null), v = d( () => typeof u.value == "string" ? [u.value] : u.value ), s = d(() => i.value === "width"), f = d(() => i.value === "height"), m = Sn(n, a, o, l), { computedX: _, computedY: h, shouldHaveMinWidth: y, shouldHaveMinHeight: p } = Rn(n, a, o, l), k = d(() => y.value ? 1 : (s.value ? m.computedWidth : o).value), x = d(() => p.value ? 1 : (f.value ? m.computedHeight : l).value), T = s.value || f.value ? m.transformOrigin : null; return ee(() => $e(c.value)), { __sfc: !0, props: r, emit: e, x: n, y: a, width: o, height: l, transition: i, classList: u, root: c, computedClasses: v, shouldTransitionWidth: s, shouldTransitionHeight: f, transitionProps: m, computedX: _, computedY: h, shouldHaveMinWidth: y, shouldHaveMinHeight: p, computedWidth: k, computedHeight: x, transformOrigin: T }; } }); var Bn = function() { var e = this, r = e._self._c, n = e._self._setupProxy; return r("rect", { ref: "root", staticClass: "lume-bar", class: [ { "lume-fill--faded": e.isFaded, "lume-bar--negative": e.isNegative, "lume-bar--transition-width": n.shouldTransitionWidth, "lume-bar--transition-height": n.shouldTransitionHeight }, ...n.computedClasses ], style: { transformOrigin: n.transformOrigin }, attrs: { x: n.computedX, y: n.computedY, width: n.computedWidth, height: n.computedHeight, "data-j-bar": "" }, on: { click: function(a) { return n.emit("click", a); }, mouseover: function(a) { return n.emit("mouseover", a); }, mouseleave: function(a) { return n.emit("mouseleave", a); } } }); }, Cn = [], Gn = /* @__PURE__ */ E( Pn, Bn, Cn, !1, null, "8e8f732a" ); const Ue = Gn.exports; var ne = /* @__PURE__ */ ((t) => (t.Categorical = "categorical", t.Sequential = "sequential", t.Divergent = "divergent", t))(ne || {}), z = /* @__PURE__ */ ((t) => (t.Skyblue = "skyblue", t.Royalblue = "royalblue", t.Violet = "violet", t.Darkteal = "darkteal", t.Gold = "gold", t))(z || {}), Ht = /* @__PURE__ */ ((t) => (t.Skyblue10 = "skyblue-10", t.Skyblue20 = "skyblue-20", t.Skyblue30 = "skyblue-30", t.Skyblue40 = "skyblue-40", t.Skyblue50 = "skyblue-50", t.Skyblue60 = "skyblue-60", t.Skyblue70 = "skyblue-70", t.Skyblue80 = "skyblue-80", t.Skyblue90 = "skyblue-90", t.Skyblue100 = "skyblue-100", t.Royalblue10 = "royalblue-10", t.Royalblue20 = "royalblue-20", t.Royalblue30 = "royalblue-30", t.Royalblue40 = "royalblue-40", t.Royalblue50 = "royalblue-50", t.Royalblue60 = "royalblue-60", t.Royalblue70 = "royalblue-70", t.Royalblue80 = "royalblue-80", t.Royalblue90 = "royalblue-90", t.Royalblue100 = "royalblue-100", t.Violet10 = "violet-10", t.Violet20 = "violet-20", t.Violet30 = "violet-30", t.Violet40 = "violet-40", t.Violet50 = "violet-50", t.Violet60 = "violet-60", t.Violet70 = "violet-70", t.Violet80 = "violet-80", t.Violet90 = "violet-90", t.Violet100 = "violet-100", t.Darkteal10 = "darkteal-10", t.Darkteal20 = "darkteal-20", t.Darkteal30 = "darkteal-30", t.Darkteal40 = "darkteal-40", t.Darkteal50 = "darkteal-50", t.Darkteal60 = "darkteal-60", t.Darkteal70 = "darkteal-70", t.Darkteal80 = "darkteal-80", t.Darkteal90 = "darkteal-90", t.Darkteal100 = "darkteal-100", t.Gold10 = "gold-10", t.Gold20 = "gold-20", t.Gold30 = "gold-30", t.Gold40 = "gold-40", t.Gold50 = "gold-50", t.Gold60 = "gold-60", t.Gold70 = "gold-70", t.Gold80 = "gold-80", t.Gold90 = "gold-90", t.Gold100 = "gold-100", t))(Ht || {}), Xe = /* @__PURE__ */ ((t) => (t.SkyTeal = "skyblue-darkteal", t.VioletRoyal = "violet-royalblue", t.VioletTeal = "violet-darkteal", t.GoldTeal = "gold-darkteal", t.GoldRoyal = "gold-royalblue", t))(Xe || {}), Ye = /* @__PURE__ */ ((t) => (t.White = "white", t.Black = "black", t.Green = "green", t.Orange = "orange", t.Red = "red", t.Grey = "grey", t.Grey10 = "grey-10", t.Grey20 = "grey-20", t.Grey30 = "grey-30", t.Grey40 = "grey-40", t.Grey50 = "grey-50", t.Grey60 = "grey-60", t.Grey70 = "grey-70", t.Grey80 = "grey-80", t.Grey90 = "grey-90", t.Grey100 = "grey-100", t))(Ye || {}), Ke = /* @__PURE__ */ ((t) => (t["01"] = "01", t["02"] = "02", t["03"] = "03", t["04"] = "04", t["05"] = "05", t["06"] = "06", t["07"] = "07", t["08"] = "08", t["09"] = "09", t))(Ke || {}); const Fn = ne.Categorical, he = z.Skyblue, jn = Xe.SkyTeal; function Vn(t) { return t === ne.Divergent ? jn : he; } function Mn(t) { return Object.values(Ke).includes(t); } function at(t, e) { return e === ne.Divergent ? Object.values(Xe).includes(t) : Object.values({ ...z, ...Ht, ...Ye, ...Ke }).includes(t); } function zn(t, e) { const r = Object.values(z).indexOf(t); return fn(Object.values(z), r > -1 ? r : 0)[e]; } function Wn(t, e) { const r = 50 + e * 10; return `${t}-${r}`; } function Zn(t, e) { const r = (e + 1) * 10; return `${t}-${r}`; } function ot(t, e, r) { switch (e) { default: case ne.Categorical: return Mn(t) ? t : zn(t, r); case ne.Sequential: return Wn(t, r); case ne.Divergent: return Zn(t, r); } } function Un(t, e, r = Fn, n) { return at(t, r) ? t : (n > 4 && (q(X.ColorLoop), n = n % 5), at(e, r) ? ot(e, r, n) : ot(Vn(r), r, n)); } function Xn(t) { return t.map((e) => on(e) ? e : { value: e }); } function Yn(t) { return t.__internal === !0; } const Je = (t = null) => ({ data: { type: Array, required: !0, validator: t || void 0 }, labels: { type: Array, default: void 0 }, color: { type: String, default: z.Skyblue }, title: { type: String, default: null } }); function Qe(t, e, r, n, a) { const o = Oe({ width: 0, height: 0 }), l = mn(12), i = d(() => { var v; return t.value.length > 5 && q(X.DatasetLength), (v = t.value) == null ? void 0 : v.map( (s, f) => { if (Yn(s)) return s; const m = Xn(s.values), _ = Un( s.color, r == null ? void 0 : r.value, n == null ? void 0 : n.value.colorPalette, f ); return { ...s, values: m, color: _, __internal: !0 }; } ); }), u = d(() => Array.isArray(e.value) ? e.value : Ot(t.value).map((v, s) => s)); function c(v) { const s = (a == null ? void 0 : a.value) === O.HORIZONTAL && u.value.length * (((n == null ? void 0 : n.value.barHeight) || rt) * 2) + ((n == null ? void 0 : n.value.barHeight) || rt) || v.height; o.width = v.width, o.height = s; } return { chartID: l, computedLabels: u, containerSize: o, internalData: i, updateSize: c }; } const Kn = () => ({ xScale: { type: Function, default: null }, yScale: { type: Function, default: null } }); function Jn(t, e, r, n, a) { const o = w(null), l = w(null); function i() { var v, s, f, m; const { width: u, height: c } = r; !u && !c || (n.value === O.HORIZONTAL ? (o.value = (v = t.value) != null && v.length ? ut( t.value, u, n.value, a.value.startOnZero ) : null, l.value = (s = e.value) != null && s.length ? lt( e.value, c, n.value, a.value ) : null) : (o.value = (f = e.value) != null && f.length ? lt( e.value, u, n.value, a.value ) : null, l.value = (m = t.value) != null && m.length ? ut( t.value, c, n.value, a.value.startOnZero ) : null)); } return kt(i), { xScale: o, yScale: l }; } function lt(t, e, r, n) { const a = [0, e], { padding: o, paddingInner: l, paddingOuter: i } = n, u = o ?? (r === O.HORIZONTAL ? wt : It); return Object.assign( fe().range(a).paddingInner(l ?? u).paddingOuter(i ?? u).domain(t.map((c, v) => v)), { labels: t } ); } function ut(t, e, r, n) { const a = Tt(t).filter((v) => v != null), o = [0, e]; if (a.length === 0) return pe().range(o).domain([0, 0]).nice(); const l = Math.min(...a), i = n && l > 0 ? 0 : l, u = Math.max(...a), c = r === O.HORIZONTAL ? [i, u] : [u, i]; return pe().range(o).domain(c).nice(); } function it(t) { return (t == null ? void 0 : t.range) !== void 0 || (t == null ? void 0 : t.copy) !== void 0; } function Pe(t, e) { return U(t) ? t.bandwidth() / 2 + t(t.domain()[e]) : t(e); } function st(t, e, { padding: r, paddingInner: n, paddingOuter: a } = {}) { const o = r ?? (e === O.HORIZONTAL ? wt : It); return t.copy().paddingInner(n ?? o).paddingOuter(a ?? o); } function qe(t) { return Object.values(O).includes(t); } const ce = (t, e = !0) => ({ ...Je(t), ...Kn(), ...me(), classList: { type: [String, Array], default: () => [] }, hoveredIndex: { type: Number, default: null }, ...e ? { orientation: { type: String, default: O.VERTICAL, validator: qe } } : {} }), Qn = (t) => ({ ...Je(t), ...me(), hoveredElement: { type: [Number, String], default: null } }); function qn() { const t = w(), e = Oe({ dimensions: {} }), r = new ResizeObserver((n) => { n.forEach((a) => { e.dimensions = a.contentRect; }); }); return ee(() => { r.observe(t.value); }), xt(() => { r.unobserve(t.value); }), { resizeState: e, resizeRef: t }; } const er = /* @__PURE__ */ N({ __name: "lume-chart-container", props: { margins: { type: Object, required: !0 }, containerSize: { type: Object, default: () => ({ width: 0, height: 0 }) }, transparentBackground: { type: Boolean, default: !1 }, noMinSize: { type: Boolean, default: !1 }, orientation: { type: String, default: O.VERTICAL, validator: qe } }, emits: ["click", "mouseenter", "mouseleave", "resize"], setup(t, { emit: e }) { const r = t, { margins: n, containerSize: a } = B(r), o = w(null), { resizeRef: l, resizeState: i } = qn(), u = d( () => a.value.height + n.value.top + n.value.bottom ); return kt(() => { if (!o.value) return; const { width: c } = i.dimensions, { height: v } = o.value.getBoundingClientRect(); if (!c || r.orientation === O.VERTICAL && !v) return; const s = c - n.value.left - n.value.right, f = v - n.value.top - n.value.bottom, m = { width: s > 0 ? s : 0, height: f > 0 ? f : 0, outerWidth: c, outerHeight: v }; e("resize", m); }), { __sfc: !0, props: r, emit: e, margins: n, containerSize: a, root: o, resizeRef: l, resizeState: i, svgHeight: u }; } }); var tr = function() { var e = this, r = e._self._c, n = e._self._setupProxy; return r("div", { ref: "resizeRef", staticClass: "lume-chart-container", class: { "lume-chart-container--minimum": !e.noMinSize }, attrs: { "data-j-chart-container": "" } }, [e._t("header"), r("svg", { ref: "root", staticClass: "lume-chart-container__svg", class: { "lume-chart-container__svg--transparent": e.transparentBackground }, attrs: { height: n.svgHeight, "data-j-chart-container__root": "" }, on: { click: function(a) { return n.emit("click", a); }, mouseenter: function(a) { return n.emit("mouseenter", a); }, mouseleave: function(a) { return n.emit("mouseleave", a); } } }, [r("g", { staticClass: "lume-chart-container__group", attrs: { transform: `translate(${n.margins.left}, ${n.margins.top})`, "data-j-chart-container__group": "" } }, [e._t("default")], 2)]), e._t("footer"), e._t("extra")], 2); }, nr = [], rr = /* @__PURE__ */ E( er, tr, nr, !1, null, "d53cdc3e" ); const ar = rr.exports, or = /* @__PURE__ */ N({ __name: "lume-chart-legend", props: { data: { type: Array, validator: an, required: !0 } }, emits: ["click", "mouseenter", "mouseleave"], setup(t, { emit: e }) { return { __sfc: !0, emit: e }; } }); var lr = function() { var e = this, r = e._self._c, n = e._self._setupProxy; return r("div", { staticClass: "lume-chart-legend", attrs: { "data-j-chart-legend": "" }, on: { mouseleave: function(a) { return n.emit("mouseleave"); } } }, e._l(e.data, function(a, o) { return r("div", { key: `legend-item-${o}`, staticClass: "lume-chart-legend__item lume-typography--caption", attrs: { tabindex: "0", "data-j-chart-legend__symbol-wrapper": "" }, on: { click: function(l) { return n.emit("click", { index: o, dataset: a, event: l }); }, mouseenter: function(l) { return n.emit("mouseenter", { index: o, dataset: a, event: l }); } } }, [r("span", { staticClass: "lume-chart-legend__symbol", class: `lume-background-color--${a.color}`, attrs: { "data-j-chart-legend__symbol": "" } }), e._v(" " + e._s(a.label || o) + " ")]); }), 0); }, ur = [], ir = /* @__PURE__ */ E( or, lr, ur, !1, null, "6f1d1c44" ); const sr = ir.exports, cr = {}; var dr = function() { var e = this, r = e._self._c; return r("div", { staticClass: "lume-tooltip__title", attrs: { "data-j-tooltip__title": "" } }, [e._t("default")], 2); }, vr = [], fr = /* @__PURE__ */ E( cr, dr, vr, !1, null, "8af3fac6" ); const pr = fr.exports, mr = {}; var _r = function() { var e = this, r = e._self._c; return r("li", { staticClass: "lume-tooltip__item", attrs: { "data-j-tooltip__summary-item": "" } }, [r("span", [e._t("default")], 2), r("strong", { staticClass: "lume-tooltip__value" }, [e._t("value")], 2)]); }, hr = [], gr = /* @__PURE__ */ E( mr, _r, hr, !1, null, "4ed7ec1b" ); const yr = gr.exports, br = /* @__PURE__ */ N({ __name: "lume-tooltip-item", props: { color: { type: String, default: null } }, setup(t) { return { __sfc: !0 }; } }); var kr = function() { var e = this, r = e._self._c; return e._self._setupProxy, r("li", { staticClass: "lume-tooltip__item", attrs: { "data-j-tooltip__item": "" } }, [e.color ? r("span", { staticClass: "lume-tooltip__symbol", class: [`lume-background-color--${e.color}`], attrs: { "data-j-tooltip__item__symbol": "" } }) : e._e(), r("span", { attrs: { "data-j-tooltip__item__label": "" } }, [e._t("label")], 2), r("strong", { staticClass: "lume-tooltip__value", attrs: { "data-j-tooltip__item__value": "" } }, [e._t("value")], 2)]); }, xr = [], Ar = /* @__PURE__ */ E( br, kr, xr, !1, null, "4f995c3c" ); const Tr = Ar.exports, Lr = /* @__PURE__ */ N({ __name: "lume-tooltip", props: { opened: { type: Boolean, default: !1 }, targetElement: { type: Element, default: null }, items: { type: Array, required: !0 }, position: { type: String, default: "auto", validator: (t) => kn.includes(t) }, fixedPositioning: { type: Boolean, default: !1 }, inverse: { type: Boolean, default: !1 }, modifiers: { type: Array, default: null }, title: { type: [String, Number], default: null }, summary: { type: String, default: null }, ...me() }, emits: ["opened", "moved", "closed", "tooltip-mouseenter", "tooltip-mouseleave"], setup(t, { emit: e }) { const r = t, n = w(null), { items: a, options: o } = B(r), l = M(), i = w(null), { allOptions: u } = Y(o), c = d( () => u.value.fixedPositioning ?? r.fixedPositioning ), v = d( () => c.value ? "fixed" : "absolute" ), s = d(() => [ { name: "computeStyles", options: { adaptive: !1 // so that we can have smooth transitions } }, { name: "offset", options: { offset: [0, u.value.offset || 8] } }, ...r.modifiers || [] ]), f = d( () => u.value.showTitle !== !1 && r.title != null ), m = d(() => Ae(u.value.valueFormat)), _ = d(() => Ae(u.value.titleFormat)), h = d( () => { var I; return ((I = a.value) == null ? void 0 : I.find((L) => L.isSummary)) || { label: u.value.summary ?? r.summary }; } ), y = d(() => l.summary || h.value.label), p = d(() => r.inverse || u.value.inverse ? [...a.value].reverse() : a.value); function k() { r.targetElement && n.value && (i.value = Jt(r.targetElement, n.value, { placement: r.position, strategy: v.value, modifiers: s.value }), e("opened", r.targetElement)); } function x() { i.value && (i.value.destroy(), e("closed"), n.value && n.value.classList.remove("lume-tooltip--animated")); } function T() { i.value && (u.value.withAnimation !== !1 && n.value && n.value.classList.add("lume-tooltip--animated"), r.targetElement ? function() { i.value.state.elements.reference = r.targetElement, i.value.update(), e("moved", r.targetElement); }() : x()); } return H( () => r.targetElement, async (I, L) => { !L && I ? (await He(), k()) : T(); } ), ee(k), xt(x), { __sfc: !0, props: r, emit: e, root: n, items: a, options: o, slots: l, popper: i, allOptions: u, computedFixedPositioning: c, strategy: v, allModifiers: s, showTitle: f, formatValue: m, formatTitle: _, summaryItem: h, hasSummary: y, computedItems: p, initPopper: k, destroyPopper: x, updatePopper: T, LumeTooltipTitle: pr, LumeTooltipSummary: yr, LumeTooltipItem: Tr }; } }); var Or = function() { var e = this, r = e._self._c, n = e._self._setupProxy; return e.opened && e.targetElement ? r("div", { ref: "root", staticClass: "lume-tooltip lume-typography--caption", class: { "lume-tooltip--pointer-events": n.options.withPointerEvents }, attrs: { "data-j-tooltip": "" }, on: { mouseenter: function(a) { return n.emit("tooltip-mouseenter"); }, mouseleave: function(a) { return n.emit("tooltip-mouseleave"); } } }, [e._t("default", function() { return [e._t("title", function() { return [n.showTitle ? r(n.LumeTooltipTitle, [e._v(" " + e._s(n.formatTitle(e.title)) + " ")]) : e._e()]; }), r("ul", { staticClass: "lume-tooltip__items" }, [e._t("summary", function() { return [n.hasSummary ? r(n.LumeTooltipSummary, { scopedSlots: e._u([n.summaryItem.value ? { key: "value", fn: function() { return [e._v(" " + e._s(n.formatValue(n.summaryItem.value)) + " ")]; }, proxy: !0 } : null], null, !0) }, [e._v(" " + e._s(n.summaryItem.label) + " ")]) : e._e()]; }), n.hasSummary ? r("li", { staticClass: "lume-tooltip__break" }, [r("hr")]) : e._e(), e._t("items", function() { return e._l(n.computedItems, function(a) { return r(n.LumeTooltipItem, { key: a.label, attrs: { color: a.color }, scopedSlots: e._u([{ key: "label", fn: function() { return [e._v(" " + e._s(a.label) + " ")]; }, proxy: !0 }, { key: "value", fn: function() { return [e._v(" " + e._s(n.formatValue(a.value)) + " ")]; }, proxy: !0 }], null, !0) }); }); })], 2)]; })], 2) : e._e(); }, $r = [], Ir = /* @__PURE__ */ E( Lr, Or, $r, !1, null, "e7c90551" ); const wr = Ir.exports, Ie = () => ({ data: { type: Array, required: !0 }, labels: { type: Array, default: () => [] }, options: { type: Object, default: () => ({}) }, orientation: { type: String, default: O.VERTICAL, validator: qe }, xScale: { type: Function, default: () => null }, yScale: { type: Function, default: () => null }, hoveredIndex: { type: Number, default: -1 }, containerSize: { type: Object, default: () => ({ width: 0, height: 0 }) }, transition: { type: Boolean, default: !0 }, classList: { type: [String, Array], default: () => [] } }), Er = /* @__PURE__ */ N({ __name: "lume-overlay-group", props: { ...Ie(), orientation: { type: String, default: O.VERTICAL } }, emits: ["click", "lume__internal--hover", "mouseover"], setup(t, { emit: e }) { const r = t, { data: n, orientation: a, xScale: o, yScale: l } = B(r), i = d(() => Ot(n)); function u(c) { var y; const v = a.value === O.HORIZONTAL ? l.value : o.value, s = v.domain(), f = ln(v), m = ((y = v.paddingInner) == null ? void 0 : y.call(v)) ?? 0, _ = f * m, h = U(v) ? v(s[c]) - _ / 2 : v(c) - f / 2; return a.value === O.HORIZONTAL ? { width: Math.max(...o.value.range()), height: f, transform: `translate(0, ${h})` } : { width: f, height: Math.max(...l.value.range()), transform: `translate(${h}, 0)` }; } return { __sfc: !0, props: r, emit: e, data: n, orientation: a, xScale: o, yScale: l, overlayData: i, getOverlayBarAttributes: u, LumeBar: Ue }; } }); var Nr = function() { var e = this, r = e._self._c, n = e._self._setupProxy; return r("g", { staticClass: "lume-overlay-group" }, e._l(n.overlayData, function(a, o) { return r(n.LumeBar, e._b({ key: `overlay-${o}`, attrs: { "data-j-lume-overlay-group": o, transition: !1, "class-list": "lume-fill--transparent" }, on: { mouseover: function(l) { return n.emit("lume__internal--hover", o); }, click: function(l) { return n.emit("click", { index: o, event: l }); } } }, "lume-bar", n.getOverlayBarAttributes(o), !1)); }), 1); }, Hr = [], Dr = /* @__PURE__ */ E( Er, Nr, Hr, !1, null, null ); const Rr = Dr.exports, Sr = [ "axis-click", "axis-mouseenter", "axis-mouseleave", "rendered", "resize", "data-changed", "labels-changed", "chart-click", "chart-mouseenter", "chart-mouseleave", "legend-click", "legend-mouseenter", "legend-mouseleave", "bar-click", "line-click", "point-click", "node-click", "node-mouseenter", "node-mouseleave", "link-click", "link-mouseenter", "link-mouseleave", "tooltip-opened", "tooltip-moved", "tooltip-closed", "hovered-index-changed", "update:hoveredIndex" ], K = (t, e) => { function r(o, ...l) { document.dispatchEvent( new CustomEvent(`${e}_${o}`, { detail: [...l] }) ); } function n(o, l) { document.addEventListener( `${e}_${o}`, (i) => l(...i.detail) ); } return { componentEventPropagator: Sr.reduce((o, l) => (o[l] = (i) => t(l, i), o), {}), emitInternalEvent: r, listenInternalEvent: n }; }; function Pr(t) { return { hasNegativeValues: d( () => Tt(t.value).some((r) => r < 0) ) }; } function Br(t, e, r, n) { const a = d( () => n.value === O.HORIZONTAL ), o = d( () => { var c; return t.height - (a != null && a.value ? 0 : ((c = r.value) == null ? void 0 : c.call(r, 0)) || 0); } ), l = d( () => { var c; return a != null && a.value ? ((c = e.value) == null ? void 0 : c.call(e, 0)) || 0 : t.width; } ), i = d( () => { var c; return a != null && a.value ? "translate(0, 0)" : `translate(0, ${((c = r.value) == null ? void 0 : c.call(r, 0)) || 0})`; } ); return { negativeBarAttributes: d(() => ({ width: l.value, height: o.value, transform: i.value })) }; } function Cr(t, e) { return t.reduce((r, n) => Ze(n.values, e).map( (a, o) => r[o] ? a.value > r[o] ? a.value : r[o] : a.value ?? 0 ), []); } function Gr(t, e) { return t.reduce((r, n) => Ze(n.values, e).map( (a, o) => { const l = a.value == null || a.value < 0 ? 0 : a.value; return r[o] ? r[o] + l : l; } ), []); } const ct = { "stacked-bar": Gr }; function Dt(t, e, r, n, a, o, l, i) { const u = d( () => { var v; return e.value.withTooltip !== !1 && !((v = e.value.tooltipOptions) != null && v.targetElement); } ); function c(v) { var m; const s = ((m = a == null ? void 0 : a.value) == null ? void 0 : m.length) ?? 0, f = i != null && i.value && ct[i.value] ? ct[i.value]( v, s ) : Cr(v, s); t.value = f.map((_, h) => ({ cx: (o == null ? void 0 : o.value) === O.HORIZONTAL ? r.value(_) : Pe(r.value, h), cy: (o == null ? void 0 : o.value) === O.HORIZONTAL ? Pe(n.value, h) : n.value(_) })); } return H( [r, n], () => { r.value && n.value && (l != null && l.value) && u.value && c(l.value); }, { immediate: !0 } ), { shouldGenerateTooltipAnchors: u, updateTooltipAnchorAttributes: c }; } function Fr() { const t = Oe({ opened: !1, targetElement: null }); return { tooltipConfig: t, showTooltip: (n) => { t.opened = !0, t.targetElement = n; }, hideTooltip: () => { t.opened = !1, t.targetElement = null; } }; } function jr(t) { return { getTooltipItems: d( () => (r) => t.value.map(({ color: n, label: a, values: o }) => { var l, i, u; return { color: ((l = o[r]) == null ? void 0 : l.color) || n, label: a, value: ((i = o[r]) == null ? void 0 : i.label) ?? ((u = o[r]) == null ? void 0 : u.value) ?? $t }; }) ) }; } const Be = 16, Ce = 8, Ge = 28, Fe = 24, re = { VERTICAL: { top: Be, right: Ce, bottom: Ge, left: Fe }, HORIZONTAL: { top: Be, right: Ce, bottom: Ge, left: Fe } }; function Vr(t) { return !t || t === "auto" || t.top == null || t.top === "auto" ? Be : t.top; } function Mr(t) { return !t || t === "auto" || t.right == null || t.right === "auto" ? Ce : t.right; } function zr(t, e) { return !t || t === "auto" || t.bottom == null || t.bottom === "auto" ? e || Ge : t.bottom; } function Wr(t, e) { return !t || t === "auto" || t.left == null || t.left === "auto" ? e || Fe : t.left; } const Zr = /* @__PURE__ */ N({ __name: "lume-chart", props: { ...ce(), chartType: { type: String, default: null } }, setup(t, { emit: e }) { const r = t, n = M(), { data: a, labels: o, color: l, options: i, orientation: u, chartType: c } = B(r), v = w(-1), s = w(null), f = w(null), m = w([]), _ = w(null), h = w(0), y = w(0), { allOptions: p } = Y(i), { internalData: k, computedLabels: x, containerSize: T, updateSize: I, chartID: L } = Qe(a, o, l, p, u), { listenInternalEvent: D } = K(e, L), { xScale: R, yScale: P } = Jn( k, x, T, u, p ), G = d(() => ({ top: Vr(p.value.margins), right: Mr(p.value.margins), bottom: zr(p.value.margins, h.value), left: Wr(p.value.margins, y.value) })), j = d(() => { var b; return r.xScale ? it(r.xScale) ? r.xScale : (b = r.xScale) == null ? void 0 : b.call(r, k.value, o.value, T) : R.value; }), J = d(() => { var b; return r.yScale ? it(r.yScale) ? r.yScale : (b = r.yScale) == null ? void 0 : b.call(r, k.value, o.value, T) : P.value; }), oe = d(() => ({ ...p.value.xAxisOptions, withHover: u.value === O.VERTICAL })), W = d(() => ({ ...p.value.yAxisOptions, withHover: u.value === O.HORIZONTAL })), te = d(() => { var b; return (b = p.value.xAxisOptions) == null ? void 0 : b.title; }), Q = d(() => { var b; return (b = p.value.yAxisOptions) == null ? void 0 : b.title; }), g = d(() => { var b; return ((b = p.value.xAxisOptions) == null ? void 0 : b.withTitle) !== !1 && te.value; }), A = d(() => { var b; return ((b = p.value.yAxisOptions) == null ? void 0 : b.withTitle) !== !1 && Q.value; }), $ = d( () => a.value.every((b) => !b.values.length) || a.value.every((b) => b.values.every((S) => S === null)) ), C = d(() => { const b = [], { noBaseScales: S } = p.value; return S || b.push(() => !!(j.value && J.value)), b.every((V) => V() === !0); }), { hasNegativeValues: Z } = Pr(k), { negativeBarAttributes: F } = Br( T, j, J, u ), { shouldGenerateTooltipAnchors: tt } = Dt( m, p, j, J, o, u, k, c ), { tooltipConfig: ve, showTooltip: ge, hideTooltip: le } = Fr(), { getTooltipItems: ye } = jr(k), ue = d( () => { var b; return ((b = p.value.tooltipOptions) == null ? void 0 : b.position) || "top"; } ), nt = d(() => { var S; const b = (S = p.value.tooltipOptions) == null ? void 0 : S.withPointerEvents; return ve.opened && (!b || b && _.value === !1); }); function be(b) { var V; if (p.value.withHover === !1 || b === v.value) return; const S = v.value; if (v.value = b, p.value.withTooltip !== !1) { const Vt = (V = p.value.tooltipOptions) != null && V.targetElement ? p.value.tooltipOptions.targetElement === "self" ? f.value.$el : p.value.tooltipOptions.targetElement : s.value[b]; ge(Vt); } e("hovered-index-changed", { newIndex: b, oldIndex: S }), e("update:hoveredIndex", b); } function ke() { le(), v.value = -1, e("update:hoveredIndex", -1); } function we(b) { if (!a.value.some( ({ values: V }) => b <= V.length - 1 )) { q(X.InvalidHoveredIndex); return; } b == null || b === -1 ? ke() : be(b); } function Ct() { setTimeout(() => { nt.value && ke(), e("chart-mouseleave"); }, 0); } function Gt(b) { I(b), e("resize", b); } function Ft({ index: b, value: S, event: V }) { b !== null && be(b), e("axis-mouseenter", { index: b, value: S, event: V }); } function jt({ index: b, value: S, event: V }) { e("axis-click", { index: b, value: S, event: V }); } return H( a, (b, S) => e("data-changed", { newValue: b, oldValue: S }) ), H( o, (b, S) => e("labels-changed", { newValue: b, oldValue: S }) ), H($, (b) => b && q(X.Empty), { immediate: !0 }), H(() => r.hoveredIndex, we), H( m, (b) => { b && r.hoveredIndex != null && v.value === -1 && we(r.hoveredIndex); }, { flush: "post" } ), H(_, (b) => { b === !1 && ve.opened && ke(); }), ee(async () => { e("rendered"), n.groups || console.error('"groups" `<slot>` must have content.'), D("lume__internal--hover", be); }), Ee("chartID", L), Ee("isEmpty", $), Ee("tooltipAnchorAttributes", m), { __sfc: !0, props: r, slots: n, emit: e, data: a, labels: o, color: l, options: i, orientation: u, chartType: c, internalHoveredIndex: v, tooltipAnchor: s, chartContainer: f, tooltipAnchorAttributes: m, isHoveringTooltip: _, xAxisHeight: h, yAxisWidth: y, allOptions: p, internalData: k, computedLabels: x, containerSize: T, updateSize: I, chartID: L, listenInternalEvent: D, xScale: R, yScal