enarratio-astro 0.4.4 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/README.md +23 -22
  3. package/dist/chart.d.ts +6 -0
  4. package/dist/chart.js +2 -0
  5. package/dist/markdown.js +1 -0
  6. package/package.json +2 -2
  7. package/src/chart.ts +8 -0
  8. package/src/markdown.ts +1 -0
package/CHANGELOG.md CHANGED
@@ -7,6 +7,22 @@ every such change is listed here.
7
7
 
8
8
  ## [Unreleased]
9
9
 
10
+ ## [0.5.0] - 2026-11-08
11
+
12
+ ### Added
13
+
14
+ - A `lang` field on `<Chart>`, Markdown `chart` blocks and the spec: the language of the chart's text as a BCP 47 tag, written as the figure's `lang` so a screen reader switches voice (WCAG 3.1.2). A bad tag makes the chart a "could not be drawn" note.
15
+
16
+ ### Changed
17
+
18
+ - Draws with Enarratio 0.10.0: the range form asks for both ends instead of ignoring a blank one (SC 3.3.1), and density values no longer print as long runs of zeros.
19
+
20
+ ## [0.4.5] - 2026-11-07
21
+
22
+ ### Changed
23
+
24
+ - Draws with Enarratio 0.9.2, whose "Show data" table scrolls in a keyboard-focusable region on narrow screens (WCAG 2.1.1, 1.4.10).
25
+
10
26
  ## [0.4.4] - 2026-11-07
11
27
 
12
28
  ### Changed
package/README.md CHANGED
@@ -103,28 +103,29 @@ interactive chart on the page and works with view transitions.
103
103
 
104
104
  The component's props and a Markdown block's keys are the same:
105
105
 
106
- | Option | Used by | Notes |
107
- | ---------------------- | ------------------------ | --------------------------------------------------------------------------------------------------------------------------- |
108
- | `type` | all | `bar` (default), `line`, `area` (stacked), `scatter` or `heatmap`. |
109
- | `data` | all | The data (component only; in Markdown it follows the dashes). Up to 5000 rows and 50 columns. |
110
- | `alt` | all | **Required.** What the chart shows and finds, in a sentence. It names the chart for screen readers. |
111
- | `title`, `subtitle` | all | Optional. Shown above the chart. |
112
- | `caption`, `notes` | all | Optional. The caption, under the chart, is for method or caveats; notes are a smaller line for definitions. |
113
- | `source`, `sourceHref` | all | Optional. Where the data came from, linked when `sourceHref` is set, beside a CSV download of the data. |
114
- | `byline` | all | Optional. Who made the chart. |
115
- | `x` | all | The column along the x axis. Column names match without regard to case. ISO dates make a time axis in line and area charts. |
116
- | `y` | all | The value column. Bar charts count rows when it is missing. For a heatmap, the row column. |
117
- | `series` | bar, line, area, scatter | Splits rows into series, told apart by color and by legend, labels or symbols. |
118
- | `value` | heatmap | The cell value column. |
119
- | `xLabel`, `yLabel` | all | Axis labels. |
120
- | `xUnit`, `yUnit` | all | Optional. The unit, shown after the axis label (`Sales (units)`) and in the table and summary. |
121
- | `layout` | bar | `stacked` (default) or `grouped`. |
122
- | `orientation` | bar | `vertical` (default) or `horizontal`. |
123
- | `scale` | line, scatter | `linear` (default) or `log`. |
124
- | `regression` | scatter | A least-squares line with its 95% band. |
125
- | `dataTable` | all | `details` (default; behind a "Data table" toggle) or `visually-hidden` (screen readers only). |
126
- | `id` | all | The figure's id. |
127
- | `interactive` | all | Adds the enhancement script. Off by default, so pages stay script-free. |
106
+ | Option | Used by | Notes |
107
+ | ---------------------- | ------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
108
+ | `type` | all | `bar` (default), `line`, `area` (stacked), `scatter` or `heatmap`. |
109
+ | `data` | all | The data (component only; in Markdown it follows the dashes). Up to 5000 rows and 50 columns. |
110
+ | `alt` | all | **Required.** What the chart shows and finds, in a sentence. It names the chart for screen readers. |
111
+ | `title`, `subtitle` | all | Optional. Shown above the chart. |
112
+ | `caption`, `notes` | all | Optional. The caption, under the chart, is for method or caveats; notes are a smaller line for definitions. |
113
+ | `source`, `sourceHref` | all | Optional. Where the data came from, linked when `sourceHref` is set, beside a CSV download of the data. |
114
+ | `byline` | all | Optional. Who made the chart. |
115
+ | `x` | all | The column along the x axis. Column names match without regard to case. ISO dates make a time axis in line and area charts. |
116
+ | `y` | all | The value column. Bar charts count rows when it is missing. For a heatmap, the row column. |
117
+ | `series` | bar, line, area, scatter | Splits rows into series, told apart by color and by legend, labels or symbols. |
118
+ | `value` | heatmap | The cell value column. |
119
+ | `xLabel`, `yLabel` | all | Axis labels. |
120
+ | `xUnit`, `yUnit` | all | Optional. The unit, shown after the axis label (`Sales (units)`) and in the table and summary. |
121
+ | `layout` | bar | `stacked` (default) or `grouped`. |
122
+ | `orientation` | bar | `vertical` (default) or `horizontal`. |
123
+ | `scale` | line, scatter | `linear` (default) or `log`. |
124
+ | `regression` | scatter | A least-squares line with its 95% band. |
125
+ | `dataTable` | all | `details` (default; behind a "Data table" toggle) or `visually-hidden` (screen readers only). |
126
+ | `lang` | all | Optional. The language of the chart's text as a BCP 47 tag (`de`), written as the figure's `lang` so screen readers switch voice. Leave it out when the chart is in the page's language. |
127
+ | `id` | all | The figure's id. |
128
+ | `interactive` | all | Adds the enhancement script. Off by default, so pages stay script-free. |
128
129
 
