@rokkit/chart 1.3.7 → 1.3.9

package/dist/lib/brewing/axes.svelte.js

@@ -1,270 +0,0 @@
-// import { scaleBand } from 'd3-scale'
-
-import {} from './types.js'
-
-/**
- * @typedef {import('./types').TickData} TickData
- * @typedef {import('./types').AxisData} AxisData
- * @typedef {import('./types').ChartScales} ChartScales
- * @typedef {import('./types').ChartDimensions} ChartDimensions
- */
-
-const IDENTITY = (v) => v
-
-/**
- * @param {Object} xScale
- * @param {number|null} tickCount
- * @returns {Array}
- */
-function xTicksFromContinuous(xScale, tickCount) {
-	return tickCount !== null ? xScale.ticks(tickCount) : xScale.ticks()
-}
-
-/**
- * @param {Array} domain
- * @param {number} tickCount
- * @returns {Array}
- */
-function downsampleDomain(domain, tickCount) {
-	const step = Math.max(1, Math.floor(domain.length / tickCount))
-	return domain.filter((_, i) => i % step === 0)
-}
-
-/**
- * @param {Object} xScale
- * @param {number|null} tickCount
- * @returns {Array}
- */
-function xTicksFromBand(xScale, tickCount) {
-	const domain = xScale.domain()
-	if (tickCount === null || tickCount >= domain.length) return domain
-	return downsampleDomain(domain, tickCount)
-}
-
-/**
- * @param {Object} xScale
- * @param {number|null} tickCount
- * @returns {Array}
- */
-function resolveXTicks(xScale, tickCount) {
-	return xScale.ticks ? xTicksFromContinuous(xScale, tickCount) : xTicksFromBand(xScale, tickCount)
-}
-
-/**
- * @param {Object} xScale
- * @param {unknown} value
- * @returns {number}
- */
-function xPosition(xScale, value) {
-	return xScale.bandwidth ? xScale(value) + xScale.bandwidth() / 2 : xScale(value)
-}
-
-/**
- * @param {Object} scale
- * @param {Array} values
- * @param {Function} formatter
- * @param {(scale: Object, v: unknown) => number} getPosition
- * @returns {Array}
- */
-function mapTicks(scale, values, formatter, getPosition) {
-	return values.map((value) => ({
-		value,
-		position: getPosition(scale, value),
-		formattedValue: formatter(value)
-	}))
-}
-
-/**
- * @param {Object} options
- * @returns {{ tickCount: number|null, formatter: Function, label: string }}
- */
-function parseAxisOptions(options) {
-	const opts = options || {}
-	return {
-		tickCount: opts.tickCount !== undefined ? opts.tickCount : null,
-		formatter: opts.tickFormat ? opts.tickFormat : IDENTITY,
-		label: opts.label ? opts.label : ''
-	}
-}
-
-/**
- * Creates x-axis tick data for rendering
- *
- * @param {Object} scales - Chart scales
- * @param {Function} scales.x - X-axis scale
- * @param {Object} dimensions - Chart dimensions
- * @param {Object} options - Axis options
- * @param {number} [options.tickCount] - Number of ticks to show
- * @param {Function} [options.tickFormat] - Tick formatting function
- * @param {string} [options.label] - Axis label
- * @returns {AxisData} Axis rendering data
- */
-export function createXAxis(scales, dimensions, options) {
-	if (!scales.x) return { ticks: [] }
-	const { tickCount, formatter, label } = parseAxisOptions(options)
-	const ticks = mapTicks(scales.x, resolveXTicks(scales.x, tickCount), formatter, xPosition)
-	return {
-		ticks,
-		label,
-		transform: `translate(0, ${dimensions.innerHeight})`,
-		labelTransform: `translate(${dimensions.innerWidth / 2}, 35)`
-	}
-}
-
-/**
- * @param {Object} yScale
- * @param {number|null} tickCount
- * @returns {Array}
- */
-function yTicksFromDomain(yScale, tickCount) {
-	const domain = yScale.domain()
-	if (tickCount === null || domain.length <= tickCount) return domain
-	return downsampleDomain(domain, tickCount)
-}
-
-/**
- * @param {Object} yScale
- * @param {number|null} tickCount
- * @returns {Array}
- */
-function resolveYTicks(yScale, tickCount) {
-	if (yScale.ticks) return tickCount !== null ? yScale.ticks(tickCount) : yScale.ticks()
-	if (yScale.domain) return yTicksFromDomain(yScale, tickCount)
-	return []
-}
-
-/**
- * @param {Object} scale
- * @param {unknown} value
- * @returns {unknown}
- */
-function yPositionPassthrough(scale, value) {
-	return scale(value)
-}
-
-/**
- * Creates y-axis tick data for rendering
- *
- * @param {Object} scales - Chart scales
- * @param {Function} scales.y - Y-axis scale
- * @param {Object} dimensions - Chart dimensions
- * @param {Object} options - Axis options
- * @param {number} [options.tickCount] - Number of ticks to show
- * @param {Function} [options.tickFormat] - Tick formatting function
- * @param {string} [options.label] - Axis label
- * @returns {AxisData} Axis rendering data
- */
-export function createYAxis(scales, dimensions, options) {
-	if (!scales.y) return { ticks: [] }
-	const { tickCount, formatter, label } = parseAxisOptions(options)
-	const ticks = mapTicks(
-		scales.y,
-		resolveYTicks(scales.y, tickCount),
-		formatter,
-		yPositionPassthrough
-	)
-	return {
-		ticks,
-		label,
-		transform: 'translate(0, 0)',
-		labelTransform: `translate(-40, ${dimensions.innerHeight / 2}) rotate(-90)`
-	}
-}
-
-/**
- * @param {Object} scales
- * @param {Object} dimensions
- * @param {number|null} xTickCount
- * @returns {Array}
- */
-function buildXLines(scales, dimensions, xTickCount) {
-	return createXAxis(scales, dimensions, { tickCount: xTickCount }).ticks.map((tick) => ({
-		x1: tick.position,
-		y1: 0,
-		x2: tick.position,
-		y2: dimensions.innerHeight
-	}))
-}
-
-/**
- * @param {Object} scales
- * @param {Object} dimensions
- * @param {number|null} yTickCount
- * @returns {Array}
- */
-function buildYLines(scales, dimensions, yTickCount) {
-	return createYAxis(scales, dimensions, { tickCount: yTickCount }).ticks.map((tick) => ({
-		x1: 0,
-		y1: tick.position,
-		x2: dimensions.innerWidth,
-		y2: tick.position
-	}))
-}
-
-/**
- * @param {Object} opts
- * @returns {{ direction: string, xTickCount: number|null, yTickCount: number|null }}
- */
-function parseGridOptions(opts) {
-	const o = opts || {}
-	return {
-		direction: o.direction !== undefined ? o.direction : 'both',
-		xTickCount: o.xTickCount !== undefined ? o.xTickCount : null,
-		yTickCount: o.yTickCount !== undefined ? o.yTickCount : null
-	}
-}
-
-/**
- * @param {string} direction
- * @returns {{ showX: boolean, showY: boolean }}
- */
-function gridDirections(direction) {
-	return {
-		showX: direction === 'x' || direction === 'both',
-		showY: direction === 'y' || direction === 'both'
-	}
-}
-
-/**
- * Creates grid line data for rendering
- *
- * @param {Object} scales - Chart scales
- * @param {Object} dimensions - Chart dimensions
- * @param {Object} options - Grid options
- * @param {string} [options.direction='both'] - Grid direction ('x', 'y', or 'both')
- * @param {number} [options.xTickCount] - Number of x-axis ticks
- * @param {number} [options.yTickCount] - Number of y-axis ticks
- * @returns {Object} Grid rendering data
- */
-export function createGrid(scales, dimensions, options) {
-	const { direction, xTickCount, yTickCount } = parseGridOptions(options)
-	const { showX, showY } = gridDirections(direction)
-	return {
-		xLines: showX && scales.x ? buildXLines(scales, dimensions, xTickCount) : [],
-		yLines: showY && scales.y ? buildYLines(scales, dimensions, yTickCount) : []
-	}
-}
-
-/**
- * Creates DOM attributes for a tick element
- *
- * @param {TickData} tick - Tick data
- * @param {string} axis - Axis type ('x' or 'y')
- * @returns {Object} Attributes for the tick
- */
-export function createTickAttributes(tick, axis) {
-	if (axis === 'x') {
-		return {
-			'data-plot-tick': 'major',
-			transform: `translate(${tick.position}, 0)`,
-			'text-anchor': 'middle'
-		}
-	} else {
-		return {
-			'data-plot-tick': 'major',
-			transform: `translate(0, ${tick.position})`,
-			'text-anchor': 'end',
-			'dominant-baseline': 'middle'
-		}
-	}
-}

