@qkix/strapi-plugin-chartkit 0.1.7 → 0.3.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 (2) hide show
  1. package/README.md +45 -4
  2. package/package.json +5 -5
package/README.md CHANGED
@@ -67,6 +67,21 @@ look right here and wrong there.
67
67
  The editor opens in a dialog. Cancel genuinely cancels: it edits a draft and
68
68
  only writes on save.
69
69
 
70
+ ### Labels are dates
71
+
72
+ Turn this on and the labels stop being names and become instants: readings are
73
+ placed by _when_ they are, so a day's gap and a fortnight's gap no longer look
74
+ alike. Ticks then come from the calendar rather than from your rows, which is
75
+ what lets a year of daily figures label itself with a few months instead of 365
76
+ smeared dates.
77
+
78
+ Labels have to be dates for it - ISO 8601, e.g. `2026-08-20`. One that is not is
79
+ named in the editor rather than quietly drawn as a category again.
80
+
81
+ Off by default, including for labels that look like dates: `2024` and `2025` may
82
+ be two categories you meant to weigh equally, and re-spacing them because they
83
+ parse would be a decision this plugin has no business making for you.
84
+
70
85
  ## Three ways to get the numbers in
71
86
 
72
87
  Most charts already exist as numbers somewhere, and retyping them is the worst
@@ -114,7 +129,17 @@ import { Chart } from '@qkix/chartkit-astro-renderer';
114
129
  <Chart spec={article.chart} locale="en-US" />
115
130
  ```
116
131
 
117
- Both produce markup at build or request time. Neither ships a runtime.
132
+ ```vue
133
+ <script setup>
134
+ import { Chart } from '@qkix/chartkit-vue-renderer';
135
+ </script>
136
+
137
+ <template>
138
+ <Chart :spec="article.chart" locale="en-US" />
139
+ </template>
140
+ ```
141
+
142
+ They all produce markup at build or request time. None ships a runtime.
118
143
 
119
144
  ## It takes your theme, including dark mode
120
145
 
@@ -142,6 +167,21 @@ SSR chart renderer. The obvious candidate, ECharts in SSR mode, writes its
142
167
  palette into the markup as literal hex values - which makes class-based dark
143
168
  mode impossible without post-processing the output.
144
169
 
170
+ ### When one chart needs to say something else
171
+
172
+ Under **Colors** in the editor there is a swatch per series - per slice, on a pie
173
+ or donut. Leave one alone and it keeps following your stylesheet; set one and
174
+ that series overrules it, which is what picking out a single line or reddening
175
+ the quarter that went wrong requires.
176
+
177
+ Only the entries you set are stored, so highlighting one series does not freeze
178
+ the colors of the others against your next restyle. The cross beside a swatch
179
+ hands that series back to the site.
180
+
181
+ A color set here beats the CSS on purpose. The stylesheet is the house style; a
182
+ chart that names a color is overruling it for a reason, and a house style that
183
+ could silently repaint it would be no override at all.
184
+
145
185
  ## Also a block, if you use Better Blocks
146
186
 
147
187
  <img src="https://raw.githubusercontent.com/qkix/strapi-plugins/main/packages/strapi-plugin-chartkit/docs/block.png" alt="A chart block inside a Better Blocks rich-text document" width="700" />
@@ -191,13 +231,14 @@ script, or a field that used to be a different type - it says so and goes
191
231
  | [`@qkix/chartkit-core`](https://www.npmjs.com/package/@qkix/chartkit-core) | the spec, the validator and the SVG renderer. No dependencies. |
192
232
  | [`@qkix/chartkit-react-renderer`](https://www.npmjs.com/package/@qkix/chartkit-react-renderer) | rendering a stored chart in React / Next.js |
193
233
  | [`@qkix/chartkit-astro-renderer`](https://www.npmjs.com/package/@qkix/chartkit-astro-renderer) | rendering a stored chart in Astro |
234
+ | [`@qkix/chartkit-vue-renderer`](https://www.npmjs.com/package/@qkix/chartkit-vue-renderer) | rendering a stored chart in Vue / Nuxt |
194
235
  | [`@qkix/chartkit-editor`](https://www.npmjs.com/package/@qkix/chartkit-editor) | the editing surface, and the ready-made block |
195
236
 
196
237
  ## Not there yet
197
238
 
198
- Being honest about the edges: no time axes, no tooltips or other
199
- interactivity, and no per-chart color overrides - palettes are set in your site's
200
- CSS. Data is stored with the chart rather than queried from a collection.
239
+ Being honest about the edges: no tooltips or other interactivity. Data is stored
240
+ with the chart rather than queried from a collection, so a chart of something
241
+ that changes is a chart somebody has to remember to update.
201
242
 
202
243
  Issues and ideas welcome at
203
244
  [qkix/strapi-plugins](https://github.com/qkix/strapi-plugins/issues).
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@qkix/strapi-plugin-chartkit",
3
- "version": "0.1.7",
3
+ "version": "0.3.0",
4
4
  "description": "Charts for Strapi v5, rendered as server-side SVG with no client-side JavaScript",
5
5
  "strapi": {
6
6
  "kind": "plugin",
@@ -43,8 +43,8 @@
43
43
  "dist"
44
44
  ],
45
45
  "dependencies": {
46
- "@qkix/chartkit-editor": "^0.1.5",
47
- "@qkix/chartkit-core": "^0.2.4"
46
+ "@qkix/chartkit-core": "^0.4.0",
47
+ "@qkix/chartkit-editor": "^0.3.0"
48
48
  },
49
49
  "devDependencies": {
50
50
  "@strapi/sdk-plugin": "^5.3.2",
@@ -59,9 +59,9 @@
59
59
  "styled-components": "^6.1.17",
60
60
  "typescript": "^5.8.3",
61
61
  "vitest": "^3.2.4",
62
- "@qkix/tsconfig": "0.0.0",
62
+ "@qkix/eslint-config": "0.0.0",
63
63
  "@qkix/strapi-test-harness": "0.0.0",
64
- "@qkix/eslint-config": "0.0.0"
64
+ "@qkix/tsconfig": "0.0.0"
65
65
  },
66
66
  "peerDependencies": {
67
67
  "@strapi/admin": "^5.0.0",