129
130
  A chart that cannot be drawn (a column that is not in the data, text in a number column, a missing
130
131
  `alt`) is replaced by a short note saying why, and the reason is logged, so one mistake never
package/dist/chart.d.ts CHANGED
@@ -52,6 +52,12 @@ export interface ChartSpec {
52
52
  readonly regression?: boolean | undefined;
53
53
  /** "details" (default): the data table behind a toggle; "visually-hidden": for screen readers only. */
54
54
  readonly dataTable?: string | undefined;
55
+ /**
56
+ * The language of the chart's text, a BCP 47 tag such as `"de"`, written as the figure's `lang`
57
+ * so a screen reader switches voice when it differs from the page's. Leave it out when the
58
+ * chart is in the page's language.
59
+ */
60
+ readonly lang?: string | undefined;
55
61
  /** The figure's id, reported as `chartId` in the enhancement layer's events. */
56
62
  readonly id?: string | undefined;
57
63
  }
package/dist/chart.js CHANGED
@@ -33,6 +33,7 @@ function figure(spec, options) {
33
33
  if (sourceHref && !source)
34
34
  throw new Error("Name the source (source) that the link (sourceHref) goes to.");
35
35
  const id = text(spec.id)?.replace(/[^A-Za-z0-9_-]/g, "");
36
+ const lang = text(spec.lang);
36
37
  const optional = Object.fromEntries(["subtitle", "caption", "notes", "byline", "xLabel", "yLabel", "xUnit", "yUnit"]
37
38
  .map((key) => [key, text(spec[key])])
38
39
  .filter(([, value]) => value !== undefined));
@@ -42,6 +43,7 @@ function figure(spec, options) {
42
43
  ...optional,
43
44
  ...(source ? { source: sourceHref ? { name: source, href: sourceHref } : source } : {}),
44
45
  ...(id ? { id } : {}),
46
+ ...(lang ? { lang } : {}),
45
47
  dataTable: spec.dataTable === "visually-hidden" ? "visually-hidden" : "details",
46
48
  ...(options.interactive === false ? { controls: false } : {}),
47
49
  };
package/dist/markdown.js CHANGED
@@ -25,6 +25,7 @@ const KEYS = new Set([
25
25
  "scale",
26
26
  "regression",
27
27
  "dataTable",
28
+ "lang",
28
29
  "id",
29
30
  "interactive",
30
31
  ]);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "enarratio-astro",
3
- "version": "0.4.4",
3
+ "version": "0.5.0",
4
4
  "description": "Accessible charts for Astro: a Chart component and charts in Markdown, drawn on the server by Enarratio",
5
5
  "keywords": [
6
6
  "accessibility",
@@ -54,7 +54,7 @@
54
54
  },
55
55
  "dependencies": {
56
56
  "@observablehq/plot": "0.6.17",
57
- "enarratio": "0.7.3",
57
+ "enarratio": "0.10.0",
58
58
  "linkedom": "0.18.14"
59
59
  },
60
60
  "peerDependencies": {
package/src/chart.ts CHANGED
@@ -56,6 +56,12 @@ export interface ChartSpec {
56
56
  readonly regression?: boolean | undefined;
57
57
  /** "details" (default): the data table behind a toggle; "visually-hidden": for screen readers only. */
58
58
  readonly dataTable?: string | undefined;
59
+ /**
60
+ * The language of the chart's text, a BCP 47 tag such as `"de"`, written as the figure's `lang`
61
+ * so a screen reader switches voice when it differs from the page's. Leave it out when the
62
+ * chart is in the page's language.
63
+ */
64
+ readonly lang?: string | undefined;
59
65
  /** The figure's id, reported as `chartId` in the enhancement layer's events. */
60
66
  readonly id?: string | undefined;
61
67
  }
@@ -108,6 +114,7 @@ function figure(spec: ChartSpec, options: RenderOptions) {
108
114
  if (sourceHref && !source)
109
115
  throw new Error("Name the source (source) that the link (sourceHref) goes to.");
110
116
  const id = text(spec.id)?.replace(/[^A-Za-z0-9_-]/g, "");
117
+ const lang = text(spec.lang);
111
118
  const optional = Object.fromEntries(
112
119
  (["subtitle", "caption", "notes", "byline", "xLabel", "yLabel", "xUnit", "yUnit"] as const)
113
120
  .map((key) => [key, text(spec[key])])
@@ -119,6 +126,7 @@ function figure(spec: ChartSpec, options: RenderOptions) {
119
126
  ...optional,
120
127
  ...(source ? { source: sourceHref ? { name: source, href: sourceHref } : source } : {}),
121
128
  ...(id ? { id } : {}),
129
+ ...(lang ? { lang } : {}),
122
130
  dataTable:
123
131
  spec.dataTable === "visually-hidden" ? ("visually-hidden" as const) : ("details" as const),
124
132
  ...(options.interactive === false ? { controls: false } : {}),
package/src/markdown.ts CHANGED
@@ -29,6 +29,7 @@ const KEYS = new Set([
29
29
  "scale",
30
30
  "regression",
31
31
  "dataTable",
32
+ "lang",
32
33
  "id",
33
34
  "interactive",
34
35
  ]);