vue-data-ui 3.16.4 → 3.17.0

package/dist/{vue-ui-age-pyramid-txthNdz1.js → vue-ui-age-pyramid-DgAJXx1F.js}

@@ -1,7 +1,7 @@
-import { defineAsyncComponent as I, computed as g, ref as r, toRefs as Mt, watch as ee, shallowRef as We, onMounted as Nt, onBeforeUnmount as Ke, watchEffect as Et, openBlock as u, createElementBlock as v, unref as n, normalizeStyle as te, normalizeClass as Xe, createElementVNode as c, toDisplayString as T, createBlock as R, createCommentVNode as p, withCtx as f, renderSlot as y, normalizeProps as w, guardReactiveProps as k, createSlots as je, createVNode as he, Fragment as O, renderList as M, resolveDynamicComponent as Bt, mergeProps as Ut, createTextVNode as ge, nextTick as pe } from "vue";
-import { j as Vt, t as Ye, o as qe, q as Gt, K as x, X as Ht, u as be, v as Je, k as N, l as E, a0 as Wt, a1 as Kt, T as Xt, U as jt, a3 as Yt } from "./lib-DBptbyyI.js";
+import { defineAsyncComponent as I, computed as g, ref as r, toRefs as Mt, watch as te, shallowRef as We, onMounted as Nt, onBeforeUnmount as Ke, watchEffect as Et, openBlock as u, createElementBlock as v, unref as n, normalizeStyle as le, normalizeClass as Xe, createElementVNode as f, toDisplayString as T, createBlock as R, createCommentVNode as p, withCtx as c, renderSlot as y, normalizeProps as x, guardReactiveProps as w, createSlots as je, createVNode as he, Fragment as O, renderList as M, resolveDynamicComponent as Bt, mergeProps as Ut, createTextVNode as ge, nextTick as pe } from "vue";
+import { j as Vt, t as Ye, o as qe, q as Gt, K as k, X as Ht, u as be, v as Je, k as N, l as E, a0 as Wt, a1 as Kt, T as Xt, U as jt, a3 as Yt } from "./lib-DBptbyyI.js";
 import { t as Qe, u as qt } from "./useResponsive-DfdjqQps.js";
-import { u as Jt } from "./useConfig-CpJA0VZa.js";
+import { u as Jt } from "./useConfig-ChRble71.js";
 import { u as Qt, B as Zt } from "./BaseScanner-BhhkKVoj.js";
 import { u as el } from "./usePrinter-CEpYU3r5.js";
 import { u as tl } from "./useSvgExport-ByUukOZt.js";
