arbor-dashboard 1.64.0 → 1.66.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 +27 -27
  2. package/package.json +18 -2
package/README.md CHANGED
@@ -8,56 +8,56 @@ An npm package of responsive charting components for data visualisation
8
8
 
9
9
  - Node.js
10
10
  - Yarn package manager
11
+ - [Tilt](https://tilt.dev) (for the recommended local setup)
11
12
 
12
- ### Installation
13
+ ### Running locally
13
14
 
14
- 1. Clone the repository and install dependencies:
15
+ #### Option 1 - Tilt (recommended)
15
16
 
16
- ```bash
17
- yarn
18
- ```
17
+ Tilt handles all dependency installation and starts the backend (port 3000) and frontend automatically. Pass a port for the Tilt UI:
19
18
 
20
- 2. Install backend dependencies:
21
19
  ```bash
22
- cd local/backend
23
- yarn
20
+ tilt up --port 10351
24
21
  ```
25
22
 
26
- 3. Install frontend dependencies:
23
+ Open [http://localhost:5173](http://localhost:5173).
24
+
25
+ #### Option 2 - Manual
26
+
27
+ Install dependencies first:
28
+
27
29
  ```bash
28
- cd local/Frontend
29
30
  yarn
31
+ cd local/backend && yarn
32
+ cd local/Frontend && yarn
30
33
  ```
31
34
 
32
- ### Running the Backend
35
+ Then start the backend and frontend in separate terminals:
33
36
 
34
- 1. Navigate to the backend directory:
35
37
  ```bash
36
- cd local/backend
37
- ```
38
+ # Terminal 1 - backend (port 3000)
39
+ cd local/backend && node app.js
38
40
 
39
- 2. Start the backend server:
40
- ```bash
41
- node app.js
41
+ # Terminal 2 - frontend (port 5173)
42
+ cd local/Frontend && npm run dev
42
43
  ```
43
44
 
44
- 4. Verify the backend is running by visiting:
45
- http://localhost:3000/
45
+ ## Storybook
46
+
47
+ The component library is documented and previewed in Storybook.
48
+
49
+ To start the development server on port 6006:
46
50
 
47
- ### Running the Frontend
48
- 1. Navigate to the frontend directory:
49
51
  ```bash
50
- cd local/Frontend
52
+ yarn storybook
51
53
  ```
52
54
 
53
- 2. Start the Frontend
55
+ To run the story tests:
56
+
54
57
  ```bash
55
- npm run dev
58
+ yarn test:storybook
56
59
  ```
57
60
 
58
- 3. The frontend will be available at:
59
- http://localhost:5173/
60
-
61
61
 
62
62
  ## Developing with SIS
63
63
  > Note: this is only recommended for end to end developing - for general developing of charts in this library use the packaged dev server, [usage guide here](https://arbor-education.slite.com/app/docs/SgIhOMBxZQLGOc#5xRs7JNsgNP0HB)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "arbor-dashboard",
3
- "version": "1.64.0",
3
+ "version": "1.66.0",
4
4
  "description": "A tool to create responsive dashboards with charts",
5
5
  "main": "./dist/main.js",
6
6
  "types": "./src/Components/types.ts",
@@ -16,7 +16,10 @@
16
16
  "dev-mode": "yalc publish && onchange 'src/**' -- yarn build-push",
17
17
  "changeset": "changeset",
18
18
  "changeset:add": "changeset add",
19
- "changeset:version": "changeset version"
19
+ "changeset:version": "changeset version",
20
+ "storybook": "storybook dev -p 6006",
21
+ "build-storybook": "storybook build",
22
+ "test:storybook": "vitest --workspace vitest.workspace.ts"
20
23
  },
21
24
  "repository": {
22
25
  "type": "git",
@@ -67,12 +70,19 @@
67
70
  "@changesets/changelog-github": "^0.5.2",
68
71
  "@changesets/cli": "^2.29.8",
69
72
  "@eslint/js": "^9.13.0",
73
+ "@storybook/addon-a11y": "^10.4.3",
74
+ "@storybook/addon-docs": "^10.4.3",
75
+ "@storybook/addon-vitest": "^10.4.3",
76
+ "@storybook/react-vite": "^10.4.3",
70
77
  "@testing-library/dom": "^10.4.0",
71
78
  "@testing-library/react": "^16.2.0",
72
79
  "@types/jest": "^29.5.14",
73
80
  "@types/node": "^22.13.1",
74
81
  "@types/react": "^19.0.8",
75
82
  "@types/react-dom": "^19.0.3",
83
+ "@vitejs/plugin-react": "^5.0.1",
84
+ "@vitest/browser": "^3.2.0",
85
+ "@vitest/coverage-v8": "3.2.6",
76
86
  "babel-jest": "^29.7.0",
77
87
  "babel-loader": "^9.2.1",
78
88
  "css-loader": "^7.1.2",
@@ -86,19 +96,25 @@
86
96
  "eslint-plugin-prettier": "^5.5.4",
87
97
  "eslint-plugin-react": "^7.37.5",
88
98
  "eslint-plugin-react-hooks": "^7.0.0",
99
+ "eslint-plugin-storybook": "10.4.3",
89
100
  "globals": "^15.11.0",
90
101
  "jest": "^29.7.0",
91
102
  "jest-environment-jsdom": "^29.7.0",
92
103
  "onchange": "^7.1.0",
104
+ "playwright": "^1.60.0",
93
105
  "prettier": "^3.3.3",
94
106
  "react": "^18.2.0",
95
107
  "react-dom": "^18.2.0",
96
108
  "react-test-renderer": "^19.0.0",
97
109
  "sass": "^1.84.0",
98
110
  "sass-loader": "^16.0.4",
111
+ "storybook": "^10.4.3",
112
+ "storybook-addon-deep-controls": "^0.10.0",
99
113
  "style-loader": "^4.0.0",
100
114
  "ts-node": "^10.9.2",
101
115
  "typescript-eslint": "^8.11.0",
116
+ "vite": "^7.1.3",
117
+ "vitest": "^3.2.0",
102
118
  "webpack": "^5.107.2",
103
119
  "webpack-cli": "^6.0.1"
104
120
  },