fix: workspace avatar url won't update (#1817)

2024-11-22 07:41:58 +03:00 · 2023-04-04 12:46:33 -05:00 · 2023-04-04 12:46:33 -05:00 · 89f53190db
commit 89f53190db
parent 37169ae37d
18 changed files with 1189 additions and 102 deletions
--- a/.github/workflows/build-master.yml
+++ b/.github/workflows/build-master.yml
@ -123,6 +123,33 @@ jobs:
          tags: ${{ steps.meta.outputs.tags }}
          labels: ${{ steps.meta.outputs.labels }}

+  storybook-test:
+    name: Storybook Test
+    runs-on: ubuntu-latest
+    environment: development
+    needs: [build-storybook]
+    steps:
+      - uses: actions/checkout@v3
+      - name: Setup Node.js
+        uses: ./.github/actions/setup-node
+      - name: Download storybook artifact
+        uses: actions/download-artifact@v3
+        with:
+          name: storybook
+          path: ./packages/component/storybook-static
+      - name: Run storybook tests
+        working-directory: ./packages/component
+        run: |
+          yarn exec concurrently -k -s first -n "SB,TEST" -c "magenta,blue" "yarn exec serve ./storybook-static -l 6006" "yarn test-storybook --coverage"
+      - name: Upload storybook test coverage results
+        uses: codecov/codecov-action@v3
+        with:
+          token: ${{ secrets.CODECOV_TOKEN }}
+          files: ./packages/component/coverage/storybook/coverage-storybook.json
+          flags: storybook-test
+          name: affine
+          fail_ci_if_error: true
+
  e2e-test:
    name: E2E Test
    runs-on: ubuntu-latest
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@ -81,6 +81,33 @@ jobs:
          path: ./apps/web/.next
          if-no-files-found: error

+  storybook-test:
+    name: Storybook Test
+    runs-on: ubuntu-latest
+    environment: development
+    needs: [build-storybook]
+    steps:
+      - uses: actions/checkout@v3
+      - name: Setup Node.js
+        uses: ./.github/actions/setup-node
+      - name: Download storybook artifact
+        uses: actions/download-artifact@v3
+        with:
+          name: storybook
+          path: ./packages/component/storybook-static
+      - name: Run storybook tests
+        working-directory: ./packages/component
+        run: |
+          yarn exec concurrently -k -s first -n "SB,TEST" -c "magenta,blue" "yarn exec serve ./storybook-static -l 6006" "yarn test-storybook --coverage"
+      - name: Upload storybook test coverage results
+        uses: codecov/codecov-action@v3
+        with:
+          token: ${{ secrets.CODECOV_TOKEN }}
+          files: ./packages/component/coverage/storybook/coverage-storybook.json
+          flags: storybook-test
+          name: affine
+          fail_ci_if_error: true
+
  e2e-test:
    name: E2E Test
    runs-on: ubuntu-latest
--- a/.gitignore
+++ b/.gitignore
@ -36,7 +36,7 @@ node_modules
 # misc
 /.sass-cache
 /connect.lock
-/coverage
+coverage
 /libpeerconnection.log
 npm-debug.log
 yarn-error.log
--- a/apps/electron/yarn.lock
+++ b/apps/electron/yarn.lock
@ -50,6 +50,7 @@ __metadata:
    "@mui/icons-material": ^5.11.11
    "@mui/material": ^5.11.15
    "@storybook/addon-actions": ^7.0.2
+    "@storybook/addon-coverage": ^0.0.8
    "@storybook/addon-essentials": ^7.0.2
    "@storybook/addon-interactions": ^7.0.2
    "@storybook/addon-links": ^7.0.2
@ -65,7 +66,10 @@ __metadata:
    "@types/react": ^18.0.31
    "@types/react-dnd": ^3.0.2
    "@types/react-dom": 18.0.11
+    "@vanilla-extract/css": ^1.11.0
    "@vitejs/plugin-react": ^3.1.0
+    clsx: ^1.2.1
+    concurrently: ^8.0.1
    jest-mock: ^29.5.0
    lit: ^2.7.0
    react: ^18.2.0
@ -73,6 +77,7 @@ __metadata:
    react-dnd-html5-backend: ^16.0.1
    react-dom: ^18.2.0
    react-is: ^18.2.0
+    serve: ^14.2.0
    storybook: ^7.0.2
    storybook-dark-mode: ^3.0.0
    typescript: ^5.0.3
@ -3054,7 +3059,7 @@ __metadata:
  languageName: node
  linkType: hard

-"@istanbuljs/load-nyc-config@npm:^1.0.0":
+"@istanbuljs/load-nyc-config@npm:^1.0.0, @istanbuljs/load-nyc-config@npm:^1.1.0":
  version: 1.1.0
  resolution: "@istanbuljs/load-nyc-config@npm:1.1.0"
  dependencies:
@ -4237,6 +4242,18 @@ __metadata:
  languageName: node
  linkType: hard

+"@storybook/addon-coverage@npm:^0.0.8":
+  version: 0.0.8
+  resolution: "@storybook/addon-coverage@npm:0.0.8"
+  dependencies:
+    "@types/babel__core": ^7.1.19
+    "@types/istanbul-lib-coverage": ^2.0.4
+    babel-plugin-istanbul: ^6.1.1
+    vite-plugin-istanbul: ^3.0.1
+  checksum: 8cf18a291699df1b630f77698abfd4d370dabfba55ae186e522b76b9bc76ce6a866cdd5d0e8c044dda135dd2873651d3ab9d2ddc93903222bdabf236ef64645e
+  languageName: node
+  linkType: hard
+
 "@storybook/addon-docs@npm:7.0.2":
  version: 7.0.2
  resolution: "@storybook/addon-docs@npm:7.0.2"
@ -5525,7 +5542,7 @@ __metadata:
  languageName: node
  linkType: hard

-"@types/babel__core@npm:^7.0.0, @types/babel__core@npm:^7.1.14":
+"@types/babel__core@npm:^7.0.0, @types/babel__core@npm:^7.1.14, @types/babel__core@npm:^7.1.19":
  version: 7.20.0
  resolution: "@types/babel__core@npm:7.20.0"
  dependencies:
@ -5749,7 +5766,7 @@ __metadata:
  languageName: node
  linkType: hard

-"@types/istanbul-lib-coverage@npm:*, @types/istanbul-lib-coverage@npm:^2.0.0, @types/istanbul-lib-coverage@npm:^2.0.1":
+"@types/istanbul-lib-coverage@npm:*, @types/istanbul-lib-coverage@npm:^2.0.0, @types/istanbul-lib-coverage@npm:^2.0.1, @types/istanbul-lib-coverage@npm:^2.0.4":
  version: 2.0.4
  resolution: "@types/istanbul-lib-coverage@npm:2.0.4"
  checksum: a25d7589ee65c94d31464c16b72a9dc81dfa0bea9d3e105ae03882d616e2a0712a9c101a599ec482d297c3591e16336962878cb3eb1a0a62d5b76d277a890ce7
@ -6121,6 +6138,32 @@ __metadata:
  languageName: node
  linkType: hard

+"@vanilla-extract/css@npm:^1.11.0":
+  version: 1.11.0
+  resolution: "@vanilla-extract/css@npm:1.11.0"
+  dependencies:
+    "@emotion/hash": ^0.9.0
+    "@vanilla-extract/private": ^1.0.3
+    ahocorasick: 1.0.2
+    chalk: ^4.1.1
+    css-what: ^5.0.1
+    cssesc: ^3.0.0
+    csstype: ^3.0.7
+    deep-object-diff: ^1.1.9
+    deepmerge: ^4.2.2
+    media-query-parser: ^2.0.2
+    outdent: ^0.8.0
+  checksum: da382c7b80e88890931dbf927d38769aed432cb4c5cd434f35ffd5dcec18584c95864c2ad8f5cd0456ae32f9b3ee6aa3af8eb2d95a7f7c709e41a52d731996b5
+  languageName: node
+  linkType: hard
+
+"@vanilla-extract/private@npm:^1.0.3":
+  version: 1.0.3
+  resolution: "@vanilla-extract/private@npm:1.0.3"
+  checksum: 866a71ba6804edeb0735684e7723ba78f5cf0bb40d4fb538fe6bf7d73928099e341312337b2a510ac0ce96ff8a4b39eb7f7a5fad0c842532353dd20e7278f29b
+  languageName: node
+  linkType: hard
+
 "@vitejs/plugin-react@npm:^3.0.1, @vitejs/plugin-react@npm:^3.1.0":
  version: 3.1.0
  resolution: "@vitejs/plugin-react@npm:3.1.0"
@ -6147,6 +6190,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@zeit/schemas@npm:2.29.0":
+  version: 2.29.0
+  resolution: "@zeit/schemas@npm:2.29.0"
+  checksum: 3cea06bb67d790336aca0cc17580fd492ff3fc66ef4d180dce7053ff7ff54ab81b56bf718ba6f537148c581161d06306a481ec218d540bff922e0e009844ffd1
+  languageName: node
+  linkType: hard
+
 "abbrev@npm:^1.0.0":
  version: 1.1.1
  resolution: "abbrev@npm:1.1.1"
@ -6249,6 +6299,25 @@ __metadata:
  languageName: node
  linkType: hard

+"ahocorasick@npm:1.0.2":
+  version: 1.0.2
+  resolution: "ahocorasick@npm:1.0.2"
+  checksum: a13ce4403554ae782cf5e28d468a732acf1fd3d0bff251f5dcfddfa5497b6cc343948d69cd94dfdbe8d4dfdb81e2b34cb1c92079e6301f38b0143d314fb95bd6
+  languageName: node
+  linkType: hard
+
+"ajv@npm:8.11.0":
+  version: 8.11.0
+  resolution: "ajv@npm:8.11.0"
+  dependencies:
+    fast-deep-equal: ^3.1.1
+    json-schema-traverse: ^1.0.0
+    require-from-string: ^2.0.2
+    uri-js: ^4.2.2
+  checksum: 5e0ff226806763be73e93dd7805b634f6f5921e3e90ca04acdf8db81eed9d8d3f0d4c5f1213047f45ebbf8047ffe0c840fa1ef2ec42c3a644899f69aa72b5bef
+  languageName: node
+  linkType: hard
+
 "ajv@npm:~6.12.6":
  version: 6.12.6
  resolution: "ajv@npm:6.12.6"
@ -6261,7 +6330,7 @@ __metadata:
  languageName: node
  linkType: hard

-"ansi-align@npm:^3.0.0":
+"ansi-align@npm:^3.0.0, ansi-align@npm:^3.0.1":
  version: 3.0.1
  resolution: "ansi-align@npm:3.0.1"
  dependencies:
@ -6341,6 +6410,13 @@ __metadata:
  languageName: node
  linkType: hard

+"ansi-styles@npm:^6.1.0":
+  version: 6.2.1
+  resolution: "ansi-styles@npm:6.2.1"
+  checksum: ef940f2f0ced1a6347398da88a91da7930c33ecac3c77b72c5905f8b8fe402c52e6fde304ff5347f616e27a742da3f1dc76de98f6866c69251ad0b07a66776d9
+  languageName: node
+  linkType: hard
+
 "anymatch@npm:^3.0.3, anymatch@npm:~3.1.2":
  version: 3.1.3
  resolution: "anymatch@npm:3.1.3"
@ -6395,6 +6471,13 @@ __metadata:
  languageName: node
  linkType: hard

+"arch@npm:^2.2.0":
+  version: 2.2.0
+  resolution: "arch@npm:2.2.0"
+  checksum: e21b7635029fe8e9cdd5a026f9a6c659103e63fff423834323cdf836a1bb240a72d0c39ca8c470f84643385cf581bd8eda2cad8bf493e27e54bd9783abe9101f
+  languageName: node
+  linkType: hard
+
 "archy@npm:^1.0.0":
  version: 1.0.0
  resolution: "archy@npm:1.0.0"
@ -6422,6 +6505,13 @@ __metadata:
  languageName: node
  linkType: hard

