Chartjs

createChartAuto :: HTMLElement -> ChartConfig -> Callbacks -> Effect ChartInstance

Create a Chart.js instance with automatic overlay routing. Inspects the config + callbacks via hasOverlays; if there are any non-JSON values (callbacks, gradient/pattern colors, image point styles) it dispatches to createChartWithCallbacks, otherwise it uses the plain createChart. This is the safe default — it produces the same chart either way and never silently drops an overlay value.

Consumers with no callbacks can pass defaultCallbacks:

inst <- createChartAuto canvas myConfig defaultCallbacks

updateChartAuto :: ChartInstance -> ChartConfig -> Callbacks -> Maybe String -> Effect Unit

Update a Chart.js instance with automatic overlay routing. Mirrors createChartAuto: dispatches to updateChartWithCallbacks when the config contains overlays, otherwise uses plain updateChart. The mode parameter is forwarded to the underlying chart.update(mode) call — pass Just "none" to suppress the animation on update.

data TooltipItem

Opaque type for a Chart.js tooltip item in tooltip callbacks.

type TooltipCallbacks = { afterBody :: Maybe (EffectFn1 (Array TooltipItem) String), afterFooter :: Maybe (EffectFn1 (Array TooltipItem) String), afterLabel :: Maybe (EffectFn1 TooltipItem String), afterTitle :: Maybe (EffectFn1 (Array TooltipItem) String), beforeBody :: Maybe (EffectFn1 (Array TooltipItem) String), beforeFooter :: Maybe (EffectFn1 (Array TooltipItem) String), beforeLabel :: Maybe (EffectFn1 TooltipItem String), beforeTitle :: Maybe (EffectFn1 (Array TooltipItem) String), footer :: Maybe (EffectFn1 (Array TooltipItem) String), label :: Maybe (EffectFn1 TooltipItem String), labelColor :: Maybe (EffectFn1 TooltipItem Foreign), labelPointStyle :: Maybe (EffectFn1 TooltipItem Foreign), labelTextColor :: Maybe (EffectFn1 TooltipItem String), title :: Maybe (EffectFn1 (Array TooltipItem) String) }

Tooltip formatting callbacks. Callbacks receiving a single TooltipItem are called per-dataset. Callbacks receiving an array are called once for the whole tooltip.

type TickCallback = EffectFn3 Foreign Int (Array Foreign) String

Tick formatting callback: (value, index, ticks) -> formatted label

data LegendItem

Opaque type for a Chart.js legend item in legend callbacks.

data Legend

Opaque type for the Chart.js legend object in legend callbacks.

type ComponentInput = { callbacks :: Callbacks, config :: ChartConfig, updateMode :: Maybe String }

Input for the Halogen chart component: a config, optional callbacks, and an update mode controlling animation on data changes.

type Callbacks = { animationOnComplete :: Maybe (EffectFn1 Foreign Unit), animationOnProgress :: Maybe (EffectFn1 Foreign Unit), legendGenerateLabels :: Maybe (EffectFn1 ChartInstance (Array Foreign)), legendLabelsFilter :: Maybe (EffectFn2 LegendItem Foreign Boolean), legendLabelsSort :: Maybe (EffectFn3 LegendItem LegendItem Foreign Int), legendOnClick :: Maybe (EffectFn3 Event LegendItem Legend Unit), legendOnHover :: Maybe (EffectFn3 Event LegendItem Legend Unit), legendOnLeave :: Maybe (EffectFn3 Event LegendItem Legend Unit), onClick :: Maybe (EffectFn3 Event (Array ActiveElement) ChartInstance Unit), onHover :: Maybe (EffectFn3 Event (Array ActiveElement) ChartInstance Unit), onResize :: Maybe (EffectFn2 ChartInstance { height :: Number, width :: Number } Unit), scaleCallbacks :: Maybe (Object ScaleLifecycleCallbacks), tickCallbacks :: Maybe (Object TickCallback), tooltipCallbacks :: Maybe TooltipCallbacks, tooltipExternal :: Maybe (EffectFn1 Foreign Unit), tooltipFilter :: Maybe (EffectFn4 Foreign Int (Array Foreign) Foreign Boolean), tooltipItemSort :: Maybe (EffectFn3 Foreign Foreign Foreign Int) }

