From 1834501ab3f4176494586b235b0d1fcaf8047f92 Mon Sep 17 00:00:00 2001 From: Kerry Date: Tue, 31 Oct 2023 10:15:21 +1300 Subject: [PATCH] Add @storybook/addon-a11y (#119) * add @storybook/addon-a11y * prettier --- .storybook/main.ts | 20 +++--- package.json | 1 + yarn.lock | 154 ++++++++++++++++++++++++++++++++++++++++++++- 3 files changed, 167 insertions(+), 8 deletions(-) diff --git a/.storybook/main.ts b/.storybook/main.ts index 0e229795..b4dea8cd 100644 --- a/.storybook/main.ts +++ b/.storybook/main.ts @@ -1,17 +1,23 @@ import type { StorybookConfig } from "@storybook/react-vite"; +const addons = [ + "@storybook/addon-links", + "@storybook/addon-essentials", + "@storybook/addon-interactions", + "@storybook/addon-designs", + "@storybook/addon-themes", +]; + +if (process.env.NODE_ENV === "development") { + addons.push("@storybook/addon-a11y"); +} + const config: StorybookConfig = { stories: [ "../src/**/*.mdx", "../src/**/!(__ComponentTemplate__)*.stories.@(js|jsx|ts|tsx)", ], - addons: [ - "@storybook/addon-links", - "@storybook/addon-essentials", - "@storybook/addon-interactions", - "@storybook/addon-designs", - "@storybook/addon-themes", - ], + addons, framework: { name: "@storybook/react-vite", options: {}, diff --git a/package.json b/package.json index aca9522b..0b02ea7b 100644 --- a/package.json +++ b/package.json @@ -56,6 +56,7 @@ "@fontsource/inter": "^5.0.8", "@percy/cli": "^1.27.1", "@percy/storybook": "^4.3.6", + "@storybook/addon-a11y": "^7.5.1", "@storybook/addon-designs": "7.0.5", "@storybook/addon-essentials": "7.4.2", "@storybook/addon-interactions": "7.4.2", diff --git a/yarn.lock b/yarn.lock index 13d6c9fc..5f0a74e4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2121,6 +2121,25 @@ resolved "https://registry.yarnpkg.com/@sinclair/typebox/-/typebox-0.27.8.tgz#6667fac16c436b5434a387a34dedb013198f6e6e" integrity sha512-+Fj43pSMwJs4KRrH/938Uf+uAELIgVBmQzg/q1YG10djyfA3TnrU8N8XzqCh/okZdszqBQTZf96idMfE5lnwTA== +"@storybook/addon-a11y@^7.5.1": + version "7.5.1" + resolved "https://registry.yarnpkg.com/@storybook/addon-a11y/-/addon-a11y-7.5.1.tgz#ed7876245c7b00fab4d742a058a32c577af17a79" + integrity sha512-BzmSIhgqR+WSS5gqSOyzFACs20Nv0Wk9b4lpUWw5zEqZkXy1PFAUyRQ65kD9Tdjc1O2KL2Zi1h/gi0O6dWldMg== + dependencies: + "@storybook/addon-highlight" "7.5.1" + "@storybook/channels" "7.5.1" + "@storybook/client-logger" "7.5.1" + "@storybook/components" "7.5.1" + "@storybook/core-events" "7.5.1" + "@storybook/global" "^5.0.0" + "@storybook/manager-api" "7.5.1" + "@storybook/preview-api" "7.5.1" + "@storybook/theming" "7.5.1" + "@storybook/types" "7.5.1" + axe-core "^4.2.0" + lodash "^4.17.21" + react-resize-detector "^7.1.2" + "@storybook/addon-actions@7.4.2": version "7.4.2" resolved "https://registry.yarnpkg.com/@storybook/addon-actions/-/addon-actions-7.4.2.tgz#7f1d69a5439d6d39c7453e2167f831f34c620380" @@ -2238,6 +2257,15 @@ "@storybook/global" "^5.0.0" "@storybook/preview-api" "7.4.2" +"@storybook/addon-highlight@7.5.1": + version "7.5.1" + resolved "https://registry.yarnpkg.com/@storybook/addon-highlight/-/addon-highlight-7.5.1.tgz#575152b8e54464ef6a29f5f58c19c14bfd45730c" + integrity sha512-js9OV17kpjRowuaGAPfI9aOn/zzt8P589ACZE+/eYBO9jT65CADwAUxg//Uq0/he+Ac9495pcK3BcYyDeym7/g== + dependencies: + "@storybook/core-events" "7.5.1" + "@storybook/global" "^5.0.0" + "@storybook/preview-api" "7.5.1" + "@storybook/addon-interactions@7.4.2": version "7.4.2" resolved "https://registry.yarnpkg.com/@storybook/addon-interactions/-/addon-interactions-7.4.2.tgz#44618d9d00a041058e12d19b774d3cd8ef7baaa9" @@ -2441,6 +2469,18 @@ telejson "^7.2.0" tiny-invariant "^1.3.1" +"@storybook/channels@7.5.1": + version "7.5.1" + resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-7.5.1.tgz#f850c6da3e2cabe51239499d68a8b3d7eb22c621" + integrity sha512-7hTGHqvtdFTqRx8LuCznOpqPBYfUeMUt/0IIp7SFuZT585yMPxrYoaK//QmLEWnPb80B8HVTSQi7caUkJb32LA== + dependencies: + "@storybook/client-logger" "7.5.1" + "@storybook/core-events" "7.5.1" + "@storybook/global" "^5.0.0" + qs "^6.10.0" + telejson "^7.2.0" + tiny-invariant "^1.3.1" + "@storybook/cli@7.4.5": version "7.4.5" resolved "https://registry.yarnpkg.com/@storybook/cli/-/cli-7.4.5.tgz#2d21e56f6172ba0a0e162c7d37ded4b07e726d66" @@ -2502,6 +2542,13 @@ dependencies: "@storybook/global" "^5.0.0" +"@storybook/client-logger@7.5.1": + version "7.5.1" + resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-7.5.1.tgz#dc4c693900ae1f7ebda9f7faeea46956e70ef184" + integrity sha512-XxbLvg0aQRoBrzxYLcVYCbjDkGbkU8Rfb74XbV2CLiO2bIbFPmA1l1Nwbp+wkCGA+O6Z1zwzSl6wcKKqZ6XZCg== + dependencies: + "@storybook/global" "^5.0.0" + "@storybook/codemod@7.4.5": version "7.4.5" resolved "https://registry.yarnpkg.com/@storybook/codemod/-/codemod-7.4.5.tgz#39cc21a587e1282ad5931e73690c26f48c677140" @@ -2554,6 +2601,22 @@ use-resize-observer "^9.1.0" util-deprecate "^1.0.2" +"@storybook/components@7.5.1": + version "7.5.1" + resolved "https://registry.yarnpkg.com/@storybook/components/-/components-7.5.1.tgz#677eae0e7976939434b5c391fe841ced9b66e082" + integrity sha512-fdzzxGBV/Fj9pYwfYL3RZsVUHeBqlfLMBP/L6mPmjaZSwHFqkaRZZUajZc57lCtI+TOy2gY6WH3cPavEtqtgLw== + dependencies: + "@radix-ui/react-select" "^1.2.2" + "@radix-ui/react-toolbar" "^1.0.4" + "@storybook/client-logger" "7.5.1" + "@storybook/csf" "^0.1.0" + "@storybook/global" "^5.0.0" + "@storybook/theming" "7.5.1" + "@storybook/types" "7.5.1" + memoizerific "^1.11.3" + use-resize-observer "^9.1.0" + util-deprecate "^1.0.2" + "@storybook/core-client@7.4.2": version "7.4.2" resolved "https://registry.yarnpkg.com/@storybook/core-client/-/core-client-7.4.2.tgz#30ae78e856cf1af7898be43f01773c58b52553c8" @@ -2634,6 +2697,13 @@ dependencies: ts-dedent "^2.0.0" +"@storybook/core-events@7.5.1": + version "7.5.1" + resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-7.5.1.tgz#a6bf057e4605fb8360c76d28a3c36daa676a81a4" + integrity sha512-2eyaUhTfmEEqOEZVoCXVITCBn6N7QuZCG2UNxv0l//ED+7MuMiFhVw7kS7H3WOVk65R7gb8qbKFTNX8HFTgBHg== + dependencies: + ts-dedent "^2.0.0" + "@storybook/core-server@7.4.5": version "7.4.5" resolved "https://registry.yarnpkg.com/@storybook/core-server/-/core-server-7.4.5.tgz#df6bba0178b2470789103463450461d39de54279" @@ -2809,6 +2879,27 @@ telejson "^7.2.0" ts-dedent "^2.0.0" +"@storybook/manager-api@7.5.1": + version "7.5.1" + resolved "https://registry.yarnpkg.com/@storybook/manager-api/-/manager-api-7.5.1.tgz#ebc5c0efc3f9c3451882e61b9b982d898a1fc6c9" + integrity sha512-ygwJywluhhE1dpA0jC2D/3NFhMXzFCt+iW4m3cOwexYTuiDWF66AbGOFBx9peE7Wk/Z9doKkf9E3v11enwaidA== + dependencies: + "@storybook/channels" "7.5.1" + "@storybook/client-logger" "7.5.1" + "@storybook/core-events" "7.5.1" + "@storybook/csf" "^0.1.0" + "@storybook/global" "^5.0.0" + "@storybook/router" "7.5.1" + "@storybook/theming" "7.5.1" + "@storybook/types" "7.5.1" + dequal "^2.0.2" + lodash "^4.17.21" + memoizerific "^1.11.3" + semver "^7.3.7" + store2 "^2.14.2" + telejson "^7.2.0" + ts-dedent "^2.0.0" + "@storybook/manager@7.4.5": version "7.4.5" resolved "https://registry.yarnpkg.com/@storybook/manager/-/manager-7.4.5.tgz#efd7c44eac0dc309ee96ab8c4eed54ffabde76d8" @@ -2874,6 +2965,26 @@ ts-dedent "^2.0.0" util-deprecate "^1.0.2" +"@storybook/preview-api@7.5.1": + version "7.5.1" + resolved "https://registry.yarnpkg.com/@storybook/preview-api/-/preview-api-7.5.1.tgz#c21697587d7202941e0f90538115d9c3be21f781" + integrity sha512-8xjUbuGmHLmw8tfTUCjXSvMM9r96JaexPFmHdwW6XLe71KKdWp8u96vRDRE5648cd+/of15OjaRtakRKqluA/A== + dependencies: + "@storybook/channels" "7.5.1" + "@storybook/client-logger" "7.5.1" + "@storybook/core-events" "7.5.1" + "@storybook/csf" "^0.1.0" + "@storybook/global" "^5.0.0" + "@storybook/types" "7.5.1" + "@types/qs" "^6.9.5" + dequal "^2.0.2" + lodash "^4.17.21" + memoizerific "^1.11.3" + qs "^6.10.0" + synchronous-promise "^2.0.15" + ts-dedent "^2.0.0" + util-deprecate "^1.0.2" + "@storybook/preview@7.4.2": version "7.4.2" resolved "https://registry.yarnpkg.com/@storybook/preview/-/preview-7.4.2.tgz#8539e0379f195d12774832bd9c87166b0382fc1e" @@ -2943,6 +3054,15 @@ memoizerific "^1.11.3" qs "^6.10.0" +"@storybook/router@7.5.1": + version "7.5.1" + resolved "https://registry.yarnpkg.com/@storybook/router/-/router-7.5.1.tgz#1d09daa1c7414061fe8c47415b7750a874ad1d9b" + integrity sha512-BvKo+IxWwo3dfIG1+vLtZLT4qqkNHL5GTIozTyX04uqt9ByYZL6SJEzxEa1Xn6Qq/fbdQwzCanNHbTlwiTMf7Q== + dependencies: + "@storybook/client-logger" "7.5.1" + memoizerific "^1.11.3" + qs "^6.10.0" + "@storybook/telemetry@7.4.5": version "7.4.5" resolved "https://registry.yarnpkg.com/@storybook/telemetry/-/telemetry-7.4.5.tgz#e9ce51ce70e763848077bd671057293cc2946f03" @@ -2986,6 +3106,16 @@ "@storybook/global" "^5.0.0" memoizerific "^1.11.3" +"@storybook/theming@7.5.1": + version "7.5.1" + resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-7.5.1.tgz#b3a78f493d644ac8cba5136e04479a58a9ba5546" + integrity sha512-ETLAOn10hI4Mkmjsr0HGcM6HbzaURrrPBYmfXOrdbrzEVN+AHW4FlvP9d8fYyP1gdjPE1F39XvF0jYgt1zXiHQ== + dependencies: + "@emotion/use-insertion-effect-with-fallbacks" "^1.0.0" + "@storybook/client-logger" "7.5.1" + "@storybook/global" "^5.0.0" + memoizerific "^1.11.3" + "@storybook/types@7.4.2": version "7.4.2" resolved "https://registry.yarnpkg.com/@storybook/types/-/types-7.4.2.tgz#c7ae7521e6f7a3f811797464724d5e4714597ca9" @@ -3006,6 +3136,16 @@ "@types/express" "^4.7.0" file-system-cache "2.3.0" +"@storybook/types@7.5.1": + version "7.5.1" + resolved "https://registry.yarnpkg.com/@storybook/types/-/types-7.5.1.tgz#fa7f5c4ded412c92af9e6bcb238689c1f4f57d2a" + integrity sha512-ZcMSaqFNx1E+G00nRDUi8kKL7gxJVlnCvbKLNj3V85guy4DkIYAZr31yDqze07gDWbjvKoHIp3tKpgE+2i8upQ== + dependencies: + "@storybook/channels" "7.5.1" + "@types/babel__core" "^7.0.0" + "@types/express" "^4.7.0" + file-system-cache "2.3.0" + "@svgr/babel-plugin-add-jsx-attribute@8.0.0": version "8.0.0" resolved "https://registry.yarnpkg.com/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-8.0.0.tgz#4001f5d5dd87fa13303e36ee106e3ff3a7eb8b22" @@ -3640,7 +3780,7 @@ "@typescript-eslint/types" "6.7.3" eslint-visitor-keys "^3.4.1" -"@vector-im/compound-design-tokens@0.7.0": +"@vector-im/compound-design-tokens@0.0.7": version "0.0.7" resolved "https://registry.yarnpkg.com/@vector-im/compound-design-tokens/-/compound-design-tokens-0.0.7.tgz#b0716dd4782dd95900491e45b003b58f93748024" integrity sha512-RCQc6qr+s8cp4xKbNi/I3OL43uPCH+N4L9vYf0r+qwRy4WCKdI4QL0TBTV4bOo8hF49z8e+BgU5ZIu5TVQXNMQ== @@ -4130,6 +4270,11 @@ available-typed-arrays@^1.0.5: resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz#92f95616501069d07d10edb2fc37d3e1c65123b7" integrity sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw== +axe-core@^4.2.0: + version "4.8.2" + resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.8.2.tgz#2f6f3cde40935825cf4465e3c1c9e77b240ff6ae" + integrity sha512-/dlp0fxyM3R8YW7MFzaHWXrf4zzbr0vaYb23VBFCl83R7nWNPg/yaQw2Dc8jzCMmDVLhSdzH8MjrsuIUuvX+6g== + babel-core@^7.0.0-bridge.0: version "7.0.0-bridge.0" resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-7.0.0-bridge.0.tgz#95a492ddd90f9b4e9a4a1da14eb335b87b634ece" @@ -8201,6 +8346,13 @@ react-remove-scroll@2.5.5: use-callback-ref "^1.3.0" use-sidecar "^1.1.2" +react-resize-detector@^7.1.2: + version "7.1.2" + resolved "https://registry.yarnpkg.com/react-resize-detector/-/react-resize-detector-7.1.2.tgz#8ef975dd8c3d56f9a5160ac382ef7136dcd2d86c" + integrity sha512-zXnPJ2m8+6oq9Nn8zsep/orts9vQv3elrpA+R8XTcW7DVVUJ9vwDwMXaBtykAYjMnkCIaOoK9vObyR7ZgFNlOw== + dependencies: + lodash "^4.17.21" + react-style-singleton@^2.2.1: version "2.2.1" resolved "https://registry.yarnpkg.com/react-style-singleton/-/react-style-singleton-2.2.1.tgz#f99e420492b2d8f34d38308ff660b60d0b1205b4"