@primeui/vue-chart 0.0.1-alpha.1 → 1.0.0-beta.1

package/dist/{chunk-4CRHCZV3.mjs → chunks/chunk-CMJXLIEY.mjs}

@@ -1,8 +1,118 @@
-import { useCartesianFrame, useLineRenderer, useCartesianFrameRegistration } from './chunk-CQHNYT2V.mjs';
-import { useChartMethods, useChartState, useChartHover } from './chunk-HANSF33Z.mjs';
-import { defineComponent, computed, h, unref, openBlock, createElementBlock, createCommentVNode } from 'vue';
-import { resolvePointLabels } from '@primeui/chart-core';
+import { useControllerLifecycle } from './chunk-KNNYJD4D.mjs';
+import { useCartesianFrame, useCartesianFrameRegistration } from './chunk-I2BWSDNR.mjs';
+import { useChartMethods, useChartState, useChartHover } from './chunk-QOWKMWNO.mjs';
+import { defineComponent, computed, h, unref, openBlock, createElementBlock, createCommentVNode, ref, shallowRef, watch } from 'vue';
+import { resolvePointLabels, safeRenderProp } from '@primeui/chart-core';
+import { createLineRendererCanvas } from '@primeui/chart-core/series/line/controller-canvas';
+import { createLineRendererSvg } from '@primeui/chart-core/series/line/controller-svg';
 
+function useLineRenderer(options) {
+  const {
+    chartArea,
+    renderer,
+    canvasEl,
+    datasets,
+    datasetVisibility,
+    hover,
+    hoverConfig,
+    chartId,
+    width,
+    height,
+    categoryScale,
+    valueScales,
+    firstValueAxisId,
+    axisIdProp,
+    orientation,
+    lineStackBasesMap,
+    lineTransformedValues,
+    rangeGroups,
+    features,
+    compositor,
+    layoutData,
+    dir,
+    theme
+  } = options;
+  const groupRef = ref(null);
+  const controller = renderer === "canvas" ? createLineRendererCanvas() : createLineRendererSvg();
+  const layoutCacheRef = shallowRef(/* @__PURE__ */ new Map());
+  const liveLayoutsRef = shallowRef(controller.renderedLayouts);
+  const renderPropsCacheRef = shallowRef(/* @__PURE__ */ new Map());
+  const markerOverlaysRef = ref([]);
+  controller.onFrame = () => {
+    markerOverlaysRef.value = controller.markerOverlays;
+    liveLayoutsRef.value = controller.renderedLayouts;
+  };
+  watch(
+    [datasets, datasetVisibility, chartArea, categoryScale, valueScales, firstValueAxisId, axisIdProp, lineStackBasesMap, lineTransformedValues, rangeGroups, features, groupRef, width, height, dir, theme],
+    () => {
+      if (renderer === "svg" && !groupRef.value) return;
+      controller.update({
+        datasets: datasets.value,
+        datasetVisibility: datasetVisibility.value,
+        chartArea: chartArea.value,
+        chartId,
+        width: width.value,
+        height: height.value,
+        renderer,
+        categoryScale: categoryScale.value,
+        valueXScales: layoutData?.value?.valueXScales,
+        valueScales: valueScales.value,
+        firstValueAxisId: firstValueAxisId.value,
+        axisIdProp: axisIdProp.value,
+        orientation: orientation?.value,
+        lineStackBasesMap: lineStackBasesMap.value,
+        lineTransformedValues: lineTransformedValues.value,
+        groupedDataOverride: layoutData?.value?.groupedDataOverride,
+        layoutData: layoutData?.value ?? null,
+        rangeGroups: rangeGroups.value,
+        features: features.value,
+        hover: hover.value,
+        hoverConfig: hoverConfig.value,
+        compositor,
+        canvasEl: canvasEl.value,
+        svgGroup: groupRef.value,
+        labelConfig: options.labelConfig?.value,
+        dir: dir.value,
+        theme: theme.value
+      });
+      layoutCacheRef.value = controller.layouts;
+      liveLayoutsRef.value = controller.renderedLayouts;
+      renderPropsCacheRef.value = controller.renderProps;
+      markerOverlaysRef.value = controller.markerOverlays;
+    },
+    { immediate: true, flush: "post" }
+  );
+  watch(hover, () => {
+    controller.applyHover(hover.value);
+  });
+  const { applyPropertyAnimations, renderFrameCycle } = useControllerLifecycle(controller);
+  function hitTest(x, y) {
+    return controller.hitTest(x, y);
+  }
+  function findAllNearest(x, y) {
+    return controller.findAllNearest(x, y);
+  }
+  function syncWithAnimatedScale(categoryScale2, valueScales2) {
+    controller.syncWithAnimatedScale(categoryScale2, valueScales2);
+    markerOverlaysRef.value = controller.markerOverlays;
+    liveLayoutsRef.value = controller.renderedLayouts;
+  }
+  return {
+    groupRef,
+    hitTest,
+    findAllNearest,
+    lineLayouts: layoutCacheRef,
+    liveLayouts: liveLayoutsRef,
+    lineRenderProps: renderPropsCacheRef,
+    subscribeTipPositions: (cb) => controller.subscribeTipPositions(cb),
+    markerOverlays: markerOverlaysRef,
+    syncWithAnimatedScale,
+    applyPropertyAnimations,
+    renderFrameCycle
+  };
+}
+
+// src/components/renderers/layers/LineLayer.vue
 var _hoisted_1 = ["clip-path"];
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LineLayer",
@@ -27,6 +137,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       valueScales: computed(() => frame.layoutData.value?.valueScales),
       firstValueAxisId: computed(() => frame.layoutData.value?.valueScales?.keys().next().value ?? "default"),
       axisIdProp: computed(() => frame.layoutData.value?.orientation === "horizontal" ? "xAxisId" : "yAxisId"),
