@primeui/chart-core 0.0.1-alpha.1 → 1.0.0-rc.1

package/dist/{chunk-ILUWFYGY.mjs → chunks/chunk-FNMLVZOA.mjs}

@@ -1,9 +1,9 @@
-import { MARKER_SHAPE_NAMES, renderMarkerShapeSvg } from './chunk-PRDVPOZX.mjs';
-import { formatPointDescription } from './chunk-OGJ6IIBW.mjs';
-import { DEFAULT_HOVER_POINT_RADIUS_MULTIPLIER, DEFAULT_LINE_MARKER_SIZE } from './chunk-NKUYIWAP.mjs';
-import { createSvgGradientFromColor, makeItemContext, resolveDash, resolveAccessor, getPrimaryColor } from './chunk-O2X6FF45.mjs';
-import { createSvgPathBuilder, traceClosedSpline } from './chunk-IEGLX7VL.mjs';
-import { createSvgGroup, setAttr, adjustBrightness, createSvgDefs, appendChild, prependChild, svgClass, createSvgPath, svgNode } from './chunk-SSLTFJ3U.mjs';
+import { MARKER_SHAPE_NAMES, renderMarkerShapeSvg } from './chunk-QIYJUZ7I.mjs';
+import { formatPointDescription } from './chunk-IFJPDARC.mjs';
+import { DEFAULT_HOVER_POINT_RADIUS_MULTIPLIER, DEFAULT_LINE_MARKER_SIZE } from './chunk-6LUIVTNV.mjs';
+import { createSvgGradientFromColor, makeItemContext, resolveDash, resolveAccessor, getPrimaryColor } from './chunk-BDCNBS6W.mjs';
+import { createSvgPathBuilder, traceClosedSpline } from './chunk-PXUXZADY.mjs';
+import { createSvgGroup, setAttr, adjustBrightness, createSvgDefs, appendChild, prependChild, svgClass, createSvgPath, svgNode } from './chunk-BF7RP4A3.mjs';
 
 // src/series/radar/shared.ts
 function buildSmoothPath(points) {
@@ -53,7 +53,7 @@ function renderRadarSeriesSvg(layout, seriesIndex, hoverState, theme, effectConf
   const isStacked = sd.basePoints && sd.basePoints.length > 0;
   const innerPathD = isStacked ? isSmooth ? buildSmoothPath([...sd.basePoints].reverse()) : buildPointsPathReversed(sd.basePoints) : "";
   const fillPathD = isStacked ? `${outerPathD} ${innerPathD}` : outerPathD;
-  const colorClassN = `p-chart-color-${sd.seriesIdx % 10}`;
+  const colorClassN = `p-chart-color-${sd.colorIndex % 14}`;
   const seriesIsHoveredJs = !isSharedHover && isSeriesHovered;
   let fillColor = sd.color;
   let strokeColor = sd.color;
@@ -81,7 +81,7 @@ function renderRadarSeriesSvg(layout, seriesIndex, hoverState, theme, effectConf
   const dashPattern = sd.lineDash ?? (sd.lineStyle === "dashed" ? [6, 4] : sd.lineStyle === "dotted" ? [2, 3] : null);
   if (dashPattern?.length) dashAttrs["stroke-dasharray"] = dashPattern.join(" ");
   const fillAreaCls = svgClass("p-chart-area", `p-chart-series-${sd.seriesIdx}`, fillValue === void 0 && colorClassN, seriesIsHoveredJs && "p-chart-point-hover", anyHover && !isSeriesHovered && "p-chart-series-inactive");
-  const themedSeriesColor = theme.series[sd.seriesIdx % theme.series.length];
+  const themedSeriesColor = theme.series[sd.colorIndex % theme.series.length];
   const areaEl = createSvgPath(fillPathD, {
     fill: fillValue ?? themedSeriesColor,
     "fill-opacity": sd.fillOpacity * seriesOpacity,

package/dist/{chunk-SXHVDJGF.mjs → chunks/chunk-FQAFGPW6.mjs}

@@ -1,7 +1,7 @@
-import { buildSvgArcPath } from './chunk-LVMDQ4OJ.mjs';
-import { formatPointDescription } from './chunk-OGJ6IIBW.mjs';
-import { createSvgGradientFromColor } from './chunk-O2X6FF45.mjs';
-import { createSvgGroup, createSvgDefs, appendChild, prependChild, setAttr, adjustBrightness, svgClass, createSvgPath } from './chunk-SSLTFJ3U.mjs';
+import { buildSvgArcPath } from './chunk-4S3FOFCN.mjs';
+import { formatPointDescription } from './chunk-IFJPDARC.mjs';
+import { createSvgGradientFromColor } from './chunk-BDCNBS6W.mjs';
+import { createSvgGroup, createSvgDefs, appendChild, prependChild, setAttr, adjustBrightness, svgClass, createSvgPath } from './chunk-BF7RP4A3.mjs';
 
 // src/series/polar/svg/index.ts
 function renderPolarBarsSvg(layout, hoverState, effectConfig, theme, a11y) {
@@ -49,9 +49,9 @@ function renderPolarBarsSvg(layout, hoverState, effectConfig, theme, a11y) {
       },
       false
     );
-    const barCls = svgClass("p-chart-arc", `p-chart-series-${bar.seriesIdx}`, fillColor === void 0 && `p-chart-color-${bar.seriesIdx % 10}`, isHovered && "p-chart-point-hover", isInactive && "p-chart-point-inactive");
+    const barCls = svgClass("p-chart-arc", `p-chart-series-${bar.seriesIdx}`, fillColor === void 0 && `p-chart-color-${bar.colorIndex % 14}`, isHovered && "p-chart-point-hover", isInactive && "p-chart-point-inactive");
     const attrs = {
-      fill: fillColor ?? theme.series[bar.seriesIdx % theme.series.length],
+      fill: fillColor ?? theme.series[bar.colorIndex % theme.series.length],
       stroke: (isHovered ? bar.hoverBorderColor : void 0) ?? bar.borderColor ?? "none",
       "stroke-width": bar.borderStrokeWidth ?? 0,
       class: barCls

package/dist/{chunk-N3TIT3OH.mjs → chunks/chunk-FSPE3M5E.mjs}

@@ -1,19 +1,19 @@
-import { lineHitTest, lineFindAllNearest, computeStackBases } from './chunk-WFTX4AQJ.mjs';
-import { buildLinePath, buildStackedFillPath, buildFillPath, hitTestLine, calculateLineLayout, applyTipExtension, restoreTipExtension, buildRangeFillPath, buildDualRangeFillPaths } from './chunk-6HSEJLSR.mjs';
-import { collectLineMarkerOverlays } from './chunk-X4D7FKUS.mjs';
-import { registerDatasetLayers, triggerCompositorRepaint } from './chunk-Q6PPVIHU.mjs';
-import { resolvePointLabels } from './chunk-66T4MRC5.mjs';
-import { renderResolvedLabels } from './chunk-QQBXUDM4.mjs';
-import { AnimatedScene, resolveAnimatedProps, LINE_ANIMATABLE_PROPS } from './chunk-VN7CKCSE.mjs';
-import { reconcileSvgChildren } from './chunk-KP2TWD4Z.mjs';
-import { parseAnimationConfig } from './chunk-3WEMHXZI.mjs';
-import { cancelRaf, raf } from './chunk-EDAKJLNA.mjs';
-import { buildAccessibilityRenderContext, generateSeriesDescription } from './chunk-OGJ6IIBW.mjs';
-import { collectItems } from './chunk-FFMT6OCO.mjs';
-import { DEFAULT_HOVER_DIM_OPACITY, DEFAULT_HOVER_BRIGHTNESS, DEFAULT_FALLBACK_COLOR } from './chunk-NKUYIWAP.mjs';
-import { streamingPointsInterpolator, buildLineFingerprint, detectStreamingUpdateKind } from './chunk-XQQCGFYB.mjs';
-import { getDefaultColor, isGradientColor, createCanvasGradientFromColor, createSvgGradientFromColor } from './chunk-O2X6FF45.mjs';
-import { createSvgDefs, appendChild, createSvgPath, setAttr, createSvgGroup, materializeSvgNode } from './chunk-SSLTFJ3U.mjs';
+import { lineHitTest, lineFindAllNearest, computeStackBases } from './chunk-RKNL7UWZ.mjs';
+import { buildLinePath, buildStackedFillPath, buildFillPath, hitTestLine, calculateLineLayout, applyTipExtension, restoreTipExtension, buildRangeFillPath, buildDualRangeFillPaths } from './chunk-7I2SNJ2X.mjs';
+import { collectLineMarkerOverlays } from './chunk-UZWWYKL7.mjs';
+import { registerDatasetLayers, triggerCompositorRepaint } from './chunk-MT3OLVZC.mjs';
+import { renderResolvedLabels } from './chunk-G3DYNMWT.mjs';
+import { resolvePointLabels } from './chunk-7IKKWWRT.mjs';
+import { AnimatedScene, resolveAnimatedProps, LINE_ANIMATABLE_PROPS } from './chunk-JS47MSB2.mjs';
+import { reconcileSvgChildren } from './chunk-FWNWV3H7.mjs';
+import { parseAnimationConfig } from './chunk-LTQH3LQJ.mjs';
+import { cancelRaf, raf } from './chunk-5WFF272M.mjs';
+import { buildAccessibilityRenderContext, generateSeriesDescription } from './chunk-IFJPDARC.mjs';
+import { collectItems } from './chunk-FRVJH7ZG.mjs';
+import { DEFAULT_HOVER_DIM_OPACITY, DEFAULT_HOVER_BRIGHTNESS, DEFAULT_FALLBACK_COLOR } from './chunk-6LUIVTNV.mjs';
+import { buildColorIndexMap, getDefaultColor, isGradientColor, createCanvasGradientFromColor, createSvgGradientFromColor } from './chunk-BDCNBS6W.mjs';
+import { streamingPointsInterpolator, buildLineFingerprint, detectStreamingUpdateKind } from './chunk-EQLCJTM4.mjs';
+import { createSvgDefs, appendChild, createSvgPath, setAttr, createSvgGroup, materializeSvgNode } from './chunk-BF7RP4A3.mjs';
 
 // src/series/line/controller/helpers.ts
 function resolveLineAnimationPlan(layouts, animConfig, isInitial, lastFingerprint, sceneElementCount) {
@@ -21,7 +21,7 @@ function resolveLineAnimationPlan(layouts, animConfig, isInitial, lastFingerprin
   const { enabled: animEnabled, duration, easing } = parseAnimationConfig(animConfig);
   const limit = animConfig?.limit ?? 5e3;
   const fingerprint = buildLineFingerprint(layouts);
-  const phase = isInitial ? "entrance" : lastFingerprint !== "" && fingerprint !== lastFingerprint ? "update" : "static";
+  const phase = isInitial ? "entrance" : fingerprint !== lastFingerprint ? "update" : "static";
   let totalPoints = 0;
   for (const [, layout] of layouts) {
     totalPoints += layout.points.length;
@@ -211,7 +211,7 @@ function renderLinesFrame(params) {
         if (datasetVisibility?.get(lineLayout.datasetId) === false) continue;
         const props = renderPropsMap.get(lineLayout.datasetId);
         if (!props) continue;
-        const seriesColor = typeof lineLayout.lineColor === "string" ? lineLayout.lineColor : getDefaultColor(lineLayout.seriesIdx, context.theme);
+        const seriesColor = typeof lineLayout.lineColor === "string" ? lineLayout.lineColor : getDefaultColor(lineLayout.colorIndex, context.theme);
         const total = lineLayout.visiblePoints.reduce((sum, pt) => sum + (pt.value ?? 0), 0);
         const labels = resolvePointLabels(lineLayout.visiblePoints, seriesColor, total, labelConfig, props.name, props.data);
         renderResolvedLabels(labels, labelConfig, { renderer: "canvas", ctx, theme: context.theme });
@@ -254,8 +254,8 @@ function buildLineSvgChildren(params) {
       } else {
         const result = buildDualRangeFillPaths(layoutA.visiblePoints, layoutB.visiblePoints, curve, tension);
         if (result) {
-          const colorA = typeof layoutA.lineColor === "string" ? layoutA.lineColor : getDefaultColor(layoutA.seriesIdx, theme);
-          const colorB = typeof layoutB.lineColor === "string" ? layoutB.lineColor : getDefaultColor(layoutB.seriesIdx, theme);
+          const colorA = typeof layoutA.lineColor === "string" ? layoutA.lineColor : getDefaultColor(layoutA.colorIndex, theme);
+          const colorB = typeof layoutB.lineColor === "string" ? layoutB.lineColor : getDefaultColor(layoutB.colorIndex, theme);
           const opacity = rg.fillOpacity * dimOpacity;
           for (const d of result.abovePaths) children.push(createSvgPath(d, { fill: colorA, opacity }));
           for (const d of result.belowPaths) children.push(createSvgPath(d, { fill: colorB, opacity }));
@@ -291,7 +291,7 @@ function buildLineSvgChildren(params) {
     const labelGroup = createSvgGroup();
     for (const [, lineLayout] of layouts) {
       if (datasetVisibility?.get(lineLayout.datasetId) === false) continue;
-      const seriesColor = typeof lineLayout.lineColor === "string" ? lineLayout.lineColor : getDefaultColor(lineLayout.seriesIdx, context.theme);
+      const seriesColor = typeof lineLayout.lineColor === "string" ? lineLayout.lineColor : getDefaultColor(lineLayout.colorIndex, context.theme);
       const total = lineLayout.visiblePoints.reduce((sum, pt) => sum + (pt.value ?? 0), 0);
       const labels = resolvePointLabels(lineLayout.visiblePoints, seriesColor, total, labelConfig, renderPropsMap.get(lineLayout.datasetId)?.name, renderPropsMap.get(lineLayout.datasetId)?.data);
       renderResolvedLabels(labels, labelConfig, { renderer: "svg", svgGroup: labelGroup, theme: context.theme });
@@ -334,8 +334,8 @@ function renderRangeFillsCanvas(ctx, rangeGroups, layouts, renderPropsMap, chart
     } else {
       const result = buildDualRangeFillPaths(layoutA.visiblePoints, layoutB.visiblePoints, curve, tension);
       if (!result) continue;
-      const colorA = typeof layoutA.lineColor === "string" ? layoutA.lineColor : getDefaultColor(layoutA.seriesIdx, theme);
-      const colorB = typeof layoutB.lineColor === "string" ? layoutB.lineColor : getDefaultColor(layoutB.seriesIdx, theme);
+      const colorA = typeof layoutA.lineColor === "string" ? layoutA.lineColor : getDefaultColor(layoutA.colorIndex, theme);
+      const colorB = typeof layoutB.lineColor === "string" ? layoutB.lineColor : getDefaultColor(layoutB.colorIndex, theme);
       const opacity = rg.fillOpacity * dimOpacity;
       for (const d of result.abovePaths) fillPathCanvas(ctx, d, colorA, opacity);
       for (const d of result.belowPaths) fillPathCanvas(ctx, d, colorB, opacity);
@@ -419,7 +419,7 @@ function paintCanvasLayer(ctx, canvasCtx, dsId, rangeFirstDs, context) {
     const renderProps = props.renderMarker ? { ...props, showMarkers: false, interaction: { ...props.interaction, hoveredIndex: null } } : props;
     ctx._paint.renderCanvas(renderProps, layout, canvasCtx, context);
     if (input.labelConfig && input.datasetVisibility?.get(dsId) !== false) {
-      const seriesColor = typeof layout.lineColor === "string" ? layout.lineColor : getDefaultColor(layout.seriesIdx, input.theme);
+      const seriesColor = typeof layout.lineColor === "string" ? layout.lineColor : getDefaultColor(layout.colorIndex, input.theme);
       const total = layout.visiblePoints.reduce((sum, pt) => sum + (pt.value ?? 0), 0);
       const labels = resolvePointLabels(layout.visiblePoints, seriesColor, total, input.labelConfig, props.name, props.data);
       renderResolvedLabels(labels, input.labelConfig, { renderer: "canvas", ctx: canvasCtx, theme: input.theme });
@@ -492,11 +492,15 @@ function startSceneUpdateLoop(ctx, easing) {
 }
 function buildSceneTargets(ctx, visibleDatasets, renderPropsMap, input, explicitMode) {
   const targets = /* @__PURE__ */ new Map();
+  const colorIndexById = buildColorIndexMap(input.datasets);
   let anyTip = false;
   for (const ds of visibleDatasets) {
     const newValues = input.lineTransformedValues?.get(ds.id) ?? [];
     const axisId = ds.props[input.axisIdProp] ?? input.firstValueAxisId;
+    const valueScale = input.valueScales?.get(axisId) ?? input.valueXScales?.get(axisId);
+    const enterBaseline = valueScale ? valueScale.domain()[0] : 0;
     const stackOrder = input.datasets.get(ds.id)?.order ?? 0;
+    const colorIndex = colorIndexById.get(ds.id) ?? 0;
     const props = ds.props;
     const renderProps = renderPropsMap.get(ds.id) ?? props;
     let hint;
@@ -511,7 +515,9 @@ function buildSceneTargets(ctx, visibleDatasets, renderPropsMap, input, explicit
       geometry: { values: newValues, streamingHint: hint },
       datasetId: ds.id,
       axisId,
+      enterBaseline,
       stackOrder,
+      colorIndex,
       props,
       renderProps,
       isExiting: false
@@ -523,11 +529,10 @@ function renderSceneFrame(ctx) {
   const layouts = /* @__PURE__ */ new Map();
   if (!ctx.lastInput) return layouts;
   const input = ctx.lastInput;
-  if (!input.categoryScale || !input.valueScales || input.valueScales.size === 0) return layouts;
-  const elements = ctx._scene.getElements();
-  if (elements.length === 0) return layouts;
+  if (!input.categoryScale && (!input.valueXScales || input.valueXScales.size === 0) || !input.valueScales || input.valueScales.size === 0) return layouts;
+  if (ctx._scene.elementCount === 0) return layouts;
   const sharedValueScale = input.valueScales.values().next().value;
-  const orderedElements = [...elements].sort((a, b) => a.current.stackOrder - b.current.stackOrder);
+  const orderedElements = Array.from(ctx._scene.elementValues()).sort((a, b) => a.current.stackOrder - b.current.stackOrder);
   let categoryCount = 0;
   for (const el of orderedElements) {
     categoryCount = Math.max(categoryCount, el.current.geometry.values.length);
@@ -546,21 +551,24 @@ function renderSceneFrame(ctx) {
     const groupedData = input.groupedDataOverride?.get(state.datasetId);
     const propsForLayout = groupedData ? { ...state.props, data: groupedData } : state.props;
     const isStacked = state.props.stackId !== void 0;
+    const valueXScale = input.valueXScales?.get(state.props.xAxisId ?? "") ?? (input.valueXScales?.size === 1 ? input.valueXScales.values().next().value : void 0);
     const baseLayout = calculateLineLayout(propsForLayout, input.chartArea, {
       categoryScale: input.categoryScale,
+      valueXScale,
       valueScale: targetValueScale,
       stackBases: isStacked ? stackBasesMap.get(state.datasetId) : void 0,
       transformedValues: state.geometry.values,
-      seriesId: state.datasetId
+      seriesId: state.datasetId,
+      orientation: input.orientation
     });
-    layouts.set(state.datasetId, { ...baseLayout, datasetIndex: datasetIndex++ });
+    layouts.set(state.datasetId, { ...baseLayout, datasetIndex: datasetIndex++, colorIndex: state.colorIndex });
   }
   return layouts;
 }
 function updateRenderState(ctx) {
   const layouts = renderSceneFrame(ctx);
   const activeRenderProps = /* @__PURE__ */ new Map();
-  for (const el of ctx._scene.getElements()) {
+  for (const el of ctx._scene.elementValues()) {
     const baseProps = el.current.renderProps;
     const overrides = ctx._propertyOverrides.get(el.current.datasetId);
     const merged = overrides ? { ...baseProps, ...overrides } : baseProps;
@@ -689,18 +697,19 @@ var LineRendererController = class {
     this.onFrame = null;
     this._paint = paint;
     this._scene = new AnimatedScene({
-      // ENTER: lines enter from zeros at the same x positions.
-      // values=[] is intentional — the controller seeds the real "zeros" array
-      // at _buildSceneTargets time (it needs to know category count).
+      // ENTER: lines enter from the value-axis floor (`enterBaseline` = domain min)
+      // at the same x positions, so they slide up off the axis edge rather than
+      // emanating from the data-value-0 gridline (which sits mid-plot when the
+      // domain dips below zero).
       emptyState: (target) => ({
         ...target,
-        geometry: { values: target.geometry.values.map(() => 0), streamingHint: "update" },
+        geometry: { values: target.geometry.values.map(() => target.enterBaseline), streamingHint: "update" },
         isExiting: false
       }),
-      // EXIT: shrink to zeros at current x positions.
+      // EXIT: shrink to the same value-axis floor at current x positions.
       exitEmptyState: (target) => ({
         ...target,
-        geometry: { values: target.geometry.values.map(() => 0), streamingHint: "update" },
+        geometry: { values: target.geometry.values.map(() => target.enterBaseline), streamingHint: "update" },
         isExiting: true
       }),
       registry: LINE_REGISTRY
@@ -718,7 +727,7 @@ var LineRendererController = class {
     const sortedDatasets = Array.from(datasets.entries()).sort(([, a], [, b]) => a.order - b.order);
     this.lineDatasets = collectItems(sortedDatasets, datasetVisibility).line;
     let layoutResult = input.layoutResult ?? this.computeLayout(input);
-    if (!layoutResult && this._scene.getElements().length > 0 && input.categoryScale && input.valueScales && input.valueScales.size > 0) {
+    if (!layoutResult && this._scene.elementCount > 0 && input.categoryScale && input.valueScales && input.valueScales.size > 0) {
       layoutResult = { layouts: /* @__PURE__ */ new Map(), renderPropsMap: /* @__PURE__ */ new Map(), visibleDatasets: [] };
     }
     if (!layoutResult) {
@@ -732,6 +741,7 @@ var LineRendererController = class {
       this._lastFingerprint = "";
       this.tipProgress = 1;
       this.tipDuration = 0;
+      compositor?.removeLayersByPrefix("line:");
       if (input.renderer === "svg" && this.svgGroup) {
         while (this.svgGroup.firstChild) this.svgGroup.removeChild(this.svgGroup.firstChild);
       }
@@ -751,7 +761,7 @@ var LineRendererController = class {
       accessibility: buildAccessibilityRenderContext(features)
     };
     const animConfig = features.get("animation")?.props;
-    const { fingerprint, updateMode, phase, shouldAnimate, duration, easing } = resolveLineAnimationPlan(layouts, animConfig, this._isInitial, this._lastFingerprint, this._scene.getElements().length);
+    const { fingerprint, updateMode, phase, shouldAnimate, duration, easing } = resolveLineAnimationPlan(layouts, animConfig, this._isInitial, this._lastFingerprint, this._scene.elementCount);
     const { targets: sceneTargets, anyTip } = buildSceneTargets(this, visibleDatasets, renderPropsMap, input, updateMode);
     if (input.renderer === "canvas" && compositor) {
       compositor.removeLayersByPrefix?.("line:");
@@ -888,6 +898,15 @@ var LineRendererController = class {
   get layouts() {
     return this.layoutCache;
   }
+  /**
+   * Live animated point layouts — the geometry of the current rAF frame, falling back to
+   * the settled target layout when no frame has rendered yet. Per-frame consumers (e.g.
+   * custom SVG data-label VNodes) read this so their positions track the entrance/transition
+   * animation instead of snapping to the final layout, matching the canvas label path.
+   */
+  get renderedLayouts() {
+    return this.lastRenderedLayouts ?? this.layoutCache;
+  }
   get renderProps() {
     return this.renderPropsCache;
   }
@@ -977,27 +996,31 @@ var LineRendererController = class {
     startSceneUpdateLoop(this, easing);
   }
   computeLayout(input) {
-    const { categoryScale, valueScales, chartArea, axisIdProp, firstValueAxisId, lineStackBasesMap, lineTransformedValues, groupedDataOverride, hoverConfig } = input;
-    if (this.lineDatasets.length === 0 || !categoryScale || !valueScales || valueScales.size === 0) return null;
+    const { categoryScale, valueXScales, valueScales, chartArea, axisIdProp, firstValueAxisId, lineStackBasesMap, lineTransformedValues, groupedDataOverride, hoverConfig } = input;
+    if (this.lineDatasets.length === 0 || !categoryScale && (!valueXScales || valueXScales.size === 0) || !valueScales || valueScales.size === 0) return null;
     const visibleDatasets = this.lineDatasets.filter((d) => d.visible);
     if (visibleDatasets.length === 0) return null;
     const layouts = /* @__PURE__ */ new Map();
     const renderPropsMap = /* @__PURE__ */ new Map();
     const sharedValueScale = valueScales.values().next().value;
+    const colorIndexById = buildColorIndexMap(input.datasets);
     let datasetIndex = 0;
     for (const ld of visibleDatasets) {
       const targetAxisId = ld.props[axisIdProp] ?? firstValueAxisId;
       const targetValueScale = valueScales.get(targetAxisId) ?? sharedValueScale;
       const groupedData = groupedDataOverride?.get(ld.id);
       const propsForLayout = groupedData ? { ...ld.props, data: groupedData } : ld.props;
+      const valueXScale = valueXScales?.get(ld.props.xAxisId ?? "") ?? (valueXScales?.size === 1 ? valueXScales.values().next().value : void 0);
       const baseLayout = calculateLineLayout(propsForLayout, chartArea, {
         categoryScale,
+        valueXScale,
         valueScale: targetValueScale,
         stackBases: lineStackBasesMap?.get(ld.id),
         transformedValues: lineTransformedValues?.get(ld.id),
-        seriesId: ld.id
+        seriesId: ld.id,
+        orientation: input.orientation
       });
-      layouts.set(ld.id, { ...baseLayout, datasetIndex: datasetIndex++ });
+      layouts.set(ld.id, { ...baseLayout, datasetIndex: datasetIndex++, colorIndex: colorIndexById.get(ld.id) ?? 0 });
       const seriesHoverProps = ld.props;
       renderPropsMap.set(ld.id, {
         ...ld.props,

package/dist/{chunk-KNDZP446.mjs → chunks/chunk-FSWYYRPX.mjs}

@@ -1,8 +1,8 @@
-import { calculateAxisLayout } from './chunk-ZTL2FQEW.mjs';
-import { getEasing, easeOutQuart } from './chunk-3WEMHXZI.mjs';
-import { raf, cancelRaf } from './chunk-EDAKJLNA.mjs';
-import { interpolateCartesianAxisLayout } from './chunk-WH3C3Y7P.mjs';
-import { createLinearScale, createOrdinalTimeScale, createOrdinalTimeBandAdapter, createTimeScale, createTimeBandAdapter } from './chunk-RQ3CKQOX.mjs';
+import { calculateAxisLayout } from './chunk-AETETRB4.mjs';
+import { getEasing, easeOutQuart } from './chunk-LTQH3LQJ.mjs';
+import { raf, cancelRaf } from './chunk-5WFF272M.mjs';
+import { interpolateCartesianAxisLayout } from './chunk-CKQ4DNNJ.mjs';
+import { createLinearScale, createOrdinalTimeScale, createOrdinalTimeBandAdapter, createTimeScale, createTimeBandAdapter } from './chunk-K7AGQTVK.mjs';
 
 // src/animations/axis-transition.ts
 var AXIS_SMOOTHING = 0.225;

package/dist/{chunk-KP2TWD4Z.mjs → chunks/chunk-FWNWV3H7.mjs}

@@ -1,4 +1,4 @@
-import { materializeSvgNode } from './chunk-SSLTFJ3U.mjs';
+import { materializeSvgNode } from './chunk-BF7RP4A3.mjs';
 
 // src/utils/render/reconcile.ts
 var PROTECTED_ATTRS = /* @__PURE__ */ new Set(["style", "tabindex"]);

package/dist/{chunk-WCG35U6M.mjs → chunks/chunk-FYVMRQFF.mjs}

@@ -1,16 +1,17 @@
-import { isPointInSlice } from './chunk-LVMDQ4OJ.mjs';
-import { MARKER_SHAPE_NAMES, renderMarkerShapeSvg, drawMarkerCanvas } from './chunk-PRDVPOZX.mjs';
-import { calculateRadiusAndCenter } from './chunk-NPDZLYIF.mjs';
-import { formatPointDescription } from './chunk-OGJ6IIBW.mjs';
-import { measureText } from './chunk-XTVE4P3L.mjs';
-import { DEFAULT_RADIAL_LABEL_FONT_SIZE, DEFAULT_GRID_LEVELS, resolveFontSize, resolveFontFamily, DEFAULT_RADAR_FILL_OPACITY, DEFAULT_LINE_WIDTH, DEFAULT_HOVER_POINT_RADIUS_MULTIPLIER, DEFAULT_POLAR_GAP_PX, DEFAULT_RADAR_HIT_RADIUS, DEFAULT_LINE_MARKER_SIZE } from './chunk-NKUYIWAP.mjs';
-import { isGradientColor, batchResolveAccessor, FIELD_DEFAULTS, createSvgGradientFromColor, makeItemContext, resolveDash, resolveAccessor, getDefaultColor, createCanvasGradientFromColor, sampleGradientAt, resolveSwatchColor, getPrimaryColor, batchResolveRequired } from './chunk-O2X6FF45.mjs';
-import { createCanvasPathBuilder, traceClosedSpline, createSvgPathBuilder } from './chunk-IEGLX7VL.mjs';
-import { createSvgGroup, setAttr, adjustBrightness, createSvgDefs, appendChild, prependChild, svgClass, createSvgPath, svgNode, withCanvasState } from './chunk-SSLTFJ3U.mjs';
-import { calculateNiceDomain, generateNiceTicks, toRad } from './chunk-RQ3CKQOX.mjs';
+import { isPointInSlice } from './chunk-4S3FOFCN.mjs';
+import { MARKER_SHAPE_NAMES, renderMarkerShapeSvg, drawMarkerCanvas } from './chunk-QIYJUZ7I.mjs';
+import { calculateRadiusAndCenter } from './chunk-AJ24XDEK.mjs';
+import { formatPointDescription } from './chunk-IFJPDARC.mjs';
+import { resolveRadialAccessors } from './chunk-6MAO6I3E.mjs';
+import { measureText } from './chunk-56MASQS2.mjs';
+import { DEFAULT_RADIAL_LABEL_FONT_SIZE, DEFAULT_GRID_LEVELS, resolveFontSize, resolveFontFamily, DEFAULT_RADAR_FILL_OPACITY, DEFAULT_LINE_WIDTH, DEFAULT_HOVER_POINT_RADIUS_MULTIPLIER, DEFAULT_POLAR_GAP_PX, DEFAULT_RADAR_HIT_RADIUS, DEFAULT_LINE_MARKER_SIZE } from './chunk-6LUIVTNV.mjs';
+import { buildColorIndexMap, isGradientColor, batchResolveAccessor, FIELD_DEFAULTS, createSvgGradientFromColor, makeItemContext, resolveDash, resolveAccessor, getDefaultColor, createCanvasGradientFromColor, sampleGradientAt, resolveSwatchColor, getPrimaryColor, batchResolveRequired } from './chunk-BDCNBS6W.mjs';
+import { createCanvasPathBuilder, traceClosedSpline, createSvgPathBuilder } from './chunk-PXUXZADY.mjs';
+import { createSvgGroup, setAttr, adjustBrightness, createSvgDefs, appendChild, prependChild, svgClass, createSvgPath, svgNode, withCanvasState } from './chunk-BF7RP4A3.mjs';
+import { calculateNiceDomain, generateNiceTicks, toRad } from './chunk-K7AGQTVK.mjs';
 
 // src/renderers/radar.layout.ts
-function calculateRadarLayout(datasets, chartArea, globalFont, sharedCategories, sharedDomain, perAxisDomains, referenceBoundaryValues, perSpokeDomains, tickCount) {
+function calculateRadarLayout(datasets, chartArea, globalFont, sharedCategories, sharedDomain, perAxisDomains, referenceBoundaryValues, perSpokeDomains, tickCount, showCategoryLabels = true) {
   const categories = sharedCategories ?? extractCategories(datasets);
   const categoryCount = categories.length;
   const angleStep = categoryCount > 0 ? 360 / categoryCount : 0;
@@ -55,7 +56,7 @@ function calculateRadarLayout(datasets, chartArea, globalFont, sharedCategories,
   const resolvedLabelFontSize = resolveFontSize(DEFAULT_RADIAL_LABEL_FONT_SIZE, globalFont);
   const resolvedFontFamily = resolveFontFamily(void 0, globalFont);
   const labelPadding = measureText("Xg", resolvedLabelFontSize).height;
-  const labelMargins = calculateLabelMargins(categories, angleStep, labelPadding, resolvedLabelFontSize);
+  const labelMargins = showCategoryLabels ? calculateLabelMargins(categories, angleStep, labelPadding, resolvedLabelFontSize) : { top: 0, right: 0, bottom: 0, left: 0 };
   const adjustedArea = {
     x: chartArea.x + labelMargins.left,
     y: chartArea.y + labelMargins.top,
@@ -84,6 +85,7 @@ function calculateRadarLayout(datasets, chartArea, globalFont, sharedCategories,
   }
   const series = [];
   const stackRunning = /* @__PURE__ */ new Map();
+  const colorIndexById = buildColorIndexMap(new Map(datasets.map((d) => [d.id, d])));
   for (let si = 0; si < datasets.length; si++) {
     const ds = datasets[si];
     const gradientColor = ds.props.color && isGradientColor(ds.props.color) ? ds.props.color : void 0;
@@ -144,6 +146,7 @@ function calculateRadarLayout(datasets, chartArea, globalFont, sharedCategories,
       basePoints: isStacked ? basePoints : void 0,
       color,
       seriesIdx: si,
+      colorIndex: colorIndexById.get(ds.id) ?? si,
       gradientColor,
       fillOpacity,
       lineStrokeWidth: lineWidth,
@@ -176,7 +179,7 @@ function extractCategories(datasets) {
   for (const ds of datasets) {
     const props = ds.props;
     if (!props.data) continue;
-    const cats = batchResolveAccessor(props.categoryField ?? FIELD_DEFAULTS.categoryField, props.data);
+    const cats = batchResolveAccessor(resolveRadialAccessors(props).angularField ?? FIELD_DEFAULTS.categoryField, props.data);
     for (const cat of cats) {
       const str = String(cat);
       if (!seen.has(str)) {
@@ -189,7 +192,7 @@ function extractCategories(datasets) {
 }
 function resolveValues(props) {
   if (!props.data) return [];
-  return batchResolveAccessor(props.valueField ?? FIELD_DEFAULTS.valueField, props.data).map((v) => Number(v) || 0);
+  return batchResolveAccessor(resolveRadialAccessors(props).radialField ?? FIELD_DEFAULTS.valueField, props.data).map((v) => Number(v) || 0);
 }
 function computeRadialComboContext(radarDatasets, polarDatasets) {
   const allEntries = [...radarDatasets, ...polarDatasets];
@@ -294,7 +297,7 @@ function renderRadarSeriesSvg(layout, seriesIndex, hoverState, theme, effectConf
   const isStacked = sd.basePoints && sd.basePoints.length > 0;
   const innerPathD = isStacked ? isSmooth ? buildSmoothPath([...sd.basePoints].reverse()) : buildPointsPathReversed(sd.basePoints) : "";
   const fillPathD = isStacked ? `${outerPathD} ${innerPathD}` : outerPathD;
-  const colorClassN = `p-chart-color-${sd.seriesIdx % 10}`;
+  const colorClassN = `p-chart-color-${sd.colorIndex % 14}`;
   const seriesIsHoveredJs = !isSharedHover && isSeriesHovered;
   let fillColor = sd.color;
   let strokeColor = sd.color;
@@ -322,7 +325,7 @@ function renderRadarSeriesSvg(layout, seriesIndex, hoverState, theme, effectConf
   const dashPattern = sd.lineDash ?? (sd.lineStyle === "dashed" ? [6, 4] : sd.lineStyle === "dotted" ? [2, 3] : null);
   if (dashPattern?.length) dashAttrs["stroke-dasharray"] = dashPattern.join(" ");
   const fillAreaCls = svgClass("p-chart-area", `p-chart-series-${sd.seriesIdx}`, fillValue === void 0 && colorClassN, seriesIsHoveredJs && "p-chart-point-hover", anyHover && !isSeriesHovered && "p-chart-series-inactive");
-  const themedSeriesColor = theme.series[sd.seriesIdx % theme.series.length];
+  const themedSeriesColor = theme.series[sd.colorIndex % theme.series.length];
   appendChild(
     group,
     createSvgPath(fillPathD, {
@@ -473,7 +476,7 @@ function renderRadarSeriesCanvas(ctx, layout, seriesIndex, hoverState, effectCon
   if (anyHover && !isSharedHover && !isSeriesHovered && effectConfig?.dimOpacity !== void 0) {
     seriesOpacity = effectConfig.dimOpacity;
   }
-  const baseColor = sd.color ?? getDefaultColor(sd.seriesIdx, theme);
+  const baseColor = sd.color ?? getDefaultColor(sd.colorIndex, theme);
   let fillColor = baseColor;
   let strokeColor = baseColor;
   if (!isSharedHover && isSeriesHovered && effectConfig?.hoverBrightness) {
@@ -644,9 +647,9 @@ function hitTestRadar(x, y, layout, theme) {
           index: pi,
           label: layout.categories[pi] ?? "",
           value: pt.value,
-          color: sd.color ?? (sd.gradientColor ? getPrimaryColor(sd.gradientColor) : getDefaultColor(sd.seriesIdx, theme)),
+          color: sd.color ?? (sd.gradientColor ? getPrimaryColor(sd.gradientColor) : getDefaultColor(sd.colorIndex, theme)),
           colorGradient: sd.gradientColor,
-          swatchColor: resolveSwatchColor({ color: sd.color ?? sd.gradientColor }, sd.seriesIdx, void 0, theme)
+          swatchColor: resolveSwatchColor({ color: sd.color ?? sd.gradientColor }, sd.colorIndex, void 0, theme)
         };
       }
     }
@@ -670,7 +673,7 @@ function resolveBorderProps(props, item, index, value, category, seriesIndex, se
   if (!borderColor && !borderStrokeWidth && !borderRadius && !borderDash && borderDashOffset === void 0 && !hoverColor && !hoverBorderColor && opacity === void 0) return {};
   return { borderColor, borderStrokeWidth, borderRadius, borderDash, borderDashOffset, hoverColor, hoverBorderColor, opacity };
 }
-function calculatePolarLayout(datasets, chartArea, stackConfig, globalFont, sharedCategories, sharedDomain) {
+function calculatePolarLayout(datasets, chartArea, stackConfig, globalFont, sharedCategories, sharedDomain, showCategoryLabels = true) {
   const categories = sharedCategories ?? extractCategories(datasets);
   const categoryCount = categories.length;
   const angleStep = categoryCount > 0 ? 360 / categoryCount : 0;
@@ -679,6 +682,7 @@ function calculatePolarLayout(datasets, chartArea, stackConfig, globalFont, shar
   const allValues = [];
   const visibleDatasets = datasets.filter((ds) => ds.visible);
   const globalDatasetIndex = new Map(visibleDatasets.map((ds) => [ds.id, datasets.indexOf(ds)]));
+  const colorIndexById = buildColorIndexMap(new Map(datasets.map((d) => [d.id, d])));
   const isStacked = visibleDatasets.some((ds) => ds.props.stackId !== void 0);
   const categoryValuesByDataset = [];
   const keysByDataset = [];
@@ -744,7 +748,7 @@ function calculatePolarLayout(datasets, chartArea, stackConfig, globalFont, shar
   const resolvedLabelFontSize = resolveFontSize(DEFAULT_RADIAL_LABEL_FONT_SIZE, globalFont);
   const resolvedFontFamily = resolveFontFamily(void 0, globalFont);
   const labelPadding = measureText("Xg", resolvedLabelFontSize).height;
-  const labelMargins = calculateLabelMargins(categories, angleStep, labelPadding, resolvedLabelFontSize);
+  const labelMargins = showCategoryLabels ? calculateLabelMargins(categories, angleStep, labelPadding, resolvedLabelFontSize) : { top: 0, right: 0, bottom: 0, left: 0 };
   const adjustedArea = {
     x: chartArea.x + labelMargins.left,
     y: chartArea.y + labelMargins.top,
@@ -756,9 +760,11 @@ function calculatePolarLayout(datasets, chartArea, stackConfig, globalFont, shar
   const firstTick = levelValues[0] ?? domain[0];
   const lastTick = levelValues[levelValues.length - 1] ?? domain[1];
   domain = [Math.min(domain[0], firstTick), Math.max(domain[1], lastTick)];
+  const baseInnerRadius = innerRadiusRatio * maxRadius;
+  const availableRadius = maxRadius - baseInnerRadius;
   const levelRadii = levelValues.map((v) => {
-    if (domain[1] === domain[0]) return 0;
-    return (v - domain[0]) / (domain[1] - domain[0]) * maxRadius;
+    if (domain[1] === domain[0]) return baseInnerRadius;
+    return baseInnerRadius + (v - domain[0]) / (domain[1] - domain[0]) * availableRadius;
   });
   const grid = {
     shape: "circle",
@@ -776,8 +782,6 @@ function calculatePolarLayout(datasets, chartArea, stackConfig, globalFont, shar
     });
   }
   const bars = [];
-  const baseInnerRadius = innerRadiusRatio * maxRadius;
-  const availableRadius = maxRadius - baseInnerRadius;
   const gapPx = firstProps?.spacing ?? DEFAULT_POLAR_GAP_PX;
   const gapDeg = maxRadius > 0 ? gapPx / maxRadius * (180 / Math.PI) : 0;
   if (isStacked) {
@@ -812,6 +816,7 @@ function calculatePolarLayout(datasets, chartArea, stackConfig, globalFont, shar
             value: 0,
             color: color2,
             seriesIdx: dsSeriesIdx,
+            colorIndex: colorIndexById.get(ds.id) ?? dsSeriesIdx,
             hidden: true,
             ...border2
           });
@@ -842,6 +847,7 @@ function calculatePolarLayout(datasets, chartArea, stackConfig, globalFont, shar
           value: rawValue,
           color,
           seriesIdx: dsSeriesIdx,
+          colorIndex: colorIndexById.get(ds.id) ?? dsSeriesIdx,
           ...border
         });
         currentInner = outerRadius;
@@ -874,6 +880,7 @@ function calculatePolarLayout(datasets, chartArea, stackConfig, globalFont, shar
           value: rawValue,
           color,
           seriesIdx: dsSeriesIdx,
+          colorIndex: colorIndexById.get(ds.id) ?? dsSeriesIdx,
           ...border
         });
       }
@@ -903,6 +910,7 @@ function calculatePolarLayout(datasets, chartArea, stackConfig, globalFont, shar
           value: rawValue,
           color,
           seriesIdx: dsSeriesIdx,
+          colorIndex: colorIndexById.get(ds.id) ?? dsSeriesIdx,
           ...border
         });
       }
@@ -947,9 +955,9 @@ function hitTestPolar(x, y, layout, theme) {
         index: bar.categoryIndex,
         label: layout.categories[bar.categoryIndex] ?? "",
         value: bar.value,
-        color: bar.color ?? getDefaultColor(bar.seriesIdx, theme),
+        color: bar.color ?? getDefaultColor(bar.colorIndex, theme),
         colorGradient: gradColor,
-        swatchColor: resolveSwatchColor({ color: bar.color ?? gradColor }, bar.seriesIdx, void 0, theme)
+        swatchColor: resolveSwatchColor({ color: bar.color ?? gradColor }, bar.colorIndex, void 0, theme)
       };
     }
   }

package/dist/chunks/chunk-G3DIMENH.mjs

@@ -0,0 +1,63 @@
+import { isChartDevWarningsEnabled, warnChartDevOnce } from './chunk-K7AGQTVK.mjs';
+
+// src/cartesian/series-accessors.ts
+function resolveCartesianAccessors(props) {
+  if (props.categoryXField != null) {
+    return { independentField: props.categoryXField, measureField: props.valueYField, independentIsCategory: true, orientation: "vertical" };
+  }
+  if (props.categoryYField != null) {
+    return { independentField: props.categoryYField, measureField: props.valueXField, independentIsCategory: true, orientation: "horizontal" };
+  }
+  return {
+    independentField: props.valueXField,
+    measureField: props.valueYField,
+    independentIsCategory: false,
+    orientation: "vertical"
+  };
+}
+function boundAxisType(map, axisId) {
+  if (map.size === 0) return void 0;
+  const entry = axisId != null ? map.get(axisId) : map.values().next().value;
+  return entry?.props?.type;
+}
+function validateCartesianAccessors(seriesList, axes) {
+  if (!isChartDevWarningsEnabled()) return;
+  let sawVertical = false;
+  let sawHorizontal = false;
+  for (const { id, props } of seriesList) {
+    const cx = props.categoryXField != null;
+    const cy = props.categoryYField != null;
+    const vx = props.valueXField != null;
+    const vy = props.valueYField != null;
+    if (cx) sawVertical = true;
+    if (cy) sawHorizontal = true;
+    if (cx && cy) {
+      warnChartDevOnce(`cartesian-accessor:${id}:dual-category`, `series "${id}" sets both categoryXField and categoryYField; categoryXField wins and categoryYField is ignored.`);
+    }
+    const acc = resolveCartesianAccessors(props);
+    if (!cx && !cy && !vx && !vy) {
+      warnChartDevOnce(`cartesian-accessor:${id}:no-accessors`, `series "${id}" has no cartesian field accessors (categoryXField/categoryYField/valueXField/valueYField); nothing will render.`);
+    } else if (acc.independentField != null && acc.measureField == null) {
+      warnChartDevOnce(`cartesian-accessor:${id}:missing-measure`, `series "${id}" has an independent field but no value (measure) field \u2014 points will render at zero. Pair categoryXField with valueYField, or categoryYField with valueXField.`);
+    }
+    const xType = boundAxisType(axes.x, props.xAxisId);
+    const yType = boundAxisType(axes.y, props.yAxisId);
+    if (cx && (xType === "linear" || xType === "logarithmic")) {
+      warnChartDevOnce(`cartesian-accessor:${id}:catx-on-numeric`, `series "${id}" uses categoryXField but its X axis is type "${xType}"; category fields require a category (or time) axis.`);
+    }
+    if (cy && (yType === "linear" || yType === "logarithmic")) {
+      warnChartDevOnce(`cartesian-accessor:${id}:caty-on-numeric`, `series "${id}" uses categoryYField but its Y axis is type "${yType}"; category fields require a category (or time) axis.`);
+    }
+    if (vx && xType === "category") {
+      warnChartDevOnce(`cartesian-accessor:${id}:valx-on-category`, `series "${id}" uses valueXField but its X axis is type "category"; value fields require a linear/logarithmic/time axis.`);
+    }
+    if (vy && yType === "category") {
+      warnChartDevOnce(`cartesian-accessor:${id}:valy-on-category`, `series "${id}" uses valueYField but its Y axis is type "category"; value fields require a linear/logarithmic/time axis.`);
+    }
+  }
+  if (sawVertical && sawHorizontal) {
+    warnChartDevOnce("cartesian-accessor:mixed-orientation", "chart has mixed series orientations (categoryXField \u2192 vertical and categoryYField \u2192 horizontal); the chart will collapse to a single orientation.");
+  }
+}
+
+export { resolveCartesianAccessors, validateCartesianAccessors };