package/dist/lib/brewing/bars.svelte.d.ts

@@ -1,56 +0,0 @@
-/**
- * Creates bar data for rendering
- *
- * @param {Array} data - Chart data
- * @param {Object} fields - Field mappings
- * @param {string} fields.x - X-axis field
- * @param {string} fields.y - Y-axis field
- * @param {string} fields.color - Color field (optional)
- * @param {Object} scales - Chart scales
- * @param {Function} scales.x - X-axis scale
- * @param {Function} scales.y - Y-axis scale
- * @param {Function} scales.color - Color scale
- * @param {Object} options - Options including dimensions and defaultColor
- * @param {Object} options.dimensions - Chart dimensions
- * @param {string} [options.defaultColor='#4682b4'] - Default color if no color scale
- * @returns {BarData[]} Bar data for rendering
- */
-export function createBars(data: any[], fields: {
-    x: string;
-    y: string;
-    color: string;
-}, scales: {
-    x: Function;
-    y: Function;
-    color: Function;
-}, options: {
-    dimensions: Object;
-    defaultColor?: string | undefined;
-}): BarData[];
-/**
- * Filter bars based on a selection criteria
- *
- * @param {BarData[]} bars - Bar data array
- * @param {Object} selection - Selection criteria
- * @returns {BarData[]} Filtered bars
- */
-export function filterBars(bars: BarData[], selection: Object): BarData[];
-/**
- * Creates a grouped bars layout
- *
- * @param {Array} data - Chart data
- * @param {Object} fields - Field mappings
- * @param {Object} scales - Chart scales
- * @param {Object} options - Options including dimensions and padding
- * @param {Object} options.dimensions - Chart dimensions
- * @param {number} [options.padding=0.1] - Padding between bars in a group
- * @returns {Object} Grouped bar data
- */
-export function createGroupedBars(data: any[], fields: Object, scales: Object, options: {
-    dimensions: Object;
-    padding?: number | undefined;
-}): Object;
-export type BarData = import("./types").BarData;
-export type ScaleFields = import("./types").ScaleFields;
-export type ChartScales = import("./types").ChartScales;
-export type ChartDimensions = import("./types").ChartDimensions;

