Sha256: 76a62384003a741591287236cae3d4acdbbd50c72f6a7d782885a7a87073aaa4
Contents?: true
Size: 973 Bytes
Versions: 16
Compression:
Stored size: 973 Bytes
Contents
import { Controller } from "@hotwired/stimulus"
import { Chart, registerables } from "https://cdn.skypack.dev/chart.js@4.4.6?min"
Chart.register(...registerables)
Chart.defaults.backgroundColor = getCssVariableValue("--color-primary")
Chart.defaults.borderColor = getCssVariableValue("--color-border")
Chart.defaults.color = getCssVariableValue("--color-text")
Chart.defaults.font.family = getCssVariableValue("--font-system-ui")
Chart.defaults.font.size = 12
function getCssVariableValue(variableName) {
return getComputedStyle(document.documentElement).getPropertyValue(variableName).trim()
}
export default class extends Controller {
static values = { type: { type: String, default: "line" }, data: Object, options: Object }
connect() {
this.chart = new Chart(this.element, this.#settings)
}
disconnect() {
this.chart.destroy()
}
get #settings() {
return { type: this.typeValue, data: this.dataValue, options: this.optionsValue }
}
}
Version data entries
16 entries across 16 versions & 1 rubygems