Upgrade storybook (#184)

* Update version of node * Updated package name in README * Updated pnpm * Updated jest image snapshot * Change story order * Updated Storybook * Re-ran storybook init * Improved scripts * Upgraded Storybook * Fixed an issue with Crosshairs not being long enough * Removed a stray console log * Added some Chromatic test functions * Reduced the size of the huge dataset * Updated line widths for Canvas * Minor event optimizations * Updated pnpm version * Updated workflow * Added changeset * Updated props to supress clipping
IPWright83 · Nov 11, 2023 · 6eba8e0 · 6eba8e0
1 parent 44a2fec
commit 6eba8e0
Show file tree

Hide file tree

Showing 57 changed files with 7,222 additions and 7,435 deletions.
diff --git a/.changeset/quick-boxes-jog.md b/.changeset/quick-boxes-jog.md
@@ -0,0 +1,8 @@
+---
+"@chart-io/d3": minor
+"@chart-io/detection": minor
+"@chart-io/react": minor
+"@chart-io/types": minor
+---
+
+Upgraded Storybook
diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml
@@ -15,22 +15,21 @@ jobs:
     runs-on: ubuntu-latest
     if: "!contains(github.event.head_commit.message, 'ci skip')"
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 20
       - uses: pnpm/action-setup@v2
         with:
           run_install: false
-      - name: Get pnpm store directory
-        id: pnpm-cache
+      - name: Get pnpm store cache directory
+        shell: bash
         run: |
-          echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
-
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
       - uses: actions/cache@v3
         name: Setup pnpm cache
         with:
-          path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
+          path: ${{ env.STORE_PATH }}
           key: ${{ hashFiles('**/pnpm-lock.yaml') }}
           restore-keys: |
             ${{ runner.os }}-pnpm-store-
@@ -43,22 +42,22 @@ jobs:
   #   runs-on: ubuntu-latest
   #   if: "!contains(github.event.head_commit.message, 'ci skip')"
   #   steps:
-  #     - uses: actions/checkout@v2
+  #     - uses: actions/checkout@v3
   #     - uses: actions/setup-node@v3
   #       with:
   #         node-version: 16
   #     - uses: pnpm/action-setup@v2
   #       with:
   #         run_install: false
-  #     - name: Get pnpm store directory
-  #       id: pnpm-cache
+  #     - name: Get pnpm store cache directory
+  #       shell: bash
   #       run: |
-  #         echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
+  #         echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
   #     - uses: actions/cache@v3
   #       name: Setup pnpm cache
   #       with:
-  #         path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
-  #         key: ${{ hashFiles('**/pnpm-lock.yaml') }}
+  #         path: ${{ env.STORE_PATH }}
+  #         key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
   #         restore-keys: |
   #           ${{ runner.os }}-pnpm-store-
   #     - name: pnpm Install
@@ -70,21 +69,21 @@ jobs:
     runs-on: ubuntu-latest
     if: "!contains(github.event.head_commit.message, 'ci skip')"
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 20
       - uses: pnpm/action-setup@v2
         with:
           run_install: false
-      - name: Get pnpm store directory
-        id: pnpm-cache
+      - name: Get pnpm store cache directory
+        shell: bash
         run: |
-          echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
       - uses: actions/cache@v3
         name: Setup pnpm cache
         with:
-          path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
+          path: ${{ env.STORE_PATH }}
           key: ${{ hashFiles('**/pnpm-lock.yaml') }}
           restore-keys: |
             ${{ runner.os }}-pnpm-store-
@@ -98,23 +97,23 @@ jobs:
     if: "!contains(github.event.head_commit.message, 'ci skip') && github.event.pull_request.draft == false"
     needs: [lint, unit]
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
         with:
           fetch-depth: 0
       - uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 20
       - uses: pnpm/action-setup@v2
         with:
           run_install: false
-      - name: Get pnpm store directory
-        id: pnpm-cache
+      - name: Get pnpm store cache directory
+        shell: bash
         run: |
-          echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
       - uses: actions/cache@v3
         name: Setup pnpm cache
         with:
-          path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
+          path: ${{ env.STORE_PATH }}
           key: ${{ hashFiles('**/pnpm-lock.yaml') }}
           restore-keys: |
             ${{ runner.os }}-pnpm-store-
@@ -134,7 +133,7 @@ jobs:
     if: "!contains(github.event.head_commit.message, 'ci skip') && github.event.pull_request.draft == false"
     needs: [chromatic]
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
       - name: Check if auto merge possible
         id: check
         run: |

diff --git a/.github/workflows/push-to-master.yml b/.github/workflows/push-to-master.yml
@@ -12,22 +12,22 @@ jobs:
     runs-on: ubuntu-latest
     if: "!contains(github.event.head_commit.message, 'ci skip')"
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 20
       - uses: pnpm/action-setup@v2
         with:
           run_install: false
-      - name: Get pnpm store directory
-        id: pnpm-cache
+      - name: Get pnpm store cache directory
+        shell: bash
         run: |
-          echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
       - uses: actions/cache@v3
         name: Setup pnpm cache
         with:
-          path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
-          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          path: ${{ env.STORE_PATH }}
+          key: ${{ hashFiles('**/pnpm-lock.yaml') }}
           restore-keys: |
             ${{ runner.os }}-pnpm-store-
       - name: pnpm Install
@@ -42,24 +42,24 @@ jobs:
     outputs:
       published: ${{ steps.published.outputs.published }}
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
         with:
           token: ${{ secrets.DEPLOY_TOKEN }}
       - uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 20
       - uses: pnpm/action-setup@v2
         with:
           run_install: false
-      - name: Get pnpm store directory
-        id: pnpm-cache
+      - name: Get pnpm store cache directory
+        shell: bash
         run: |
-          echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
       - uses: actions/cache@v3
         name: Setup pnpm cache
         with:
-          path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
-          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          path: ${{ env.STORE_PATH }}
+          key: ${{ hashFiles('**/pnpm-lock.yaml') }}
           restore-keys: |
             ${{ runner.os }}-pnpm-store-
       - name: pnpm Install
@@ -85,22 +85,22 @@ jobs:
     if: needs.changesets_version.outputs.published == 'true'
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 20
       - uses: pnpm/action-setup@v2
         with:
           run_install: false
-      - name: Get pnpm store directory
-        id: pnpm-cache
+      - name: Get pnpm store cache directory
+        shell: bash
         run: |
-          echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
       - uses: actions/cache@v3
         name: Setup pnpm cache
         with:
-          path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
-          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          path: ${{ env.STORE_PATH }}
+          key: ${{ hashFiles('**/pnpm-lock.yaml') }}
           restore-keys: |
             ${{ runner.os }}-pnpm-store-
       - name: pnpm Install
@@ -115,24 +115,24 @@ jobs:
     if: needs.changesets_version.outputs.published == 'true'
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
         with:
           fetch-depth: 0
           token: ${{ secrets.DEPLOY_TOKEN }}
       - uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 20
       - uses: pnpm/action-setup@v2
         with:
           run_install: false
-      - name: Get pnpm store directory
-        id: pnpm-cache
+      - name: Get pnpm store cache directory
+        shell: bash
         run: |
-          echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
       - uses: actions/cache@v3
         name: Setup pnpm cache
         with:
-          path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
+          path: ${{ env.STORE_PATH }}
           key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
           restore-keys: |
             ${{ runner.os }}-pnpm-store-

diff --git a/.nvmrc b/.nvmrc
@@ -1 +1 @@
-v18.18.2
+v20.2.0
diff --git a/README.md b/README.md
@@ -1,20 +1,20 @@
-# @chart-io/react-d3
+# @chart-io/react
 
-@chart-io/react-d3 provides a set of reusable chart components to make data visualization easy. All the components are built using a combination of [React](https://reactjs.org/) and [D3](https://d3js.org/).
+@chart-io/react provides a set of reusable chart components to make data visualization easy. All the components are built using a combination of [React](https://reactjs.org/) and [D3](https://d3js.org/).
 
 It aims to provide high-level components that require minial configuration to provide great looking charts, while also providing access to the low level components giving you the flexibility to customize them as you see fit.
 
-> :warning: @chart-io/react-d3 is currently in pre-release. While you're welcome to give it a try some interfaces may change.
+> :warning: @chart-io/react is currently in pre-release. While you're welcome to give it a try some interfaces may change.
 
 # Install
 
 #### npm
 
-`npm install --save @chart-io/react-d3`
+`npm install --save @chart-io/react`
 
 #### yarn
 
-`yarn add @chart-io/react-d3`
+`yarn add @chart-io/react`
 
 # Getting Started
 
@@ -58,6 +58,6 @@ Start the storybook server
 
 ## FAQ
 
-#### Is @chart-io/react-d3 free to use?
+#### Is @chart-io/react free to use?
 
-@chart-io/react-d3 is free to use and the aim is that it will always be free in open source/non-commercial projects. There may be costs for commercial use in the future, purely to help support the development and improvement of @chart-io/react-d3.
+@chart-io/react is free to use and the aim is that it will always be free in open source/non-commercial projects. There may be costs for commercial use in the future, purely to help support the development and improvement of @chart-io/react.
diff --git a/package.json b/package.json
@@ -1,16 +1,15 @@
 {
   "name": "monorepo-root",
   "version": "1.0.0",
-  "packageManager": "pnpm@7.12.1",
+  "packageManager": "pnpm@8.10.2",
   "type": "module",
   "author": "\"Ian Wright\" <\"[email protected]\">",
   "scripts": {
     "build": "turbo run build",
     "build:package": "node scripts/choice build",
-    "build:watch": "turbo run build --scope=@chart-io/* --no-deps -- -- -w",
-    "dev": "turbo run build --scope=@chart-io/* --no-deps && turbo run dev --no-cache --parallel --continue",
     "changeset": "changeset",
     "clean": "rm -rf node_modules && pnpm -r clean",
+    "dev": "turbo run build --scope=@chart-io/* --no-deps && turbo run dev --no-cache --parallel --continue",
     "graph": "turbo run build --graph=graph.html",
     "lint": "turbo run lint",
     "publish": "changeset publish",
@@ -19,9 +18,13 @@
     "storybook": "pnpm --filter '@chart-io/react' storybook",
     "storybook:build": "pnpm --filter '@chart-io/react' build-storybook",
     "storybook:deploy": "pnpm --filter '@chart-io/*' deploy-storybook",
+    "storybook:package": "node scripts/choice storybook",
+    "storybook:test": "pnpm --filter '@chart-io/*' test-storybook",
+    "storybook:report": "node scripts/choice coverage-storybook",
     "types": "turbo run types",
     "test": "turbo run test --concurrency=1",
     "test:coverage": "turbo run test --concurrency=1 -- --coverage",
+    "test:report": "node scripts/choice test-coverage",
     "test:package": "node scripts/choice test --coverage",
     "test:watch": "node scripts/choice test --watchAll=true",
     "version": "changeset version"

diff --git a/packages/d3/package.json b/packages/d3/package.json
@@ -2,14 +2,14 @@
   "name": "@chart-io/d3",
   "version": "0.10.0",
   "private": true,
-  "packageManager": "pnpm@7.5.2",
+  "packageManager": "pnpm@8.10.2",
   "description": "Provides a custom d3 bundle",
   "repository": "[email protected]:IPWright83/chart-io.git",
   "author": "Ian Wright - IPWright83",
   "main": "index.ts",
   "types": "index.ts",
   "scripts": {
-    "clean": "rm -rf node_modules"
+    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist && rm -rf coverage"
   },
   "np": {
     "publish": false,

diff --git a/packages/detection/package.json b/packages/detection/package.json
@@ -2,7 +2,7 @@
   "name": "@chart-io/detection",
   "version": "0.8.0",
   "private": true,
-  "packageManager": "pnpm@7.26.2",
+  "packageManager": "pnpm@8.10.2",
   "description": "Provides data type detection utilities for @chart-io",
   "repository": "[email protected]:IPWright83/chart-io.git",
   "author": "\"Ian Wright\" <\"[email protected]\">",
@@ -14,7 +14,7 @@
     "build": "tsc --noEmit",
     "test": "jest --config jest.config.js",
     "test:coverage": "jest --config jest.config.js --coverage",
-    "clean": "rm -rf node_modules",
+    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist && rm -rf coverage",
     "lint": "eslint src",
     "types": "tsc --noEmit",
     "publish": ""