package/dist/lib/brewing/bars.svelte.js

@@ -1,201 +0,0 @@
-import { SvelteSet } from 'svelte/reactivity'
-import {} from './types.js'
-
-/**
- * @typedef {import('./types').BarData} BarData
- * @typedef {import('./types').ScaleFields} ScaleFields
- * @typedef {import('./types').ChartScales} ChartScales
- * @typedef {import('./types').ChartDimensions} ChartDimensions
- */
-
-const DEFAULT_COLOR = '#4682b4'
-
-/**
- * @param {Object} d - data item
- * @param {{ fields: Object, scales: Object, dimensions: Object, defaultColor: string }} ctx
- * @returns {BarData}
- */
-function buildBar(d, ctx) {
-	const { fields, scales, dimensions, defaultColor } = ctx
-	const { x: xField, y: yField, color: colorField } = fields
-	const barWidth = scales.x.bandwidth ? scales.x.bandwidth() : 10
-	const barX = scales.x.bandwidth ? scales.x(d[xField]) : scales.x(d[xField]) - barWidth / 2
-	return {
-		data: d,
-		x: barX,
-		y: scales.y(d[yField]),
-		width: barWidth,
-		height: dimensions.innerHeight - scales.y(d[yField]),
-		color: colorField && scales.color ? scales.color(d[colorField]) : defaultColor
-	}
-}
-
-/**
- * @param {Object} options
- * @param {Object} fields
- * @param {Object} scales
- * @returns {{ ctx: Object }|null} null if input is invalid
- */
-function parseBarsInput(options, fields, scales) {
-	if (!scales.x || !scales.y) return null
-	const opts = options || {}
-	return {
-		fields,
-		scales,
-		dimensions: opts.dimensions,
-		defaultColor: opts.defaultColor !== undefined ? opts.defaultColor : DEFAULT_COLOR
-	}
-}
-
-/**
- * Creates bar data for rendering
- *
- * @param {Array} data - Chart data
- * @param {Object} fields - Field mappings
- * @param {string} fields.x - X-axis field
- * @param {string} fields.y - Y-axis field
- * @param {string} fields.color - Color field (optional)
- * @param {Object} scales - Chart scales
- * @param {Function} scales.x - X-axis scale
- * @param {Function} scales.y - Y-axis scale
- * @param {Function} scales.color - Color scale
- * @param {Object} options - Options including dimensions and defaultColor
- * @param {Object} options.dimensions - Chart dimensions
- * @param {string} [options.defaultColor='#4682b4'] - Default color if no color scale
- * @returns {BarData[]} Bar data for rendering
- */
-export function createBars(data, fields, scales, options) {
-	if (!data || !data.length) return []
-	const ctx = parseBarsInput(options, fields, scales)
-	if (!ctx) return []
-	return data.map((d) => buildBar(d, ctx))
-}
-
-/**
- * Filter bars based on a selection criteria
- *
- * @param {BarData[]} bars - Bar data array
- * @param {Object} selection - Selection criteria
- * @returns {BarData[]} Filtered bars
- */
-export function filterBars(bars, selection) {
-	if (!selection) return bars
-
-	return bars.filter((bar) => {
-		for (const [key, value] of Object.entries(selection)) {
-			if (bar.data[key] !== value) return false
-		}
-		return true
-	})
-}
-
-/**
- * @param {Object} item - data item
- * @param {Object} scales - chart scales
- * @param {{ yField: string, colorField: string, group: unknown, barX: number, barWidth: number, dimensions: Object }} ctx
- * @returns {BarData}
- */
-function buildGroupBar(item, scales, ctx) {
-	const { yField, colorField, group, barX, barWidth, dimensions } = ctx
-	return {
-		data: item,
-		group,
-		x: barX,
-		y: scales.y(item[yField]),
-		width: barWidth,
-		height: dimensions.innerHeight - scales.y(item[yField]),
-		color: scales.color ? scales.color(item[colorField]) : DEFAULT_COLOR
-	}
-}
-
-/**
- * @param {Object} scales
- * @param {{ groupItems: Array, groupField: string, group: unknown, i: number, yField: string, colorField: string, barWidth: number, padding: number, dimensions: Object, xPos: number }} ctx
- * @returns {BarData|null}
- */
-function buildOneGroupBar(scales, ctx) {
-	const {
-		groupItems,
-		groupField,
-		group,
-		i,
-		yField,
-		colorField,
-		barWidth,
-		padding,
-		dimensions,
-		xPos
-	} = ctx
-	const item = groupItems.find((d) => d[groupField] === group)
-	if (!item) return null
-	const barX = xPos + i * (barWidth + padding)
-	return buildGroupBar(item, scales, { yField, colorField, group, barX, barWidth, dimensions })
-}
-
-/**
- * @param {Object} fields
- * @param {Object} options
- * @returns {{ xField: string, yField: string, groupField: string, colorField: string, dimensions: Object, padding: number }}
- */
-function parseGroupedBarsConfig(fields, options) {
-	const opts = options || {}
-	return {
-		xField: fields.x,
-		yField: fields.y,
-		groupField: fields.group,
-		colorField: fields.color !== undefined ? fields.color : fields.group,
-		dimensions: opts.dimensions,
-		padding: opts.padding !== undefined ? opts.padding : 0.1
-	}
-}
-
-/**
- * Creates a grouped bars layout
- *
- * @param {Array} data - Chart data
- * @param {Object} fields - Field mappings
- * @param {Object} scales - Chart scales
- * @param {Object} options - Options including dimensions and padding
- * @param {Object} options.dimensions - Chart dimensions
- * @param {number} [options.padding=0.1] - Padding between bars in a group
- * @returns {Object} Grouped bar data
- */
-export function createGroupedBars(data, fields, scales, options) {
-	if (!data || !data.length || !fields.group) return { groups: [], bars: [] }
-
-	const { xField, yField, groupField, colorField, dimensions, padding } = parseGroupedBarsConfig(
-		fields,
-		options
-	)
-
-	const groups = [...new SvelteSet(data.map((d) => d[groupField]))]
-	const xValues = [...new SvelteSet(data.map((d) => d[xField]))]
-
-	const xScale = scales.x
-	const groupWidth = xScale.bandwidth ? xScale.bandwidth() : 20
-	const barWidth = (groupWidth - padding * (groups.length - 1)) / groups.length
-
-	const bars = []
-	xValues.forEach((xValue) => {
-		const groupItems = data.filter((d) => d[xField] === xValue)
-		const xPos = xScale(xValue)
-		groups.forEach((group, i) => {
-			const ctx = {
-				groupItems,
-				groupField,
-				group,
-				i,
-				yField,
-				colorField,
-				barWidth,
-				padding,
-				dimensions,
-				xPos
-			}
-			const bar = buildOneGroupBar(scales, ctx)
-			if (bar) bars.push(bar)
-		})
-	})
-
-	return { groups, bars }
-}

