@rokkit/chart 1.0.0-next.57 → 1.0.0-next.58

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rokkit/chart",
-  "version": "1.0.0-next.57",
+  "version": "1.0.0-next.58",
   "description": "Components for making interactive charts.",
   "author": "Jerry Thomas <me@jerrythomas.name>",
   "license": "MIT",
@@ -23,7 +23,7 @@
     "typescript": "^5.2.2",
     "vite": "^4.5.0",
     "vitest": "~0.34.6",
-    "shared-config": "1.0.0-next.57"
+    "shared-config": "1.0.0-next.58"
   },
   "dependencies": {
     "d3-array": "^3.2.4",
@@ -35,10 +35,10 @@
     "date-fns": "^2.30.0",
     "ramda": "^0.29.1",
     "yootils": "^0.3.1",
-    "@rokkit/atoms": "1.0.0-next.57",
-    "@rokkit/stores": "1.0.0-next.57",
-    "@rokkit/core": "1.0.0-next.57",
-    "@rokkit/molecules": "1.0.0-next.57"
+    "@rokkit/atoms": "1.0.0-next.58",
+    "@rokkit/molecules": "1.0.0-next.58",
+    "@rokkit/core": "1.0.0-next.58",
+    "@rokkit/stores": "1.0.0-next.58"
   },
   "files": [
     "src/**/*.js",

package/src/lib/chart.js

@@ -52,8 +52,7 @@ export class ChartBrewer {
 			fill: [...new Set(this.data.map((item) => item[this.fill]))]
 		}
 
-		let xOffset =
-			max(this.scaleValues.y.map((value) => value.toString().length)) * 10
+		let xOffset = max(this.scaleValues.y.map((value) => value.toString().length)) * 10
 		let yOffset = 20
 
 		this.margin = {
@@ -158,9 +157,7 @@ export class ChartBrewer {
 		}
 
 		// The maximum width of a violin must be x.bandwidth = the width dedicated to a group
-		var xNum = scaleLinear()
-			.range([0, this.axis.x.scale.bandwidth()])
-			.domain([0, maxNum])
+		var xNum = scaleLinear().range([0, this.axis.x.scale.bandwidth()]).domain([0, maxNum])
 
 		let result = area()
 			.x0(xNum(0))
@@ -179,8 +176,7 @@ export class ChartBrewer {
 }
 
 function tickValues(scale, whichAxis, params) {
-	let { values, count } =
-		whichAxis in params.ticks ? params.ticks[whichAxis] : {}
+	let { values, count } = whichAxis in params.ticks ? params.ticks[whichAxis] : {}
 	values =
 		Array.isArray(values) && values.length > 2
 			? values

package/src/lib/color.js

@@ -19,12 +19,8 @@ export class ColorBrewer {
 
 	mix(fill, stroke, contrast) {
 		this.fill = Object.keys(this.grayscale).includes(fill) ? fill : this.fill
-		this.stroke = Object.keys(this.grayscale).includes(stroke)
-			? stroke
-			: this.stroke
-		this.contrast = Object.keys(this.grayscale).includes(contrast)
-			? contrast
-			: this.contrast
+		this.stroke = Object.keys(this.grayscale).includes(stroke) ? stroke : this.stroke
+		this.contrast = Object.keys(this.grayscale).includes(contrast) ? contrast : this.contrast
 
 		return this
 	}

package/src/lib/funnel.js

@@ -48,9 +48,7 @@ function determineLayout(uniques, aes) {
 			vertical = false
 			console.warn('Assuming horizontal layout because stat is count')
 		} else {
-			console.error(
-				'Cannot plot without at least one axis having numeric values'
-			)
+			console.error('Cannot plot without at least one axis having numeric values')
 			return null
 		}
 	}
@@ -77,9 +75,7 @@ export function convertToPhases(input, aes) {
 	const summary = summarize(input, by, value, aes.stat)
 	const phases = nest()
 		.key((d) => d[key])
-		.rollup((rows) =>
-			'fill' in aes ? fillMissing(uniques.fill, rows, key, aes) : rows
-		)
+		.rollup((rows) => ('fill' in aes ? fillMissing(uniques.fill, rows, key, aes) : rows))
 		.entries(summary)
 
 	return { phases, uniques, vertical }
@@ -214,8 +210,7 @@ function calculatePosition(input, aes, row, stat, index, midpoint) {
 export function funnel(input, aes, width, height) {
 	let data = convertToPhases(input, aes)
 	data = mirror(data, aes)
-	const curve =
-		aes.curve === 'basis' ? curveBasis : data.vertical ? curveBumpY : curveBumpX
+	const curve = aes.curve === 'basis' ? curveBasis : data.vertical ? curveBumpY : curveBumpX
 
 	if ('fill' in aes) {
 		let stats = flatten(data.stats.map((phase) => phase.value))

package/src/lib/geom.js

@@ -1,14 +1,4 @@
-import {
-	sum,
-	min,
-	max,
-	mean,
-	mode,
-	median,
-	deviation,
-	variance,
-	flatRollup
-} from 'd3-array'
+import { sum, min, max, mean, mode, median, deviation, variance, flatRollup } from 'd3-array'
 
 const summaries = {
 	identity: (value) => value,
@@ -31,8 +21,7 @@ const summaries = {
  */
 export function rollup(stat) {
 	if (typeof stat === 'function') return stat
-	if (typeof stat !== 'string')
-		throw new TypeError('stat must be a string or function')
+	if (typeof stat !== 'string') throw new TypeError('stat must be a string or function')
 	if (!(stat in summaries)) throw new TypeError('Unknown stat: ' + stat)
 
 	return summaries[stat]

package/src/lib/heatmap.js

@@ -20,9 +20,7 @@ export function summarize(data, dateField = 'date', valueField) {
 	const nested = nest()
 		.key((d) => format(new Date(d[dateField]), DATE_FORMAT))
 		.rollup((d) =>
-			valueField
-				? d.map((value) => value[valueField]).reduce((a, b) => a + b, 0)
-				: d.length
+			valueField ? d.map((value) => value[valueField]).reduce((a, b) => a + b, 0) : d.length
 		)
 		.entries(data)
 

package/src/lib/pattern.js

@@ -60,10 +60,7 @@ export const builtIn = [
 	},
 
 	{
-		path:
-			'M5 1 A6 6 0 0 0 5 9' +
-			'A6 6 0 0 0 5 1' +
-			'M1 5A6 6 0 0 0 9 5A6 6 0 0 0 1 5',
+		path: 'M5 1 A6 6 0 0 0 5 9' + 'A6 6 0 0 0 5 1' + 'M1 5A6 6 0 0 0 9 5A6 6 0 0 0 1 5',
 		minAngle: 0,
 		maxAngle: 90
 	},
@@ -87,8 +84,7 @@ export const builtIn = [
 		maxAngle: 90
 	},
 	{
-		path:
-			'M5 0L6 4L10 5L6 6L5 10L4 6L0 5L4 4Z' + 'M2 1V3M1 2H3' + 'M8 9V7M9 8H7',
+		path: 'M5 0L6 4L10 5L6 6L5 10L4 6L0 5L4 4Z' + 'M2 1V3M1 2H3' + 'M8 9V7M9 8H7',
 		minAngle: 0,
 		maxAngle: 90
 	},
@@ -145,9 +141,7 @@ export class PatternBrewer {
 		count = clamp(count, 1, 15)
 		this.paths = this.paths.map((path) => ({
 			...path,
-			angles: [...Array(count).keys()].map(
-				(i) => (i * (path.maxAngle - path.minAngle)) / count
-			)
+			angles: [...Array(count).keys()].map((i) => (i * (path.maxAngle - path.minAngle)) / count)
 		}))
 		return this
 	}

package/src/lib/rollup.js

@@ -29,13 +29,7 @@ function slidingWindowForNumbers(values, size, step, offset = 0, fmt = 0) {
 	return result
 }
 
-function slidingWindowForDates(
-	values,
-	size,
-	step,
-	offset = {},
-	fmt = 'yyyy-MM-dd'
-) {
+function slidingWindowForDates(values, size, step, offset = {}, fmt = 'yyyy-MM-dd') {
 	const largest = max(values)
 	let current = new Date(format(min(values), fmt))
 	let blocks = []

package/src/lib/store.js

@@ -12,12 +12,8 @@ import { tweened, cubicOut } from 'svelte/motion'
 export function animatedChart(input, key, valueFields = [], previous = []) {
 	const previousKeys = new Set(previous.map((item) => item[key]))
 	const currentKeys = new Set(input.map((item) => item[key]))
-	const toAdd = new Set(
-		[...currentKeys].filter((key) => !previousKeys.has(key))
-	)
-	const toRemove = new Set(
-		[...previousKeys].filter((key) => !currentKeys.has(key))
-	)
+	const toAdd = new Set([...currentKeys].filter((key) => !previousKeys.has(key)))
+	const toRemove = new Set([...previousKeys].filter((key) => !currentKeys.has(key)))
 
 	let data = input
 		.filter((item) => toAdd.has(item[key]))
@@ -25,10 +21,7 @@ export function animatedChart(input, key, valueFields = [], previous = []) {
 			let el = { ...item }
 			valueFields.forEach(
 				({ field, initialValue, attrs }) =>
-					(el[field] =
-						typeof initialValue === 'function'
-							? initialValue(el, attrs)
-							: initialValue)
+					(el[field] = typeof initialValue === 'function' ? initialValue(el, attrs) : initialValue)
 			)
 			return el
 		})

package/src/lib/summary.js

@@ -20,9 +20,7 @@ export function summarize(data, by, attr, stat = 'count') {
 		.key((d) => by.map((f) => d[f]).join('|'))
 		.rollup((rows) => {
 			let agg = pick(by, rows[0])
-			stats.map(
-				(stat) => (agg[stat] = aggregate[stat](rows.map((d) => d[attr])))
-			)
+			stats.map((stat) => (agg[stat] = aggregate[stat](rows.map((d) => d[attr]))))
 			return [agg]
 		})
 		.entries(data)

package/src/lib/utils.js

@@ -127,9 +127,7 @@ export function aggregate(data, x, y) {
  * @returns
  */
 export function getPaletteForValues(values, palette, fallback) {
-	return values.map((_, index) =>
-		index < palette.length ? palette[index] : fallback
-	)
+	return values.map((_, index) => (index < palette.length ? palette[index] : fallback))
 }
 
 /**
@@ -156,8 +154,5 @@ export function toNested(data, key, label) {
  * @returns {Object} with keys as items in a and values as items in b
  */
 export function repeatAcross(b, a) {
-	return a.reduce(
-		(acc, item, index) => ({ ...acc, [item]: b[index % b.length] }),
-		{}
-	)
+	return a.reduce((acc, item, index) => ({ ...acc, [item]: b[index % b.length] }), {})
 }