Chart.js event callbacks (click, hover, resize, legend, tooltip, ticks).

data ActiveElement

Opaque type for a Chart.js active element in event callbacks.

simpleInput :: ChartConfig -> ComponentInput

Create a ComponentInput from just a ChartConfig (no callbacks). Defaults to Just "none" for updateMode to suppress animation on updates.

hasOverlays :: Callbacks -> ChartConfig -> Boolean

Check if there are any overlays that need to be merged. Returns true for any of: callbacks, non-CSS colors (gradient/pattern), scriptable color functions (SIFn), image point styles, scriptable non-color fields, per-chart-type dataset-defaults overlays under options.datasets, or inline plugins. Drives the createChartAuto routing decision.

hasCallbacks :: Callbacks -> Boolean

Check if any callbacks are set.

defaultTooltipCallbacks :: TooltipCallbacks

All optional fields set to Nothing.

defaultCallbacks :: Callbacks

All optional fields set to Nothing.

callbacksToForeign :: Callbacks -> Foreign

Convert Callbacks to a plain JS object for the FFI merge function.

buildOverlays :: Callbacks -> ChartConfig -> Foreign

Build a combined overlays object containing callbacks plus dataset overlays (non-CSS colors, scriptable color functions, image point styles, scriptable non-color fields), plus per-chart-type dataset- defaults overlays (same categories at options.datasets.{type}), plus inline plugins (#24). This is the main entry point for the FFI merge function.

type ColorStop = { color :: String, offset :: Number }

A gradient color stop with an offset (0–1) and CSS color string.

scriptableIndexablePointStyleToForeign :: ScriptableIndexable PointStyle -> Foreign

Convert a ScriptableIndexable PointStyle to Foreign. SIFn functions are wrapped as JS closures whose return value is passed through pointStyleToForeign so the live Chart.js call site sees an already- encoded point style (string or image reference).

scriptableIndexableColorToForeign :: ScriptableIndexable Color -> Foreign

Convert a ScriptableIndexable Color to Foreign. SIVal / SIArray pass through colorToForeign directly; SIFn is wrapped as a JS closure via Chartjs.Scriptable.scriptableIndexableToForeign so the color returned by the PS function is colorToForeign-encoded before Chart.js sees it.

pointStyleToForeign :: PointStyle -> Foreign

Convert a PointStyle to a Foreign value for direct JS use. String variants become strings, PSFalse becomes the JS boolean false, and PSImage passes through the wrapped HTMLImageElement / HTMLCanvasElement reference unchanged.

indexablePointStyleToForeign :: Indexable PointStyle -> Foreign

Convert an Indexable PointStyle to Foreign. Retained for backwards compatibility — new code should use scriptableIndexablePointStyleToForeign since all PointStyle dataset fields are now ScriptableIndexable after #22.

extractDatasetsDefaultsOverlay :: DatasetsDefaults -> Maybe Foreign

Extract overlays from per-chart-type DatasetsDefaults entries (options.datasets.{line,bar,bubble,...}). Returns Nothing when every chart-type slot is either Nothing or contains only JSON- compatible values. Otherwise returns a Foreign object keyed by chart type string whose values are the per-type dataset overlays from extractDatasetOverlay — the same shape mergeOverlays in FFI.js already understands for regular dataset overlays, just namespaced into a different merge target.

Without this helper, a consumer writing SIFn, a gradient, an image point style on DatasetDefaults would silently lose the value: the JSON encoder emits null for the non-serializable form, and if nothing routes the real value onto config.options.datasets[type], Chart.js falls back to its built- in palette.

extractDatasetOverlays :: forall r. Array (Record (DatasetCommonRow r)) -> Maybe (Array Foreign)

Extract dataset overlays for every dataset in the config. Covers the same categories as extractDatasetOverlay: gradient/pattern colors, scriptable color functions, and image point styles. Returns Nothing if no dataset has any non-JSON values, signalling the overlay merge can be skipped entirely.

extractDatasetOverlay :: forall r. Record (DatasetCommonRow r) -> Maybe Foreign

Extract non-JSON fields from a dataset (or dataset-defaults record) as a Foreign object. Covers:

• gradient/pattern colors and scriptable color functions (#21)
• image point styles (#17) and scriptable pointStyle functions (#22)
• per-segment line styling (#23, moved to JSON path in #32)
• scriptable numeric / boolean / enum / compound fields (#22) — SIFn / SFn forms of borderWidth, borderRadius, border- Skipped, inflateAmount, base, pointRadius, radius, offset, rotation, borderAlign, circular, fill, etc.

Returns Nothing when every one of these fields contains only JSON-compatible values.

Row-polymorphic in r so the same extractor works on both Dataset (which adds label + data on top of DatasetCommonRow ()) and DatasetDefaults (which closes the row with ()). This is what lets extractDatasetsDefaultsOverlay reuse the dataset logic without duplication.

createRadialGradient :: HTMLCanvasElement -> { r0 :: Number, r1 :: Number, x0 :: Number, x1 :: Number, y0 :: Number, y1 :: Number } -> Array ColorStop -> Effect CanvasGradient

Create a radial gradient on a canvas.

createPattern :: HTMLCanvasElement -> Foreign -> String -> Effect CanvasPattern

Create a pattern on a canvas from an image element.

createLinearGradient :: HTMLCanvasElement -> { x0 :: Number, x1 :: Number, y0 :: Number, y1 :: Number } -> Array ColorStop -> Effect CanvasGradient

Create a linear gradient on a canvas.

colorToForeign :: Color -> Foreign

Convert a Color to a Foreign value for direct JS use.

toChartJsConfig :: ChartConfig -> Json

Convert a ChartConfig to the JSON structure Chart.js expects.

data ChartInstance

Opaque handle to a Chart.js instance.

updateChartWithCallbacks :: ChartInstance -> Json -> Foreign -> Maybe String -> Effect Unit

Update a chart with a new JSON config and a callbacks/overlays object. The mode parameter controls animation: Nothing for default animation, Just "none" to skip animation, or any other Chart.js update mode.

updateChart :: ChartInstance -> Json -> Maybe String -> Effect Unit

Update an existing chart with a new JSON config. The mode parameter controls animation: Nothing for default animation, Just "none" to skip animation, or any other Chart.js update mode.

toggleDataVisibility :: ChartInstance -> Int -> Effect Unit

Toggle the visibility of a single data element by its index within the dataset. Inverts the current visibility flag on the matching meta entry. Call updateChart afterwards to render the change.

toBase64Image :: ChartInstance -> Maybe String -> Maybe Number -> Effect String

Export the chart as a base64-encoded image data URL. The type parameter is a MIME type (e.g. "image/png", "image/jpeg"). The quality parameter is 0-1 for lossy formats like JPEG.

stopChart :: ChartInstance -> Effect ChartInstance

Stop the current animation. Returns the chart instance for chaining.

showDataset :: ChartInstance -> Int -> Maybe Int -> Effect Unit

Show a dataset or a specific data element with animation. Pass Nothing for dataIndex to show the entire dataset.

setDatasetVisibility :: ChartInstance -> Int -> Boolean -> Effect Unit

Set the visibility of a dataset. Call updateChart afterward to render.

setActiveElements :: ChartInstance -> Array { datasetIndex :: Int, index :: Int } -> Effect Unit

Programmatically set the active elements (e.g. to highlight a data point from outside a hover handler). Each entry must specify a datasetIndex and index. Call updateChart to apply.

resizeChart :: ChartInstance -> Maybe Number -> Maybe Number -> Effect Unit

Adjust canvas dimensions. Pass Nothing for both width and height to resize to match the container. Normally called automatically when the container resizes; call this explicitly if you changed the container size imperatively.

resetChart :: ChartInstance -> Effect Unit

Restore the chart to its initial state before animations began. A subsequent updateChart call will trigger new animations.

renderChart :: ChartInstance -> Effect Unit

Trigger a redraw of existing chart elements. Does NOT update elements for new data — use updateChart when data changes.

isPluginEnabled :: ChartInstance -> String -> Effect Boolean

Check whether a Chart.js plugin is currently enabled by its plugin id (the string returned by the plugin's id field). Useful for conditional behavior in custom plugins.

isDatasetVisible :: ChartInstance -> Int -> Effect Boolean

Check whether a dataset is currently visible.

interactionOptionsToForeign :: InteractionOptions -> Foreign

Convert InteractionOptions to a plain JS object suitable for passing to Chart.js's getElementsAtEventForMode. Nothing fields are dropped so Chart.js uses its defaults for them. Exported for testing — callers normally use getElementsAtEventForMode directly.

hideDataset :: ChartInstance -> Int -> Maybe Int -> Effect Unit

Hide a dataset or a specific data element with animation. Pass Nothing for dataIndex to hide the entire dataset.

getVisibleDatasetCount :: ChartInstance -> Effect Int

Return the number of currently visible datasets.

getSortedVisibleDatasetMetas :: ChartInstance -> Effect (Array Foreign)

Get the sorted list of visible dataset metadata objects. Each entry is the same opaque Foreign shape returned by getDatasetMeta, filtered to only the visible datasets and sorted in draw order.

getElementsAtEventForMode :: ChartInstance -> Event -> InteractionMode -> InteractionOptions -> Boolean -> Effect (Array InteractionItem)

Find chart elements matching an event for a given interaction mode. Useful for click handlers that need to know which point/bar/arc was hit. The useFinalPosition flag controls whether to use the animation's final position (true) or current position (false).

getDatasetMeta :: ChartInstance -> Int -> Effect Foreign

Look up the internal metadata object for a dataset by index. The returned Foreign is Chart.js's ChartMeta — a mutable bag of controller/scale/data references. Consumers who need specific fields (e.g. data, visible, hidden) coerce via Foreign operations.

getDataVisibility :: ChartInstance -> Int -> Effect Boolean

Check whether a single data element is currently visible.

getChartByElement :: HTMLElement -> Effect (Maybe ChartInstance)

Look up an existing chart instance by its canvas element. Returns Nothing if no chart is currently bound to the canvas. Useful for accessing a chart from outside the code that created it (e.g. from a separate event handler that has only the DOM reference).

getChartByCanvasId :: String -> Effect (Maybe ChartInstance)

Look up an existing chart instance by canvas element id (the id attribute of the underlying <canvas>). Returns Nothing if no matching canvas exists or no chart is bound to it.

getActiveElements :: ChartInstance -> Effect (Array Foreign)

Get the array of currently active (hovered or otherwise highlighted) chart elements. Each entry is an opaque Foreign wrapping Chart.js's ActiveElement (which has datasetIndex, index, and element).

destroyChart :: ChartInstance -> Effect Unit

Destroy a chart instance and release its resources.

createChartWithCallbacks :: HTMLElement -> Json -> Foreign -> Effect ChartInstance

Create a chart with a JSON config and a callbacks/overlays object.

createChart :: HTMLElement -> Json -> Effect ChartInstance

Create a new Chart.js instance on a canvas element with a JSON config.

clearChart :: ChartInstance -> Effect ChartInstance

Clear the chart canvas. Used internally between animation frames; rarely needed directly. Returns the chart instance for chaining.

chartUnregister :: Array Foreign -> Effect Unit

Reverse chartRegister. Removes the given components from the global registry. Mostly useful for tests; production code rarely needs to unregister.

chartRegistry :: Effect Foreign

Get the global Chart.js registry as an opaque Foreign value. The registry exposes typed sub-registries (controllers, plugins, scales, elements) plus generic add / remove methods. Use this for advanced registration scenarios — registering a custom interaction mode (via Chart.helpers.registry) or a custom tooltip positioner, both of which the typed PureScript API does not yet model. Consumers using this should reference Chart.js's registry API docs directly.

chartRegister :: Array Foreign -> Effect Unit

Register one or more Chart.js components (controllers, plugins, scales, or elements) globally. Each item must be a JS object the Chart.js registry recognizes — typically a controller class with an id field. After registration, the component is available to all subsequent chart instances in this process. Pair with CustomType from Chartjs.Types (#27) to use a registered controller as a chart type.

The PS argument is Array Foreign because Chart.js components are arbitrary JS objects (and registering plugins / controllers / scales / elements works the same way at the API level). Build the components in JS or via unsafeToForeign from PS.

scriptableToForeign :: forall a. (a -> Foreign) -> Scriptable a -> Foreign

Encode a Scriptable a to Foreign. Static SVal values pass through the supplied encoder; SFn functions become JS closures that apply the encoder to their return value at call time — which is what Chart.js expects when it resolves scriptable options at draw time.

scriptableIndexableToForeign :: forall a. (a -> Foreign) -> ScriptableIndexable a -> Foreign

Encode a ScriptableIndexable a to Foreign. SIVal / SIArray pass through the inner encoder directly (arrays are mapped element-wise); SIFn follows the same closure-wrapping treatment as SFn.

hasScriptableIndexable :: forall a. ScriptableIndexable a -> Boolean

true when the value needs the overlay path because it holds a function.

hasScriptable :: forall a. Scriptable a -> Boolean

true when the value needs the overlay path because it holds a function.

type ScriptableTooltipContext = { chart :: Foreign, tooltip :: Foreign, tooltipItems :: Array Foreign }

Context passed by Chart.js to scriptable tooltip option functions. Mirrors Chart.js's ScriptableTooltipContext<TType>. Different from dataset-level ScriptableContext — has tooltip and tooltipItems instead of dataIndex, dataset, etc. Both tooltip and tooltipItems are left as Foreign because their shape is complex (the full TooltipModel / TooltipItem types).

data ScriptableIndexable a

Chart.js's ScriptableAndArray<T, TContext> — a value that can be a single value, a per-item array, or a scriptable function. Note that Chart.js does not allow function entries inside the array form, so this is a flat ADT rather than Indexable (Scriptable a).

Like Scriptable, the SIFn form cannot be JSON-serialized and travels through the overlay path — the chart must be created via createChartAuto (or createChartWithCallbacks) for an SIFn value to take effect. SIVal / SIArray serialize as plain JSON and work with the base createChart path.

Constructors

• SIVal a
• SIArray (Array a)
• SIFn (ScriptableContext -> a)

Instances

• (Eq a) => Eq (ScriptableIndexable a)
• (Show a) => Show (ScriptableIndexable a)

type ScriptableContext = { active :: Boolean, chart :: Foreign, dataIndex :: Int, dataset :: Foreign, datasetIndex :: Int, mode :: String, parsed :: Foreign, raw :: Foreign, type :: String }

Context passed by Chart.js to scriptable option functions at resolution time. Mirrors Chart.js's ScriptableContext<TType> interface. chart, dataset, parsed, and raw are left as Foreign because their shape varies by chart type and parsing config — consumers inspect them via Foreign operations.

data Scriptable a

A value that Chart.js accepts as either a static value or a function computed from the resolution context. Chart.js calls Scriptable functions once per affected element at draw time to pick the concrete value. Use SVal for static values and SFn (or the scriptableFn smart constructor) for dynamic ones.

SFn-wrapped functions travel through the overlay path: they cannot be JSON-serialized, so the chart must be created via createChartWithCallbacks or createChartAuto for the dynamic form to take effect. SVal-only configurations serialize as plain JSON and work with the base createChart path.

Constructors

• SVal a
• SFn (ScriptableContext -> a)

Instances

• (Eq a) => Eq (Scriptable a)
• (Show a) => Show (Scriptable a)

data ScaleMinMax

Scale min / max / suggestedMin / suggestedMax value. Numeric for linear/logarithmic/radial scales, string for category scales (matches a label) and time scales (an ISO date or any string the configured time adapter parses). Chart.js's CategoryScaleOptions and TimeScaleOptions both type these as string | number; the base CoreScaleOptions types them as unknown (fully untyped).

Constructors

• SMNumber Number
• SMString String

Instances

• Eq ScaleMinMax
• Generic ScaleMinMax _
• Show ScaleMinMax

type Radius = Cutout

Outer radius for pie/doughnut charts. Same shape as Cutout: pixels or percentage string (e.g. "100%").

data PointStyle

Point marker styles. PSFalse disables the marker. PSImage wraps an HTMLImageElement or HTMLCanvasElement for image-based point styles — the referenced element's natural width / height determine the drawn size at render time (the pointRadius field does not apply).

Image point styles cannot be JSON-serialized and go through the overlay mechanism in Chartjs.Colors / Chartjs.Callbacks — you must create the chart via createChartWithCallbacks (or anything that builds overlays) for a PSImage dataset pointStyle to render. Ensure the wrapped image has finished loading before the chart is created; Chart.js reads width/height at draw time and draws nothing if they are zero.

Note: PSImage is currently supported only on Dataset.pointStyle. Setting it on options-level fields (legend, element defaults) silently produces a null in the JSON config with no overlay replacement.

Constructors

• PSCircle
• PSCross
• PSCrossRot
• PSDash
• PSLine
• PSRect
• PSRectRounded
• PSRectRot
• PSStar
• PSTriangle
• PSFalse
• PSImage Foreign

Instances

• Eq PointStyle
• Show PointStyle

type ParsingConfig = { key :: Maybe String, xAxisKey :: Maybe String, yAxisKey :: Maybe String }

Custom parsing keys for mapping data object properties to axes. Use xAxisKey/yAxisKey for cartesian charts, key for radial charts (pie/doughnut/radar).

data LineHeight

CSS line-height value. Mirrors Chart.js's FontSpec.lineHeight which accepts a unitless number or any CSS string (e.g. "1.5em", "150%").

Constructors

• LHNumber Number
• LHString String

Instances

• Eq LineHeight
• Generic LineHeight _
• Show LineHeight

type InteractionOptions = { axis :: Maybe String, includeInvisible :: Maybe Boolean, intersect :: Maybe Boolean }

Options passed to getElementsAtEventForMode. Matches Chart.js's InteractionOptions interface — same fields as InteractionConfig minus mode (which is passed as a separate argument to the method).

type InteractionItem = { datasetIndex :: Int, element :: Foreign, index :: Int }

Single element returned from getElementsAtEventForMode. Matches Chart.js's InteractionItem. element is the underlying Chart.js element (point, bar, arc, etc.) — opaque, consumers inspect via Foreign operations if needed.

data FontWeight

CSS font-weight value. Mirrors Chart.js's FontSpec.weight which accepts specific keyword strings or a numeric weight (100–900).

Constructors

• FWNormal
• FWBold
• FWLighter
• FWBolder
• FWNumeric Number

Instances

• Eq FontWeight
• Generic FontWeight _
• Show FontWeight

type DatasetsDefaults = { bar :: Maybe DatasetDefaults, bubble :: Maybe DatasetDefaults, doughnut :: Maybe DatasetDefaults, line :: Maybe DatasetDefaults, pie :: Maybe DatasetDefaults, polarArea :: Maybe DatasetDefaults, radar :: Maybe DatasetDefaults, scatter :: Maybe DatasetDefaults }

Per-chart-type dataset defaults (options.datasets in Chart.js). Each entry supplies default field values for datasets of that chart type.

type DatasetDefaults = Record (DatasetCommonRow ())

Dataset defaults — same shape as Dataset minus the identity fields (label, data). Used as the value type of per-chart-type entries in DatasetsDefaults (options.datasets.line, options.datasets.bar, ...).

type DatasetCommonRow :: Row Type -> Row Typetype DatasetCommonRow r = (angle :: Maybe Number, animation :: Maybe AnimationSetting, animations :: Maybe AnimationsConfig, backgroundColor :: Maybe (ScriptableIndexable Color), barPercentage :: Maybe Number, barThickness :: Maybe BarThickness, base :: Maybe (ScriptableIndexable Number), borderAlign :: Maybe (ScriptableIndexable BorderAlign), borderCapStyle :: Maybe (Scriptable CapStyle), borderColor :: Maybe (ScriptableIndexable Color), borderDash :: Maybe (Scriptable (Array Number)), borderDashOffset :: Maybe (Scriptable Number), borderJoinStyle :: Maybe (ScriptableIndexable JoinStyle), borderRadius :: Maybe (ScriptableIndexable BarBorderRadius), borderSkipped :: Maybe (ScriptableIndexable BorderSkipped), borderWidth :: Maybe (ScriptableIndexable BarBorderWidth), categoryPercentage :: Maybe Number, chartType :: Maybe ChartType, circular :: Maybe (ScriptableIndexable Boolean), circumference :: Maybe Number, clip :: Maybe Clip, cubicInterpolationMode :: Maybe (Scriptable CubicInterpolationMode), datalabels :: Maybe Foreign, drawActiveElementsOnTop :: Maybe (ScriptableIndexable Boolean), fill :: Maybe (Scriptable Fill), grouped :: Maybe Boolean, hidden :: Maybe Boolean, hitRadius :: Maybe (ScriptableIndexable Number), hoverBackgroundColor :: Maybe (ScriptableIndexable Color), hoverBorderCapStyle :: Maybe (Scriptable CapStyle), hoverBorderColor :: Maybe (ScriptableIndexable Color), hoverBorderDash :: Maybe (Scriptable (Array Number)), hoverBorderDashOffset :: Maybe (Scriptable Number), hoverBorderJoinStyle :: Maybe (ScriptableIndexable JoinStyle), hoverBorderRadius :: Maybe (ScriptableIndexable BarBorderRadius), hoverBorderWidth :: Maybe (ScriptableIndexable Number), hoverOffset :: Maybe (ScriptableIndexable Number), hoverRadius :: Maybe (ScriptableIndexable Number), indexAxis :: Maybe Axis, inflateAmount :: Maybe (ScriptableIndexable InflateAmount), maxBarThickness :: Maybe Number, minBarLength :: Maybe Number, offset :: Maybe (ScriptableIndexable Number), order :: Maybe Int, parsing :: Maybe ParsingConfig, pointBackgroundColor :: Maybe (ScriptableIndexable Color), pointBorderColor :: Maybe (ScriptableIndexable Color), pointBorderWidth :: Maybe (ScriptableIndexable Number), pointHitRadius :: Maybe (ScriptableIndexable Number), pointHoverBackgroundColor :: Maybe (ScriptableIndexable Color), pointHoverBorderColor :: Maybe (ScriptableIndexable Color), pointHoverBorderWidth :: Maybe (ScriptableIndexable Number), pointHoverRadius :: Maybe (ScriptableIndexable Number), pointRadius :: Maybe (ScriptableIndexable Number), pointRotation :: Maybe (ScriptableIndexable Number), pointStyle :: Maybe (ScriptableIndexable PointStyle), radius :: Maybe (ScriptableIndexable Number), rotation :: Maybe (ScriptableIndexable Number), segment :: Maybe Foreign, showLine :: Maybe Boolean, skipNull :: Maybe Boolean, spacing :: Maybe Number, spanGaps :: Maybe SpanGaps, stack :: Maybe String, stepped :: Maybe Stepped, tension :: Maybe Number, transitions :: Maybe TransitionsConfig, weight :: Maybe Number, xAxisID :: Maybe String, yAxisID :: Maybe String | r)

Row of dataset configuration fields shared between instances (Dataset) and per-type defaults (DatasetDefaults). Parameterised by r so the row can be extended with identity fields (label/data) to form Dataset, or closed (with ()) to form DatasetDefaults.

type Dataset = { data :: Array DataPoint, label :: String | DatasetCommonRow () }

Unified dataset configuration covering all Chart.js chart types.

type ColorsPluginOptions = { enabled :: Maybe Boolean, forceOverride :: Maybe Boolean }

Built-in colors plugin options. When enabled (default true), the plugin auto-assigns colors to datasets from a built-in palette. Set forceOverride to true to override any user-set colors.

data Color

A color value that Chart.js accepts: CSS string, gradient, or pattern.

Constructors

• CSSColor String
• GradientColor CanvasGradient
• PatternColor CanvasPattern

Instances

• Eq Color
• Show Color

data ChartType

Supported Chart.js chart types. The 8 named constructors cover all built-in types; CustomType is an escape hatch for chart types registered at runtime via Chart.register(MyController), where MyController is a controller class (not a plugin) that defines a new id such as "financial", "candlestick", or a custom doughnut variant. The wrapped string in CustomType must match the controller's id field so Chart.js can look it up at draw time. Pairs naturally with roadmap item #25's registration FFI bindings, but useful standalone for any consumer who has registered a controller via raw JS.

Constructors

• Line
• Bar
• Pie
• Doughnut
• Radar
• Scatter
• Bubble
• PolarArea
• CustomType String

Instances

• Eq ChartType
• Generic ChartType _
• Show ChartType

type ChartOptions = { animation :: Maybe AnimationSetting, animations :: Maybe AnimationsConfig, aspectRatio :: Maybe Number, backgroundColor :: Maybe (ScriptableIndexable Color), borderColor :: Maybe (ScriptableIndexable Color), circumference :: Maybe Number, clip :: Maybe Clip, color :: Maybe (Scriptable Color), cutout :: Maybe Cutout, datasets :: Maybe DatasetsDefaults, devicePixelRatio :: Maybe Number, elements :: Maybe ElementsConfig, events :: Maybe (Array String), font :: Maybe Font, hover :: Maybe InteractionConfig, hoverBackgroundColor :: Maybe (ScriptableIndexable Color), hoverBorderColor :: Maybe (ScriptableIndexable Color), indexAxis :: Maybe Axis, interaction :: Maybe InteractionConfig, layout :: Maybe LayoutConfig, locale :: Maybe String, maintainAspectRatio :: Maybe Boolean, normalized :: Maybe Boolean, offset :: Maybe (Indexable Number), parsing :: Maybe ParsingConfig, plugins :: Maybe PluginsConfig, radius :: Maybe Radius, resizeDelay :: Maybe Number, responsive :: Maybe Boolean, rotation :: Maybe Number, scales :: Maybe (Object ScaleConfig), showLine :: Maybe Boolean, spacing :: Maybe Number, spanGaps :: Maybe SpanGaps, startAngle :: Maybe Number, transitions :: Maybe TransitionsConfig }

Top-level chart options.

type ChartConfig = { chartType :: ChartType, datasets :: Array Dataset, labels :: Array Label, options :: ChartOptions, plugins :: Maybe (Array Foreign), xLabels :: Maybe (Array String), yLabels :: Maybe (Array String) }

Complete chart configuration: type, data, and options.

data CanvasPattern

Opaque type for a CanvasPattern object (from canvas 2D context).

data CanvasGradient

Opaque type for a CanvasGradient object (from canvas 2D context).

siValue :: forall a. a -> Maybe (ScriptableIndexable a)

ScriptableIndexable field value wrapping a single static value (Just (SIVal a)). Returns Maybe for record-literal ergonomics.

siFn :: forall a. (ScriptableContext -> a) -> Maybe (ScriptableIndexable a)

ScriptableIndexable field value wrapping a ScriptableContext -> a function (Just (SIFn f)). Returns Maybe for record-literal ergonomics.

siArray :: forall a. Array a -> Maybe (ScriptableIndexable a)

ScriptableIndexable field value wrapping a per-item array (Just (SIArray xs)). Returns Maybe for record-literal ergonomics.

scriptableValue :: forall a. a -> Maybe (Scriptable a)

Wrap a static value as a Scriptable field value (Just (SVal a)). Mirrors the single / perItem convention — returns Maybe so the result can be dropped directly into a Maybe (Scriptable a) record field without a manual Just. For pattern matching use the raw SVal constructor instead.

scriptableFn :: forall a. (ScriptableContext -> a) -> Maybe (Scriptable a)

Wrap a ScriptableContext -> a function as a Scriptable field value (Just (SFn f)). Returns Maybe for record-literal ergonomics.

psImage :: HTMLImageElement -> PointStyle

Convenience constructor for PSImage from a typed HTMLImageElement. Equivalent to PSImage (unsafeToForeign img). For HTMLCanvasElement or other CanvasImageSource values, use PSImage directly with unsafeToForeign.

The referenced image must be fully loaded before the chart is created — Chart.js reads width/height at draw time and draws nothing if they are zero. Route the config through createChartWithCallbacks so the overlay merge can substitute the live reference into the config.

defaultParsingConfig :: ParsingConfig

All optional fields set to Nothing.

defaultOptions :: ChartOptions

All optional fields set to Nothing.

defaultInteractionOptions :: InteractionOptions

All optional fields set to Nothing. Default options for getElementsAtEventForMode — Chart.js will use its built-in defaults for any field left Nothing.

defaultDatasetsDefaults :: DatasetsDefaults

Default DatasetsDefaults with every per-type entry set to Nothing.

defaultDatasetDefaults :: DatasetDefaults

Default DatasetDefaults with all optional fields set to Nothing. Use as a starting point for per-chart-type defaults in DatasetsDefaults.

defaultDataset :: Dataset

Default dataset with empty label and data. All optional fields set to Nothing.

defaultConfig :: ChartConfig

Default chart config with Bar type, empty labels, and empty datasets.

defaultColorsPluginOptions :: ColorsPluginOptions

All optional fields set to Nothing.

css :: String -> Color

Convenience constructor for CSS color strings.

chartTypeToString :: ChartType -> String

Convert to the Chart.js string representation. CustomType passes the wrapped string through unchanged — Chart.js looks up the corresponding registered controller at runtime.