package/dist/lib/brewing/brewer.svelte.d.ts

@@ -1,124 +0,0 @@
-export function buildLegendGroups(channels: any, colorMap: any, patternMap: any, symbolMap: any): {
-    field: any;
-    items: any;
-}[];
-export class ChartBrewer {
-    /**
-     * Override in subclasses to apply stat aggregation.
-     * @param {Object[]} data
-     * @param {Object} channels
-     * @param {string|Function} stat
-     * @returns {Object[]}
-     */
-    transform(data: Object[], _channels: any, _stat: any): Object[];
-    /** Aggregated data — all derived marks read this, not #rawData */
-    processedData: Object[];
-    /** Exposes channels to subclasses for use in their own $derived properties */
-    get channels(): {};
-    /** @type {Map<unknown, {fill:string,stroke:string}>} */
-    colorMap: Map<unknown, {
-        fill: string;
-        stroke: string;
-    }>;
-    /** @type {Map<unknown, string>} */
-    patternMap: Map<unknown, string>;
-    /**
-     * Unified pattern defs for ChartPatternDefs.
-     * When fill and pattern map the same field, pattern key = color key (simple case).
-     * When they differ, each unique (fillKey, patternKey) pair gets its own pattern def
-     * so bars/areas can have distinct colors per region AND distinct textures per category.
-     * @type {Array<{ id: string, name: string, fill: string, stroke: string }>}
-     */
-    patternDefs: Array<{
-        id: string;
-        name: string;
-        fill: string;
-        stroke: string;
-    }>;
-    /** @type {Map<unknown, string>} */
-    symbolMap: Map<unknown, string>;
-    get innerWidth(): number;
-    get innerHeight(): number;
-    xScale: import("d3-scale").ScaleBand<string> | (number[] & import("d3-scale").ScaleLinear<number, number, never>) | null;
-    yScale: import("d3-scale").ScaleLinear<number, number, never> | null;
-    sizeScale: import("d3-scale").ScalePower<number, number, never> | null;
-    bars: any;
-    lines: {
-        d: string | null;
-        fill: string;
-        stroke: string;
-        points: {
-            x: number;
-            y: number;
-            data: Record<string, unknown>;
-            i: number;
-        }[];
-        key?: unknown;
-    }[];
-    areas: {
-        d: string | null;
-        fill: any;
-        stroke: string;
-        key: any;
-        colorKey: any;
-        patternKey: any;
-        patternId: string | null;
-    }[] | {
-        d: never;
-        fill: any;
-        stroke: string;
-        colorKey: null;
-        patternKey: null;
-        patternId: null;
-    }[];
-    arcs: {
-        d: string | null;
-        fill: string;
-        stroke: string;
-        key: unknown;
-        patternId: string | null;
-        pct: number;
-        centroid: [number, number];
-        data: Record<string, unknown>;
-    }[];
-    points: {
-        data: Record<string, unknown>;
-        cx: number;
-        cy: number;
-        r: number;
-        fill: string;
-        stroke: string;
-        symbolPath: string | null;
-        key: unknown;
-    }[];
-    legendGroups: {
-        field: any;
-        items: any;
-    }[];
-    get margin(): {
-        top: number;
-        right: number;
-        bottom: number;
-        left: number;
-    };
-    get width(): number;
-    get height(): number;
-    get mode(): string;
-    /**
-     * @param {{ data?: Object[], channels?: Object, width?: number, height?: number, mode?: string, margin?: Object, layers?: Object[], curve?: string, stat?: string|Function }} opts
-     *   Supported channel keys: `x`, `y`, `fill`, `color`, `pattern`, `symbol`, `size`, `label`.
-     *   `frame` is reserved for future animation use (no-op).
-     */
-    update(opts?: {
-        data?: Object[];
-        channels?: Object;
-        width?: number;
-        height?: number;
-        mode?: string;
-        margin?: Object;
-        layers?: Object[];
-        curve?: string;
-        stat?: string | Function;
-    }): void;
-    #private;
-}