+"arg@npm:5.0.2":
+  version: 5.0.2
+  resolution: "arg@npm:5.0.2"
+  checksum: 6c69ada1a9943d332d9e5382393e897c500908d91d5cb735a01120d5f71daf1b339b7b8980cbeaba8fd1afc68e658a739746179e4315a26e8a28951ff9930078
+  languageName: node
+  linkType: hard
+
 "arg@npm:^4.1.0":
  version: 4.1.3
  resolution: "arg@npm:4.1.3"
@ -6806,6 +6896,22 @@ __metadata:
  languageName: node
  linkType: hard

+"boxen@npm:7.0.0":
+  version: 7.0.0
+  resolution: "boxen@npm:7.0.0"
+  dependencies:
+    ansi-align: ^3.0.1
+    camelcase: ^7.0.0
+    chalk: ^5.0.1
+    cli-boxes: ^3.0.0
+    string-width: ^5.1.2
+    type-fest: ^2.13.0
+    widest-line: ^4.0.1
+    wrap-ansi: ^8.0.1
+  checksum: b917cf7a168ef3149635a8c02d5c9717d66182348bd27038d85328ad12655151e3324db0f2815253846c33e5f0ddf28b6cd52d56a12b9f88617b7f8f722b946a
+  languageName: node
+  linkType: hard
+
 "boxen@npm:^5.1.2":
  version: 5.1.2
  resolution: "boxen@npm:5.1.2"
@ -7082,6 +7188,13 @@ __metadata:
  languageName: node
  linkType: hard

+"camelcase@npm:^7.0.0":
+  version: 7.0.1
+  resolution: "camelcase@npm:7.0.1"
+  checksum: 86ab8f3ebf08bcdbe605a211a242f00ed30d8bfb77dab4ebb744dd36efbc84432d1c4adb28975ba87a1b8be40a80fbd1e60e2f06565315918fa7350011a26d3d
+  languageName: node
+  linkType: hard
+
 "can-bind-to-host@npm:^1.1.1":
  version: 1.1.2
  resolution: "can-bind-to-host@npm:1.1.2"
@ -7098,6 +7211,22 @@ __metadata:
  languageName: node
  linkType: hard

+"chalk-template@npm:0.4.0":
+  version: 0.4.0
+  resolution: "chalk-template@npm:0.4.0"
+  dependencies:
+    chalk: ^4.1.2
+  checksum: 6c706802a79a7963cbce18f022b046fe86e438a67843151868852f80ea7346e975a6a9749991601e7e5d3b6a6c4852a04c53dc966a9a3d04031bd0e0ed53c819
+  languageName: node
+  linkType: hard
+
+"chalk@npm:5.0.1":
+  version: 5.0.1
+  resolution: "chalk@npm:5.0.1"
+  checksum: 7b45300372b908f0471fbf7389ce2f5de8d85bb949026fd51a1b95b10d0ed32c7ed5aab36dd5e9d2bf3191867909b4404cef75c5f4d2d1daeeacd301dd280b76
+  languageName: node
+  linkType: hard
+
 "chalk@npm:^2.0.0, chalk@npm:^2.4.1, chalk@npm:^2.4.2":
  version: 2.4.2
  resolution: "chalk@npm:2.4.2"
@ -7119,7 +7248,7 @@ __metadata:
  languageName: node
  linkType: hard

-"chalk@npm:^4.0.0, chalk@npm:^4.0.2, chalk@npm:^4.1.0, chalk@npm:^4.1.2":
+"chalk@npm:^4.0.0, chalk@npm:^4.0.2, chalk@npm:^4.1.0, chalk@npm:^4.1.1, chalk@npm:^4.1.2":
  version: 4.1.2
  resolution: "chalk@npm:4.1.2"
  dependencies:
@ -7129,7 +7258,7 @@ __metadata:
  languageName: node
  linkType: hard

-"chalk@npm:^5.2.0":
+"chalk@npm:^5.0.1, chalk@npm:^5.2.0":
  version: 5.2.0
  resolution: "chalk@npm:5.2.0"
  checksum: 03d8060277de6cf2fd567dc25fcf770593eb5bb85f460ce443e49255a30ff1242edd0c90a06a03803b0466ff0687a939b41db1757bec987113e83de89a003caa
@ -7239,6 +7368,13 @@ __metadata:
  languageName: node
  linkType: hard

+"cli-boxes@npm:^3.0.0":
+  version: 3.0.0
+  resolution: "cli-boxes@npm:3.0.0"
+  checksum: 637d84419d293a9eac40a1c8c96a2859e7d98b24a1a317788e13c8f441be052fc899480c6acab3acc82eaf1bccda6b7542d7cdcf5c9c3cc39227175dc098d5b2
+  languageName: node
+  linkType: hard
+
 "cli-cursor@npm:^3.1.0":
  version: 3.1.0
  resolution: "cli-cursor@npm:3.1.0"
@ -7285,6 +7421,17 @@ __metadata:
  languageName: node
  linkType: hard

+"clipboardy@npm:3.0.0":
+  version: 3.0.0
+  resolution: "clipboardy@npm:3.0.0"
+  dependencies:
+    arch: ^2.2.0
+    execa: ^5.1.1
+    is-wsl: ^2.2.0
+  checksum: 2c292acb59705494cbe07d7df7c8becff4f01651514d32ebd80f4aec2d20946d8f3824aac67ecdf2d09ef21fdf0eb24b6a7f033c137ccdceedc4661c54455c94
+  languageName: node
+  linkType: hard
+
 "cliui@npm:^6.0.0":
  version: 6.0.0
  resolution: "cliui@npm:6.0.0"
@ -7527,7 +7674,7 @@ __metadata:
  languageName: node
  linkType: hard

-"compression@npm:^1.7.4":
+"compression@npm:1.7.4, compression@npm:^1.7.4":
  version: 1.7.4
  resolution: "compression@npm:1.7.4"
  dependencies:
@ -7561,6 +7708,26 @@ __metadata:
  languageName: node
  linkType: hard

+"concurrently@npm:^8.0.1":
+  version: 8.0.1
+  resolution: "concurrently@npm:8.0.1"
+  dependencies:
+    chalk: ^4.1.2
+    date-fns: ^2.29.3
+    lodash: ^4.17.21
+    rxjs: ^7.8.0
+    shell-quote: ^1.8.0
+    spawn-command: 0.0.2-1
+    supports-color: ^8.1.1
+    tree-kill: ^1.2.2
+    yargs: ^17.7.1
+  bin:
+    conc: dist/bin/concurrently.js
+    concurrently: dist/bin/concurrently.js
+  checksum: cce10ab1bbd7fd099300234637cdbc8e12622a5fe53f8dd31dcd9562d9803f25d3d0410bdb6fffd54e8f4e11b852366c03994bd319843cce70e449c8a8a69526
+  languageName: node
+  linkType: hard
+
 "console-control-strings@npm:^1.0.0, console-control-strings@npm:^1.1.0":
  version: 1.1.0
  resolution: "console-control-strings@npm:1.1.0"
@ -7568,6 +7735,13 @@ __metadata:
  languageName: node
  linkType: hard

+"content-disposition@npm:0.5.2":
+  version: 0.5.2
+  resolution: "content-disposition@npm:0.5.2"
+  checksum: 298d7da63255a38f7858ee19c7b6aae32b167e911293174b4c1349955e97e78e1d0b0d06c10e229405987275b417cf36ff65cbd4821a98bc9df4e41e9372cde7
+  languageName: node
+  linkType: hard
+
 "content-disposition@npm:0.5.4":
  version: 0.5.4
  resolution: "content-disposition@npm:0.5.4"
@ -7709,6 +7883,13 @@ __metadata:
  languageName: node
  linkType: hard

+"css-what@npm:^5.0.1":
+  version: 5.1.0
+  resolution: "css-what@npm:5.1.0"
+  checksum: 0b75d1bac95c885c168573c85744a6c6843d8c33345f54f717218b37ea6296b0e99bb12105930ea170fd4a921990392a7c790c16c585c1d8960c49e2b7ec39f7
+  languageName: node
+  linkType: hard
+
 "css.escape@npm:^1.5.1":
  version: 1.5.1
  resolution: "css.escape@npm:1.5.1"
@ -7716,6 +7897,15 @@ __metadata:
  languageName: node
  linkType: hard

+"cssesc@npm:^3.0.0":
+  version: 3.0.0
+  resolution: "cssesc@npm:3.0.0"
+  bin:
+    cssesc: bin/cssesc
+  checksum: f8c4ababffbc5e2ddf2fa9957dda1ee4af6048e22aeda1869d0d00843223c1b13ad3f5d88b51caa46c994225eacb636b764eb807a8883e2fb6f99b4f4e8c48b2
+  languageName: node
+  linkType: hard
+
 "csstype@npm:^3.0.2, csstype@npm:^3.1.1":
  version: 3.1.1
  resolution: "csstype@npm:3.1.1"
@ -7723,6 +7913,13 @@ __metadata:
  languageName: node
  linkType: hard

+"csstype@npm:^3.0.7":
+  version: 3.1.2
+  resolution: "csstype@npm:3.1.2"
+  checksum: e1a52e6c25c1314d6beef5168da704ab29c5186b877c07d822bd0806717d9a265e8493a2e35ca7e68d0f5d472d43fac1cdce70fd79fd0853dff81f3028d857b5
+  languageName: node
+  linkType: hard
+
 "cwd@npm:^0.10.0":
  version: 0.10.0
  resolution: "cwd@npm:0.10.0"
@ -7740,6 +7937,13 @@ __metadata:
  languageName: node
  linkType: hard

+"date-fns@npm:^2.29.3":
+  version: 2.29.3
+  resolution: "date-fns@npm:2.29.3"
+  checksum: e01cf5b62af04e05dfff921bb9c9933310ed0e1ae9a81eb8653452e64dc841acf7f6e01e1a5ae5644d0337e9a7f936175fd2cb6819dc122fdd9c5e86c56be484
+  languageName: node
+  linkType: hard
+
 "debug@npm:2.6.9, debug@npm:^2.2.0, debug@npm:^2.6.9":
  version: 2.6.9
  resolution: "debug@npm:2.6.9"
@ -7818,6 +8022,13 @@ __metadata:
  languageName: node
  linkType: hard

+"deep-extend@npm:^0.6.0":
+  version: 0.6.0
+  resolution: "deep-extend@npm:0.6.0"
+  checksum: 7be7e5a8d468d6b10e6a67c3de828f55001b6eb515d014f7aeb9066ce36bd5717161eb47d6a0f7bed8a9083935b465bc163ee2581c8b128d29bf61092fdf57a7
+  languageName: node
+  linkType: hard
+
 "deep-is@npm:~0.1.3":
  version: 0.1.4
  resolution: "deep-is@npm:0.1.4"
@ -7825,6 +8036,13 @@ __metadata:
  languageName: node
  linkType: hard

+"deep-object-diff@npm:^1.1.9":
+  version: 1.1.9
+  resolution: "deep-object-diff@npm:1.1.9"
+  checksum: ecd42455e4773f653595d28070295e7aaa8402db5f8ab21d0bec115a7cb4de5e207a5665514767da5f025c96597f1d3a0a4888aeb4dd49e03c996871a3aa05ef
+  languageName: node
+  linkType: hard
+
 "deepmerge@npm:^4.2.2":
  version: 4.3.1
  resolution: "deepmerge@npm:4.3.1"
@ -8193,6 +8411,13 @@ __metadata:
  languageName: node
  linkType: hard

+"eastasianwidth@npm:^0.2.0":
+  version: 0.2.0
+  resolution: "eastasianwidth@npm:0.2.0"
+  checksum: 7d00d7cd8e49b9afa762a813faac332dee781932d6f2c848dc348939c4253f1d4564341b7af1d041853bc3f32c2ef141b58e0a4d9862c17a7f08f68df1e0f1ed
+  languageName: node
+  linkType: hard
+
 "ee-first@npm:1.1.1":
  version: 1.1.1
  resolution: "ee-first@npm:1.1.1"
@ -8359,6 +8584,13 @@ __metadata:
  languageName: node
  linkType: hard

