@neo4j-ndl/react-charts 1.1.13 → 1.1.15
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.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neo4j-ndl/react-charts",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.15",
|
|
4
4
|
"sideEffects": false,
|
|
5
5
|
"description": "React implementation of charts from Neo4j Design System",
|
|
6
6
|
"keywords": [
|
|
@@ -35,7 +35,8 @@
|
|
|
35
35
|
},
|
|
36
36
|
"files": [
|
|
37
37
|
"lib",
|
|
38
|
-
"icons"
|
|
38
|
+
"icons",
|
|
39
|
+
"skills"
|
|
39
40
|
],
|
|
40
41
|
"publishConfig": {
|
|
41
42
|
"access": "public"
|
|
@@ -55,8 +56,8 @@
|
|
|
55
56
|
"peerDependencies": {
|
|
56
57
|
"react": ">=19.0.0",
|
|
57
58
|
"react-dom": ">=19.0.0",
|
|
58
|
-
"@neo4j-ndl/base": "^4.16.
|
|
59
|
-
"@neo4j-ndl/react": "^4.16.
|
|
59
|
+
"@neo4j-ndl/base": "^4.16.4",
|
|
60
|
+
"@neo4j-ndl/react": "^4.16.10"
|
|
60
61
|
},
|
|
61
62
|
"dependencies": {
|
|
62
63
|
"classnames": "2.5.1",
|
|
@@ -73,6 +74,8 @@
|
|
|
73
74
|
"watch:cjs": "pnpm exec tsc -p tsconfig.cjs.json --watch",
|
|
74
75
|
"build:types": "pnpm exec tsc -p tsconfig.types.json",
|
|
75
76
|
"docs:generate": "pnpm --dir ../.. run docs:generate -- --package react-charts",
|
|
77
|
+
"docs:generate-skills": "pnpm --dir ../.. run docs:generate-skills -- --package react-charts",
|
|
78
|
+
"docs:generate-all": "pnpm run docs:generate && pnpm run docs:generate-skills",
|
|
76
79
|
"format": "pnpm exec prettier --write 'src/**/*.{js,jsx,ts,tsx}'",
|
|
77
80
|
"lint": "pnpm exec eslint src",
|
|
78
81
|
"license:quick-show:local": "../../scripts/cc.sh '{yellow 📄} Licenses for react-charts! {yellow 📄}' && pnpm exec license-checker --production --relativeLicensePath",
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: ndl-react-charts
|
|
3
|
+
description: >-
|
|
4
|
+
Build data visualizations with the Neo4j Needle React Charts library
|
|
5
|
+
(@neo4j-ndl/react-charts), an Apache ECharts-based charting layer. Use when
|
|
6
|
+
adding or modifying charts in a React app. Provides component props,
|
|
7
|
+
accessibility requirements, and runnable usage examples. Works with any agent
|
|
8
|
+
that supports skills (Cursor, Claude, etc.).
|
|
9
|
+
---
|
|
10
|
+
|
|
11
|
+
# Neo4j Needle React Charts (@neo4j-ndl/react-charts)
|
|
12
|
+
|
|
13
|
+
> 📌 Shipped with `@neo4j-ndl/react-charts`. Once installed into your repo (e.g. via
|
|
14
|
+
> `npx skills add`) this folder is detached from the package — the installed
|
|
15
|
+
> package (TypeScript types in `node_modules/@neo4j-ndl/react-charts`) is the source of
|
|
16
|
+
> truth.
|
|
17
|
+
|
|
18
|
+
Use Neo4j Needle React Charts instead of hand-rolling chart components.
|
|
19
|
+
|
|
20
|
+
## Setup
|
|
21
|
+
|
|
22
|
+
- Import the base stylesheet once at the app root (if not already wired):
|
|
23
|
+
`import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';`
|
|
24
|
+
- Import chart components from `@neo4j-ndl/react-charts`.
|
|
25
|
+
- Requires `@neo4j-ndl/react` and `echarts` as peer dependencies; make sure
|
|
26
|
+
they are installed.
|
|
27
|
+
|
|
28
|
+
## Rules
|
|
29
|
+
|
|
30
|
+
- **Never hallucinate props.** Before using any prop — including common-sounding
|
|
31
|
+
ones like `size`, `tone`, or `shadow` — confirm it appears in the component's
|
|
32
|
+
doc here or in the package's TypeScript types. Do not assume APIs from other
|
|
33
|
+
libraries (MUI, Radix, Chakra). If something is unclear, ask the user — or when
|
|
34
|
+
running unattended, prefer the TypeScript types and omit the uncertain prop
|
|
35
|
+
rather than guessing.
|
|
36
|
+
- These docs are the primary source for props, accessibility, and examples. The
|
|
37
|
+
package's `.d.ts` type contract is authoritative: if the types disagree with
|
|
38
|
+
these docs, the **types win**. Do not reverse-engineer behavior from the
|
|
39
|
+
compiled implementation source in `node_modules`.
|
|
40
|
+
- Chart configuration is driven by Apache ECharts. Before assuming a chart option
|
|
41
|
+
exists, confirm it in the component's props here or the TypeScript types, and
|
|
42
|
+
consult the ECharts option reference (https://echarts.apache.org/en/option.html)
|
|
43
|
+
for supported behavior.
|
|
44
|
+
- Follow the accessibility guidance in each component's doc; don't strip built-in
|
|
45
|
+
roles or keyboard behavior.
|
|
46
|
+
|
|
47
|
+
## How to use this skill
|
|
48
|
+
|
|
49
|
+
1. Find the component in the catalog below to get its docs file and import path.
|
|
50
|
+
2. Read `components/<file>` for that component's props, accessibility
|
|
51
|
+
requirements, and runnable examples; prefer those examples.
|
|
52
|
+
|
|
53
|
+
## Components
|
|
54
|
+
|
|
55
|
+
Import from `@neo4j-ndl/react-charts`.
|
|
56
|
+
|
|
57
|
+
| Component | Docs | Accessibility | Examples |
|
|
58
|
+
|-----------|------|---------------|----------|
|
|
59
|
+
| `Chart` | [components/charts.md](components/charts.md) | | 20 |
|