@@ -41,7 +41,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
   },
   emits: ["copyAlt"],
   setup(xe, { expose: Ze, emit: et }) {
-    const tt = I(() => import("./Tooltip-Bf-kM3_A.js")), lt = I(() => import("./BaseIcon-Cb3zzG6s.js")), at = I(() => import("./vue-ui-accordion-BF4v32wv.js")), ot = I(() => import("./DataTable-DT2kIdQ6.js")), st = I(() => import("./PenAndPaper-Ct3qJ4lA.js")), it = I(() => import("./UserOptions-rW2fRf3V.js")), ut = I(() => import("./PackageVersion-1BHnPIBZ.js")), nt = I(() => import("./BaseDraggableDialog-CIb-iD9g.js")), { vue_ui_age_pyramid: rt } = Jt(), { isThemeValid: vt, warnInvalidTheme: dt } = ll(), b = xe, yt = et, we = g(() => !!b.dataset && b.dataset.length), C = r(Vt()), V = r(!1), le = r(""), P = r(null), ke = r(0), $ = r(null), Ce = r(null), Ae = r(null), Te = r(null), $e = r(0), Le = r(0), ae = r(null), G = r(null), oe = r(null), q = r(!1), J = r(!1), L = r(null), _e = r({ x: 0, y: 0 }), H = r("pointer"), se = r(!1), e = r(ne()), W = g(() => e.value.userOptions.useCursorPointer), ct = g(() => Ye({
+    const tt = I(() => import("./Tooltip-C8KGyqQk.js")), lt = I(() => import("./BaseIcon-Cb3zzG6s.js")), at = I(() => import("./vue-ui-accordion-CnDW2UQL.js")), ot = I(() => import("./DataTable-DT2kIdQ6.js")), st = I(() => import("./PenAndPaper-Ct3qJ4lA.js")), it = I(() => import("./UserOptions-rW2fRf3V.js")), ut = I(() => import("./PackageVersion-B3kmPxTR.js")), nt = I(() => import("./BaseDraggableDialog-CIb-iD9g.js")), { vue_ui_age_pyramid: rt } = Jt(), { isThemeValid: vt, warnInvalidTheme: dt } = ll(), b = xe, yt = et, we = g(() => !!b.dataset && b.dataset.length), C = r(Vt()), V = r(!1), ae = r(""), P = r(null), ke = r(0), $ = r(null), Ce = r(null), Ae = r(null), Te = r(null), $e = r(0), Le = r(0), oe = r(null), G = r(null), se = r(null), q = r(!1), J = r(!1), L = r(null), _e = r({ x: 0, y: 0 }), H = r("pointer"), ie = r(!1), e = r(re()), W = g(() => e.value.userOptions.useCursorPointer), ct = g(() => Ye({
       defaultConfig: {
         userOptions: { show: !1 },
         table: { show: !1 },
@@ -73,10 +73,10 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         }
       },
       userConfig: e.value.skeletonConfig ?? {}
-    })), { loading: Se, FINAL_DATASET: Q, manualLoading: ie } = Qt({
+    })), { loading: Se, FINAL_DATASET: Q, manualLoading: ue } = Qt({
       ...Mt(b),
       FINAL_CONFIG: e,
-      prepareConfig: ne,
+      prepareConfig: re,
       skeletonDataset: b.config?.skeletonDataset ?? [
         ["_", 9, 2, 2],
         ["_", 8, 3, 3],
@@ -93,8 +93,8 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         defaultConfig: e.value,
         userConfig: ct.value
       })
-    }), { userOptionsVisible: ue, setUserOptionsVisibility: Ie, keepUserOptionState: Oe } = al({ config: e.value }), { svgRef: z } = ol({ config: e.value.style.title });
-    function ne() {
+    }), { userOptionsVisible: ne, setUserOptionsVisibility: Ie, keepUserOptionState: Oe } = al({ config: e.value }), { svgRef: z } = ol({ config: e.value.style.title });
+    function re() {
       const t = me({
         userConfig: b.config,
         defaultConfig: rt
@@ -111,10 +111,10 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         defaultConfig: l
       });
     }