+"emoji-regex@npm:^9.2.2":
+  version: 9.2.2
+  resolution: "emoji-regex@npm:9.2.2"
+  checksum: 8487182da74aabd810ac6d6f1994111dfc0e331b01271ae01ec1eb0ad7b5ecc2bbbbd2f053c05cb55a1ac30449527d819bbfbf0e3de1023db308cbcb47f86601
+  languageName: node
+  linkType: hard
+
 "encode-utf8@npm:^1.0.3":
  version: 1.0.3
  resolution: "encode-utf8@npm:1.0.3"
@ -8896,6 +9128,15 @@ __metadata:
  languageName: node
  linkType: hard

+"fast-url-parser@npm:1.1.3":
+  version: 1.1.3
+  resolution: "fast-url-parser@npm:1.1.3"
+  dependencies:
+    punycode: ^1.3.2
+  checksum: 5043d0c4a8d775ff58504d56c096563c11b113e4cb8a2668c6f824a1cd4fb3812e2fdf76537eb24a7ce4ae7def6bd9747da630c617cf2a4b6ce0c42514e4f21c
+  languageName: node
+  linkType: hard
+
 "fastq@npm:^1.6.0":
  version: 1.15.0
  resolution: "fastq@npm:1.15.0"
@ -10279,7 +10520,7 @@ __metadata:
  languageName: node
  linkType: hard

-"ini@npm:^1.3.4":
+"ini@npm:^1.3.4, ini@npm:~1.3.0":
  version: 1.3.8
  resolution: "ini@npm:1.3.8"
  checksum: dfd98b0ca3a4fc1e323e38a6c8eb8936e31a97a918d3b377649ea15bdb15d481207a0dda1021efbd86b464cae29a0d33c1d7dcaf6c5672bee17fa849bc50a1b3
@ -10603,6 +10844,13 @@ __metadata:
  languageName: node
  linkType: hard

+"is-port-reachable@npm:4.0.0":
+  version: 4.0.0
+  resolution: "is-port-reachable@npm:4.0.0"
+  checksum: 47b7e10db8edcef27fbf9e50f0de85ad368d35688790ca64a13db67260111ac5f4b98989b11af06199fa93f25d810bd09a5b21b2c2646529668638f7c34d3c04
+  languageName: node
+  linkType: hard
+
 "is-property@npm:^1.0.0, is-property@npm:^1.0.2":
  version: 1.0.2
  resolution: "is-property@npm:1.0.2"
@ -11685,6 +11933,13 @@ __metadata:
  languageName: node
  linkType: hard

+"json-schema-traverse@npm:^1.0.0":
+  version: 1.0.0
+  resolution: "json-schema-traverse@npm:1.0.0"
+  checksum: 02f2f466cdb0362558b2f1fd5e15cce82ef55d60cd7f8fa828cf35ba74330f8d767fcae5c5c2adb7851fa811766c694b9405810879bc4e1ddd78a7c0e03658ad
+  languageName: node
+  linkType: hard
+
 "json-stringify-safe@npm:^5.0.1":
  version: 5.0.1
  resolution: "json-stringify-safe@npm:5.0.1"
@ -12266,6 +12521,15 @@ __metadata:
  languageName: node
  linkType: hard

+"media-query-parser@npm:^2.0.2":
+  version: 2.0.2
+  resolution: "media-query-parser@npm:2.0.2"
+  dependencies:
+    "@babel/runtime": ^7.12.5
+  checksum: 8ef956d9e63fe6f4041988beda69843b3a6bb48228ea2923a066f6e7c8f7c5dba75fae357318c48a97ed5beae840b8425cb7e727fc1bb77acc65f2005f8945ab
+  languageName: node
+  linkType: hard
+
 "media-typer@npm:0.3.0":
  version: 0.3.0
  resolution: "media-typer@npm:0.3.0"
@ -12345,6 +12609,22 @@ __metadata:
  languageName: node
  linkType: hard

+"mime-db@npm:~1.33.0":
+  version: 1.33.0
+  resolution: "mime-db@npm:1.33.0"
+  checksum: 281a0772187c9b8f6096976cb193ac639c6007ac85acdbb8dc1617ed7b0f4777fa001d1b4f1b634532815e60717c84b2f280201d55677fb850c9d45015b50084
+  languageName: node
+  linkType: hard
+
+"mime-types@npm:2.1.18":
+  version: 2.1.18
+  resolution: "mime-types@npm:2.1.18"
+  dependencies:
+    mime-db: ~1.33.0
+  checksum: 729265eff1e5a0e87cb7f869da742a610679585167d2f2ec997a7387fc6aedf8e5cad078e99b0164a927bdf3ace34fca27430d6487456ad090cba5594441ba43
+  languageName: node
+  linkType: hard
+
 "mime-types@npm:^2.1.12, mime-types@npm:^2.1.25, mime-types@npm:~2.1.24, mime-types@npm:~2.1.34":
  version: 2.1.35
  resolution: "mime-types@npm:2.1.35"
@ -12400,7 +12680,7 @@ __metadata:
  languageName: node
  linkType: hard

-"minimatch@npm:^3.0.2, minimatch@npm:^3.0.4, minimatch@npm:^3.1.1":
+"minimatch@npm:3.1.2, minimatch@npm:^3.0.2, minimatch@npm:^3.0.4, minimatch@npm:^3.1.1":
  version: 3.1.2
  resolution: "minimatch@npm:3.1.2"
  dependencies:
@ -12418,7 +12698,7 @@ __metadata:
  languageName: node
  linkType: hard

-"minimist@npm:^1.1.1, minimist@npm:^1.1.3, minimist@npm:^1.2.5, minimist@npm:^1.2.6, minimist@npm:^1.2.8, minimist@npm:~1.2.5":
+"minimist@npm:^1.1.1, minimist@npm:^1.1.3, minimist@npm:^1.2.0, minimist@npm:^1.2.5, minimist@npm:^1.2.6, minimist@npm:^1.2.8, minimist@npm:~1.2.5":
  version: 1.2.8
  resolution: "minimist@npm:1.2.8"
  checksum: 75a6d645fb122dad29c06a7597bddea977258957ed88d7a6df59b5cd3fe4a527e253e9bbf2e783e4b73657f9098b96a5fe96ab8a113655d4109108577ecf85b0
@ -13113,6 +13393,13 @@ __metadata:
  languageName: node
  linkType: hard

+"outdent@npm:^0.8.0":
+  version: 0.8.0
+  resolution: "outdent@npm:0.8.0"
+  checksum: 72b7c1a287674317ea477999ec24e73a9eda21de35eb9429218f4a5bab899e964afaee7508265898118fee5cbee1d79397916b66dd8aeee285cd948ea5b1f562
+  languageName: node
+  linkType: hard
+
 "p-cancelable@npm:^2.0.0":
  version: 2.1.1
  resolution: "p-cancelable@npm:2.1.1"
@ -13359,6 +13646,13 @@ __metadata:
  languageName: node
  linkType: hard

+"path-is-inside@npm:1.0.2":
+  version: 1.0.2
+  resolution: "path-is-inside@npm:1.0.2"
+  checksum: 0b5b6c92d3018b82afb1f74fe6de6338c4c654de4a96123cb343f2b747d5606590ac0c890f956ed38220a4ab59baddfd7b713d78a62d240b20b14ab801fa02cb
+  languageName: node
+  linkType: hard
+
 "path-key@npm:^2.0.0, path-key@npm:^2.0.1":
  version: 2.0.1
  resolution: "path-key@npm:2.0.1"
@ -13387,6 +13681,13 @@ __metadata:
  languageName: node
  linkType: hard

+"path-to-regexp@npm:2.2.1":
+  version: 2.2.1
+  resolution: "path-to-regexp@npm:2.2.1"
+  checksum: b921a74e7576e25b06ad1635abf7e8125a29220d2efc2b71d74b9591f24a27e6f09078fa9a1b27516a097ea0637b7cab79d19b83d7f36a8ef3ef5422770e89d9
+  languageName: node
+  linkType: hard
+
 "path-type@npm:^2.0.0":
  version: 2.0.0
  resolution: "path-type@npm:2.0.0"
@ -13818,6 +14119,13 @@ __metadata:
  languageName: node
  linkType: hard

+"punycode@npm:^1.3.2":
+  version: 1.4.1
+  resolution: "punycode@npm:1.4.1"
+  checksum: fa6e698cb53db45e4628559e557ddaf554103d2a96a1d62892c8f4032cd3bc8871796cae9eabc1bc700e2b6677611521ce5bb1d9a27700086039965d0cf34518
+  languageName: node
+  linkType: hard
+
 "punycode@npm:^2.1.0":
  version: 2.3.0
  resolution: "punycode@npm:2.3.0"
@ -13908,6 +14216,13 @@ __metadata:
  languageName: node
  linkType: hard

+"range-parser@npm:1.2.0":
+  version: 1.2.0
+  resolution: "range-parser@npm:1.2.0"
+  checksum: bdf397f43fedc15c559d3be69c01dedf38444ca7a1610f5bf5955e3f3da6057a892f34691e7ebdd8c7e1698ce18ef6c4d4811f70e658dda3ff230ef741f8423a
+  languageName: node
+  linkType: hard
+
 "range-parser@npm:~1.2.1":
  version: 1.2.1
  resolution: "range-parser@npm:1.2.1"
@ -13927,6 +14242,20 @@ __metadata:
  languageName: node
  linkType: hard

+"rc@npm:^1.0.1, rc@npm:^1.1.6":
+  version: 1.2.8
+  resolution: "rc@npm:1.2.8"
+  dependencies:
+    deep-extend: ^0.6.0
+    ini: ~1.3.0
+    minimist: ^1.2.0
+    strip-json-comments: ~2.0.1
+  bin:
+    rc: ./cli.js
+  checksum: 2e26e052f8be2abd64e6d1dabfbd7be03f80ec18ccbc49562d31f617d0015fbdbcf0f9eed30346ea6ab789e0fdfe4337f033f8016efdbee0df5354751842080e
+  languageName: node
+  linkType: hard
+
 "rcedit@npm:^3.0.1":
  version: 3.0.1
  resolution: "rcedit@npm:3.0.1"
@ -14357,6 +14686,25 @@ __metadata:
  languageName: node
  linkType: hard

+"registry-auth-token@npm:3.3.2":
+  version: 3.3.2
+  resolution: "registry-auth-token@npm:3.3.2"
+  dependencies:
+    rc: ^1.1.6
+    safe-buffer: ^5.0.1
+  checksum: c9d7ae160a738f1fa825556e3669e6c771d2c0239ce37679f7e8646157a97d0a76464738be075002a1f754ef9bfb913b689f4bbfd5296d28f136fbf98c8c2217
+  languageName: node
+  linkType: hard
+
+"registry-url@npm:3.1.0":
+  version: 3.1.0
+  resolution: "registry-url@npm:3.1.0"
+  dependencies:
+    rc: ^1.0.1
+  checksum: 6d223da41b04e1824f5faa63905c6f2e43b216589d72794111573f017352b790aef42cd1f826463062f89d804abb2027e3d9665d2a9a0426a11eedd04d470af3
+  languageName: node
+  linkType: hard
+
 "regjsparser@npm:^0.9.1":
  version: 0.9.1
  resolution: "regjsparser@npm:0.9.1"
@ -14415,6 +14763,13 @@ __metadata:
  languageName: node
  linkType: hard

+"require-from-string@npm:^2.0.2":
+  version: 2.0.2
+  resolution: "require-from-string@npm:2.0.2"
+  checksum: a03ef6895445f33a4015300c426699bc66b2b044ba7b670aa238610381b56d3f07c686251740d575e22f4c87531ba662d06937508f0f3c0f1ddc04db3130560b
+  languageName: node
+  linkType: hard
+
 "require-main-filename@npm:^2.0.0":
  version: 2.0.0
  resolution: "require-main-filename@npm:2.0.0"
@ -14683,7 +15038,7 @@ __metadata:
  languageName: node
  linkType: hard