+      orientation: computed(() => frame.layoutData.value?.orientation ?? "vertical"),
       lineStackBasesMap: computed(() => frame.layoutData.value?.lineStackBasesMap),
       lineTransformedValues: computed(() => frame.layoutData.value?.lineTransformedValues),
       rangeGroups: computed(() => frame.layoutData.value?.rangeGroups),
@@ -42,14 +153,14 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       if (methods.renderer !== "svg" || !frame.layoutData.value || !lc?.render) return [];
       const visibility = state.value.datasetVisibility;
       const nodes = [];
-      for (const [dsId, lineLayout] of line.lineLayouts.value) {
+      for (const [dsId, lineLayout] of line.liveLayouts.value) {
         if (visibility?.get(dsId) === false) continue;
         const lineProps = line.lineRenderProps.value.get(dsId);
         const seriesColor = typeof lineProps?.color === "string" ? lineProps.color : typeof lineLayout.lineColor === "string" ? lineLayout.lineColor : lc.color ?? "";
         const dsTotal = lineLayout.visiblePoints.reduce((sum, pt) => sum + Math.abs(pt.value ?? 0), 0);
         const resolved = resolvePointLabels(lineLayout.visiblePoints, seriesColor, dsTotal, lc, lineProps?.name);
         for (const lbl of resolved) {
-          const result = lc.render({
+          const result = safeRenderProp(() => lc.render({
             index: lbl.dataIndex,
             value: lbl.value,
             percentage: lbl.percentage,
@@ -58,7 +169,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
             color: lbl.color,
             x: lbl.x,
             y: lbl.y
-          });
+          }), "data label");
           if (result != null) {
             nodes.push(h("g", {
               key: `line-${dsId}-${lbl.dataIndex}`,
@@ -98,7 +209,12 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
           snapX: lnHit.x,
           snapY: lnHit.y,
           formattedValue: fmtVal,
-          cursorFormattedValue: ""
+          cursorFormattedValue: "",
+          independentIsCategory: lnHit.independentIsCategory,
+          xValue: lnHit.xValue,
+          yValue: lnHit.yValue,
+          xAxisTitle: lnHit.xAxisTitle,
+          yAxisTitle: lnHit.yAxisTitle
         };
       },
       findAllNearest: (x, y) => line.findAllNearest(x, y),
@@ -126,7 +242,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       }
     });
     return (_ctx, _cache) => {
-      return unref(methods).renderer === "svg" && unref(line).hasLineData.value ? (openBlock(), createElementBlock("g", {
+      return unref(methods).renderer === "svg" ? (openBlock(), createElementBlock("g", {
         key: 0,
         ref: (el) => {
           unref(line).groupRef.value = el;

package/dist/{chunk-42J32DPD.mjs → chunks/chunk-CRIB3I3L.mjs}

@@ -1,4 +1,4 @@
-import { useChartMethods } from './chunk-HANSF33Z.mjs';
+import { useChartMethods } from './chunk-QOWKMWNO.mjs';
 import { defineComponent, computed, onMounted, watch, onUnmounted } from 'vue';
 
 var referenceLineIdCounter = 0;

package/dist/{chunk-WKSQR6L5.mjs → chunks/chunk-CW2KYVYO.mjs}

@@ -1,9 +1,9 @@
-import { CandlestickLayer_default } from './chunk-FFBK7Q3W.mjs';
-import { CartesianRenderer_default } from './chunk-HTZVV6VV.mjs';
-import { registerFamilyRenderer, registerChartLayer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-CQHNYT2V.mjs';
-import { useRendererHint, useChartMethods } from './chunk-HANSF33Z.mjs';
+import { CandlestickLayer_default } from './chunk-YI3GLQYF.mjs';
+import { CartesianRenderer_default } from './chunk-YZQS2YBK.mjs';
+import { registerFamilyRenderer, registerChartLayer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-I2BWSDNR.mjs';
+import { useRendererHint, useChartMethods } from './chunk-QOWKMWNO.mjs';
 import { defineComponent, useSlots, computed, onMounted, watch, onUnmounted, renderSlot, createCommentVNode } from 'vue';
-import { candlestickRenderer } from '@primeui/chart-core';
+import { candlestickRenderer } from '@primeui/chart-core/series/candlestick';
 
 var candlestickIdCounter = 0;
 var _sfc_main = /* @__PURE__ */ defineComponent({
@@ -12,10 +12,28 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     id: {},
     name: {},
     data: {},
-    timeField: { type: [
+    categoryXField: { type: [
+      String,
+      Function,
+      Array
+    ] },
+    categoryYField: { type: [
+      String,
+      Function,
+      Array
+    ] },
+    valueXField: { type: [
+      String,
+      Function,
+      Number,
+      null,
+      Array
+    ] },
+    valueYField: { type: [
       String,
       Function,
       Number,
+      null,
       Array
     ] },
     openField: { type: [
@@ -136,7 +154,10 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       const datasetProps = computed(() => ({
         id: autoId,
         data: props.data,
-        timeField: props.timeField,
+        categoryXField: props.categoryXField,
+        categoryYField: props.categoryYField,
+        valueXField: props.valueXField,
+        valueYField: props.valueYField,
         openField: props.openField,
         highField: props.highField,
         lowField: props.lowField,
@@ -172,10 +193,12 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     if (hasChildren.value) {
       let buildSynthesizedProps2 = function() {
         const items = getItems();
+        const horizontal = items.some((it) => it.categoryY != null);
+        const axisBinding = horizontal ? { categoryYField: (ctx) => ctx.datum.categoryY ?? "" } : { categoryXField: (ctx) => ctx.datum.categoryX ?? "" };
         return {
           id: autoId,
           data: items,
-          timeField: (ctx) => ctx.datum.time ?? ctx.datum.label ?? "",
+          ...axisBinding,
           openField: (ctx) => ctx.datum.open ?? 0,
           highField: (ctx) => ctx.datum.high ?? 0,
           lowField: (ctx) => ctx.datum.low ?? 0,

package/dist/{chunk-644ROAHU.mjs → chunks/chunk-DDRSIMLE.mjs}

@@ -1,10 +1,10 @@
-import { CartesianRenderer_default } from './chunk-HTZVV6VV.mjs';
-import { LineLayer_default } from './chunk-4CRHCZV3.mjs';
-import { registerFamilyRenderer, registerChartLayer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-CQHNYT2V.mjs';
-import { STACKED_CONTEXT_KEY, RANGE_CONTEXT_KEY } from './chunk-TEOO4OLV.mjs';
-import { useRendererHint, useChartMethods } from './chunk-HANSF33Z.mjs';
+import { CartesianRenderer_default } from './chunk-YZQS2YBK.mjs';
+import { LineLayer_default } from './chunk-CMJXLIEY.mjs';
+import { registerFamilyRenderer, registerChartLayer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-I2BWSDNR.mjs';
+import { STACKED_CONTEXT_KEY, RANGE_CONTEXT_KEY } from './chunk-L6N5IYAJ.mjs';
+import { useRendererHint, useChartMethods } from './chunk-QOWKMWNO.mjs';
 import { defineComponent, useSlots, computed, inject, onMounted, watch, onUnmounted, renderSlot, createCommentVNode } from 'vue';
-import { lineRenderer } from '@primeui/chart-core';
+import { lineRenderer } from '@primeui/chart-core/series/line';
 
 var lineIdCounter = 0;
 var _sfc_main = /* @__PURE__ */ defineComponent({
@@ -13,12 +13,24 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     id: {},
     boost: { type: [Boolean, String] },
     data: {},
-    categoryField: { type: [
+    categoryXField: { type: [
       String,
       Function,
       Array
     ] },
-    valueField: { type: [
+    categoryYField: { type: [
+      String,
+      Function,
+      Array
+    ] },
+    valueXField: { type: [
+      String,
+      Function,
+      Number,
+      null,
+      Array
+    ] },
+    valueYField: { type: [
       String,
       Function,
       Number,
@@ -193,8 +205,10 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         const p = {
           id: autoId,
           data: props.data,
-          categoryField: props.categoryField,
-          valueField: props.valueField,
+          categoryXField: props.categoryXField,
+          categoryYField: props.categoryYField,
+          valueXField: props.valueXField,
+          valueYField: props.valueYField,
           color: props.color,
           name: props.name,
           order: effectiveOrder,
@@ -254,11 +268,18 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     if (hasChildren.value) {
       let buildSynthesizedProps2 = function() {
         const items = getItems();
+        const horizontal = items.some((it) => it.categoryY != null);
+        const axisBinding = horizontal ? {
+          categoryYField: (ctx) => ctx.datum.categoryY ?? "",
+          valueXField: (ctx) => ctx.datum.valueX
+        } : {
+          categoryXField: (ctx) => ctx.datum.categoryX ?? "",
+          valueYField: (ctx) => ctx.datum.valueY
+        };
         return {
           id: autoId,
           data: items,
-          categoryField: (ctx) => ctx.datum.label ?? "",
-          valueField: (ctx) => ctx.datum.value,
+          ...axisBinding,
           pointColors: items.some((i) => i.color != null) ? items.map((i) => i.color) : void 0,
           name: props.name,
           color: props.color,

package/dist/{chunk-32XIRBZ7.mjs → chunks/chunk-DXKAPWMO.mjs}

@@ -1,5 +1,5 @@
-import { AXIS_GROUP_REGISTRY_KEY } from './chunk-5SRBQVU5.mjs';
-import { useAxisComponentBase } from './chunk-CQHNYT2V.mjs';
+import { AXIS_GROUP_REGISTRY_KEY } from './chunk-EHSDNH7K.mjs';
+import { useAxisComponentBase } from './chunk-I2BWSDNR.mjs';
 import { defineComponent, useSlots, computed, provide, renderSlot } from 'vue';
 
 var __default__ = { inheritAttrs: false };

package/dist/{chunk-372K2BMN.mjs → chunks/chunk-EKGCPOZJ.mjs}

@@ -1,11 +1,11 @@
-import { LegendRenderer_default } from './chunk-5FTUGKPC.mjs';
-import { ColorLegendRenderer_default } from './chunk-E4ROAOPT.mjs';
-import { TooltipRenderer_default } from './chunk-GX2MK6VT.mjs';
-import { useResponsiveDimensions, useAnimationProps, useDrilldownState, useResponsiveConfig, provideFamilyRenderers, provideChartLayers, useZoomPan, useKeyboardNavigation, useChartSync, useChartContext, useChartSyncCoordinator } from './chunk-CQHNYT2V.mjs';
-import { NavigatorRenderer_default } from './chunk-NLXOJSKK.mjs';
-import { provideChartContext } from './chunk-HANSF33Z.mjs';
-import { CHART_SYNC_INFO_KEY } from './chunk-LD57I4SY.mjs';
-import { TOOLTIP_CONTEXT_KEY } from './chunk-FZ3PZ66C.mjs';
+import { LegendRenderer_default } from './chunk-TRGN3ZMM.mjs';
+import { ColorLegendRenderer_default } from './chunk-S4YR4YK7.mjs';
+import { TooltipRenderer_default } from './chunk-36DHPBYP.mjs';
+import { useResponsiveDimensions, useAnimationProps, useDrilldownState, useResponsiveConfig, provideFamilyRenderers, provideChartLayers, useZoomPan, useKeyboardNavigation, useChartSync, useChartContext, useChartSyncCoordinator } from './chunk-I2BWSDNR.mjs';
+import { NavigatorRenderer_default } from './chunk-GLFXRR7N.mjs';
+import { provideChartContext } from './chunk-QOWKMWNO.mjs';
+import { CHART_SYNC_INFO_KEY } from './chunk-H4HLHGUW.mjs';
+import { TOOLTIP_CONTEXT_KEY } from './chunk-4Q3QUNX6.mjs';
 import { defineComponent, computed, ref, onMounted, watch, onBeforeUnmount, toRef, shallowRef, provide, nextTick, openBlock, createElementBlock, normalizeStyle, normalizeClass, createElementVNode, toDisplayString, createCommentVNode, renderSlot, unref, createBlock, resolveDynamicComponent, withCtx, createTextVNode, Fragment, renderList, withModifiers } from 'vue';
 import { resolveTheme, ChartStateController, buildChartDataTable, themeToCssVars, configureCanvasHiDPI, computeCrosshairLayout, buildAnnotationContext, DEFAULT_FONT_FAMILY, renderAnnotationsCanvas, resolveDirFromElement, observeDocumentDir } from '@primeui/chart-core';
 import { verifyLicense } from '@primeui/license-manager';
@@ -224,10 +224,13 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     locale: {},
     animation: { type: [Object, Boolean] },
     animations: {},
-    transitions: {},
     renderer: {}
   },
-  emits: ["resize"],
+  emits: [
+    "resize",
+    "point-click",
+    "point-hover"
+  ],
   setup(__props, { expose: __expose, emit: __emit }) {
     const VNodeRenderer = defineComponent({
       props: { node: {
@@ -312,8 +315,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     });
     useAnimationProps(() => ({
       animation: props.animation,
-      animations: props.animations,
-      transitions: props.transitions
+      animations: props.animations
     }), methods);
     const containerRef = ref(null);
     const mainCanvasRef = ref(null);
@@ -588,11 +590,38 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         processMouseMove(evt);
       });
     }
+    function resolvePointEvent(hit) {
+      const index = hit.index ?? 0;
+      const data = state.value.datasets.get(hit.datasetId)?.props?.data;
+      return {
+        datasetId: hit.datasetId,
+        index,
+        label: hit.label ?? "",
+        value: hit.value ?? 0,
+        color: hit.color ?? "",
+        datum: data?.[index]
+      };
+    }
+    function hitForPointEvent(x, y) {
+      try {
+        return rendererDelegate.value?.hitTest(x, y) ?? null;
+      } catch {
+        return null;
+      }
+    }
+    let _lastHoverKey = null;
     function processMouseMove(e) {
       if (zoomIsDragging.value) return;
       const rect = containerRef.value?.getBoundingClientRect();
       if (!rect) return;
-      coreMouseMove(e.clientX - rect.left, e.clientY - rect.top);
+      const x = e.clientX - rect.left;
+      const y = e.clientY - rect.top;
+      coreMouseMove(x, y);
+      const hit = hitForPointEvent(x, y);
+      const key = hit ? `${hit.datasetId}:${hit.index}` : null;
+      if (key === _lastHoverKey) return;
+      _lastHoverKey = key;
+      emit("point-hover", hit ? resolvePointEvent(hit) : null);
     }
     function handleMouseMoveWithKeyboard(e) {
       keyboardNav.onMouseMove();
@@ -614,12 +643,20 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     }
     function handleMouseLeave() {
       coreMouseLeave();
+      if (_lastHoverKey !== null) {
+        _lastHoverKey = null;
+        emit("point-hover", null);
+      }
     }
     function handleClick(e) {
-      if (!hoverConfig.value && !isRect.value && !drilldownState.enabled.value) return;
       const rect = containerRef.value?.getBoundingClientRect();
       if (!rect) return;
-      coreClick(e.clientX - rect.left, e.clientY - rect.top);
+      const x = e.clientX - rect.left;
+      const y = e.clientY - rect.top;
+      const hit = hitForPointEvent(x, y);
+      if (hit) emit("point-click", resolvePointEvent(hit));
+      if (!hoverConfig.value && !isRect.value && !drilldownState.enabled.value) return;
+      coreClick(x, y);
     }
     function handleLegendClick(item) {
       coreLegendClick(item);
@@ -994,6 +1031,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
               height: unref(height),
               "canvas-el": mainCanvasRef.value,
               "zoom-state": unref(zoomState),
+              "is-dragging": unref(zoomIsDragging),
               "adaptive-data-label-font-size": unref(adaptive).dataLabelFontSize,
               "adaptive-data-label-rotation": unref(adaptive).dataLabelRotation,
               "rule-overrides": unref(ruleOverrides)
@@ -1003,6 +1041,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
               "height",
               "canvas-el",
               "zoom-state",
+              "is-dragging",
               "adaptive-data-label-font-size",
               "adaptive-data-label-rotation",
               "rule-overrides"
@@ -1142,6 +1181,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
             "canvas-el": mainCanvasRef.value,
             "overlay-canvas-el": overlayCanvasRef.value,
             "zoom-state": unref(zoomState),
+            "is-dragging": unref(zoomIsDragging),
             "adaptive-data-label-font-size": unref(adaptive).dataLabelFontSize,
             "adaptive-data-label-rotation": unref(adaptive).dataLabelRotation,
             "rule-overrides": unref(ruleOverrides)
@@ -1152,6 +1192,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
             "canvas-el",
             "overlay-canvas-el",
             "zoom-state",
+            "is-dragging",
             "adaptive-data-label-font-size",
             "adaptive-data-label-rotation",
             "rule-overrides"

package/dist/{chunk-E2U4W5FW.mjs → chunks/chunk-F7EK5D6J.mjs}

@@ -1,8 +1,8 @@
-import { RadarLayer_default } from './chunk-DOOXGOOB.mjs';
-import { RadialRenderer_default } from './chunk-4NJ2PSHV.mjs';
-import { registerFamilyRenderer, registerChartLayer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-CQHNYT2V.mjs';
-import { STACKED_CONTEXT_KEY } from './chunk-TEOO4OLV.mjs';
-import { useRendererHint, useChartMethods } from './chunk-HANSF33Z.mjs';
+import { RadarLayer_default } from './chunk-OJHEN5FG.mjs';
+import { RadialRenderer_default } from './chunk-5ZLVNQ2L.mjs';
+import { registerFamilyRenderer, registerChartLayer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-I2BWSDNR.mjs';
+import { STACKED_CONTEXT_KEY } from './chunk-L6N5IYAJ.mjs';
+import { useRendererHint, useChartMethods } from './chunk-QOWKMWNO.mjs';
 import { defineComponent, useSlots, computed, inject, onMounted, watch, onUnmounted, renderSlot, createCommentVNode } from 'vue';
 
 var radarIdCounter = 0;
@@ -11,12 +11,12 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   props: {
     id: {},
     data: {},
-    categoryField: { type: [
+    categoryXField: { type: [
       String,
       Function,
       Array
     ] },
-    valueField: { type: [
+    valueYField: { type: [
       String,
       Function,
       Number,
@@ -158,8 +158,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       const datasetProps = computed(() => ({
         id: autoId,
         data: props.data,
-        categoryField: props.categoryField,
-        valueField: props.valueField,
+        categoryXField: props.categoryXField,
+        valueYField: props.valueYField,
         color: props.color,
         name: props.name,
         fillOpacity: props.fillOpacity,
@@ -204,8 +204,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         return {
           id: autoId,
           data: getItems(),
-          categoryField: (ctx) => ctx.datum.label ?? "",
-          valueField: (ctx) => ctx.datum.value,
+          categoryXField: (ctx) => ctx.datum.categoryX ?? "",
+          valueYField: (ctx) => ctx.datum.valueY,
           name: props.name,
           color: props.color,
           fillOpacity: props.fillOpacity,

package/dist/{chunk-ZHFL3RYO.mjs → chunks/chunk-GE2Y2FHS.mjs}

@@ -1,8 +1,8 @@
-import { PieLayer_default } from './chunk-UO27BCRL.mjs';
-import { RadialRenderer_default } from './chunk-4NJ2PSHV.mjs';
-import { registerFamilyRenderer, registerChartLayer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-CQHNYT2V.mjs';
-import { STACKED_CONTEXT_KEY } from './chunk-TEOO4OLV.mjs';
-import { useRendererHint, useChartMethods } from './chunk-HANSF33Z.mjs';
+import { PieLayer_default } from './chunk-3XOLEGDL.mjs';
+import { RadialRenderer_default } from './chunk-5ZLVNQ2L.mjs';
+import { registerFamilyRenderer, registerChartLayer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-I2BWSDNR.mjs';
+import { STACKED_CONTEXT_KEY } from './chunk-L6N5IYAJ.mjs';
+import { useRendererHint, useChartMethods } from './chunk-QOWKMWNO.mjs';
 import { defineComponent, useSlots, computed, useId, inject, onMounted, watch, onUnmounted, renderSlot, createCommentVNode } from 'vue';
 import { resolveAccessor } from '@primeui/chart-core';
 
@@ -146,7 +146,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
           id: autoId,
           data: items,
           valueField: (ctx) => ctx.datum.value,
-          categoryField: (ctx) => ctx.datum.label ?? "",
+          categoryField: (ctx) => ctx.datum.category ?? "",
           color: ((ctx) => ctx.datum.color ?? resolveAccessor(props.color, ctx)),
           // Pie-level props pass through
           innerRadius: props.innerRadius,

package/dist/{chunk-AAX7FOW3.mjs → chunks/chunk-GIDIMIWE.mjs}

@@ -1,8 +1,8 @@
-import { PolarLayer_default } from './chunk-JKK3D33U.mjs';
-import { RadialRenderer_default } from './chunk-4NJ2PSHV.mjs';
-import { registerFamilyRenderer, registerChartLayer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-CQHNYT2V.mjs';
-import { STACKED_CONTEXT_KEY } from './chunk-TEOO4OLV.mjs';
-import { useRendererHint, useChartMethods } from './chunk-HANSF33Z.mjs';
+import { PolarLayer_default } from './chunk-ADAGGXFG.mjs';
+import { RadialRenderer_default } from './chunk-5ZLVNQ2L.mjs';
+import { registerFamilyRenderer, registerChartLayer, useDatasetAnimationRegistration, useDatasetRegistration, useItemCollector } from './chunk-I2BWSDNR.mjs';
+import { STACKED_CONTEXT_KEY } from './chunk-L6N5IYAJ.mjs';
+import { useRendererHint, useChartMethods } from './chunk-QOWKMWNO.mjs';
 import { defineComponent, useSlots, computed, inject, onMounted, watch, onUnmounted, renderSlot, createCommentVNode } from 'vue';
 import { resolveAccessor } from '@primeui/chart-core';
 
@@ -12,12 +12,12 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   props: {
     id: {},
     data: {},
-    categoryField: { type: [
+    categoryXField: { type: [
       String,
       Function,
       Array
     ] },
-    valueField: { type: [
+    valueYField: { type: [
       String,
       Function,
       Number,
@@ -118,8 +118,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       const datasetProps = computed(() => ({
         id: autoId,
         data: props.data,
-        categoryField: props.categoryField,
-        valueField: props.valueField,
+        categoryXField: props.categoryXField,
+        valueYField: props.valueYField,
         color: props.color,
         name: props.name,
         order: effectiveOrder,
@@ -150,8 +150,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         return {
           id: autoId,
           data: getItems(),
-          categoryField: (ctx) => ctx.datum.label ?? "",
-          valueField: (ctx) => ctx.datum.value,
+          categoryXField: (ctx) => ctx.datum.categoryX ?? "",
+          valueYField: (ctx) => ctx.datum.valueY,
           color: ((ctx) => ctx.datum.color ?? resolveAccessor(props.color, ctx)),
           name: props.name,
           innerRadius: props.innerRadius,