-    ee(() => b.config, (t) => {
-      Se.value || (e.value = ne()), ue.value = !e.value.userOptions.showOnChartHover, Pe(), $e.value += 1, Le.value += 1, A.value.showTable = e.value.table.show, A.value.showTooltip = e.value.style.tooltip.show;
-    }, { deep: !0 }), ee(() => b.dataset, (t) => {
-      Array.isArray(t) && t.length > 0 && (ie.value = !1);
+    te(() => b.config, (t) => {
+      Se.value || (e.value = re()), ne.value = !e.value.userOptions.showOnChartHover, Pe(), $e.value += 1, Le.value += 1, A.value.showTable = e.value.table.show, A.value.showTooltip = e.value.style.tooltip.show;
+    }, { deep: !0 }), te(() => b.dataset, (t) => {
+      Array.isArray(t) && t.length > 0 && (ue.value = !1);
     }, { deep: !0 });
     const _ = We(null), B = We(null);
     Nt(() => {
@@ -126,7 +126,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         componentName: "VueUiAgePyramid",
         type: "dataset",
         debug: ft.value
-      }), ie.value = !0), qe(b.dataset) || (ie.value = e.value.loading), e.value.responsive) {
+      }), ue.value = !0), qe(b.dataset) || (ue.value = e.value.loading), e.value.responsive) {
         const t = Qe(() => {
           const { width: a, height: l } = qt({
             chart: $.value,
@@ -144,7 +144,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
     Ke(() => {
       _.value && (B.value && _.value.unobserve(B.value), _.value.disconnect());
     });
-    const { isPrinting: re, isImaging: ve, generatePdf: ze, generateImage: Fe } = el({
+    const { isPrinting: ve, isImaging: de, generatePdf: ze, generateImage: Fe } = el({
       elementId: `vue-ui-age-pyramid_${C.value}`,
       fileName: e.value.style.title.text || "vue-ui-age-pyramid",
       options: e.value.userOptions.print
@@ -152,7 +152,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
       showTable: e.value.table.show,
       showTooltip: e.value.style.tooltip.show
     });
-    ee(e, () => {
+    te(e, () => {
       A.value = {
         showTable: e.value.table.show,
         showTooltip: e.value.style.tooltip.show
@@ -165,7 +165,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
       Z.value = t;
     }, 100);
     Et((t) => {
-      const a = ae.value;
+      const a = oe.value;
       if (!a) return;
       const l = new ResizeObserver((o) => {
         bt(o[0].contentRect.height);
@@ -216,7 +216,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
       let o;
       return t < 0, o = Math.round(t / l) * l, o;
     }
-    const K = g(() => Math.max(...Q.value.flatMap((t) => t.slice(-2).map((a) => x(a))))), U = g(() => Q.value.length), wt = g(() => Q.value.map((t) => ({
+    const K = g(() => Math.max(...Q.value.flatMap((t) => t.slice(-2).map((a) => k(a))))), U = g(() => Q.value.length), wt = g(() => Q.value.map((t) => ({
       segment: t[0],
       age: t[1],
       left: {
@@ -237,7 +237,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
           y: l,
           color: e.value.style.layout.bars.left.color,
           x: s.value.leftChart.right - t.left.proportionToMax * s.value.leftChart.width,
-          width: x(t.left.proportionToMax * s.value.leftChart.width),
+          width: k(t.left.proportionToMax * s.value.leftChart.width),
           height: o
         },
         right: {
@@ -245,11 +245,11 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
           y: l,
           color: e.value.style.layout.bars.right.color,
           x: s.value.rightChart.left,
-          width: x(t.right.proportionToMax * s.value.rightChart.width),
+          width: k(t.right.proportionToMax * s.value.rightChart.width),
           height: o
         }
       };
-    })), de = r(null);
+    })), ee = r(null);
     function ye(t) {
       const [a, l, o, d] = t;
       return { segment: a, index: l, left: o, right: d };
@@ -272,7 +272,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
       l && (_e.value = l);
     }
     function Re(t, a, l = "pointer") {
-      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: ye(a), seriesIndex: t }), P.value = t, L.value = t, H.value = l, de.value = {
+      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: ye(a), seriesIndex: t }), P.value = t, L.value = t, H.value = l, ee.value = {
         datapoint: a,
         seriesIndex: t,
         series: h.value,
@@ -290,7 +290,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         series: h.value,
         config: e.value
       })))
-        le.value = o({
+        ae.value = o({
           seriesIndex: t,
           datapoint: {
             segment: a[0],
@@ -306,25 +306,25 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         const i = h.value[t];
         d += `<div><b>${i.segment}</b></div>`, d += `<div>${e.value.translations.age}: ${N(
           e.value.style.layout.dataLabels.yAxis.formatter,
-          x(i.age),
-          E({ v: x(i.age) }),
+          k(i.age),
+          E({ v: k(i.age) }),
           { datapoint: a, seriesIndex: t }
         )}</div>`, d += `<div style="margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor}">`, d += '<div style="display:flex; flex-direction:row;gap:12px">', d += `<div style="display:flex;flex-direction:column;align-items:center;justify-content:center"><svg viewBox="0 0 12 12" height="12" width="12"><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.underlayer}"/><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.show ? `url(#age_pyramid_left_${C.value})` : e.value.style.layout.bars.left.color}"/></svg><div>${e.value.translations.female}</div><div><b>${N(
           e.value.style.layout.dataLabels.xAxis.formatter,
-          x(i.left.value),
-          E({ v: x(i.left.value) }),
+          k(i.left.value),
+          E({ v: k(i.left.value) }),
           { datapoint: a, seriesIndex: t }
         )}</b></div></div>`, d += `<div style="display:flex;flex-direction:column;align-items:center;justify-content:center"><svg viewBox="0 0 12 12" height="12" width="12"><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.underlayer}"/><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${e.value.style.layout.bars.gradient.show ? `url(#age_pyramid_right_${C.value})` : e.value.style.layout.bars.right.color}"/></svg><div>${e.value.translations.male}</div><div><b>${N(
           e.value.style.layout.dataLabels.xAxis.formatter,
-          x(i.right.value),
-          E({ v: x(i.right.value) }),
+          k(i.right.value),
+          E({ v: k(i.right.value) }),
           { datapoint: a, seriesIndex: t }
         )}</b></div></div>`, d += "</div>", d += `<div style="margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor}"><div>${e.value.translations.total}</div><div><b>${N(
           e.value.style.layout.dataLabels.xAxis.formatter,
-          x(i.right.value) + x(i.left.value),
-          E({ v: x(i.right.value) + x(i.left.value) }),
+          k(i.right.value) + k(i.left.value),
+          E({ v: k(i.right.value) + k(i.left.value) }),
           { datapoint: a, seriesIndex: t }
-        )}</b></div></div>`, d += "</div>", le.value = `<div>${d}</div>`;
+        )}</b></div></div>`, d += "</div>", ae.value = `<div>${d}</div>`;
       }
       V.value = !0, l === "keyboard" && pe(() => {
         Ct(t);
@@ -397,7 +397,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
     }
     const Tt = r([]), $t = r({ start: 0, end: h.value.length });
     sl({
-      timeLabelsEls: ae,
+      timeLabelsEls: oe,
       timeLabels: Tt,
       slicer: $t,
       configRef: e,
@@ -440,11 +440,11 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         }
       };
     });
-    ee(() => A.value.showTable, (t) => {
+    te(() => A.value.showTable, (t) => {
       e.value.table.show || (t && e.value.table.useDialog && G.value ? G.value.open() : "close" in G.value && G.value.close());
     });
     function Be() {
-      A.value.showTable = !1, oe.value && oe.value.setTableIconState(!1);
+      A.value.showTable = !1, se.value && se.value.setTableIconState(!1);
     }
     const Lt = g(() => e.value.style.backgroundColor), _t = g(() => e.value.style.title), { exportSvg: St, getSvg: It } = tl({
       svg: z,
@@ -488,10 +488,10 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
       }));
     }
     function Pt() {
-      se.value = !0;
+      ie.value = !0;
     }
     function zt() {
-      P.value = null, L.value = null, H.value = "pointer", V.value = !1, se.value = !1;
+      P.value = null, L.value = null, H.value = "pointer", V.value = !1, ie.value = !1;
     }
     function Ft(t) {
       if (!z.value || X.value || document.activeElement !== z.value || !h.value.length) return;
@@ -530,15 +530,15 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
       ref_key: "agePyramid",
       ref: $,
       id: `vue-ui-age-pyramid_${C.value}`,
-      style: te(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.backgroundColor};${e.value.responsive ? "height:100%" : ""}`),
+      style: le(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.backgroundColor};${e.value.responsive ? "height:100%" : ""}`),
       onMouseenter: a[1] || (a[1] = () => n(Ie)(!0)),
       onMouseleave: a[2] || (a[2] = () => n(Ie)(!1))
     }, [
-      c("div", {
+      f("div", {
         id: `chart-instructions-${C.value}`,
         class: "sr-only"
       }, [
-        c("p", null, T(e.value.a11y.translations.keyboardNavigation), 1)
+        f("p", null, T(e.value.a11y.translations.keyboardNavigation), 1)
       ], 8, yl),
       F.value?.body?.length ? (u(), R(rl, {
         key: 0,
@@ -557,23 +557,23 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         isCursorPointer: W.value,
         onClose: fe
       }, {
-        "annotator-action-close": f(() => [
+        "annotator-action-close": c(() => [
           y(t.$slots, "annotator-action-close", {}, void 0, !0)
         ]),
-        "annotator-action-color": f(({ color: l }) => [
-          y(t.$slots, "annotator-action-color", w(k({ color: l })), void 0, !0)
+        "annotator-action-color": c(({ color: l }) => [
+          y(t.$slots, "annotator-action-color", x(w({ color: l })), void 0, !0)
         ]),
-        "annotator-action-draw": f(({ mode: l }) => [
-          y(t.$slots, "annotator-action-draw", w(k({ mode: l })), void 0, !0)
+        "annotator-action-draw": c(({ mode: l }) => [
+          y(t.$slots, "annotator-action-draw", x(w({ mode: l })), void 0, !0)
         ]),
-        "annotator-action-undo": f(({ disabled: l }) => [
-          y(t.$slots, "annotator-action-undo", w(k({ disabled: l })), void 0, !0)
+        "annotator-action-undo": c(({ disabled: l }) => [
+          y(t.$slots, "annotator-action-undo", x(w({ disabled: l })), void 0, !0)
         ]),
-        "annotator-action-redo": f(({ disabled: l }) => [
-          y(t.$slots, "annotator-action-redo", w(k({ disabled: l })), void 0, !0)
+        "annotator-action-redo": c(({ disabled: l }) => [
+          y(t.$slots, "annotator-action-redo", x(w({ disabled: l })), void 0, !0)
         ]),
-        "annotator-action-delete": f(({ disabled: l }) => [
-          y(t.$slots, "annotator-action-delete", w(k({ disabled: l })), void 0, !0)
+        "annotator-action-delete": c(({ disabled: l }) => [
+          y(t.$slots, "annotator-action-delete", x(w({ disabled: l })), void 0, !0)
         ]),
         _: 3
       }, 8, ["svgRef", "backgroundColor", "color", "active", "isCursorPointer"])) : p("", !0),
@@ -604,14 +604,14 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
           }
         }, null, 8, ["config"]))
       ], 512)) : p("", !0),
-      e.value.userOptions.show && we.value && (n(Oe) || n(ue)) ? (u(), R(n(it), {
+      e.value.userOptions.show && we.value && (n(Oe) || n(ne)) ? (u(), R(n(it), {
         ref_key: "userOptionsRef",
-        ref: oe,
+        ref: se,
         key: `user_options_${ke.value}`,
         backgroundColor: e.value.style.backgroundColor,
         color: e.value.style.color,
-        isImaging: n(ve),
-        isPrinting: n(re),
+        isImaging: n(de),
+        isPrinting: n(ve),
         uid: C.value,
         hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.tooltip.show,
         hasPdf: e.value.userOptions.buttons.pdf,
@@ -641,89 +641,89 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         onToggleTooltip: Ee,
         onToggleAnnotator: fe,
         onCopyAlt: Ve,
-        style: te({
-          visibility: n(Oe) ? n(ue) ? "visible" : "hidden" : "visible"
+        style: le({
+          visibility: n(Oe) ? n(ne) ? "visible" : "hidden" : "visible"
         })
       }, je({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
-          fn: f(({ isOpen: l, color: o }) => [
-            y(t.$slots, "menuIcon", w(k({ isOpen: l, color: o })), void 0, !0)
+          fn: c(({ isOpen: l, color: o }) => [
+            y(t.$slots, "menuIcon", x(w({ isOpen: l, color: o })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
         t.$slots.optionTooltip ? {
           name: "optionTooltip",
-          fn: f(() => [
+          fn: c(() => [
             y(t.$slots, "optionTooltip", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         t.$slots.optionPdf ? {
           name: "optionPdf",
-          fn: f(() => [
+          fn: c(() => [
             y(t.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         t.$slots.optionCsv ? {
           name: "optionCsv",
-          fn: f(() => [
+          fn: c(() => [
             y(t.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         t.$slots.optionImg ? {
           name: "optionImg",
-          fn: f(() => [
+          fn: c(() => [
             y(t.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "4"
         } : void 0,
         t.$slots.optionSvg ? {
           name: "optionSvg",
-          fn: f(() => [
+          fn: c(() => [
             y(t.$slots, "optionSvg", {}, void 0, !0)
           ]),
           key: "5"
         } : void 0,
         t.$slots.optionTable ? {
           name: "optionTable",
-          fn: f(() => [
+          fn: c(() => [
             y(t.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "6"
         } : void 0,
         t.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: f(({ toggleFullscreen: l, isFullscreen: o }) => [
-            y(t.$slots, "optionFullscreen", w(k({ toggleFullscreen: l, isFullscreen: o })), void 0, !0)
+          fn: c(({ toggleFullscreen: l, isFullscreen: o }) => [
+            y(t.$slots, "optionFullscreen", x(w({ toggleFullscreen: l, isFullscreen: o })), void 0, !0)
           ]),
           key: "7"
         } : void 0,
         t.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: f(({ toggleAnnotator: l, isAnnotator: o }) => [
-            y(t.$slots, "optionAnnotator", w(k({ toggleAnnotator: l, isAnnotator: o })), void 0, !0)
+          fn: c(({ toggleAnnotator: l, isAnnotator: o }) => [
+            y(t.$slots, "optionAnnotator", x(w({ toggleAnnotator: l, isAnnotator: o })), void 0, !0)
           ]),
           key: "8"
         } : void 0,
         t.$slots.optionAltCopy ? {
           name: "optionAltCopy",
-          fn: f(({ altCopy: l }) => [
-            y(t.$slots, "optionAltCopy", w(k({ altCopy: l })), void 0, !0)
+          fn: c(({ altCopy: l }) => [
+            y(t.$slots, "optionAltCopy", x(w({ altCopy: l })), void 0, !0)
           ]),
           key: "9"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasSvg", "hasTable", "hasFullscreen", "hasAltCopy", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "isCursorPointer", "onGeneratePdf", "style"])) : p("", !0),
-      c("div", cl, [
+      f("div", cl, [
         (u(), v("svg", {
           ref_key: "svgRef",
           ref: z,
           xmlns: n(Ht),
           class: Xe({ "vue-data-ui-fullscreen--on": D.value, "vue-data-ui-fulscreen--off": !D.value }),
           viewBox: `0 0 ${m.value.width <= 0 ? 10 : m.value.width} ${m.value.height <= 0 ? 10 : m.value.height}`,
-          style: te(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.color}`),
+          style: le(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.color}`),
           tabindex: "0",
           "aria-describedby": `chart-instructions-${C.value}`,
           onFocus: Pt,
@@ -743,50 +743,50 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
           }, [
             y(t.$slots, "chart-background", {}, void 0, !0)
           ], 8, hl)) : p("", !0),
-          c("defs", null, [
-            c("linearGradient", {
+          f("defs", null, [
+            f("linearGradient", {
               id: `age_pyramid_left_${C.value}`,
               x1: "0%",
               y1: "0%",
               x2: "100%",
               y2: "0%"
             }, [
-              c("stop", {
+              f("stop", {
                 offset: "0%",
                 "stop-color": e.value.style.layout.bars.left.color
               }, null, 8, pl),
-              c("stop", {
+              f("stop", {
                 offset: "100%",
                 "stop-color": n(be)(n(Je)(e.value.style.layout.bars.left.color, e.value.style.layout.bars.gradient.shiftHue), 100 - e.value.style.layout.bars.gradient.intensity)
               }, null, 8, bl)
             ], 8, gl),
-            c("linearGradient", {
+            f("linearGradient", {
               id: `age_pyramid_right_${C.value}`,
               x1: "0%",
               y1: "0%",
               x2: "100%",
               y2: "0%"
             }, [
-              c("stop", {
+              f("stop", {
                 offset: "0%",
                 "stop-color": n(be)(n(Je)(e.value.style.layout.bars.right.color, e.value.style.layout.bars.gradient.shiftHue), 100 - e.value.style.layout.bars.gradient.intensity)
               }, null, 8, xl),
-              c("stop", {
+              f("stop", {
                 offset: "100%",
                 "stop-color": e.value.style.layout.bars.right.color
               }, null, 8, wl)
             ], 8, ml)
           ]),
           (u(!0), v(O, null, M(h.value, (l, o) => (u(), v("g", null, [
-            c("rect", {
+            f("rect", {
               x: l.left.x,
               y: l.left.y,
-              width: n(x)(l.left.width <= 0 ? 1e-4 : l.left.width),
+              width: n(k)(l.left.width <= 0 ? 1e-4 : l.left.width),
               height: l.left.height <= 0 ? 1e-4 : l.left.height,
               fill: e.value.style.layout.bars.gradient.underlayer,
               rx: e.value.style.layout.bars.borderRadius
             }, null, 8, kl),
-            c("rect", {
+            f("rect", {
               x: l.left.x,
               y: l.left.y,
               width: l.left.width <= 0 ? 1e-4 : l.left.width,
@@ -794,7 +794,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
               fill: e.value.style.layout.bars.gradient.show ? `url(#age_pyramid_left_${C.value})` : l.left.color,
               rx: e.value.style.layout.bars.borderRadius
             }, null, 8, Cl),
-            c("rect", {
+            f("rect", {
               x: l.right.x,
               y: l.right.y,
               width: l.right.width <= 0 ? 1e-4 : l.right.width,
@@ -802,7 +802,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
               fill: e.value.style.layout.bars.gradient.underlayer,
               rx: e.value.style.layout.bars.borderRadius
             }, null, 8, Al),
-            c("rect", {
+            f("rect", {
               x: l.right.x,
               y: l.right.y,
               width: l.right.width <= 0 ? 1e-4 : l.right.width,
@@ -811,9 +811,9 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
               rx: e.value.style.layout.bars.borderRadius
             }, null, 8, Tl)
           ]))), 256)),
-          c("g", null, [
+          f("g", null, [
             e.value.style.layout.dataLabels.sideTitles.show ? (u(), v("g", $l, [
-              c("text", {
+              f("text", {
                 x: s.value.left,
                 y: e.value.style.layout.dataLabels.sideTitles.fontSize,
                 fill: e.value.style.layout.dataLabels.sideTitles.useSideColor ? e.value.style.layout.bars.left.color : e.value.style.layout.dataLabels.sideTitles.color,
@@ -821,7 +821,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
                 "text-anchor": "start",
                 "font-weight": e.value.style.layout.dataLabels.sideTitles.bold ? "bold" : "normal"
               }, T(e.value.translations.female), 9, Ll),
-              c("text", {
+              f("text", {
                 x: s.value.right,
                 y: e.value.style.layout.dataLabels.sideTitles.fontSize,
                 fill: e.value.style.layout.dataLabels.sideTitles.useSideColor ? e.value.style.layout.bars.right.color : e.value.style.layout.dataLabels.sideTitles.color,
@@ -850,7 +850,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
             ])) : p("", !0),
             e.value.style.layout.dataLabels.xAxis.show ? (u(), v("g", Ol, [
               e.value.style.layout.grid.show ? (u(), v("g", Pl, [
-                c("line", {
+                f("line", {
                   x1: S.value.right[0].x,
                   x2: S.value.right.at(-1).x,
                   y1: s.value.bottom + e.value.style.layout.dataLabels.xAxis.fontSize / 2,
@@ -859,7 +859,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
                   "stroke-width": e.value.style.layout.grid.strokeWidth,
                   "stroke-linecap": "round"
                 }, null, 8, zl),
-                c("line", {
+                f("line", {
                   x1: S.value.left[0].x,
                   x2: S.value.left.at(-1).x,
                   y1: s.value.bottom + e.value.style.layout.dataLabels.xAxis.fontSize / 2,
@@ -893,9 +893,9 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
                   "stroke-linecap": "round"
                 }, null, 8, Rl)) : p("", !0)
               ]))), 256)),
-              c("g", {
+              f("g", {
                 ref_key: "xAxisLabels",
-                ref: ae
+                ref: oe
               }, [
                 (u(!0), v(O, null, M(S.value.right, (l, o) => (u(), v("text", {
                   class: "vue-ui-age-pyramid-x-axis-label",
@@ -928,7 +928,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
                   { datapoint: l, seriesIndex: o }
                 )), 9, Nl))), 256))
               ], 512),
-              c("text", {
+              f("text", {
                 x: s.value.right,
                 y: m.value.height,
                 "text-anchor": "end",
@@ -939,7 +939,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
             ])) : p("", !0)
           ]),
           (u(!0), v(O, null, M(xe.dataset, (l, o) => (u(), v("g", null, [
-            c("rect", {
+            f("rect", {
               x: s.value.left,
               y: s.value.top + s.value.height / U.value * o - e.value.style.layout.bars.gap / 2,
               width: s.value.width <= 0 ? 1e-4 : s.value.width,
@@ -953,17 +953,17 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
           y(t.$slots, "svg", {
             svg: {
               ...m.value,
-              isPrintingImg: n(re) | n(ve) | q.value,
+              isPrintingImg: n(ve) | n(de) | q.value,
               isPrintingSvg: J.value
             }
           }, void 0, !0)
         ], 46, fl)),
         t.$slots.hint ? (u(), v("div", Ul, [
-          y(t.$slots, "hint", w(k({ hint: e.value.a11y.translations.keyboardNavigation, isVisible: se.value })), void 0, !0)
+          y(t.$slots, "hint", x(w({ hint: e.value.a11y.translations.keyboardNavigation, isVisible: ie.value })), void 0, !0)
         ])) : p("", !0)
       ]),
       t.$slots.watermark ? (u(), v("div", Vl, [
-        y(t.$slots, "watermark", w(k({ isPrinting: n(re) || n(ve) || q.value || J.value })), void 0, !0)
+        y(t.$slots, "watermark", x(w({ isPrinting: n(ve) || n(de) || q.value || J.value })), void 0, !0)
       ])) : p("", !0),
       y(t.$slots, "legend", { legend: h.value }, void 0, !0),
       t.$slots.source ? (u(), v("div", {
@@ -987,7 +987,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         position: e.value.style.tooltip.position,
         offsetY: e.value.style.tooltip.offsetY,
         parent: $.value,
-        content: le.value,
+        content: ae.value,
         isFullscreen: D.value,
         isCustom: e.value.style.tooltip.customFormat && typeof e.value.style.tooltip.customFormat == "function",
         smooth: e.value.style.tooltip.smooth,
@@ -997,11 +997,14 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         isA11yMode: H.value === "keyboard",
         a11yPosition: _e.value
       }, {
-        "tooltip-before": f(() => [
-          y(t.$slots, "tooltip-before", w(k({ ...de.value })), void 0, !0)
+        "tooltip-before": c(() => [
+          y(t.$slots, "tooltip-before", x(w({ ...ee.value })), void 0, !0)
         ]),
-        "tooltip-after": f(() => [
-          y(t.$slots, "tooltip-after", w(k({ ...de.value })), void 0, !0)
+        tooltip: c(() => [
+          y(t.$slots, "tooltip", x(w({ ...ee.value })), void 0, !0)
+        ]),
+        "tooltip-after": c(() => [
+          y(t.$slots, "tooltip-after", x(w({ ...ee.value })), void 0, !0)
         ]),
         _: 3
       }, 8, ["teleportTo", "show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold", "isA11yMode", "a11yPosition"]),
@@ -1010,7 +1013,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
         ref: G,
         onClose: Be
       }), je({
-        content: f(() => [
+        content: c(() => [
           (u(), R(n(ot), {
             key: `table_${Le.value}`,
             colNames: F.value.colNames,
@@ -1022,10 +1025,10 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
             isCursorPointer: W.value,
             onClose: Be
           }, {
-            th: f(({ th: l }) => [
+            th: c(({ th: l }) => [
               ge(T(l), 1)
             ]),
-            td: f(({ td: l }) => [
+            td: c(({ td: l }) => [
               ge(T(l), 1)
             ]),
             _: 1
@@ -1035,19 +1038,19 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
       }, [
         e.value.table.useDialog ? {
           name: "title",
-          fn: f(() => [
+          fn: c(() => [
             ge(T(j.value.title), 1)
           ]),
           key: "0"
         } : void 0,
         e.value.table.useDialog ? {
           name: "actions",
-          fn: f(() => [
-            c("button", {
+          fn: c(() => [
+            f("button", {
               tabindex: "0",
               class: "vue-ui-user-options-button",
               onClick: a[0] || (a[0] = (l) => ce(e.value.userOptions.callbacks.csv)),
-              style: te({ cursor: W.value ? "pointer" : "default" })
+              style: le({ cursor: W.value ? "pointer" : "default" })
             }, [
               he(n(lt), {
                 name: "fileCsv",
@@ -1063,7 +1066,7 @@ const dl = ["id"], yl = ["id"], cl = { style: { position: "relative" } }, fl = [
       ], !0)
     ], 46, dl));
   }
-}, ua = /* @__PURE__ */ vl(Gl, [["__scopeId", "data-v-b63d06c1"]]);
+}, ua = /* @__PURE__ */ vl(Gl, [["__scopeId", "data-v-b69c6f22"]]);
 export {
   ua as default
 };