@rokkit/chart 1.3.0 → 1.3.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rokkit/chart",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "type": "module",
   "description": "Data-driven chart components",
   "repository": {

package/src/lib/chart.js

@@ -97,11 +97,13 @@ class Chart {
 		this.refresh()
 	}
 
+	/* v8 ignore next 4 -- this.padding (number) set in #initFields shadows this prototype method */
 	padding(value) {
 		this.padding = value
 		return this.refresh()
 	}
 
+	/* v8 ignore next 4 -- this.margin (object) set in #initFields shadows this prototype method */
 	margin(value) {
 		this.margin = value
 		return this.refresh()

package/src/lib/context.js

@@ -1,6 +1,8 @@
 import { getContext, setContext } from 'svelte'
 import { writable, derived } from 'svelte/store'
-import * as d3 from 'd3'
+import { scaleBand, scaleLinear, scaleOrdinal } from 'd3-scale'
+import { schemeCategory10 } from 'd3-scale-chromatic'
+import { max } from 'd3-array'
 
 const CHART_CONTEXT = 'chart-context'
 
@@ -61,22 +63,20 @@ function makeUpdateScales(data, innerDimensions) {
 		return derived([data, innerDimensions], ([$data, $innerDimensions]) => {
 			if (!$data || $data.length === 0) return null
 
-			const xScale = d3
-				.scaleBand()
+			const xScale = scaleBand()
 				.domain($data.map((d) => d[xKey]))
 				.range([0, $innerDimensions.width])
 				.padding(0.2)
 
-			const yScale = d3
-				.scaleLinear()
-				.domain([0, d3.max($data, (d) => d[yKey])])
+			const yScale = scaleLinear()
+				.domain([0, max($data, (d) => d[yKey])])
 				.nice()
 				.range([$innerDimensions.height, 0])
 
 			let colorScale = null
 			if (colorKey) {
 				const uniqueCategories = [...new Set($data.map((d) => d[colorKey]))]
-				colorScale = d3.scaleOrdinal().domain(uniqueCategories).range(d3.schemeCategory10)
+				colorScale = scaleOrdinal().domain(uniqueCategories).range(schemeCategory10)
 			}
 
 			return { xScale, yScale, colorScale }

package/src/lib/keyboard-nav.js

@@ -17,7 +17,7 @@ export function keyboardNav(node, enabled) {
 		const container = node.closest('[data-plot-geom]')
 		if (!container) return
 		const elements = [...container.querySelectorAll('[data-plot-element]')].filter(
-			(el) => /** @type {HTMLElement|SVGElement} */ (el).tabIndex >= 0
+			(el) => el.tabIndex >= 0
 		)
 		const idx = elements.indexOf(node)
 		if (idx === -1) return
@@ -25,7 +25,7 @@ export function keyboardNav(node, enabled) {
 			e.key === 'ArrowRight' ? Math.min(idx + 1, elements.length - 1) : Math.max(idx - 1, 0)
 		if (nextIdx !== idx) {
 			e.preventDefault()
-			/** @type {HTMLElement|SVGElement} */ (elements[nextIdx]).focus()
+			elements[nextIdx].focus()
 		}
 	}
 	node.addEventListener('keydown', handleKeydown)