@internetstiftelsen/charts 0.9.1 → 0.9.2

package/dist/grid.d.ts

@@ -3,11 +3,11 @@ import type { GridConfig, ChartTheme, D3Scale, ExportHooks, GridConfigBase } fro
 import type { ChartComponent } from './chart-interface.js';
 export declare class Grid implements ChartComponent<GridConfigBase> {
     readonly type: "grid";
-    readonly horizontal: boolean;
-    readonly vertical: boolean;
+    readonly value: boolean;
+    readonly category: boolean;
     readonly exportHooks?: ExportHooks<GridConfigBase>;
     constructor(config?: GridConfig);
     getExportConfig(): GridConfigBase;
     createExportComponent(override?: Partial<GridConfigBase>): ChartComponent<GridConfigBase>;
-    render(plotGroup: Selection<SVGGElement, undefined, null, undefined>, x: D3Scale, y: D3Scale, theme: ChartTheme): void;
+    render(plotGroup: Selection<SVGGElement, undefined, null, undefined>, x: D3Scale, y: D3Scale, theme: ChartTheme, isHorizontalOrientation: boolean): void;
 }

package/dist/grid.js

@@ -8,13 +8,13 @@ export class Grid {
             writable: true,
             value: 'grid'
         });
-        Object.defineProperty(this, "horizontal", {
+        Object.defineProperty(this, "value", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
-        Object.defineProperty(this, "vertical", {
+        Object.defineProperty(this, "category", {
             enumerable: true,
             configurable: true,
             writable: true,
@@ -26,14 +26,14 @@ export class Grid {
             writable: true,
             value: void 0
         });
-        this.horizontal = config?.horizontal ?? true;
-        this.vertical = config?.vertical ?? true;
+        this.value = config?.value ?? true;
+        this.category = config?.category ?? true;
         this.exportHooks = config?.exportHooks;
     }
     getExportConfig() {
         return {
-            horizontal: this.horizontal,
-            vertical: this.vertical,
+            value: this.value,
+            category: this.category,
         };
     }
     createExportComponent(override) {
@@ -43,13 +43,19 @@ export class Grid {
             exportHooks: this.exportHooks,
         });
     }
-    render(plotGroup, x, y, theme) {
+    render(plotGroup, x, y, theme, isHorizontalOrientation) {
         // Get plot area dimensions from the scale ranges
         const xRange = x.range();
         const yRange = y.range();
         const plotWidth = xRange[1] - xRange[0];
         const plotHeight = yRange[0] - yRange[1];
-        if (this.horizontal) {
+        const showHorizontalLines = isHorizontalOrientation
+            ? this.category
+            : this.value;
+        const showVerticalLines = isHorizontalOrientation
+            ? this.value
+            : this.category;
+        if (showHorizontalLines) {
             plotGroup
                 .append('g')
                 .attr('class', 'grid-lines horizontal')
@@ -65,7 +71,7 @@ export class Grid {
                 .selectAll('.domain')
                 .remove();
         }
-        if (this.vertical) {
+        if (showVerticalLines) {
             plotGroup
                 .append('g')
                 .attr('class', 'grid-lines vertical')

package/dist/types.d.ts

@@ -258,8 +258,8 @@ export type YAxisConfig = YAxisConfigBase & {
     exportHooks?: ExportHooks<YAxisConfigBase>;
 };
 export type GridConfigBase = {
-    horizontal?: boolean;
-    vertical?: boolean;
+    value?: boolean;
+    category?: boolean;
 };
 export type GridConfig = GridConfigBase & {
     exportHooks?: ExportHooks<GridConfigBase>;

package/dist/xy-chart.js

@@ -149,7 +149,7 @@ export class XYChart extends BaseChart {
         this.setupScales();
         this.renderTitle(svg);
         if (this.grid && this.x && this.y) {
-            this.grid.render(plotGroup, this.x, this.y, this.renderTheme);
+            this.grid.render(plotGroup, this.x, this.y, this.renderTheme, this.isHorizontalOrientation());
         }
         this.renderSeries(visibleSeries);
         if (this.x && this.y) {

package/package.json

@@ -1,5 +1,5 @@
 {
-    "version": "0.9.1",
+    "version": "0.9.2",
     "name": "@internetstiftelsen/charts",
     "type": "module",
     "sideEffects": false,