-"safe-buffer@npm:5.2.1, safe-buffer@npm:>=5.1.0, safe-buffer@npm:^5.1.0, safe-buffer@npm:~5.2.0":
+"safe-buffer@npm:5.2.1, safe-buffer@npm:>=5.1.0, safe-buffer@npm:^5.0.1, safe-buffer@npm:^5.1.0, safe-buffer@npm:~5.2.0":
  version: 5.2.1
  resolution: "safe-buffer@npm:5.2.1"
  checksum: b99c4b41fdd67a6aaf280fcd05e9ffb0813654894223afb78a31f14a19ad220bba8aba1cb14eddce1fcfb037155fe6de4e861784eb434f7d11ed58d1e70dd491
@ -14794,6 +15149,22 @@ __metadata:
  languageName: node
  linkType: hard

+"serve-handler@npm:6.1.5":
+  version: 6.1.5
+  resolution: "serve-handler@npm:6.1.5"
+  dependencies:
+    bytes: 3.0.0
+    content-disposition: 0.5.2
+    fast-url-parser: 1.1.3
+    mime-types: 2.1.18
+    minimatch: 3.1.2
+    path-is-inside: 1.0.2
+    path-to-regexp: 2.2.1
+    range-parser: 1.2.0
+  checksum: 7a98ca9cbf8692583b6cde4deb3941cff900fa38bf16adbfccccd8430209bab781e21d9a1f61c9c03e226f9f67689893bbce25941368f3ddaf985fc3858b49dc
+  languageName: node
+  linkType: hard
+
 "serve-static@npm:1.15.0":
  version: 1.15.0
  resolution: "serve-static@npm:1.15.0"
@ -14806,6 +15177,27 @@ __metadata:
  languageName: node
  linkType: hard

+"serve@npm:^14.2.0":
+  version: 14.2.0
+  resolution: "serve@npm:14.2.0"
+  dependencies:
+    "@zeit/schemas": 2.29.0
+    ajv: 8.11.0
+    arg: 5.0.2
+    boxen: 7.0.0
+    chalk: 5.0.1
+    chalk-template: 0.4.0
+    clipboardy: 3.0.0
+    compression: 1.7.4
+    is-port-reachable: 4.0.0
+    serve-handler: 6.1.5
+    update-check: 1.5.4
+  bin:
+    serve: build/main.js
+  checksum: a1c26e6c3dd0c482589b39a105e2f09bebf20ee8a0358accd5d64b313952ad3e1a56b8af2bdfef269f9fd37140b4f6c940d12395c851e4a46dfdace8f97616e4
+  languageName: node
+  linkType: hard
+
 "set-blocking@npm:^2.0.0":
  version: 2.0.0
  resolution: "set-blocking@npm:2.0.0"
@ -14861,6 +15253,13 @@ __metadata:
  languageName: node
  linkType: hard

+"shell-quote@npm:^1.8.0":
+  version: 1.8.0
+  resolution: "shell-quote@npm:1.8.0"
+  checksum: 6ef7c5e308b9c77eedded882653a132214fa98b4a1512bb507588cf6cd2fc78bfee73e945d0c3211af028a1eabe09c6a19b96edd8977dc149810797e93809749
+  languageName: node
+  linkType: hard
+
 "shelljs@npm:^0.8.5":
  version: 0.8.5
  resolution: "shelljs@npm:0.8.5"
@ -15054,6 +15453,13 @@ __metadata:
  languageName: node
  linkType: hard

+"spawn-command@npm:0.0.2-1":
+  version: 0.0.2-1
+  resolution: "spawn-command@npm:0.0.2-1"
+  checksum: 2cac8519332193d1ed37d57298c4a1f73095e9edd20440fbab4aa47f531da83831734f2b51c44bb42b2747bf3485dec3fa2b0a1003f74c67561f2636622e328b
+  languageName: node
+  linkType: hard
+
 "spawn-wrap@npm:^2.0.0":
  version: 2.0.0
  resolution: "spawn-wrap@npm:2.0.0"
@ -15275,6 +15681,17 @@ __metadata:
  languageName: node
  linkType: hard

+"string-width@npm:^5.0.1, string-width@npm:^5.1.2":
+  version: 5.1.2
+  resolution: "string-width@npm:5.1.2"
+  dependencies:
+    eastasianwidth: ^0.2.0
+    emoji-regex: ^9.2.2
+    strip-ansi: ^7.0.1
+  checksum: 7369deaa29f21dda9a438686154b62c2c5f661f8dda60449088f9f980196f7908fc39fdd1803e3e01541970287cf5deae336798337e9319a7055af89dafa7193
+  languageName: node
+  linkType: hard
+
 "string_decoder@npm:^1.1.1":
  version: 1.3.0
  resolution: "string_decoder@npm:1.3.0"
@ -15362,6 +15779,13 @@ __metadata:
  languageName: node
  linkType: hard

+"strip-json-comments@npm:~2.0.1":
+  version: 2.0.1
+  resolution: "strip-json-comments@npm:2.0.1"
+  checksum: 1074ccb63270d32ca28edfb0a281c96b94dc679077828135141f27d52a5a398ef5e78bcf22809d23cadc2b81dfbe345eb5fd8699b385c8b1128907dec4a7d1e1
+  languageName: node
+  linkType: hard
+
 "strip-outer@npm:^1.0.1":
  version: 1.0.1
  resolution: "strip-outer@npm:1.0.1"
@ -15428,7 +15852,7 @@ __metadata:
  languageName: node
  linkType: hard

-"supports-color@npm:^8.0.0":
+"supports-color@npm:^8.0.0, supports-color@npm:^8.1.1":
  version: 8.1.1
  resolution: "supports-color@npm:8.1.1"
  dependencies:
@ -15838,7 +16262,7 @@ __metadata:
  languageName: node
  linkType: hard

-"type-fest@npm:^2.19.0":
+"type-fest@npm:^2.13.0, type-fest@npm:^2.19.0":
  version: 2.19.0
  resolution: "type-fest@npm:2.19.0"
  checksum: a4ef07ece297c9fba78fc1bd6d85dff4472fe043ede98bd4710d2615d15776902b595abf62bd78339ed6278f021235fb28a96361f8be86ed754f778973a0d278
@ -16081,6 +16505,16 @@ __metadata:
  languageName: node
  linkType: hard

+"update-check@npm:1.5.4":
+  version: 1.5.4
+  resolution: "update-check@npm:1.5.4"
+  dependencies:
+    registry-auth-token: 3.3.2
+    registry-url: 3.1.0
+  checksum: 2c9f7de6f030364c5ea02a341e5ae2dfe76da6559b32d40dd3b047b3ac0927408cf92d322c51cd8e009688210a85ccbf1eba449762a65a0d1b14f3cdf1ea5c48
+  languageName: node
+  linkType: hard
+
 "uri-js@npm:^4.2.2":
  version: 4.4.1
  resolution: "uri-js@npm:4.4.1"
@ -16217,6 +16651,18 @@ __metadata:
  languageName: node
  linkType: hard

+"vite-plugin-istanbul@npm:^3.0.1":
+  version: 3.0.4
+  resolution: "vite-plugin-istanbul@npm:3.0.4"
+  dependencies:
+    "@istanbuljs/load-nyc-config": ^1.1.0
+    istanbul-lib-instrument: ^5.1.0
+    picocolors: ^1.0.0
+    test-exclude: ^6.0.0
+  checksum: 74fa99e2e2bded28ff6ba47bddf3cdd2eae04d37f2b6d257dcf5571c75f3433c6495fe94bba1f12acd0fc6046a6e83ea618b0547726ba68190bf292c7cb34695
+  languageName: node
+  linkType: hard
+
 "vite@npm:^4.2.1":
  version: 4.2.1
  resolution: "vite@npm:4.2.1"
@ -16494,6 +16940,15 @@ __metadata:
  languageName: node
  linkType: hard

+"widest-line@npm:^4.0.1":
+  version: 4.0.1
+  resolution: "widest-line@npm:4.0.1"
+  dependencies:
+    string-width: ^5.0.1
+  checksum: 64c48cf27171221be5f86fc54b94dd29879165bdff1a7aa92dde723d9a8c99fb108312768a5d62c8c2b80b701fa27bbd36a1ddc58367585cd45c0db7920a0cba
+  languageName: node
+  linkType: hard
+
 "word-wrap@npm:^1.2.3, word-wrap@npm:~1.2.3":
  version: 1.2.3
  resolution: "word-wrap@npm:1.2.3"
@ -16530,6 +16985,17 @@ __metadata:
  languageName: node
  linkType: hard

+"wrap-ansi@npm:^8.0.1":
+  version: 8.1.0
+  resolution: "wrap-ansi@npm:8.1.0"
+  dependencies:
+    ansi-styles: ^6.1.0
+    string-width: ^5.0.1
+    strip-ansi: ^7.0.1
+  checksum: 371733296dc2d616900ce15a0049dca0ef67597d6394c57347ba334393599e800bab03c41d4d45221b6bc967b8c453ec3ae4749eff3894202d16800fdfe0e238
+  languageName: node
+  linkType: hard
+
 "wrappy@npm:1":
  version: 1.0.2
  resolution: "wrappy@npm:1.0.2"
@ -16776,7 +17242,7 @@ __metadata:
  languageName: node
  linkType: hard

-"yargs@npm:^17.0.1, yargs@npm:^17.3.1":
+"yargs@npm:^17.0.1, yargs@npm:^17.3.1, yargs@npm:^17.7.1":
  version: 17.7.1
  resolution: "yargs@npm:17.7.1"
  dependencies:
--- a/apps/web/next.config.mjs
+++ b/apps/web/next.config.mjs
@ -10,6 +10,8 @@ import preset from './preset.config.mjs';
 import { getCommitHash, getGitVersion } from './scripts/gitInfo.mjs';

 const require = createRequire(import.meta.url);
+const { createVanillaExtractPlugin } = require('@vanilla-extract/next-plugin');
+const withVanillaExtract = createVanillaExtractPlugin();

 console.info('Runtime Preset', preset);

@ -189,4 +191,4 @@ if (process.env.PERFSEE_TOKEN) {
  );
 }

-export default config;
+export default withVanillaExtract(config);
--- a/apps/web/package.json
+++ b/apps/web/package.json
@ -53,6 +53,8 @@
    "@types/react": "^18.0.31",
    "@types/react-dom": "^18.0.11",
    "@types/webpack-env": "^1.18.0",
+    "@vanilla-extract/css": "^1.11.0",
+    "@vanilla-extract/next-plugin": "^2.1.1",
    "dotenv": "^16.0.3",
    "eslint": "^8.37.0",
    "eslint-config-next": "^13.2.4",
--- a/apps/web/src/components/pure/workspace-slider-bar/WorkspaceSelector/WorkspaceSelector.tsx
+++ b/apps/web/src/components/pure/workspace-slider-bar/WorkspaceSelector/WorkspaceSelector.tsx
@ -5,6 +5,7 @@ import type React from 'react';

 import { useCurrentWorkspace } from '../../../../hooks/current/use-current-workspace';
 import type { AllWorkspace } from '../../../../shared';
