@pushwoosh/kit-charts 0.0.10 → 0.0.11

package/core/Chart/Axes.js

@@ -14,6 +14,8 @@ const ANCHOR = {
   center: 'middle',
   right: 'end'
 };
+/** `style.textAlign` wins over the anchor the axis derives from its own geometry. */
+const anchorFor = (style, fallback) => style?.textAlign && ANCHOR[style.textAlign] || fallback;
 /** What a tick draws: its own node if a formatter made one, its text otherwise. */
 const tickContent = tick => {
   if (tick.node !== undefined && tick.node !== null) {
@@ -33,7 +35,7 @@ function TickLabel({
   const text = _jsx("text", {
     x: x,
     y: y,
-    textAnchor: anchor,
+    textAnchor: anchorFor(style, anchor),
     ...textProps(style),
     children: children
   });
@@ -89,7 +91,7 @@ function AxisTitle({
   return _jsx("text", {
     x: at.x,
     y: at.y,
-    textAnchor: rotation === 0 ? anchor : 'middle',
+    textAnchor: rotation === 0 ? anchorFor(title.style, anchor) : 'middle',
     transform: rotation === 0 ? undefined : `rotate(${rotation} ${at.x} ${at.y})`,
     ...textProps(title.style),
     children: title.text

package/core/model/build-model.js

@@ -337,7 +337,9 @@ export function buildChartModel({
     }) => {
       points.forEach(point => {
         if (typeof point.x === 'string') {
-          point.band = point.x;
+          // Highcharts reads a string in `[name, value]` as the point's name and
+          // places it by index; we key by category, and fall back where it misses.
+          point.band = !explicitCategories || categories.includes(point.x) ? point.x : categories[point.index] ?? point.x;
           return;
         }
         if (!explicitCategories) {
@@ -347,6 +349,8 @@ export function buildChartModel({
         point.band = categories[Number(point.x)] ?? categories[point.index] ?? String(point.x);
       });
     });
+    // A band still outside the list extends the axis: a surplus point is data, and
+    // dropping it would lose it without a word.
     resolved.forEach(({
       points
     }) => {

package/core/types/options.d.ts

@@ -86,10 +86,8 @@ export interface AxisLabelsOptions {
     hint?: (ctx: AxisLabelContext) => string | undefined;
     allowOverlap?: boolean;
     align?: 'left' | 'center' | 'right';
-    rotation?: number;
     x?: number;
     y?: number;
-    padding?: number;
     style?: TextStyle;
 }
 /** `zIndex` at or above this draws over the series instead of under it. */
@@ -168,7 +166,6 @@ export interface LegendOptions<TSeriesMeta = unknown> {
     align?: 'left' | 'center' | 'right';
     verticalAlign?: 'top' | 'middle' | 'bottom';
     layout?: 'horizontal' | 'vertical';
-    margin?: number;
     x?: number;
     y?: number;
     itemStyle?: TextStyle;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushwoosh/kit-charts",
-  "version": "0.0.10",
+  "version": "0.0.11",
   "description": "Small React chart library on SVG, with a Highcharts-shaped configuration model",
   "license": "MIT",
   "repository": {