vue-data-ui 3.22.6 → 3.22.7

package/dist/{vue-ui-accordion-CfMrbDoq.js → vue-ui-accordion-Dzz8XhX3.js}

@@ -1,9 +1,9 @@
 import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
-import { W as t } from "./lib-DRBJCmHW.js";
+import { W as t } from "./lib-EAmk-PgA.js";
 import { t as n } from "./useConfig-DYM3f6EI.js";
-import { t as r } from "./useNestedProp-BEo2N1Db.js";
+import { t as r } from "./useNestedProp-D8XqxgOU.js";
 import { t as i } from "./_plugin-vue_export-helper-B3ysoDQm.js";
-import { t as a } from "./BaseIcon-DcUvOfxf.js";
+import { t as a } from "./BaseIcon-_-BX7be3.js";
 import { computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, guardReactiveProps as d, mergeProps as f, normalizeClass as p, normalizeProps as m, normalizeStyle as h, onMounted as g, openBlock as _, ref as v, renderSlot as y, useCssVars as b, watch as x } from "vue";
 //#region src/components/vue-ui-accordion.vue
 var S = /* @__PURE__ */ e({ default: () => E }), C = { class: "vue-data-ui-component" }, w = ["id"], T = {

package/dist/{vue-ui-age-pyramid-BF5ZuuyI.js → vue-ui-age-pyramid-CC7Dxli-.js}

@@ -1,14 +1,14 @@
 import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
-import { Dt as t, It as n, Lt as r, Q as i, Vt as a, W as o, Wt as ee, X as te, _t as ne, at as re, i as s, q as c, t as ie, v as l, w as ae } from "./lib-DRBJCmHW.js";
+import { Gt as t, Ht as n, Lt as r, Ot as i, Q as a, Rt as o, W as ee, X as te, at as ne, i as s, q as c, t as re, v as l, vt as ie, w as ae } from "./lib-EAmk-PgA.js";
 import { t as oe } from "./useConfig-DYM3f6EI.js";
-import { t as se } from "./usePrinter-CRp5IW3v.js";
+import { t as se } from "./usePrinter-DnGzpp6Q.js";
 import { n as ce, t as le } from "./BaseScanner-DZvpgOjM.js";
 import { t as ue } from "./useSvgExport-SVIsDot8.js";
-import { t as de } from "./useNestedProp-BEo2N1Db.js";
+import { t as de } from "./useNestedProp-D8XqxgOU.js";
 import { t as fe } from "./useThemeCheck-C43Tcqmk.js";
 import { t as pe } from "./useTimeLabelCollider-AEcY4Ioe.js";
-import { t as me } from "./img-B_y5qDdm.js";
-import { n as he } from "./Title-C-p0ilWB.js";
+import { t as me } from "./img-B_abIg0o.js";
+import { n as he } from "./Title-PiTKr6sp.js";
 import { t as ge } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { c as _e } from "./canvas-lib-BOP_HS11.js";
 import { t as ve } from "./useResponsive-BfnK0KxU.js";
@@ -159,10 +159,10 @@ var Ie = /* @__PURE__ */ e({ default: () => ht }), Le = ["id"], Re = ["id"], ze
 	},
 	emits: ["copyAlt"],
 	setup(e, { expose: ge, emit: Ie }) {
-		let ht = g(() => import("./Tooltip-YabpoXo1.js")), gt = g(() => import("./BaseIcon-DcUvOfxf.js").then((e) => e.n)), _t = g(() => import("./vue-ui-accordion-CfMrbDoq.js").then((e) => e.n)), vt = g(() => import("./DataTable-CXfvIulC.js")), yt = g(() => import("./PenAndPaper-Bk2-E7V4.js").then((e) => e.t)), bt = g(() => import("./UserOptions-BO4VFL8O.js").then((e) => e.n)), xt = g(() => import("./PackageVersion-Da7hl-34.js").then((e) => e.t)), St = g(() => import("./BaseDraggableDialog-VbypEaAa.js").then((e) => e.n)), { vue_ui_age_pyramid: Ct } = oe(), { isThemeValid: wt, warnInvalidTheme: Tt } = fe(), D = e, Et = Ie, Dt = d(() => !!D.dataset && D.dataset.length), O = x(o()), k = x(!1), Ot = x(""), A = x(null), kt = x(0), j = x(null), At = x(null), jt = x(null), Mt = x(null), Nt = x(0), Pt = x(0), Ft = x(null), M = x(null), It = x(null), N = x(!1), P = x(!1), F = x(null), Lt = x({
+		let ht = g(() => import("./Tooltip-B8yYfISA.js")), gt = g(() => import("./BaseIcon-_-BX7be3.js").then((e) => e.n)), _t = g(() => import("./vue-ui-accordion-Dzz8XhX3.js").then((e) => e.n)), vt = g(() => import("./DataTable-CVF7DoZn.js")), yt = g(() => import("./PenAndPaper-gaV1QPpP.js").then((e) => e.t)), bt = g(() => import("./UserOptions-BL9VlHop.js").then((e) => e.n)), xt = g(() => import("./PackageVersion-Dse0n05o.js").then((e) => e.t)), St = g(() => import("./BaseDraggableDialog-1wwwdwV2.js").then((e) => e.n)), { vue_ui_age_pyramid: Ct } = oe(), { isThemeValid: wt, warnInvalidTheme: Tt } = fe(), D = e, Et = Ie, Dt = d(() => !!D.dataset && D.dataset.length), O = x(ee()), k = x(!1), Ot = x(""), A = x(null), kt = x(0), j = x(null), At = x(null), jt = x(null), Mt = x(null), Nt = x(0), Pt = x(0), Ft = x(null), M = x(null), It = x(null), N = x(!1), P = x(!1), F = x(null), Lt = x({
 			x: 0,
 			y: 0
-		}), I = x("pointer"), Rt = x(!1), L = x(Gt()), R = d(() => L.value.userOptions.useCursorPointer), zt = d(() => ee({
+		}), I = x("pointer"), Rt = x(!1), L = x(Gt()), R = d(() => L.value.userOptions.useCursorPointer), zt = d(() => t({
 			defaultConfig: {
 				userOptions: { show: !1 },
 				table: { show: !1 },
@@ -256,7 +256,7 @@ var Ie = /* @__PURE__ */ e({ default: () => ht }), Le = ["id"], Re = ["id"], ze
 					144
 				]
 			],
-			skeletonConfig: ee({
+			skeletonConfig: t({
 				defaultConfig: L.value,
 				userConfig: zt.value
 			})
@@ -288,11 +288,11 @@ var Ie = /* @__PURE__ */ e({ default: () => ht }), Le = ["id"], Re = ["id"], ze
 		});
 		let Kt = d(() => !!L.value.debug);
 		function qt() {
-			if (t(D.dataset) && (i({
+			if (i(D.dataset) && (a({
 				componentName: "VueUiAgePyramid",
 				type: "dataset",
 				debug: Kt.value
-			}), Vt.value = !0), t(D.dataset) || (Vt.value = L.value.loading), L.value.responsive) {
+			}), Vt.value = !0), i(D.dataset) || (Vt.value = L.value.loading), L.value.responsive) {
 				let e = _e(() => {
 					let { width: e, height: t } = ve({
 						chart: j.value,
@@ -440,8 +440,8 @@ var Ie = /* @__PURE__ */ e({ default: () => ht }), Le = ["id"], Re = ["id"], ze
 			if (!B.value) return;
 			let t = Y.value[e];
 			if (!t) return;
-			let n = a(G.value.left + G.value.width / 2, t.left.y + t.left.height / 2, B.value);
-			n && (Lt.value = n);
+			let r = n(G.value.left + G.value.width / 2, t.left.y + t.left.height / 2, B.value);
+			r && (Lt.value = r);
 		}
 		function fn(e, t, n = "pointer") {
 			L.value.events.datapointEnter && L.value.events.datapointEnter({
@@ -454,7 +454,7 @@ var Ie = /* @__PURE__ */ e({ default: () => ht }), Le = ["id"], Re = ["id"], ze
 				config: L.value
 			};
 			let r = L.value.style.tooltip.customFormat;
-			if (ne(r) && re(() => r({
+			if (ie(r) && ne(() => r({
 				seriesIndex: e,
 				datapoint: {
 					segment: t[0],
@@ -736,14 +736,14 @@ var Ie = /* @__PURE__ */ e({ default: () => ht }), Le = ["id"], Re = ["id"], ze
 			toggleAnnotator: _n,
 			toggleFullscreen: mn,
 			copyAlt: Tn
-		}), (t, i) => (b(), m("div", {
+		}), (t, n) => (b(), m("div", {
 			class: Oe(`vue-data-ui-component vue-ui-age-pyramid ${Z.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
 			ref_key: "agePyramid",
 			ref: j,
 			id: `vue-ui-age-pyramid_${O.value}`,
 			style: y(`font-family:${L.value.style.fontFamily};width:100%; text-align:center;background:${L.value.style.backgroundColor};${L.value.responsive ? "height:100%" : ""}`),
-			onMouseenter: i[1] ||= () => T(Ut)(!0),
-			onMouseleave: i[2] ||= () => T(Ut)(!1)
+			onMouseenter: n[1] ||= () => T(Ut)(!0),
+			onMouseleave: n[2] ||= () => T(Ut)(!1)
 		}, [
 			h("div", {
 				id: `chart-instructions-${O.value}`,
@@ -923,7 +923,7 @@ var Ie = /* @__PURE__ */ e({ default: () => ht }), Le = ["id"], Re = ["id"], ze
 			h("div", ze, [(b(), m("svg", {
 				ref_key: "svgRef",
 				ref: B,
-				xmlns: T(ie),
+				xmlns: T(re),
 				class: Oe({
 					"vue-data-ui-fullscreen--on": Z.value,
 					"vue-data-ui-fulscreen--off": !Z.value
@@ -956,7 +956,7 @@ var Ie = /* @__PURE__ */ e({ default: () => ht }), Le = ["id"], Re = ["id"], ze
 					"stop-color": L.value.style.layout.bars.left.color
 				}, null, 8, Ue), h("stop", {
 					offset: "100%",
-					"stop-color": T(n)(T(r)(L.value.style.layout.bars.left.color, L.value.style.layout.bars.gradient.shiftHue), 100 - L.value.style.layout.bars.gradient.intensity)
+					"stop-color": T(r)(T(o)(L.value.style.layout.bars.left.color, L.value.style.layout.bars.gradient.shiftHue), 100 - L.value.style.layout.bars.gradient.intensity)
 				}, null, 8, We)], 8, He), h("linearGradient", {
 					id: `age_pyramid_right_${O.value}`,
 					x1: "0%",
@@ -965,7 +965,7 @@ var Ie = /* @__PURE__ */ e({ default: () => ht }), Le = ["id"], Re = ["id"], ze
 					y2: "0%"
 				}, [h("stop", {
 					offset: "0%",
-					"stop-color": T(n)(T(r)(L.value.style.layout.bars.right.color, L.value.style.layout.bars.gradient.shiftHue), 100 - L.value.style.layout.bars.gradient.intensity)
+					"stop-color": T(r)(T(o)(L.value.style.layout.bars.right.color, L.value.style.layout.bars.gradient.shiftHue), 100 - L.value.style.layout.bars.gradient.intensity)
 				}, null, 8, Ke), h("stop", {
 					offset: "100%",
 					"stop-color": L.value.style.layout.bars.right.color
@@ -1109,7 +1109,7 @@ var Ie = /* @__PURE__ */ e({ default: () => ht }), Le = ["id"], Re = ["id"], ze
 					y: G.value.top + G.value.height / J.value * t - L.value.style.layout.bars.gap / 2,
 					width: G.value.width <= 0 ? 1e-4 : G.value.width,
 					height: G.value.height / J.value <= 0 ? 1e-4 : G.value.height / J.value,
-					fill: A.value !== null && A.value === t ? T(n)(L.value.style.highlighter.color, L.value.style.highlighter.opacity) : "transparent",
+					fill: A.value !== null && A.value === t ? T(r)(L.value.style.highlighter.color, L.value.style.highlighter.opacity) : "transparent",
 					onMouseover: (n) => fn(t, e, "pointer"),
 					onMouseleave: (n) => un(t, e),
 					onClick: (n) => ln(t, e)
@@ -1222,7 +1222,7 @@ var Ie = /* @__PURE__ */ e({ default: () => ht }), Le = ["id"], Re = ["id"], ze
 				fn: E(() => [h("button", {
 					tabindex: "0",
 					class: "vue-ui-user-options-button",
-					onClick: i[0] ||= (e) => pn(L.value.userOptions.callbacks.csv),
+					onClick: n[0] ||= (e) => pn(L.value.userOptions.callbacks.csv),
 					style: y({ cursor: R.value ? "pointer" : "default" })
 				}, [Te(T(gt), {
 					name: "fileCsv",

package/dist/{vue-ui-annotator-CG6rhFpy.js → vue-ui-annotator-DXZumSP8.js}

@@ -1,12 +1,12 @@
 import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
-import { W as t, Wt as n, kt as r, x as i } from "./lib-DRBJCmHW.js";
+import { At as t, Gt as n, W as r, x as i } from "./lib-EAmk-PgA.js";
 import { t as a } from "./useConfig-DYM3f6EI.js";
-import { t as o } from "./usePrinter-CRp5IW3v.js";
-import { t as s } from "./dom-to-png-CVJfsfwL.js";
+import { t as o } from "./usePrinter-DnGzpp6Q.js";
+import { t as s } from "./dom-to-png-BZjYWNEg.js";
 import { t as c } from "./_plugin-vue_export-helper-B3ysoDQm.js";
-import { t as l } from "./BaseIcon-DcUvOfxf.js";
-import { t as ee } from "./vue-ui-accordion-CfMrbDoq.js";
-import { t as te } from "./ColorPicker-UVDPcrjE.js";
+import { t as l } from "./BaseIcon-_-BX7be3.js";
+import { t as ee } from "./vue-ui-accordion-Dzz8XhX3.js";
+import { t as te } from "./ColorPicker-TB3KhY3j.js";
 import { Fragment as ne, Teleport as re, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createTextVNode as h, createVNode as g, nextTick as ie, normalizeClass as _, normalizeStyle as v, onBeforeUnmount as ae, onMounted as oe, openBlock as y, ref as b, renderList as se, renderSlot as ce, toDisplayString as x, unref as le, vModelCheckbox as ue, vModelText as de, watch as fe, withCtx as S, withDirectives as pe, withModifiers as me } from "vue";
 //#region src/registerAnnotatorShortcuts.js
 function he(e) {
@@ -299,7 +299,7 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 	},
 	emits: ["toggleOpenState", "saveAnnotations"],
 	setup(e, { emit: c }) {
-		let re = e, ge = c, _e = b(t()), { isImaging: vt, generateImage: yt } = o({
+		let re = e, ge = c, _e = b(r()), { isImaging: vt, generateImage: yt } = o({
 			elementId: _e.value,
 			fileName: _t
 		}), w = b(void 0), bt = b(1), T = b({
@@ -334,7 +334,7 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 				height: 12,
 				width: 12
 			}
-		}), Pt = b("#1A1A1A"), V = b(!1), Ft = b(1), It = b(void 0), Lt = b(1), Rt = b(1), H = b("start"), zt = b(20), Bt = b(100), Vt = r, Ht = b(null), U = b(!1), W = b(null), G = b({
+		}), Pt = b("#1A1A1A"), V = b(!1), Ft = b(1), It = b(void 0), Lt = b(1), Rt = b(1), H = b("start"), zt = b(20), Bt = b(100), Vt = t, Ht = b(null), U = b(!1), W = b(null), G = b({
 			x: 0,
 			y: 0
 		}), Ut = b(null), K = b([]), Wt = b(!1), Gt = b(null), Kt = b({
@@ -931,7 +931,7 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 			if (!I.value?.id) return;
 			let e = {
 				...I.value,
-				id: `${I.value.id}_copy_${t()}`,
+				id: `${I.value.id}_copy_${r()}`,
 				x: I.value.x - 100 < 0 ? 1 : I.value.x - 100,
 				y: I.value.y - 100 < 0 ? 1 : I.value.y - 100
 			};
@@ -946,10 +946,10 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 		function gn(e) {
 			if (k.value) return;
 			e.preventDefault(), e.stopPropagation(), hn(), P.value ? (F.value = !0, V.value = !0) : (F.value = !1, V.value = !1, P.value = !1);
-			let n = `text_${t()}`;
+			let t = `text_${r()}`;
 			if (F.value) {
 				K.value?.begin(), z.value.push({
-					id: n,
+					id: t,
 					type: "text",
 					lines: 0,
 					x: L.value.x,
@@ -965,21 +965,21 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 				}), E.value = z.value.at(-1), I.value = z.value.at(-1), K.value?.end();
 				return;
 			}
-			let r = () => {
+			let n = () => {
 				St.value = z.value.find((t) => t.id === e.target.id).isDash;
 			}, i = () => {
 				bt.value = z.value.find((t) => t.id === e.target.id).strokeWidth;
 			};
 			if (N.value = !1, e.target.id.includes("arrow")) {
-				w.value = "arrow", r(), i();
+				w.value = "arrow", n(), i();
 				return;
 			}
 			if (e.target.id.includes("circle")) {
-				w.value = "circle", B.value.circle.filled = z.value.find((t) => t.id === e.target.id).isFilled, r(), i();
+				w.value = "circle", B.value.circle.filled = z.value.find((t) => t.id === e.target.id).isFilled, n(), i();
 				return;
 			}
 			if (e.target.id.includes("rect")) {
-				w.value = "rect", B.value.rect.filled = z.value.find((t) => t.id === e.target.id).isFilled, r(), i();
+				w.value = "rect", B.value.rect.filled = z.value.find((t) => t.id === e.target.id).isFilled, n(), i();
 				return;
 			}
 			if (e.target.id.includes("line")) {
@@ -1087,78 +1087,78 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 				diffEndX: t.endX ? t.endX - e.x : 0,
 				diffEndY: t.endY ? t.endY - e.y : 0
 			})), e.source = R.value, R.value.length > 1) {
-				let n = Z(R.value).map((e) => e.oldId);
-				z.value = z.value.filter((e) => !n.includes(e.id)), R.value.forEach((n) => {
+				let t = Z(R.value).map((e) => e.oldId);
+				z.value = z.value.filter((e) => !t.includes(e.id)), R.value.forEach((t) => {
 					switch (!0) {
-						case n.type === "circle":
+						case t.type === "circle":
 							e.content += `
             <circle
-            id="${n.id}"
-            cx="${n.x}"
-            cy="${n.y}"
-            r="${n.circleRadius ? n.circleRadius : Number.MIN_VALUE}"
-            fill="${n.isFilled ? n.color + n.alpha : "rgba(255,255,255,0.001)"}"
-            stroke="${n.color + n.alpha}" 
-            stroke-width="${n.strokeWidth}"
-            style="${n.isDash ? `stroke-dasharray: ${n.strokeWidth * 3}` : ""}"
+            id="${t.id}"
+            cx="${t.x}"
+            cy="${t.y}"
+            r="${t.circleRadius ? t.circleRadius : Number.MIN_VALUE}"
+            fill="${t.isFilled ? t.color + t.alpha : "rgba(255,255,255,0.001)"}"
+            stroke="${t.color + t.alpha}" 
+            stroke-width="${t.strokeWidth}"
+            style="${t.isDash ? `stroke-dasharray: ${t.strokeWidth * 3}` : ""}"
             />
         `;
 							break;
-						case n.type === "rect":
+						case t.type === "rect":
 							e.content += `
             <rect
-            id="${M.value ? "" : n.id}"
-            x="${n.x}"
-            y="${n.y}"
-            fill="${n.isFilled ? n.color + n.alpha : "rgba(255,255,255,0.001)"}"
-            height="${n.rectHeight}"
-            width="${n.rectWidth}"
-            stroke="${n.color + n.alpha}"
-            stroke-width="${n.strokeWidth}"
-            style="rx:1 !important; ry:1 !important; ${n.isDash ? `stroke-dasharray: ${n.strokeWidth * 3}` : ""}"
+            id="${M.value ? "" : t.id}"
+            x="${t.x}"
+            y="${t.y}"
+            fill="${t.isFilled ? t.color + t.alpha : "rgba(255,255,255,0.001)"}"
+            height="${t.rectHeight}"
+            width="${t.rectWidth}"
+            stroke="${t.color + t.alpha}"
+            stroke-width="${t.strokeWidth}"
+            style="rx:1 !important; ry:1 !important; ${t.isDash ? `stroke-dasharray: ${t.strokeWidth * 3}` : ""}"
                         />
         `;
 							break;
-						case n.type === "arrow":
-							let r = n.strokeWidth > 3 ? 5 : 10, i = n.strokeWidth > 3 ? 2.5 : 5, a = t();
+						case t.type === "arrow":
+							let n = t.strokeWidth > 3 ? 5 : 10, i = t.strokeWidth > 3 ? 2.5 : 5, a = r();
 							e.content += `
-            <g id="${n.id}">
+            <g id="${t.id}">
             <defs>
                 <marker 
                 id="${a}" 
-                markerWidth="${r}" 
-                markerHeight="${r}" 
+                markerWidth="${n}" 
+                markerHeight="${n}" 
                 refX="0" 
                 refY="${i}" 
                 orient="auto"
                 >
                 <polygon 
-                points="0 0,${r} ${i}, 0 ${r}" 
-                fill="${n.color}"
+                points="0 0,${n} ${i}, 0 ${n}" 
+                fill="${t.color}"
                 />
                 </marker>
             </defs>
 
             <path 
-                style="stroke-linecap: round !important; ${n.isDash ? `stroke-dasharray: ${n.strokeWidth * 3}` : ""}" 
-                stroke="${n.color}" 
-                id="${n.id}" 
-                d="M${n.x},${n.y} ${n.endX},${n.endY}" 
-                stroke-width="${n.strokeWidth}" 
+                style="stroke-linecap: round !important; ${t.isDash ? `stroke-dasharray: ${t.strokeWidth * 3}` : ""}" 
+                stroke="${t.color}" 
+                id="${t.id}" 
+                d="M${t.x},${t.y} ${t.endX},${t.endY}" 
+                stroke-width="${t.strokeWidth}" 
                 marker-end="url(#${a})"
             />
             </g>
         `;
 							break;
-						case n.type === "text":
-							let o = n.textContent.split("‎"), s = [];
+						case t.type === "text":
+							let o = t.textContent.split("‎"), s = [];
 							for (let e = 0; e < o.length; e += 1) s.push(`
-            ${n.isBulletTextMode ? `<tspan x="${n.x - n.fontSize}" y="${n.y + n.fontSize * e}" id="${n.id}" font-size="${n.fontSize / 2}">⬤</tspan>` : ""}
-            <tspan id="${n.id}" x="${n.x}" y="${n.y + n.fontSize * e}">
+            ${t.isBulletTextMode ? `<tspan x="${t.x - t.fontSize}" y="${t.y + t.fontSize * e}" id="${t.id}" font-size="${t.fontSize / 2}">⬤</tspan>` : ""}
+            <tspan id="${t.id}" x="${t.x}" y="${t.y + t.fontSize * e}">
                 ${o[e]}
             </tspan>`);
 							e.content += `
-            ${nn(n, s, n.isBulletTextMode)}
+            ${nn(t, s, t.isBulletTextMode)}
             `;
 							break;
 						default: break;
@@ -1168,15 +1168,15 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 		}
 		function Cn(e) {
 			e.content = "";
-			let n = e.x || 0, r = e.y || 0;
+			let t = e.x || 0, n = e.y || 0;
 			(e.source || []).forEach((i) => {
 				switch (i.type) {
 					case "circle": {
-						let t = n + i.diffX, a = r + i.diffY;
+						let r = t + i.diffX, a = n + i.diffY;
 						e.content += `
           <circle
             id="${i.id}"
-            cx="${t}"
+            cx="${r}"
             cy="${a}"
             r="${i.circleRadius ? i.circleRadius : Number.MIN_VALUE}"
             fill="${i.isFilled ? i.color + i.alpha : "rgba(255,255,255,0.001)"}"
@@ -1188,11 +1188,11 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 						break;
 					}
 					case "rect": {
-						let t = n + i.diffX, a = r + i.diffY;
+						let r = t + i.diffX, a = n + i.diffY;
 						e.content += `
           <rect
             id="${M.value ? "" : i.id}"
-            x="${t}"
+            x="${r}"
             y="${a}"
             fill="${i.isFilled ? i.color + i.alpha : "rgba(255,255,255,0.001)"}"
             height="${i.rectHeight}"
@@ -1205,7 +1205,7 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 						break;
 					}
 					case "arrow": {
-						let a = n + i.diffX, o = r + i.diffY, s = n + i.diffEndX, c = r + i.diffEndY, l = i.strokeWidth > 3 ? 5 : 10, ee = i.strokeWidth > 3 ? 2.5 : 5, te = `m_${i.id}_${t()}`;
+						let a = t + i.diffX, o = n + i.diffY, s = t + i.diffEndX, c = n + i.diffEndY, l = i.strokeWidth > 3 ? 5 : 10, ee = i.strokeWidth > 3 ? 2.5 : 5, te = `m_${i.id}_${r()}`;
 						e.content += `
           <g id="${i.id}">
             <defs>
@@ -1232,9 +1232,9 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 						break;
 					}
 					case "text": {
-						let t = (i.textContent || "").split("‎").map((e, t) => `
-          ${i.isBulletTextMode ? `<tspan x="${n + i.diffX - i.fontSize}" y="${r + i.diffY + i.fontSize * t}" id="${i.id}" font-size="${i.fontSize / 2}">⬤</tspan>` : ""}
-          <tspan id="${i.id}" x="${n + i.diffX}" y="${r + i.diffY + i.fontSize * t}">
+						let r = (i.textContent || "").split("‎").map((e, r) => `
+          ${i.isBulletTextMode ? `<tspan x="${t + i.diffX - i.fontSize}" y="${n + i.diffY + i.fontSize * r}" id="${i.id}" font-size="${i.fontSize / 2}">⬤</tspan>` : ""}
+          <tspan id="${i.id}" x="${t + i.diffX}" y="${n + i.diffY + i.fontSize * r}">
             ${e}
           </tspan>
         `).join("");
@@ -1243,15 +1243,15 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
             <text
               style="user-select:none; height:100px;"
               id="${i.id}"
-              x="${n + i.diffX}"
-              y="${r + i.diffY}"
+              x="${t + i.diffX}"
+              y="${n + i.diffY}"
               text-anchor="${i.textAlign}"
               font-size="${i.fontSize}"
               fill="${i.color}"
               font-weight="${i.isBold ? "bold" : "normal"}"
               font-style="${i.isItalic ? "italic" : "normal"}"
               text-decoration="${i.isUnderline ? "underline" : "none"}">
-              ${t}
+              ${r}
             </text>
           </g>
         `;
@@ -1270,7 +1270,7 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 				x: L.value.x,
 				y: L.value.y
 			};
-			let e = `${N.value ? "group" : w.value}_${t()}`;
+			let e = `${N.value ? "group" : w.value}_${r()}`;
 			switch (!0) {
 				case w.value === "arrow":
 					z.value.push({
@@ -1332,7 +1332,7 @@ var ge = { class: "teleport-tooltip__inner" }, C = /*#__PURE__*/ c({
 				case w.value === "group":
 					z.value.push({
 						alpha: 1,
-						id: `group_${t()}`,
+						id: `group_${r()}`,
 						x: L.value.x,
 						y: L.value.y,
 						isFilled: !1,

package/dist/{vue-ui-bullet-C_oBS1cr.js → vue-ui-bullet-Dde6FhbR.js}

@@ -1,19 +1,19 @@
 import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
-import { Dt as t, Q as n, W as r, Wt as i, b as a, h as ee, i as o, lt as te, q as s, t as ne, wt as re } from "./lib-DRBJCmHW.js";
+import { Gt as t, Ot as n, Q as r, Tt as i, W as a, b as ee, h as te, i as o, q as s, t as ne, ut as re } from "./lib-EAmk-PgA.js";
 import { t as ie } from "./useConfig-DYM3f6EI.js";
-import { t as ae } from "./usePrinter-CRp5IW3v.js";
+import { t as ae } from "./usePrinter-DnGzpp6Q.js";
 import { n as oe, t as se } from "./BaseScanner-DZvpgOjM.js";
 import { t as ce } from "./useSvgExport-SVIsDot8.js";
-import { t as c } from "./useNestedProp-BEo2N1Db.js";
+import { t as c } from "./useNestedProp-D8XqxgOU.js";
 import { t as le } from "./useThemeCheck-C43Tcqmk.js";
-import { t as ue } from "./img-B_y5qDdm.js";
-import { n as de } from "./Title-C-p0ilWB.js";
+import { t as ue } from "./img-B_abIg0o.js";
+import { n as de } from "./Title-PiTKr6sp.js";
 import { t as fe } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { c as pe } from "./canvas-lib-BOP_HS11.js";
 import { t as me } from "./useResponsive-BfnK0KxU.js";
 import { t as he } from "./useUserOptionState-DK-_1ddE.js";
 import { t as ge } from "./useChartAccessibility-DYqac8yF.js";
-import { t as _e } from "./Legend-D-635Kag.js";
+import { t as _e } from "./Legend-kAr7Vqqu.js";
 import { t as ve } from "./vue_ui_bullet-ClzdLoOv.js";
 import { Fragment as l, Teleport as ye, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createSlots as be, createVNode as xe, defineAsyncComponent as h, guardReactiveProps as g, nextTick as Se, normalizeClass as Ce, normalizeProps as _, normalizeStyle as v, onBeforeUnmount as we, onMounted as Te, openBlock as y, ref as b, renderList as x, renderSlot as S, toDisplayString as C, toRefs as Ee, unref as w, watch as De, withCtx as T } from "vue";
 //#region src/components/vue-ui-bullet.vue
@@ -103,7 +103,7 @@ var Oe = /* @__PURE__ */ e({ default: () => E }), ke = ["id"], Ae = {
 	},
 	emits: ["copyAlt"],
 	setup(e, { expose: fe, emit: Oe }) {
-		let E = h(() => import("./PackageVersion-Da7hl-34.js").then((e) => e.t)), Xe = h(() => import("./PenAndPaper-Bk2-E7V4.js").then((e) => e.t)), Ze = h(() => import("./UserOptions-BO4VFL8O.js").then((e) => e.n)), { vue_ui_bullet: Qe } = ie(), { isThemeValid: $e, warnInvalidTheme: et } = le(), D = e, tt = Oe, O = b(null), nt = b(null), rt = b(0), it = b(null), at = b(null), ot = b(0), k = b(null), A = b(null), st = b(!1), j = b(!1), M = b(!1), N = u({
+		let E = h(() => import("./PackageVersion-Dse0n05o.js").then((e) => e.t)), Xe = h(() => import("./PenAndPaper-gaV1QPpP.js").then((e) => e.t)), Ze = h(() => import("./UserOptions-BL9VlHop.js").then((e) => e.n)), { vue_ui_bullet: Qe } = ie(), { isThemeValid: $e, warnInvalidTheme: et } = le(), D = e, tt = Oe, O = b(null), nt = b(null), rt = b(0), it = b(null), at = b(null), ot = b(0), k = b(null), A = b(null), st = b(!1), j = b(!1), M = b(!1), N = u({
 			get: () => z.value.hasOwnProperty("value"),
 			set: (e) => e
 		}), P = u(() => z.value.segments ? Array.isArray(z.value.segments) ? z.value.segments.length ? !0 : (console.warn("VueUiBullet: dataset segments is empty. Provide segments with this datastructure:\n\nsegments: [\n    {\n        name: string;\n        from: number;\n        to: number;\n        color?: string;\n    },\n    {...}\n]\n        "), N.value = !1, !1) : (console.warn("VueUiBullet: dataset segments must be an array of objects with this datastructure:\n\nsegments: [\n    {\n        name: string;\n        from: number;\n        to: number;\n        color?: string;\n    },\n    {...}\n] \n        "), N.value = !1, !1) : (console.warn("VueUiBullet: dataset segments is empty. Provide segments with this datastructure:\n\nsegments: [\n    {\n        name: string;\n        from: number;\n        to: number;\n        color?: string;\n    },\n    {...}\n]\n        "), N.value = !1, !1)), ct = u(() => !!L.value.debug), lt = u(() => {
@@ -116,12 +116,12 @@ var Oe = /* @__PURE__ */ e({ default: () => E }), ke = ["id"], Ae = {
 			};
 		});
 		function ut() {
-			if (t(z.value) ? (n({
+			if (n(z.value) ? (r({
 				componentName: "VueUiBullet",
 				type: "dataset",
 				debug: ct.value
 			}), B.value = !0) : P.value ? z.value.segments.forEach((e, t) => {
-				te({
+				re({
 					datasetObject: e,
 					requiredAttributes: [
 						"name",
@@ -129,7 +129,7 @@ var Oe = /* @__PURE__ */ e({ default: () => E }), ke = ["id"], Ae = {
 						"to"
 					]
 				}).forEach((e) => {
-					N.value = !1, n({
+					N.value = !1, r({
 						componentName: "VueUiBullet segment",
 						type: "datasetSerieAttribute",
 						property: e,
@@ -137,7 +137,7 @@ var Oe = /* @__PURE__ */ e({ default: () => E }), ke = ["id"], Ae = {
 						debug: ct.value
 					});
 				});
-			}) : (N.value = !1, B.value = !0), t(z.value) || (B.value = L.value.loading), L.value.responsive) {
+			}) : (N.value = !1, B.value = !0), n(z.value) || (B.value = L.value.loading), L.value.responsive) {
 				let e = pe(() => {
 					let { width: e, height: t } = me({
 						chart: O.value,
@@ -157,7 +157,7 @@ var Oe = /* @__PURE__ */ e({ default: () => E }), ke = ["id"], Ae = {
 		Te(() => {
 			st.value = !0, ut();
 		});
-		let F = b(r());
+		let F = b(a());
 		function I() {
 			let e = c({
 				userConfig: D.config,
@@ -174,7 +174,7 @@ var Oe = /* @__PURE__ */ e({ default: () => E }), ke = ["id"], Ae = {
 				defaultConfig: n
 			});
 		}
-		let L = b(I()), dt = u(() => L.value.userOptions.useCursorPointer), ft = u(() => i({
+		let L = b(I()), dt = u(() => L.value.userOptions.useCursorPointer), ft = u(() => t({
 			defaultConfig: {
 				userOptions: { show: !1 },
 				style: { chart: {
@@ -215,7 +215,7 @@ var Oe = /* @__PURE__ */ e({ default: () => E }), ke = ["id"], Ae = {
 					}
 				]
 			},
-			skeletonConfig: i({
+			skeletonConfig: t({
 				defaultConfig: L.value,
 				userConfig: ft.value
 			})
@@ -241,7 +241,7 @@ var Oe = /* @__PURE__ */ e({ default: () => E }), ke = ["id"], Ae = {
 		}), _t = u(() => {
 			if (!P.value) return [];
 			let e = [];
-			for (let t = 0; t < z.value.segments.length; t += 1) e.push(re(L.value.style.chart.segments.baseColor, t / z.value.segments.length));
+			for (let t = 0; t < z.value.segments.length; t += 1) e.push(i(L.value.style.chart.segments.baseColor, t / z.value.segments.length));
 			return e;
 		}), G = u(() => P.value ? {
 			min: Math.min(...z.value.segments.map((e) => e.from)),
@@ -269,7 +269,7 @@ var Oe = /* @__PURE__ */ e({ default: () => E }), ke = ["id"], Ae = {
 		});
 		let q = u(() => {
 			if (!P.value) return [];
-			let e = ee(G.value.min, G.value.max, L.value.style.chart.segments.ticks.divisions), t = e.min >= 0 ? 0 : Math.abs(e.min);
+			let e = te(G.value.min, G.value.max, L.value.style.chart.segments.ticks.divisions), t = e.min >= 0 ? 0 : Math.abs(e.min);
 			return {
 				scale: e,
 				target: { x: W.value.left + (z.value.target + t) / (e.max + t) * W.value.chartWidth - L.value.style.chart.target.width / 2 },
@@ -281,7 +281,7 @@ var Oe = /* @__PURE__ */ e({ default: () => E }), ke = ["id"], Ae = {
 				})),
 				chunks: z.value.segments.map((n, r) => ({
 					...n,
-					color: n.color ? a(n.color) : _t.value[r],
+					color: n.color ? ee(n.color) : _t.value[r],
 					x: W.value.left + W.value.chartWidth * ((n.from + t) / (e.max + t)),
 					y: W.value.top,
 					height: W.value.chartHeight,