+import { workspaceAvatarStyle } from './index.css';
 import {
  StyledSelectorContainer,
  StyledSelectorWrapper,
@ -29,9 +30,7 @@ export const WorkspaceSelector: React.FC<WorkspaceSelectorProps> = ({
    <StyledSelectorContainer onClick={onClick} data-testid="current-workspace">
      <WorkspaceAvatar
        data-testid="workspace-avatar"
-        style={{
-          flexShrink: 0,
-        }}
+        className={workspaceAvatarStyle}
        size={40}
        workspace={currentWorkspace}
      />
--- a/apps/web/src/components/pure/workspace-slider-bar/WorkspaceSelector/index.css.ts
+++ b/apps/web/src/components/pure/workspace-slider-bar/WorkspaceSelector/index.css.ts
@ -0,0 +1,4 @@
+import { style } from '@vanilla-extract/css';
+export const workspaceAvatarStyle = style({
+  flexShrink: 0,
+});
--- a/package.json
+++ b/package.json
@ -47,6 +47,7 @@
    "@types/node": "^18.15.11",
    "@typescript-eslint/eslint-plugin": "^5.57.0",
    "@typescript-eslint/parser": "^5.57.0",
+    "@vanilla-extract/vite-plugin": "^3.8.0",
    "@vitejs/plugin-react": "^3.1.0",
    "@vitest/coverage-istanbul": "^0.29.8",
    "@vitest/ui": "^0.29.8",
--- a/packages/component/.storybook/main.ts
+++ b/packages/component/.storybook/main.ts
@ -2,6 +2,7 @@ import type { StorybookConfig } from '@storybook/react-vite';
 import { fileURLToPath } from 'node:url';
 import { mergeConfig } from 'vite';
 import tsconfigPaths from 'vite-tsconfig-paths';
+import { vanillaExtractPlugin } from '@vanilla-extract/vite-plugin';

 export default {
  stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
@ -11,6 +12,7 @@ export default {
    '@storybook/addon-essentials',
    '@storybook/addon-interactions',
    '@storybook/addon-storysource',
+    '@storybook/addon-coverage',
    'storybook-dark-mode',
  ],
  framework: {
@ -19,6 +21,7 @@ export default {
  async viteFinal(config, { configType }) {
    return mergeConfig(config, {
      plugins: [
+        vanillaExtractPlugin(),
        tsconfigPaths({
          root: fileURLToPath(new URL('../../../', import.meta.url)),
        }),
--- a/packages/component/package.json
+++ b/packages/component/package.json
@ -30,6 +30,7 @@
    "@mui/icons-material": "^5.11.11",
    "@mui/material": "^5.11.15",
    "@toeverything/hooks": "workspace:*",
+    "clsx": "^1.2.1",
    "lit": "^2.7.0",
    "react": "^18.2.0",
    "react-dnd": "^16.0.1",
@ -39,6 +40,7 @@
  },
  "devDependencies": {
    "@storybook/addon-actions": "^7.0.2",
+    "@storybook/addon-coverage": "^0.0.8",
    "@storybook/addon-essentials": "^7.0.2",
    "@storybook/addon-interactions": "^7.0.2",
    "@storybook/addon-links": "^7.0.2",
@ -53,8 +55,11 @@
    "@types/react": "^18.0.31",
    "@types/react-dnd": "^3.0.2",
    "@types/react-dom": "18.0.11",
+    "@vanilla-extract/css": "^1.11.0",
    "@vitejs/plugin-react": "^3.1.0",
+    "concurrently": "^8.0.1",
    "jest-mock": "^29.5.0",
+    "serve": "^14.2.0",
    "storybook": "^7.0.2",
    "storybook-dark-mode": "^3.0.0",
    "typescript": "^5.0.3",
--- a/packages/component/src/components/block-suite-editor/index.stories.tsx
+++ b/packages/component/src/components/block-suite-editor/index.stories.tsx
@ -51,12 +51,6 @@ const Template: StoryFn<EditorProps> = (args: EditorProps) => {
 };
 export const Empty = Template.bind({});
 Empty.play = async ({ canvasElement }) => {
-  await new Promise<void>(resolve => {
-    document.addEventListener('blocksuite:ready', () => resolve(), {
-      once: true,
-    });
-  });
-
  const editorContainer = canvasElement.querySelector(
    '[data-testid="editor-test-page0"]'
  ) as HTMLDivElement;
--- a/packages/component/src/components/workspace-avatar/index.css.ts
+++ b/packages/component/src/components/workspace-avatar/index.css.ts
@ -0,0 +1,19 @@
+import { style } from '@vanilla-extract/css';
+export const avatarStyle = style({
+  color: '#fff',
+  borderRadius: '50%',
+  overflow: 'hidden',
+  display: 'inline-block',
+  verticalAlign: 'middle',
+});
+
+export const avatarTextStyle = style({
+  border: '1px solid #fff',
+  color: '#fff',
+  borderRadius: '50%',
+  display: 'inline-flex',
+  lineHeight: '1',
+  justifyContent: 'center',
+  alignItems: 'center',
+  userSelect: 'none',
+});
--- a/packages/component/src/components/workspace-avatar/index.tsx
+++ b/packages/component/src/components/workspace-avatar/index.tsx
@ -1,9 +1,12 @@
 import type { AffineWorkspace, LocalWorkspace } from '@affine/workspace/type';
 import type { Workspace } from '@blocksuite/store';
 import { useBlockSuiteWorkspaceAvatarUrl } from '@toeverything/hooks/use-blocksuite-workspace-avatar-url';
+import clsx from 'clsx';
 import type React from 'react';
 import { memo } from 'react';

+import { avatarStyle, avatarTextStyle } from './index.css';
+
 function stringToColour(str: string) {
  str = str || 'affine';
  let colour = '#';
@ -29,13 +32,12 @@ interface AvatarProps {
  size: number;
  name: string;
  avatar_url: string;
-  style?: React.CSSProperties;
+  className?: string;
 }

 export const Avatar: React.FC<AvatarProps> = memo<AvatarProps>(function Avatar({
  size: _size,
  avatar_url,
-  style,
  name,
  ...props
 }) {
@ -47,20 +49,16 @@ export const Avatar: React.FC<AvatarProps> = memo<AvatarProps>(function Avatar({
      {avatar_url ? (
        <div
          {...props}
+          className={clsx(avatarStyle, props.className)}
          style={{
-            ...style,
            width: sizeStr,
            height: sizeStr,
-            color: '#fff',
-            borderRadius: '50%',
-            overflow: 'hidden',
-            display: 'inline-block',
-            verticalAlign: 'middle',
          }}
        >
          <picture>
            <img
-              style={{ width: sizeStr, height: sizeStr }}
+              width={size}
+              height={size}
              src={avatar_url}
              alt=""
              referrerPolicy="no-referrer"
@ -70,20 +68,12 @@ export const Avatar: React.FC<AvatarProps> = memo<AvatarProps>(function Avatar({
      ) : (
        <div
          {...props}
+          className={avatarTextStyle}
          style={{
-            ...style,
            width: sizeStr,
            height: sizeStr,
-            border: '1px solid #fff',
-            color: '#fff',
            fontSize: Math.ceil(0.5 * size) + 'px',
            background: stringToColour(name || 'AFFiNE'),
-            borderRadius: '50%',
-            display: 'inline-flex',
-            lineHeight: '1',
-            justifyContent: 'center',
-            alignItems: 'center',
-            userSelect: 'none',
          }}
        >
          {(name || 'AFFiNE').substring(0, 1)}
@ -93,14 +83,14 @@ export const Avatar: React.FC<AvatarProps> = memo<AvatarProps>(function Avatar({
  );
 });

-export type WorkspaceUnitAvatarProps = {
+export type WorkspaceAvatarProps = {
  size?: number;
  workspace: LocalWorkspace | AffineWorkspace | null;
-  style?: React.CSSProperties;
+  className?: string;
 };

 export type BlockSuiteWorkspaceAvatar = Omit<
-  WorkspaceUnitAvatarProps,
+  WorkspaceAvatarProps,
  'workspace'
 > & {
  workspace: Workspace;
@ -109,7 +99,6 @@ export type BlockSuiteWorkspaceAvatar = Omit<
 export const BlockSuiteWorkspaceAvatar: React.FC<BlockSuiteWorkspaceAvatar> = ({
  size = 20,
  workspace,
-  style,
  ...props
 }) => {
  const [avatar] = useBlockSuiteWorkspaceAvatarUrl(workspace);
@ -120,15 +109,13 @@ export const BlockSuiteWorkspaceAvatar: React.FC<BlockSuiteWorkspaceAvatar> = ({
      size={size}
      name={workspace.meta.name ?? 'Untitled'}
      avatar_url={avatar ?? ''}
-      style={style}
    />
  );
 };

-export const WorkspaceAvatar: React.FC<WorkspaceUnitAvatarProps> = ({
+export const WorkspaceAvatar: React.FC<WorkspaceAvatarProps> = ({
  size = 20,
  workspace,
-  style,
  ...props
 }) => {
  if (workspace && 'blockSuiteWorkspace' in workspace) {
@ -137,11 +124,8 @@ export const WorkspaceAvatar: React.FC<WorkspaceUnitAvatarProps> = ({
        {...props}
        size={size}
        workspace={workspace.blockSuiteWorkspace}
-        style={style}
      />
    );
  }
-  return (
-    <Avatar {...props} size={size} name="UNKNOWN" avatar_url="" style={style} />
-  );
+  return <Avatar {...props} size={size} name="UNKNOWN" avatar_url="" />;
 };
--- a/packages/component/src/stories/WorkspaceAvatar.stories.tsx
+++ b/packages/component/src/stories/WorkspaceAvatar.stories.tsx
@ -2,7 +2,7 @@ import { WorkspaceFlavour } from '@affine/workspace/type';
 import { Workspace } from '@blocksuite/store';
 import type { Meta, StoryFn } from '@storybook/react';

-import type { WorkspaceUnitAvatarProps } from '../components/workspace-avatar';
+import type { WorkspaceAvatarProps } from '../components/workspace-avatar';
 import { WorkspaceAvatar } from '../components/workspace-avatar';

 export default {
@ -17,30 +17,63 @@ export default {
      },
    },
  },
-} satisfies Meta<WorkspaceUnitAvatarProps>;
+} satisfies Meta<WorkspaceAvatarProps>;

-const blockSuiteWorkspace = new Workspace({
+const basicBlockSuiteWorkspace = new Workspace({
  id: 'blocksuite-local',
+  blobOptionsGetter: (_: string) => undefined,
 });

-blockSuiteWorkspace.meta.setName('Hello World');
+basicBlockSuiteWorkspace.meta.setName('Hello World');

-export const Basic: StoryFn<WorkspaceUnitAvatarProps> = props => {
+export const Basic: StoryFn<WorkspaceAvatarProps> = props => {
  return (
-    <div>
-      <WorkspaceAvatar
-        {...props}
-        workspace={{
-          flavour: WorkspaceFlavour.LOCAL,
-          id: 'local',
-          blockSuiteWorkspace,
-          providers: [],
-        }}
-      />
-    </div>
+    <WorkspaceAvatar
+      {...props}
+      workspace={{
+        flavour: WorkspaceFlavour.LOCAL,
+        id: 'local',
+        blockSuiteWorkspace: basicBlockSuiteWorkspace,
+        providers: [],
+      }}
+    />
  );
 };

 Basic.args = {
  size: 40,
 };
+
+const avatarBlockSuiteWorkspace = new Workspace({
+  id: 'blocksuite-local',
+  blobOptionsGetter: (_: string) => undefined,
+});
+
+avatarBlockSuiteWorkspace.meta.setName('Hello World');
+avatarBlockSuiteWorkspace.blobs.then(async blobs => {
+  if (blobs) {
+    const buffer = await (
+      await fetch(new URL('@affine-test/fixtures/smile.png', import.meta.url))
+    ).arrayBuffer();
+    const id = await blobs.set(new Blob([buffer], { type: 'image/png' }));
+    avatarBlockSuiteWorkspace.meta.setAvatar(id);
+  }
+});
+
+export const BlobExample: StoryFn<WorkspaceAvatarProps> = props => {
+  return (
+    <WorkspaceAvatar
+      {...props}
+      workspace={{
+        flavour: WorkspaceFlavour.LOCAL,
+        id: 'local',
+        blockSuiteWorkspace: avatarBlockSuiteWorkspace,
+        providers: [],
+      }}
+    />
+  );
+};
+
+BlobExample.args = {
+  size: 40,
+};
--- a/packages/hooks/src/use-blocksuite-workspace-avatar-url.ts
+++ b/packages/hooks/src/use-blocksuite-workspace-avatar-url.ts
@ -1,29 +1,27 @@
 import type { Workspace } from '@blocksuite/store';
 import { assertExists } from '@blocksuite/store';
-import { useCallback } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import useSWR from 'swr';

 export function useBlockSuiteWorkspaceAvatarUrl(
-  // todo: remove `null` from type
-  blockSuiteWorkspace: Workspace | null
+  blockSuiteWorkspace: Workspace
 ) {
-  const { data: avatar, mutate } = useSWR(
-    blockSuiteWorkspace && blockSuiteWorkspace.meta.avatar
-      ? [blockSuiteWorkspace.id, blockSuiteWorkspace.meta.avatar]
-      : null,
-    {
-      fetcher: async ([id, avatar]) => {
-        assertExists(blockSuiteWorkspace);
-        const blobs = await blockSuiteWorkspace.blobs;
-        if (blobs) {
-          return blobs.get(avatar);
-        }
-        return null;
-      },
-      suspense: true,
-      fallbackData: null,
-    }
-  );
+  const [url, set] = useState(() => blockSuiteWorkspace.meta.avatar);
+  if (url !== blockSuiteWorkspace.meta.avatar) {
+    set(blockSuiteWorkspace.meta.avatar);
+  }
+  const { data: avatar, mutate } = useSWR(url, {
+    fetcher: async avatar => {
+      assertExists(blockSuiteWorkspace);
+      const blobs = await blockSuiteWorkspace.blobs;
+      if (blobs) {
+        return blobs.get(avatar);
+      }
+      return null;
+    },
+    suspense: true,
+    fallbackData: null,
+  });
  const setAvatar = useCallback(
    async (file: File) => {
      assertExists(blockSuiteWorkspace);
@ -36,5 +34,15 @@ export function useBlockSuiteWorkspaceAvatarUrl(
    },
    [blockSuiteWorkspace, mutate]
  );
+  useEffect(() => {
+    if (blockSuiteWorkspace) {
+      const dispose = blockSuiteWorkspace.meta.commonFieldsUpdated.on(() => {
+        set(blockSuiteWorkspace.meta.avatar);
+      });
+      return () => {
+        dispose.dispose();
+      };
+    }
+  }, []);
  return [avatar ?? null, setAvatar] as const;
 }
--- a/vitest.config.ts
+++ b/vitest.config.ts
@ -1,10 +1,11 @@
 import { resolve } from 'node:path';

+import { vanillaExtractPlugin } from '@vanilla-extract/vite-plugin';
 import react from '@vitejs/plugin-react';
 import { defineConfig } from 'vitest/config';

 export default defineConfig({
-  plugins: [react()],
+  plugins: [react(), vanillaExtractPlugin()],
  assetsInclude: ['**/*.md'],
  resolve: {
    alias: {
--- a/yarn.lock
+++ b/yarn.lock
@ -50,6 +50,7 @@ __metadata:
    "@mui/icons-material": ^5.11.11
    "@mui/material": ^5.11.15
    "@storybook/addon-actions": ^7.0.2
+    "@storybook/addon-coverage": ^0.0.8
    "@storybook/addon-essentials": ^7.0.2
    "@storybook/addon-interactions": ^7.0.2
    "@storybook/addon-links": ^7.0.2
@ -65,7 +66,10 @@ __metadata:
    "@types/react": ^18.0.31
    "@types/react-dnd": ^3.0.2
    "@types/react-dom": 18.0.11
+    "@vanilla-extract/css": ^1.11.0
    "@vitejs/plugin-react": ^3.1.0
+    clsx: ^1.2.1
+    concurrently: ^8.0.1
    jest-mock: ^29.5.0
    lit: ^2.7.0
    react: ^18.2.0
@ -73,6 +77,7 @@ __metadata:
    react-dnd-html5-backend: ^16.0.1
    react-dom: ^18.2.0
    react-is: ^18.2.0
+    serve: ^14.2.0
    storybook: ^7.0.2
    storybook-dark-mode: ^3.0.0
    typescript: ^5.0.3
@ -177,6 +182,8 @@ __metadata:
    "@types/react": ^18.0.31
    "@types/react-dom": ^18.0.11
    "@types/webpack-env": ^1.18.0
+    "@vanilla-extract/css": ^1.11.0
+    "@vanilla-extract/next-plugin": ^2.1.1
    cmdk: ^0.2.0
    css-spring: ^4.1.0
    dayjs: ^1.11.7
@ -2052,6 +2059,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/android-arm64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/android-arm64@npm:0.17.6"
+  conditions: os=android & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/android-arm@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/android-arm@npm:0.17.14"
@ -2059,6 +2073,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/android-arm@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/android-arm@npm:0.17.6"
+  conditions: os=android & cpu=arm
+  languageName: node
+  linkType: hard
+
 "@esbuild/android-x64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/android-x64@npm:0.17.14"
@ -2066,6 +2087,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/android-x64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/android-x64@npm:0.17.6"
+  conditions: os=android & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@esbuild/darwin-arm64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/darwin-arm64@npm:0.17.14"
@ -2073,6 +2101,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/darwin-arm64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/darwin-arm64@npm:0.17.6"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/darwin-x64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/darwin-x64@npm:0.17.14"
@ -2080,6 +2115,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/darwin-x64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/darwin-x64@npm:0.17.6"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@esbuild/freebsd-arm64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/freebsd-arm64@npm:0.17.14"
@ -2087,6 +2129,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/freebsd-arm64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/freebsd-arm64@npm:0.17.6"
+  conditions: os=freebsd & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/freebsd-x64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/freebsd-x64@npm:0.17.14"
@ -2094,6 +2143,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/freebsd-x64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/freebsd-x64@npm:0.17.6"
+  conditions: os=freebsd & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-arm64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/linux-arm64@npm:0.17.14"
@ -2101,6 +2157,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/linux-arm64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/linux-arm64@npm:0.17.6"
+  conditions: os=linux & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-arm@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/linux-arm@npm:0.17.14"
@ -2108,6 +2171,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/linux-arm@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/linux-arm@npm:0.17.6"
+  conditions: os=linux & cpu=arm
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-ia32@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/linux-ia32@npm:0.17.14"
@ -2115,6 +2185,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/linux-ia32@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/linux-ia32@npm:0.17.6"
+  conditions: os=linux & cpu=ia32
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-loong64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/linux-loong64@npm:0.17.14"
@ -2122,6 +2199,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/linux-loong64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/linux-loong64@npm:0.17.6"
+  conditions: os=linux & cpu=loong64
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-mips64el@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/linux-mips64el@npm:0.17.14"
@ -2129,6 +2213,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/linux-mips64el@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/linux-mips64el@npm:0.17.6"
+  conditions: os=linux & cpu=mips64el
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-ppc64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/linux-ppc64@npm:0.17.14"
@ -2136,6 +2227,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/linux-ppc64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/linux-ppc64@npm:0.17.6"
+  conditions: os=linux & cpu=ppc64
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-riscv64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/linux-riscv64@npm:0.17.14"
@ -2143,6 +2241,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/linux-riscv64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/linux-riscv64@npm:0.17.6"
+  conditions: os=linux & cpu=riscv64
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-s390x@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/linux-s390x@npm:0.17.14"
@ -2150,6 +2255,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/linux-s390x@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/linux-s390x@npm:0.17.6"
+  conditions: os=linux & cpu=s390x
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-x64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/linux-x64@npm:0.17.14"
@ -2157,6 +2269,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/linux-x64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/linux-x64@npm:0.17.6"
+  conditions: os=linux & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@esbuild/netbsd-x64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/netbsd-x64@npm:0.17.14"
@ -2164,6 +2283,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/netbsd-x64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/netbsd-x64@npm:0.17.6"
+  conditions: os=netbsd & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@esbuild/openbsd-x64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/openbsd-x64@npm:0.17.14"
@ -2171,6 +2297,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/openbsd-x64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/openbsd-x64@npm:0.17.6"
+  conditions: os=openbsd & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@esbuild/sunos-x64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/sunos-x64@npm:0.17.14"
@ -2178,6 +2311,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/sunos-x64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/sunos-x64@npm:0.17.6"
+  conditions: os=sunos & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@esbuild/win32-arm64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/win32-arm64@npm:0.17.14"
@ -2185,6 +2325,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/win32-arm64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/win32-arm64@npm:0.17.6"
+  conditions: os=win32 & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/win32-ia32@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/win32-ia32@npm:0.17.14"
@ -2192,6 +2339,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/win32-ia32@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/win32-ia32@npm:0.17.6"
+  conditions: os=win32 & cpu=ia32
+  languageName: node
+  linkType: hard
+
 "@esbuild/win32-x64@npm:0.17.14":
  version: 0.17.14
  resolution: "@esbuild/win32-x64@npm:0.17.14"
@ -2199,6 +2353,13 @@ __metadata:
  languageName: node
  linkType: hard

+"@esbuild/win32-x64@npm:0.17.6":
+  version: 0.17.6
+  resolution: "@esbuild/win32-x64@npm:0.17.6"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@eslint-community/eslint-utils@npm:^4.2.0":
  version: 4.4.0
  resolution: "@eslint-community/eslint-utils@npm:4.4.0"
@ -4630,6 +4791,18 @@ __metadata:
  languageName: node
  linkType: hard

+"@storybook/addon-coverage@npm:^0.0.8":
+  version: 0.0.8
+  resolution: "@storybook/addon-coverage@npm:0.0.8"
+  dependencies:
+    "@types/babel__core": ^7.1.19
+    "@types/istanbul-lib-coverage": ^2.0.4
+    babel-plugin-istanbul: ^6.1.1
+    vite-plugin-istanbul: ^3.0.1
+  checksum: 8cf18a291699df1b630f77698abfd4d370dabfba55ae186e522b76b9bc76ce6a866cdd5d0e8c044dda135dd2873651d3ab9d2ddc93903222bdabf236ef64645e
+  languageName: node
+  linkType: hard
+
 "@storybook/addon-docs@npm:7.0.2":
  version: 7.0.2
  resolution: "@storybook/addon-docs@npm:7.0.2"
@ -5950,7 +6123,7 @@ __metadata:
  languageName: node
  linkType: hard

-"@types/babel__core@npm:^7.0.0, @types/babel__core@npm:^7.1.14":
+"@types/babel__core@npm:^7.0.0, @types/babel__core@npm:^7.1.14, @types/babel__core@npm:^7.1.19":
  version: 7.20.0
  resolution: "@types/babel__core@npm:7.20.0"
  dependencies:
@ -6186,7 +6359,7 @@ __metadata:
  languageName: node
  linkType: hard

-"@types/istanbul-lib-coverage@npm:*, @types/istanbul-lib-coverage@npm:^2.0.0, @types/istanbul-lib-coverage@npm:^2.0.1":
+"@types/istanbul-lib-coverage@npm:*, @types/istanbul-lib-coverage@npm:^2.0.0, @types/istanbul-lib-coverage@npm:^2.0.1, @types/istanbul-lib-coverage@npm:^2.0.4":
  version: 2.0.4
  resolution: "@types/istanbul-lib-coverage@npm:2.0.4"
  checksum: a25d7589ee65c94d31464c16b72a9dc81dfa0bea9d3e105ae03882d616e2a0712a9c101a599ec482d297c3591e16336962878cb3eb1a0a62d5b76d277a890ce7
@ -6652,6 +6825,102 @@ __metadata:
  languageName: node
  linkType: hard

+"@vanilla-extract/babel-plugin-debug-ids@npm:^1.0.2":
+  version: 1.0.2
+  resolution: "@vanilla-extract/babel-plugin-debug-ids@npm:1.0.2"
+  dependencies:
+    "@babel/core": ^7.20.7
+  checksum: 4f3e448ae51fe48e73852816e30aef899a27e54dbafb937f8b59534d289322f590e78e089aae643e94853ce869f44e68021e41b208c6eefe7271e745fa710ec0
+  languageName: node
+  linkType: hard
+
+"@vanilla-extract/css@npm:^1.10.0, @vanilla-extract/css@npm:^1.11.0":
+  version: 1.11.0
+  resolution: "@vanilla-extract/css@npm:1.11.0"
+  dependencies:
+    "@emotion/hash": ^0.9.0
+    "@vanilla-extract/private": ^1.0.3
+    ahocorasick: 1.0.2
+    chalk: ^4.1.1
+    css-what: ^5.0.1
+    cssesc: ^3.0.0
+    csstype: ^3.0.7
+    deep-object-diff: ^1.1.9
+    deepmerge: ^4.2.2
+    media-query-parser: ^2.0.2
+    outdent: ^0.8.0
+  checksum: da382c7b80e88890931dbf927d38769aed432cb4c5cd434f35ffd5dcec18584c95864c2ad8f5cd0456ae32f9b3ee6aa3af8eb2d95a7f7c709e41a52d731996b5
+  languageName: node
+  linkType: hard
+
+"@vanilla-extract/integration@npm:^6.0.0, @vanilla-extract/integration@npm:^6.0.2":
+  version: 6.2.1
+  resolution: "@vanilla-extract/integration@npm:6.2.1"
+  dependencies:
+    "@babel/core": ^7.20.7
+    "@babel/plugin-syntax-typescript": ^7.20.0
+    "@vanilla-extract/babel-plugin-debug-ids": ^1.0.2
+    "@vanilla-extract/css": ^1.10.0
+    esbuild: 0.17.6
+    eval: 0.1.6
+    find-up: ^5.0.0
+    javascript-stringify: ^2.0.1
+    lodash: ^4.17.21
+    mlly: ^1.1.0
+    outdent: ^0.8.0
+    vite: ^4.1.4
+    vite-node: ^0.28.5
+  checksum: 28bda6804f09f6dd046fb3d3d2cc2f7b5a1143e476645d34a9e92eb9156f44d63200e1035932e8a76d4a77b5c20807907294476f6d7fc3b43e9f93670ff87953
+  languageName: node
+  linkType: hard
+
+"@vanilla-extract/next-plugin@npm:^2.1.1":
+  version: 2.1.1
+  resolution: "@vanilla-extract/next-plugin@npm:2.1.1"
+  dependencies:
+    "@vanilla-extract/webpack-plugin": ^2.2.0
+    browserslist: ^4.19.1
+  peerDependencies:
+    next: ">=12.0.5"
+  checksum: c82a3cd8228630354068c59be74cb64d48bfec3044f27d914100755fd930d0a5944d28cf5ab0516be4caccff1f32bbbe03e13f4b2a14438bee423586f3a9738e
+  languageName: node
+  linkType: hard
+
+"@vanilla-extract/private@npm:^1.0.3":
+  version: 1.0.3
+  resolution: "@vanilla-extract/private@npm:1.0.3"
+  checksum: 866a71ba6804edeb0735684e7723ba78f5cf0bb40d4fb538fe6bf7d73928099e341312337b2a510ac0ce96ff8a4b39eb7f7a5fad0c842532353dd20e7278f29b
+  languageName: node
+  linkType: hard
+
+"@vanilla-extract/vite-plugin@npm:^3.8.0":
+  version: 3.8.0
+  resolution: "@vanilla-extract/vite-plugin@npm:3.8.0"
+  dependencies:
+    "@vanilla-extract/integration": ^6.0.2
+    outdent: ^0.8.0
+    postcss: ^8.3.6
+    postcss-load-config: ^3.1.0
+  peerDependencies:
+    vite: ^2.2.3 || ^3.0.0 || ^4.0.3
+  checksum: 475b24ec957ae80d2ada5972b76011969a80094f70dc9ad44f7748b566f87a392923bdc827652b3f6ec2e9d8f9e4b3505c7b60de38d102b090c896ea53db9826
+  languageName: node
+  linkType: hard
+
+"@vanilla-extract/webpack-plugin@npm:^2.2.0":
+  version: 2.2.0
+  resolution: "@vanilla-extract/webpack-plugin@npm:2.2.0"
+  dependencies:
+    "@vanilla-extract/integration": ^6.0.0
+    chalk: ^4.1.1
+    debug: ^4.3.1
+    loader-utils: ^2.0.0
+  peerDependencies:
+    webpack: ^4.30.0 || ^5.20.2
+  checksum: 3e1741062eb849192558718e85c99d2e1aeefab01f17863d2381d493ec337a1a5137b8aef7bb60687ad754facda184d15ba763231f7bdad307170761755abf67
+  languageName: node
+  linkType: hard
+
 "@vitejs/plugin-react@npm:^3.0.1, @vitejs/plugin-react@npm:^3.1.0":
  version: 3.1.0
  resolution: "@vitejs/plugin-react@npm:3.1.0"
@ -6950,6 +7219,7 @@ __metadata:
    "@types/node": ^18.15.11
    "@typescript-eslint/eslint-plugin": ^5.57.0
    "@typescript-eslint/parser": ^5.57.0
+    "@vanilla-extract/vite-plugin": ^3.8.0
    "@vitejs/plugin-react": ^3.1.0
    "@vitest/coverage-istanbul": ^0.29.8
    "@vitest/ui": ^0.29.8
@ -7092,6 +7362,13 @@ __metadata:
  languageName: node
  linkType: hard

+"ahocorasick@npm:1.0.2":
+  version: 1.0.2
+  resolution: "ahocorasick@npm:1.0.2"
+  checksum: a13ce4403554ae782cf5e28d468a732acf1fd3d0bff251f5dcfddfa5497b6cc343948d69cd94dfdbe8d4dfdb81e2b34cb1c92079e6301f38b0143d314fb95bd6
+  languageName: node
+  linkType: hard
+
 "ajv-keywords@npm:^3.5.2":
  version: 3.5.2
  resolution: "ajv-keywords@npm:3.5.2"
@ -7825,7 +8102,7 @@ __metadata:
  languageName: node
  linkType: hard

-"browserslist@npm:^4.14.5, browserslist@npm:^4.21.3, browserslist@npm:^4.21.5":
+"browserslist@npm:^4.14.5, browserslist@npm:^4.19.1, browserslist@npm:^4.21.3, browserslist@npm:^4.21.5":
  version: 4.21.5
  resolution: "browserslist@npm:4.21.5"
  dependencies:
@ -8596,6 +8873,26 @@ __metadata:
  languageName: node
  linkType: hard

+"concurrently@npm:^8.0.1":
+  version: 8.0.1
+  resolution: "concurrently@npm:8.0.1"
+  dependencies:
+    chalk: ^4.1.2
+    date-fns: ^2.29.3
+    lodash: ^4.17.21
+    rxjs: ^7.8.0
+    shell-quote: ^1.8.0
+    spawn-command: 0.0.2-1
+    supports-color: ^8.1.1
+    tree-kill: ^1.2.2
+    yargs: ^17.7.1
+  bin:
+    conc: dist/bin/concurrently.js
+    concurrently: dist/bin/concurrently.js
+  checksum: cce10ab1bbd7fd099300234637cdbc8e12622a5fe53f8dd31dcd9562d9803f25d3d0410bdb6fffd54e8f4e11b852366c03994bd319843cce70e449c8a8a69526
+  languageName: node
+  linkType: hard
+
 "console-control-strings@npm:^1.0.0, console-control-strings@npm:^1.1.0":
  version: 1.1.0
  resolution: "console-control-strings@npm:1.1.0"
@ -8742,6 +9039,13 @@ __metadata:
  languageName: node
  linkType: hard

+"css-what@npm:^5.0.1":
+  version: 5.1.0
+  resolution: "css-what@npm:5.1.0"
+  checksum: 0b75d1bac95c885c168573c85744a6c6843d8c33345f54f717218b37ea6296b0e99bb12105930ea170fd4a921990392a7c790c16c585c1d8960c49e2b7ec39f7
+  languageName: node
+  linkType: hard
+
 "css.escape@npm:^1.5.1":
  version: 1.5.1
  resolution: "css.escape@npm:1.5.1"
@ -8749,6 +9053,15 @@ __metadata:
  languageName: node
  linkType: hard

+"cssesc@npm:^3.0.0":
+  version: 3.0.0
+  resolution: "cssesc@npm:3.0.0"
+  bin:
+    cssesc: bin/cssesc
+  checksum: f8c4ababffbc5e2ddf2fa9957dda1ee4af6048e22aeda1869d0d00843223c1b13ad3f5d88b51caa46c994225eacb636b764eb807a8883e2fb6f99b4f4e8c48b2
+  languageName: node
+  linkType: hard
+
 "csstype@npm:^3.0.2, csstype@npm:^3.1.1":
  version: 3.1.1
  resolution: "csstype@npm:3.1.1"
@ -8756,6 +9069,13 @@ __metadata:
  languageName: node
  linkType: hard

+"csstype@npm:^3.0.7":
+  version: 3.1.2
+  resolution: "csstype@npm:3.1.2"
+  checksum: e1a52e6c25c1314d6beef5168da704ab29c5186b877c07d822bd0806717d9a265e8493a2e35ca7e68d0f5d472d43fac1cdce70fd79fd0853dff81f3028d857b5
+  languageName: node
+  linkType: hard
+
 "cwd@npm:^0.10.0":
  version: 0.10.0
  resolution: "cwd@npm:0.10.0"
@ -8773,6 +9093,13 @@ __metadata:
  languageName: node
  linkType: hard

+"date-fns@npm:^2.29.3":
+  version: 2.29.3
+  resolution: "date-fns@npm:2.29.3"
+  checksum: e01cf5b62af04e05dfff921bb9c9933310ed0e1ae9a81eb8653452e64dc841acf7f6e01e1a5ae5644d0337e9a7f936175fd2cb6819dc122fdd9c5e86c56be484
+  languageName: node
+  linkType: hard
+
 "dayjs@npm:^1.11.7":
  version: 1.11.7
  resolution: "dayjs@npm:1.11.7"
@ -8789,7 +9116,7 @@ __metadata:
  languageName: node
  linkType: hard

-"debug@npm:4, debug@npm:4.3.4, debug@npm:^4.1.0, debug@npm:^4.1.1, debug@npm:^4.3.2, debug@npm:^4.3.3, debug@npm:^4.3.4":
+"debug@npm:4, debug@npm:4.3.4, debug@npm:^4.1.0, debug@npm:^4.1.1, debug@npm:^4.3.1, debug@npm:^4.3.2, debug@npm:^4.3.3, debug@npm:^4.3.4":
  version: 4.3.4
  resolution: "debug@npm:4.3.4"
  dependencies:
@ -8888,6 +9215,13 @@ __metadata:
  languageName: node
  linkType: hard

+"deep-object-diff@npm:^1.1.9":
+  version: 1.1.9
+  resolution: "deep-object-diff@npm:1.1.9"
+  checksum: ecd42455e4773f653595d28070295e7aaa8402db5f8ab21d0bec115a7cb4de5e207a5665514767da5f025c96597f1d3a0a4888aeb4dd49e03c996871a3aa05ef
+  languageName: node
+  linkType: hard
+
 "deepmerge@npm:^4.2.2":
  version: 4.3.1
  resolution: "deepmerge@npm:4.3.1"
@ -9567,6 +9901,83 @@ __metadata:
  languageName: node
  linkType: hard

+"esbuild@npm:0.17.6":
+  version: 0.17.6
+  resolution: "esbuild@npm:0.17.6"
+  dependencies:
+    "@esbuild/android-arm": 0.17.6
+    "@esbuild/android-arm64": 0.17.6
+    "@esbuild/android-x64": 0.17.6
+    "@esbuild/darwin-arm64": 0.17.6
+    "@esbuild/darwin-x64": 0.17.6
+    "@esbuild/freebsd-arm64": 0.17.6
+    "@esbuild/freebsd-x64": 0.17.6
+    "@esbuild/linux-arm": 0.17.6
+    "@esbuild/linux-arm64": 0.17.6
+    "@esbuild/linux-ia32": 0.17.6
+    "@esbuild/linux-loong64": 0.17.6
+    "@esbuild/linux-mips64el": 0.17.6
+    "@esbuild/linux-ppc64": 0.17.6
+    "@esbuild/linux-riscv64": 0.17.6
+    "@esbuild/linux-s390x": 0.17.6
+    "@esbuild/linux-x64": 0.17.6
+    "@esbuild/netbsd-x64": 0.17.6
+    "@esbuild/openbsd-x64": 0.17.6
+    "@esbuild/sunos-x64": 0.17.6
+    "@esbuild/win32-arm64": 0.17.6
+    "@esbuild/win32-ia32": 0.17.6
+    "@esbuild/win32-x64": 0.17.6
+  dependenciesMeta:
+    "@esbuild/android-arm":
+      optional: true
+    "@esbuild/android-arm64":
+      optional: true
+    "@esbuild/android-x64":
+      optional: true
+    "@esbuild/darwin-arm64":
+      optional: true
+    "@esbuild/darwin-x64":
+      optional: true
+    "@esbuild/freebsd-arm64":
+      optional: true
+    "@esbuild/freebsd-x64":
+      optional: true
+    "@esbuild/linux-arm":
+      optional: true
+    "@esbuild/linux-arm64":
+      optional: true
+    "@esbuild/linux-ia32":
+      optional: true
+    "@esbuild/linux-loong64":
+      optional: true
+    "@esbuild/linux-mips64el":
+      optional: true
+    "@esbuild/linux-ppc64":
+      optional: true
+    "@esbuild/linux-riscv64":
+      optional: true
+    "@esbuild/linux-s390x":
+      optional: true
+    "@esbuild/linux-x64":
+      optional: true
+    "@esbuild/netbsd-x64":
+      optional: true
+    "@esbuild/openbsd-x64":
+      optional: true
+    "@esbuild/sunos-x64":
+      optional: true
+    "@esbuild/win32-arm64":
+      optional: true
+    "@esbuild/win32-ia32":
+      optional: true
+    "@esbuild/win32-x64":
+      optional: true
+  bin:
+    esbuild: bin/esbuild
+  checksum: 13c4c3bcaa7ff291810d2c8294a1eb997b4672c60a9285b32d8eafcbc552e4468e06efe9d1a15067f5cbd41adcb12ddb4362618845e2e916e437f281c9aa80ab
+  languageName: node
+  linkType: hard
+
 "esbuild@npm:^0.17.0, esbuild@npm:^0.17.5":
  version: 0.17.14
  resolution: "esbuild@npm:0.17.14"
@ -10066,6 +10477,15 @@ __metadata:
  languageName: node
  linkType: hard

+"eval@npm:0.1.6":
+  version: 0.1.6
+  resolution: "eval@npm:0.1.6"
+  dependencies:
+    require-like: ">= 0.1.1"
+  checksum: 0e9246bb16256eef07afa7f31408310a784407d2fec2ddd2d7fe1f885a45b7cf37e30739e658a65d000c3dcff8d5b5c96f9819188b00e1f667b6638e75eaf23c
+  languageName: node
+  linkType: hard
+
 "events@npm:^3.2.0, events@npm:^3.3.0":
  version: 3.3.0
  resolution: "events@npm:3.3.0"
@ -12303,6 +12723,13 @@ __metadata:
  languageName: node
  linkType: hard

+"javascript-stringify@npm:^2.0.1":
+  version: 2.1.0
+  resolution: "javascript-stringify@npm:2.1.0"
+  checksum: 009981ec84299da88795fc764221ed213e3d52251cc93a396430a7a02ae09f1163a9be36a36808689681a8e6113cf00fe97ec2eea2552df48111f79be59e9358
+  languageName: node
+  linkType: hard
+
 "jest-changed-files@npm:^28.1.3":
  version: 28.1.3
  resolution: "jest-changed-files@npm:28.1.3"
@ -13310,7 +13737,7 @@ __metadata:
  languageName: node
  linkType: hard

-"lilconfig@npm:2.1.0":
+"lilconfig@npm:2.1.0, lilconfig@npm:^2.0.5":
  version: 2.1.0
  resolution: "lilconfig@npm:2.1.0"
  checksum: 8549bb352b8192375fed4a74694cd61ad293904eee33f9d4866c2192865c44c4eb35d10782966242634e0cbc1e91fe62b1247f148dc5514918e3a966da7ea117
@ -13756,6 +14183,15 @@ __metadata:
  languageName: node
  linkType: hard

+"media-query-parser@npm:^2.0.2":
+  version: 2.0.2
+  resolution: "media-query-parser@npm:2.0.2"
+  dependencies:
+    "@babel/runtime": ^7.12.5
+  checksum: 8ef956d9e63fe6f4041988beda69843b3a6bb48228ea2923a066f6e7c8f7c5dba75fae357318c48a97ed5beae840b8425cb7e727fc1bb77acc65f2005f8945ab
+  languageName: node
+  linkType: hard
+
 "media-typer@npm:0.3.0":
  version: 0.3.0
  resolution: "media-typer@npm:0.3.0"
@ -14700,6 +15136,13 @@ __metadata:
  languageName: node
  linkType: hard

+"outdent@npm:^0.8.0":
+  version: 0.8.0
+  resolution: "outdent@npm:0.8.0"
+  checksum: 72b7c1a287674317ea477999ec24e73a9eda21de35eb9429218f4a5bab899e964afaee7508265898118fee5cbee1d79397916b66dd8aeee285cd948ea5b1f562
+  languageName: node
+  linkType: hard
+
 "outvariant@npm:^1.2.1, outvariant@npm:^1.4.0":
  version: 1.4.0
  resolution: "outvariant@npm:1.4.0"
@ -15088,6 +15531,24 @@ __metadata:
  languageName: node
  linkType: hard

+"postcss-load-config@npm:^3.1.0":
+  version: 3.1.4
+  resolution: "postcss-load-config@npm:3.1.4"
+  dependencies:
+    lilconfig: ^2.0.5
+    yaml: ^1.10.2
+  peerDependencies:
+    postcss: ">=8.0.9"
+    ts-node: ">=9.0.0"
+  peerDependenciesMeta:
+    postcss:
+      optional: true
+    ts-node:
+      optional: true
+  checksum: 1c589504c2d90b1568aecae8238ab993c17dba2c44f848a8f13619ba556d26a1c09644d5e6361b5784e721e94af37b604992f9f3dc0483e687a0cc1cc5029a34
+  languageName: node
+  linkType: hard
+
 "postcss@npm:8.4.14":
  version: 8.4.14
  resolution: "postcss@npm:8.4.14"
@ -15099,7 +15560,7 @@ __metadata:
  languageName: node
  linkType: hard

-"postcss@npm:^8.4.21":
+"postcss@npm:^8.3.6, postcss@npm:^8.4.21":
  version: 8.4.21
  resolution: "postcss@npm:8.4.21"
  dependencies:
@ -16041,6 +16502,13 @@ __metadata:
  languageName: node
  linkType: hard

+"require-like@npm:>= 0.1.1":
+  version: 0.1.2
+  resolution: "require-like@npm:0.1.2"
+  checksum: edb8331f05fd807381a75b76f6cca9f0ce8acaa2e910b7e116541799aa970bfbc64fde5fd6adb3a6917dba346f8386ebbddb81614c24e8dad1b4290c7af9535e
+  languageName: node
+  linkType: hard
+
 "require-main-filename@npm:^2.0.0":
  version: 2.0.0
  resolution: "require-main-filename@npm:2.0.0"
@ -16544,6 +17012,13 @@ __metadata:
  languageName: node
  linkType: hard

+"shell-quote@npm:^1.8.0":
+  version: 1.8.0
+  resolution: "shell-quote@npm:1.8.0"
+  checksum: 6ef7c5e308b9c77eedded882653a132214fa98b4a1512bb507588cf6cd2fc78bfee73e945d0c3211af028a1eabe09c6a19b96edd8977dc149810797e93809749
+  languageName: node
+  linkType: hard
+
 "shelljs@npm:^0.8.5":
  version: 0.8.5
  resolution: "shelljs@npm:0.8.5"
@ -16745,7 +17220,7 @@ __metadata:
  languageName: node
  linkType: hard

-"source-map-support@npm:^0.5.16, source-map-support@npm:~0.5.20":
+"source-map-support@npm:^0.5.16, source-map-support@npm:^0.5.21, source-map-support@npm:~0.5.20":
  version: 0.5.21
  resolution: "source-map-support@npm:0.5.21"
  dependencies:
@ -16776,6 +17251,13 @@ __metadata:
  languageName: node
  linkType: hard

+"spawn-command@npm:0.0.2-1":
+  version: 0.0.2-1
+  resolution: "spawn-command@npm:0.0.2-1"
+  checksum: 2cac8519332193d1ed37d57298c4a1f73095e9edd20440fbab4aa47f531da83831734f2b51c44bb42b2747bf3485dec3fa2b0a1003f74c67561f2636622e328b
+  languageName: node
+  linkType: hard
+
 "spawn-wrap@npm:^2.0.0":
  version: 2.0.0
  resolution: "spawn-wrap@npm:2.0.0"
@ -17222,7 +17704,7 @@ __metadata:
  languageName: node
  linkType: hard

-"supports-color@npm:^8.0.0":
+"supports-color@npm:^8.0.0, supports-color@npm:^8.1.1":
  version: 8.1.1
  resolution: "supports-color@npm:8.1.1"
  dependencies:
@ -18234,6 +18716,24 @@ __metadata:
  languageName: node
  linkType: hard

+"vite-node@npm:^0.28.5":
+  version: 0.28.5
+  resolution: "vite-node@npm:0.28.5"
+  dependencies:
+    cac: ^6.7.14
+    debug: ^4.3.4
+    mlly: ^1.1.0
+    pathe: ^1.1.0
+    picocolors: ^1.0.0
+    source-map: ^0.6.1
+    source-map-support: ^0.5.21
+    vite: ^3.0.0 || ^4.0.0
+  bin:
+    vite-node: vite-node.mjs
+  checksum: b3813b784f551613e561bf85e64ceb8e869d760d34f135dc3351b093618c6fc3c64f23839ac530ddc49724beb83c3f70ee6392e62676c78141ed04c7ab1e0aa0
+  languageName: node
+  linkType: hard
+
 "vite-plugin-dts@npm:^2.1.0":
  version: 2.1.0
  resolution: "vite-plugin-dts@npm:2.1.0"
@ -18254,6 +18754,18 @@ __metadata:
  languageName: node
  linkType: hard

+"vite-plugin-istanbul@npm:^3.0.1":
+  version: 3.0.4
+  resolution: "vite-plugin-istanbul@npm:3.0.4"
+  dependencies:
+    "@istanbuljs/load-nyc-config": ^1.1.0
+    istanbul-lib-instrument: ^5.1.0
+    picocolors: ^1.0.0
+    test-exclude: ^6.0.0
+  checksum: 74fa99e2e2bded28ff6ba47bddf3cdd2eae04d37f2b6d257dcf5571c75f3433c6495fe94bba1f12acd0fc6046a6e83ea618b0547726ba68190bf292c7cb34695
+  languageName: node
+  linkType: hard
+
 "vite-plugin-istanbul@npm:^4.0.1":
  version: 4.0.1
  resolution: "vite-plugin-istanbul@npm:4.0.1"
@ -18284,7 +18796,7 @@ __metadata:
  languageName: node
  linkType: hard

-"vite@npm:^3.0.0 || ^4.0.0, vite@npm:^4.2.1":
+"vite@npm:^3.0.0 || ^4.0.0, vite@npm:^4.1.4, vite@npm:^4.2.1":
  version: 4.2.1
  resolution: "vite@npm:4.2.1"
  dependencies:
@ -18938,7 +19450,7 @@ __metadata:
  languageName: node
  linkType: hard

-"yaml@npm:^1.10.0":
+"yaml@npm:^1.10.0, yaml@npm:^1.10.2":
  version: 1.10.2
  resolution: "yaml@npm:1.10.2"
  checksum: ce4ada136e8a78a0b08dc10b4b900936912d15de59905b2bf415b4d33c63df1d555d23acb2a41b23cf9fb5da41c256441afca3d6509de7247daa062fd2c5ea5f
@ -19010,7 +19522,7 @@ __metadata:
  languageName: node
  linkType: hard

-"yargs@npm:^17.3.1":
+"yargs@npm:^17.3.1, yargs@npm:^17.7.1":
  version: 17.7.1
  resolution: "yargs@npm:17.7.1"
  dependencies: