vue-chrts 0.2.5-test.1 → 0.2.5-test.3

package/dist/components/AreaChart/AreaChart.js

@@ -1,13 +1,13 @@
-import { defineComponent as M, useSlots as U, useTemplateRef as j, ref as w, computed as d, createElementBlock as m, openBlock as o, normalizeClass as R, normalizeStyle as h, createVNode as u, createCommentVNode as c, createElementVNode as X, unref as i, withCtx as z, createBlock as y, Fragment as x, renderList as Y, mergeProps as p, renderSlot as L } from "vue";
-import { Position as C, CurveType as D } from "@unovis/ts";
-import { createMarkers as I, getFirstPropertyValue as H } from "../../utils.js";
-import K from "../Tooltip.js";
-import { VisXYContainer as q, VisTooltip as J, VisArea as Q, VisLine as Z, VisAxis as A, VisCrosshair as _, VisBulletLegend as ee } from "@unovis/vue";
-import { LegendPosition as te } from "../../types.js";
-const ie = {
+import { defineComponent as W, useSlots as x, useTemplateRef as E, ref as M, computed as u, createElementBlock as c, openBlock as s, normalizeClass as w, normalizeStyle as g, createVNode as m, createCommentVNode as d, createElementVNode as X, unref as a, withCtx as z, createBlock as y, Fragment as v, renderList as R, mergeProps as h, renderSlot as T } from "vue";
+import { Position as L, CurveType as C } from "@unovis/ts";
+import { createMarkers as Y, getFirstPropertyValue as U } from "../../utils.js";
+import H from "../Tooltip.js";
+import { VisXYContainer as q, VisTooltip as J, VisArea as K, VisLine as Q, VisAxis as A, VisCrosshair as Z, VisBulletLegend as I } from "@unovis/vue";
+import { LegendPosition as _ } from "../../types.js";
+const ee = {
   ref: "slotWrapper",
   style: { display: "none" }
-}, f = 24, b = 4, ne = 0.5, B = "#3b82f6", de = /* @__PURE__ */ M({
+}, ie = 0.5, $ = "#3b82f6", se = /* @__PURE__ */ W({
   __name: "AreaChart",
   props: {
     data: {},
@@ -20,15 +20,20 @@ const ie = {
     xFormatter: {},
     yFormatter: {},
     curveType: {},
+    hideArea: { type: Boolean, default: !1 },
+    gradientStops: { default: () => [
+      { offset: "0%", stopOpacity: 1 },
+      { offset: "75%", stopOpacity: 0 }
+    ] },
     lineWidth: { default: 2 },
     lineDashArray: {},
-    xNumTicks: { default: (e) => e.data.length > f ? f / b : e.data.length - 1 },
+    xNumTicks: {},
     xExplicitTicks: {},
     minMaxTicksOnly: { type: Boolean },
-    yNumTicks: { default: (e) => e.data.length > f ? f / b : e.data.length - 1 },
+    yNumTicks: {},
     hideLegend: { type: Boolean, default: !1 },
     hideTooltip: { type: Boolean },
-    legendPosition: { default: te.BottomCenter },
+    legendPosition: { default: _.BottomCenter },
     legendStyle: { default: void 0 },
     xDomainLine: { type: Boolean },
     yDomainLine: { type: Boolean },
@@ -45,79 +50,97 @@ const ie = {
     xDomain: {}
   },
   emits: ["click"],
-  setup(e, { emit: V }) {
-    const F = V, n = e, $ = U(), T = j("slotWrapper"), s = w(), g = d(
-      () => Object.values(n.categories).map((l) => l.color)
-    ), G = d(() => n.markerConfig ? I(n.markerConfig) : ""), O = d(() => n.legendPosition.startsWith("top")), N = d(() => n.legendPosition.includes("left") ? "flex-start" : n.legendPosition.includes("right") ? "flex-end" : "center"), P = d(() => {
-      const l = (t, a) => `
-    <linearGradient id="gradient${t}-${a}" gradientTransform="rotate(90)">
-      <stop offset="0%" stop-color="${a}" stop-opacity="1" />
-      <stop offset="100%" stop-color="${a}" stop-opacity="0" />
+  setup(D, { emit: b }) {
+    const B = b, t = D, O = x(), k = E("slotWrapper"), p = M(), f = u(() => {
+      const e = Object.values(t.categories).map(
+        (n, i) => `var(--vis-color${i})`
+      );
+      return Object.values(t.categories).map(
+        (n, i) => n.color ?? e[i]
+      );
+    }), V = u(() => t.markerConfig ? Y(t.markerConfig) : ""), F = u(() => t.legendPosition.startsWith("top")), G = u(() => t.legendPosition.includes("left") ? "flex-start" : t.legendPosition.includes("right") ? "flex-end" : "center"), P = u(() => {
+      const e = (i, o) => {
+        var r;
+        return `
+    <linearGradient id="gradient${i}-${o}" gradientTransform="rotate(90)">
+      ${((r = t.gradientStops) == null ? void 0 : r.map(
+          (l) => `<stop offset="${l.offset}" stop-color="${o}" stop-opacity="${l.stopOpacity}" />`
+        ).join("")) ?? ""}
+      <stop offset="100%" stop-color="${o}" stop-opacity="0" />
     </linearGradient>
-  `, r = (t, a) => `
-    <linearGradient id="gradient${t}-${a}" gradientTransform="rotate(90)">
-      <stop offset="0%" style="stop-color:var(--vis-color0);stop-opacity:1" />
-      <stop offset="100%" style="stop-color:var(--vis-color0);stop-opacity:0" />
+  `;
+      }, n = (i, o) => {
+        var r;
+        return `
+    <linearGradient id="gradient${i}-${o}" gradientTransform="rotate(90)">
+
+    ${((r = t.gradientStops) == null ? void 0 : r.map(
+          (l) => `
+      <stop offset="${l.offset}" style="stop-color:var(${o});stop-opacity:${l.stopOpacity}" />
+    `
+        ).join("")) ?? ""}
     </linearGradient>
   `;
-      return g.value.map(
-        (t, a) => t != null && t.includes("#") ? l(a, t) : r(a, t ?? B)
+      };
+      return f.value.map(
+        (i, o) => i != null && i.includes("#") ? e(o, i) : n(o, i ?? $)
       ).join("");
     });
-    function E(l) {
-      var r;
+    function S(e) {
+      var n;
       return {
-        y: (t) => Number(t[l]),
-        color: ((r = n.categories[l]) == null ? void 0 : r.color) ?? B
+        y: (i) => Number(i[e]),
+        color: ((n = t.categories[e]) == null ? void 0 : n.color) ?? $
       };
     }
-    function W(l) {
-      return typeof window > "u" ? "" : T.value ? T.value.innerHTML : "";
+    function j(e) {
+      return typeof window > "u" ? "" : k.value ? k.value.innerHTML : "";
     }
-    function S(l) {
-      return s.value = l, W();
+    function N(e) {
+      return p.value = e, j();
     }
-    return (l, r) => (o(), m("div", {
-      style: h({
+    return (e, n) => (s(), c("div", {
+      style: g({
         display: "flex",
-        flexDirection: O.value ? "column-reverse" : "column",
+        flexDirection: F.value ? "column-reverse" : "column",
         gap: "var(--vis-legend-spacing)"
       }),
-      class: R({ markers: !!n.markerConfig }),
-      onClick: r[0] || (r[0] = (t) => F("click", t, s.value))
+      class: w({ markers: !!t.markerConfig }),
+      onClick: n[0] || (n[0] = (i) => B("click", i, p.value))
     }, [
-      u(i(q), {
+      m(a(q), {
         data: e.data,
         height: e.height,
         padding: e.padding,
-        "svg-defs": P.value + G.value,
+        "svg-defs": P.value + V.value,
         "y-domain": e.yDomain,
         "x-domain": e.xDomain
       }, {
         default: z(() => [
-          e.hideTooltip ? c("", !0) : (o(), y(i(J), {
+          e.hideTooltip ? d("", !0) : (s(), y(a(J), {
             key: 0,
-            "horizontal-placement": i(C).Right,
-            "vertical-placement": i(C).Top
+            "horizontal-placement": a(L).Right,
+            "vertical-placement": a(L).Top
           }, null, 8, ["horizontal-placement", "vertical-placement"])),
-          (o(!0), m(x, null, Y(Object.keys(n.categories), (t, a) => (o(), m(x, { key: t }, [
-            u(i(Q), p({
-              x: (k, v) => v
-            }, { ref_for: !0 }, E(t), {
-              color: `url(#gradient${a}-${g.value[a]})`,
-              opacity: ne,
-              "curve-type": e.curveType ?? i(D).MonotoneX
-            }), null, 16, ["x", "color", "curve-type"]),
-            u(i(Z), {
-              x: (k, v) => v,
-              y: (k) => k[t],
-              color: g.value[a],
-              "curve-type": e.curveType ?? i(D).MonotoneX,
+          (s(!0), c(v, null, R(Object.keys(t.categories), (i, o) => (s(), c(v, { key: i }, [
+            m(a(K), h({
+              x: (r, l) => l,
+              ref_for: !0
+            }, S(i), {
+              color: `url(#gradient${o}-${f.value[o]})`,
+              opacity: e.hideArea ? 0 : ie,
+              "curve-type": e.curveType ?? a(C).MonotoneX
+            }), null, 16, ["x", "color", "opacity", "curve-type"]),
+            m(a(Q), {
+              x: (r, l) => l,
+              y: (r) => r[i],
+              color: f.value[o],
+              "curve-type": e.curveType ?? a(C).MonotoneX,
               "line-width": e.lineWidth,
-              lineDashArray: e.lineDashArray ? e.lineDashArray[a] : void 0
+              lineDashArray: e.lineDashArray ? e.lineDashArray[o] : void 0
             }, null, 8, ["x", "y", "color", "curve-type", "line-width", "lineDashArray"])
           ], 64))), 128)),
-          e.hideXAxis ? c("", !0) : (o(), y(i(A), {
+          e.hideXAxis ? d("", !0) : (s(), y(a(A), {
             key: 1,
             type: "x",
             label: e.xLabel,
@@ -130,7 +153,7 @@ const ie = {
             "tick-line": e.xTickLine,
             "min-max-ticks-only": e.minMaxTicksOnly
           }, null, 8, ["label", "num-ticks", "tick-format", "tick-values", "grid-line", "domain-line", "tick-line", "min-max-ticks-only"])),
-          e.hideYAxis ? c("", !0) : (o(), y(i(A), {
+          e.hideYAxis ? d("", !0) : (s(), y(a(A), {
             key: 2,
             type: "y",
             label: e.yLabel,
@@ -140,41 +163,44 @@ const ie = {
             "domain-line": e.yDomainLine,
             "tick-line": e.yTickLine
           }, null, 8, ["label", "num-ticks", "tick-format", "grid-line", "domain-line", "tick-line"])),
-          e.hideTooltip ? c("", !0) : (o(), y(i(_), p({ key: 3 }, e.crosshairConfig, { template: S }), null, 16))
+          e.hideTooltip ? d("", !0) : (s(), y(a(Z), h({ key: 3 }, e.crosshairConfig, { template: N }), null, 16))
         ]),
         _: 1
       }, 8, ["data", "height", "padding", "svg-defs", "y-domain", "x-domain"]),
-      n.hideLegend ? c("", !0) : (o(), m("div", {
+      t.hideLegend ? d("", !0) : (s(), c("div", {
         key: 0,
-        style: h({
+        style: g({
           display: "flex",
-          justifyContent: N.value
+          justifyContent: G.value
         })
       }, [
-        u(i(ee), {
-          style: h([
-            n.legendStyle,
+        m(a(I), {
+          style: g([
+            t.legendStyle,
             "display: flex; gap: var(--vis-legend-spacing);"
           ]),
-          items: Object.values(n.categories)
+          items: Object.values(t.categories).map((i) => ({
+            ...i,
+            color: Array.isArray(i.color) ? i.color[0] : i.color
+          }))
         }, null, 8, ["style", "items"])
       ], 4)),
-      X("div", ie, [
-        i($).tooltip ? L(l.$slots, "tooltip", {
+      X("div", ee, [
+        a(O).tooltip ? T(e.$slots, "tooltip", {
           key: 0,
-          values: s.value
-        }) : s.value ? L(l.$slots, "fallback", { key: 1 }, () => [
-          u(K, {
-            data: s.value,
+          values: p.value
+        }) : p.value ? T(e.$slots, "fallback", { key: 1 }, () => [
+          m(H, {
+            data: p.value,
             categories: e.categories,
-            toolTipTitle: i(H)(s.value) ?? "",
-            yFormatter: n.yFormatter
+            toolTipTitle: a(U)(p.value) ?? "",
+            yFormatter: t.yFormatter
           }, null, 8, ["data", "categories", "toolTipTitle", "yFormatter"])
-        ]) : c("", !0)
+        ]) : d("", !0)
       ], 512)
     ], 6));
   }
 });
 export {
-  de as default
+  se as default
 };

package/dist/components/AreaChart/types.d.ts

@@ -57,6 +57,17 @@ export interface AreaChartProps<T> {
      * See `CurveType` for available options.
      */
     curveType?: CurveType;
+    /**
+     * If `true`, hides the area fill, displaying only the line.
+     */
+    hideArea?: boolean;
+    /**
+     * Edit the gradient stops for the area fill.
+     */
+    gradientStops?: Array<{
+        offset: string;
+        stopOpacity: number;
+    }>;
     /**
      * The width of the line in pixels. Default is 2px.
      */

package/dist/components/BarChart/BarChart.js

@@ -1,14 +1,14 @@
-import { defineComponent as W, useSlots as X, useTemplateRef as Y, ref as j, computed as k, createElementBlock as v, openBlock as l, normalizeStyle as L, createVNode as b, createCommentVNode as f, createElementVNode as H, unref as a, withCtx as $, createBlock as c, Fragment as q, renderList as I, renderSlot as C } from "vue";
-import { Orientation as g, StackedBar as U, GroupedBar as J } from "@unovis/ts";
+import { defineComponent as W, useSlots as X, useTemplateRef as Y, ref as j, computed as f, createElementBlock as v, openBlock as n, normalizeStyle as L, createVNode as k, createCommentVNode as y, createElementVNode as H, unref as i, withCtx as $, createBlock as u, Fragment as q, renderList as I, renderSlot as P } from "vue";
+import { Orientation as p, StackedBar as U, GroupedBar as J } from "@unovis/ts";
 import { getFirstPropertyValue as K } from "../../utils.js";
 import { useStackedGrouped as Q } from "./stackedGroupedUtils.js";
-import { VisXYContainer as Z, VisXYLabels as _, VisTooltip as ee, VisStackedBar as F, VisGroupedBar as te, VisAxis as V, VisBulletLegend as ae } from "@unovis/vue";
-import ie from "../Tooltip.js";
-import { LegendPosition as ne } from "../../types.js";
-const oe = {
+import { VisXYContainer as Z, VisXYLabels as _, VisTooltip as ee, VisStackedBar as C, VisGroupedBar as ae, VisAxis as F, VisBulletLegend as ie } from "@unovis/vue";
+import oe from "../Tooltip.js";
+import { LegendPosition as re } from "../../types.js";
+const te = {
   ref: "slotWrapper",
   style: { display: "none" }
-}, ye = /* @__PURE__ */ W({
+}, ge = /* @__PURE__ */ W({
   __name: "BarChart",
   props: {
     data: {},
@@ -35,8 +35,8 @@ const oe = {
     radius: {},
     hideLegend: { type: Boolean, default: !1 },
     hideTooltip: { type: Boolean, default: !1 },
-    orientation: { default: g.Vertical },
-    legendPosition: { default: ne.BottomCenter },
+    orientation: { default: p.Vertical },
+    legendPosition: { default: re.BottomCenter },
     legendStyle: { default: void 0 },
     xDomainLine: { type: Boolean },
     yDomainLine: { type: Boolean },
@@ -52,111 +52,111 @@ const oe = {
     xAxis: {}
   },
   emits: ["click"],
-  setup(e, { emit: G }) {
-    const S = G, t = e, O = X(), h = Y("slotWrapper"), u = j();
-    if (t.valueLabel && !t.xAxis)
+  setup(V, { emit: G }) {
+    const S = G, a = V, O = X(), h = Y("slotWrapper"), s = j();
+    if (a.valueLabel && !a.xAxis)
       throw new Error(
         "BarChart: 'xAxis' prop is required when 'valueLabel' is enabled. Please provide an 'xAxis' to display value labels."
       );
-    if (!t.yAxis || t.yAxis.length === 0)
+    if (!a.yAxis || a.yAxis.length === 0)
       throw new Error("yAxis is required");
-    const A = k(() => t.yAxis.map((i) => (o) => o[i])), B = (i, o) => {
-      var n;
-      return (n = Object.values(t.categories)[o]) == null ? void 0 : n.color;
-    }, y = k(
+    const x = f(() => a.yAxis.map((e) => (r) => r[e])), A = (e, r) => {
+      var o;
+      return (o = Object.values(a.categories)[r]) == null ? void 0 : o.color;
+    }, c = f(
       () => Q({
-        data: t.data,
-        categories: t.categories,
-        stackAndGrouped: t.stackAndGrouped,
-        xAxis: t.xAxis,
-        spacing: t.stackedGroupedSpacing
+        data: a.data,
+        categories: a.categories,
+        stackAndGrouped: a.stackAndGrouped,
+        xAxis: a.xAxis,
+        spacing: a.stackedGroupedSpacing
       }).value
-    ), w = k(() => t.legendPosition.startsWith("top")), D = k(() => t.legendPosition.includes("left") ? "flex-start" : t.legendPosition.includes("right") ? "flex-end" : "center");
-    function T(i) {
-      return u.value = i, E();
+    ), w = f(() => a.legendPosition.startsWith("top")), D = f(() => a.legendPosition.includes("left") ? "flex-start" : a.legendPosition.includes("right") ? "flex-end" : "center");
+    function B(e) {
+      return s.value = e, E();
     }
-    function E(i) {
+    function E(e) {
       return typeof window > "u" ? "" : h.value ? h.value.innerHTML : "";
     }
-    const P = t.yAxis.map((i) => (o) => o[i]), N = P.length, z = t.data.flatMap(
-      (i, o) => P.map((n, s) => ({
-        x: o,
-        y: Number(n(i) ?? 0),
-        itemIndex: s
+    const T = a.yAxis.map((e) => (r) => r[e]), N = T.length, z = a.data.flatMap(
+      (e, r) => T.map((o, d) => ({
+        x: r,
+        y: Number(o(e) ?? 0),
+        itemIndex: d
       }))
-    ), M = (i) => {
-      if (t.stacked || t.stackAndGrouped) return i.x;
-      const o = N;
-      if (o <= 1) return i.x;
-      const s = 1 - (t.groupPadding ?? 0), m = s / o, x = -s / 2, r = m * i.itemIndex + m / 2, p = 1 - (t.barPadding ?? 0), R = (x + r) * p;
-      return i.x + R;
+    ), M = (e) => {
+      if (a.stacked || a.stackAndGrouped) return e.x;
+      const r = N;
+      if (r <= 1) return e.x;
+      const d = 1 - (a.groupPadding ?? 0), g = d / r, m = -d / 2, t = g * e.itemIndex + g / 2, b = 1 - (a.barPadding ?? 0), R = (m + t) * b;
+      return e.x + R;
     };
-    return (i, o) => (l(), v("div", {
+    return (e, r) => (n(), v("div", {
       style: L({
         display: "flex",
         flexDirection: w.value ? "column-reverse" : "column",
         gap: "var(--vis-legend-spacing)"
       }),
-      onClick: o[0] || (o[0] = (n) => S("click", n, u.value))
+      onClick: r[0] || (r[0] = (o) => S("click", o, s.value))
     }, [
-      b(a(Z), {
+      k(i(Z), {
         padding: e.padding,
         height: e.height
       }, {
         default: $(() => {
-          var n, s, m, x;
+          var o, d, g, m;
           return [
-            e.valueLabel ? (l(), c(a(_), {
+            e.valueLabel ? (n(), u(i(_), {
               key: 0,
-              data: a(z),
+              data: i(z),
               x: M,
-              y: (r) => {
-                var d;
-                return r.y + (((d = t.valueLabel) == null ? void 0 : d.labelSpacing) ?? 0);
+              y: (t) => {
+                var l;
+                return t.y + (((l = a.valueLabel) == null ? void 0 : l.labelSpacing) ?? 0);
               },
-              label: (n = t.valueLabel) == null ? void 0 : n.label,
-              backgroundColor: ((s = t.valueLabel) == null ? void 0 : s.backgroundColor) ?? "transparent",
-              color: ((m = t.valueLabel) == null ? void 0 : m.color) ?? "red",
-              labelFontSize: (x = t.valueLabel) == null ? void 0 : x.labelFontSize
-            }, null, 8, ["data", "y", "label", "backgroundColor", "color", "labelFontSize"])) : f("", !0),
-            b(a(ee), {
+              label: (o = a.valueLabel) == null ? void 0 : o.label,
+              backgroundColor: ((d = a.valueLabel) == null ? void 0 : d.backgroundColor) ?? "transparent",
+              color: ((g = a.valueLabel) == null ? void 0 : g.color) ?? "red",
+              labelFontSize: (m = a.valueLabel) == null ? void 0 : m.labelFontSize
+            }, null, 8, ["data", "y", "label", "backgroundColor", "color", "labelFontSize"])) : y("", !0),
+            k(i(ee), {
               triggers: {
-                [a(J).selectors.bar]: T,
-                [a(U).selectors.bar]: T
+                [i(J).selectors.bar]: B,
+                [i(U).selectors.bar]: B
               }
             }, null, 8, ["triggers"]),
-            e.stackAndGrouped ? (l(!0), v(q, { key: 1 }, I(y.value.states, (r) => (l(), c(a(F), {
-              key: r,
-              data: y.value.chartData,
-              x: (d, p) => p + y.value.positions[r],
-              y: y.value.bars[r],
-              color: y.value.colorFunctions[r],
+            e.stackAndGrouped ? (n(!0), v(q, { key: 1 }, I(c.value.states, (t) => (n(), u(i(C), {
+              key: t,
+              data: c.value.chartData,
+              x: (l, b) => b + c.value.positions[t],
+              y: c.value.bars[t],
+              color: c.value.colorFunctions[t],
               "rounded-corners": e.radius ?? 0,
               "group-padding": e.groupPadding ?? 0,
               "bar-padding": e.barPadding,
-              orientation: e.orientation ?? a(g).Vertical
-            }, null, 8, ["data", "x", "y", "color", "rounded-corners", "group-padding", "bar-padding", "orientation"]))), 128)) : e.stacked ? (l(), c(a(F), {
+              orientation: e.orientation ?? i(p).Vertical
+            }, null, 8, ["data", "x", "y", "color", "rounded-corners", "group-padding", "bar-padding", "orientation"]))), 128)) : e.stacked ? (n(), u(i(C), {
               key: 3,
               data: e.data,
-              x: (r, d) => d,
-              y: A.value,
-              color: B,
+              x: (t, l) => l,
+              y: x.value,
+              color: A,
               "rounded-corners": e.radius ?? 0,
               "group-padding": e.groupPadding ?? 0,
               "bar-padding": e.barPadding ?? 0.2,
-              orientation: e.orientation ?? a(g).Vertical
-            }, null, 8, ["data", "x", "y", "rounded-corners", "group-padding", "bar-padding", "orientation"])) : (l(), c(a(te), {
+              orientation: e.orientation ?? i(p).Vertical
+            }, null, 8, ["data", "x", "y", "rounded-corners", "group-padding", "bar-padding", "orientation"])) : (n(), u(i(ae), {
               key: 2,
               data: e.data,
-              x: (r, d) => d,
-              y: A.value,
-              color: B,
+              x: (t, l) => l,
+              y: x.value,
+              color: A,
               "rounded-corners": e.radius ?? 0,
               "group-padding": e.groupPadding ?? 0,
               "bar-padding": e.barPadding ?? 0.2,
-              orientation: e.orientation ?? a(g).Vertical
+              orientation: e.orientation ?? i(p).Vertical
             }, null, 8, ["data", "x", "y", "rounded-corners", "group-padding", "bar-padding", "orientation"])),
-            e.hideXAxis ? f("", !0) : (l(), c(a(V), {
+            e.hideXAxis ? y("", !0) : (n(), u(i(F), {
               key: 4,
               type: "x",
               "tick-format": e.xFormatter,
@@ -168,11 +168,11 @@ const oe = {
               "tick-values": e.xExplicitTicks,
               minMaxTicksOnly: e.minMaxTicksOnly
             }, null, 8, ["tick-format", "label", "grid-line", "domain-line", "tick-line", "num-ticks", "tick-values", "minMaxTicksOnly"])),
-            e.hideYAxis ? f("", !0) : (l(), c(a(V), {
+            e.hideYAxis ? y("", !0) : (n(), u(i(F), {
               key: 5,
               type: "y",
               label: e.yLabel,
-              "grid-line": e.orientation !== a(g).Horizontal && e.yGridLine,
+              "grid-line": e.orientation !== i(p).Horizontal && e.yGridLine,
               "domain-line": !!e.yDomainLine,
               "tick-format": e.yFormatter,
               "num-ticks": e.yNumTicks,
@@ -182,40 +182,40 @@ const oe = {
         }),
         _: 1
       }, 8, ["padding", "height"]),
-      t.hideLegend ? f("", !0) : (l(), v("div", {
+      a.hideLegend ? y("", !0) : (n(), v("div", {
         key: 0,
         style: L({
           display: "flex",
           justifyContent: D.value
         })
       }, [
-        b(a(ae), {
+        k(i(ie), {
           style: L([
-            t.legendStyle,
+            a.legendStyle,
             "display: flex; gap: var(--vis-legend-spacing);"
           ]),
-          items: Object.values(t.categories).map((n) => ({
-            ...n,
-            color: Array.isArray(n.color) ? n.color[0] : n.color
+          items: Object.values(a.categories).map((o) => ({
+            ...o,
+            color: Array.isArray(o.color) ? o.color[0] : o.color
           }))
         }, null, 8, ["style", "items"])
       ], 4)),
-      H("div", oe, [
-        a(O).tooltip ? C(i.$slots, "tooltip", {
+      H("div", te, [
+        i(O).tooltip ? P(e.$slots, "tooltip", {
           key: 0,
-          values: u.value
-        }) : u.value ? C(i.$slots, "fallback", { key: 1 }, () => [
-          b(ie, {
-            data: u.value,
-            categories: t.categories,
-            toolTipTitle: a(K)(u.value) ?? "",
-            yFormatter: t.orientation === a(g).Horizontal ? t.xFormatter : t.yFormatter
+          values: s.value
+        }) : s.value ? P(e.$slots, "fallback", { key: 1 }, () => [
+          k(oe, {
+            data: s.value,
+            categories: a.categories,
+            toolTipTitle: i(K)(s.value) ?? "",
+            yFormatter: a.orientation === i(p).Horizontal ? a.xFormatter : a.yFormatter
           }, null, 8, ["data", "categories", "toolTipTitle", "yFormatter"])
-        ]) : f("", !0)
+        ]) : y("", !0)
       ], 512)
     ], 4));
   }
 });
 export {
-  ye as default
+  ge as default
 };