@storybook/addon-a11y 10.2.0-alpha.8 → 10.2.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,9 @@
1
1
  import {
2
2
  EVENTS,
3
- PANEL_ID
4
- } from "./chunk-3FKQRDK3.js";
3
+ PANEL_ID,
4
+ filterDefs,
5
+ filters
6
+ } from "./chunk-7OPMK7TU.js";
5
7
  import {
6
8
  __export
7
9
  } from "./chunk-4BE7D4DS.js";
@@ -10,6 +12,7 @@ import {
10
12
  var preview_exports = {};
11
13
  __export(preview_exports, {
12
14
  afterEach: () => afterEach,
15
+ decorators: () => decorators,
13
16
  initialGlobals: () => initialGlobals,
14
17
  parameters: () => parameters
15
18
  });
@@ -22,8 +25,8 @@ import { addons, waitForAnimations } from "storybook/preview-api";
22
25
 
23
26
  // src/a11yRunnerUtils.ts
24
27
  import { global } from "@storybook/global";
25
- var { document } = global, withLinkPaths = (results, storyId) => {
26
- let pathname = document.location.pathname.replace(/iframe\.html$/, ""), enhancedResults = { ...results };
28
+ var { document: document2 } = global, withLinkPaths = (results, storyId) => {
29
+ let pathname = document2.location.pathname.replace(/iframe\.html$/, ""), enhancedResults = { ...results };
27
30
  return ["incomplete", "passes", "violations"].forEach((key) => {
28
31
  Array.isArray(results[key]) && (enhancedResults[key] = results[key].map((result) => ({
29
32
  ...result,
@@ -36,7 +39,7 @@ var { document } = global, withLinkPaths = (results, storyId) => {
36
39
  };
37
40
 
38
41
  // src/a11yRunner.ts
39
- var { document: document2 } = global2, channel = addons.getChannel(), DEFAULT_PARAMETERS = { config: {}, options: {} }, DISABLED_RULES = [
42
+ var { document: document3 } = global2, channel = addons.getChannel(), DEFAULT_PARAMETERS = { config: {}, options: {} }, DISABLED_RULES = [
40
43
  // In component testing, landmarks are not always present
41
44
  // and the rule check can cause false positives
42
45
  "region"
@@ -53,7 +56,7 @@ var { document: document2 } = global2, channel = addons.getChannel(), DEFAULT_PA
53
56
  if (input.element)
54
57
  throw new ElementA11yParameterError();
55
58
  let context = {
56
- include: document2?.body,
59
+ include: document3?.body,
57
60
  exclude: [".sb-wrapper", "#storybook-docs", "#storybook-highlights-root"]
58
61
  // Internal Storybook elements that are always in the document
59
62
  };
@@ -67,7 +70,7 @@ var { document: document2 } = global2, channel = addons.getChannel(), DEFAULT_PA
67
70
  rules: [...DISABLED_RULES.map((id) => ({ id, enabled: !1 })), ...config?.rules ?? []]
68
71
  };
69
72
  return axe.configure(configWithDefault), new Promise((resolve, reject) => {
70
- let highlightsRoot = document2?.getElementById("storybook-highlights-root");
73
+ let highlightsRoot = document3?.getElementById("storybook-highlights-root");
71
74
  highlightsRoot && (highlightsRoot.style.display = "none");
72
75
  let task = async () => {
73
76
  try {
@@ -99,15 +102,33 @@ function getIsVitestStandaloneRun() {
99
102
  }
100
103
  }
101
104
 
105
+ // src/withVisionSimulator.ts
106
+ import { useCallback, useEffect } from "storybook/preview-api";
107
+ var knownFilters = Object.values(filters).map((f) => f.filter), knownFiltersRegExp = new RegExp(`\\b(${knownFilters.join("|")})\\b`, "g"), withVisionSimulator = (StoryFn, { globals }) => {
108
+ let { vision } = globals, applyVisionFilter = useCallback(() => {
109
+ let existingFilters = document.body.style.filter.replaceAll(knownFiltersRegExp, "").trim(), visionFilter = filters[vision]?.filter;
110
+ return visionFilter && document.body.classList.contains("sb-show-main") ? !existingFilters || existingFilters === "none" ? document.body.style.filter = visionFilter : document.body.style.filter = `${existingFilters} ${visionFilter}` : document.body.style.filter = existingFilters || "none", () => document.body.style.filter = existingFilters || "none";
111
+ }, [vision]);
112
+ return useEffect(() => {
113
+ let cleanup = applyVisionFilter(), observer = new MutationObserver(() => applyVisionFilter());
114
+ return observer.observe(document.body, { attributeFilter: ["class"] }), () => {
115
+ cleanup(), observer.disconnect();
116
+ };
117
+ }, [applyVisionFilter]), useEffect(() => (document.body.insertAdjacentHTML("beforeend", filterDefs), () => {
118
+ let filterDefsElement = document.getElementById("storybook-a11y-vision-filters");
119
+ filterDefsElement?.parentElement?.removeChild(filterDefsElement);
120
+ }), []), StoryFn();
121
+ };
122
+
102
123
  // src/preview.tsx
103
- var vitestMatchersExtended = !1, afterEach = async ({
124
+ var vitestMatchersExtended = !1, decorators = [withVisionSimulator], afterEach = async ({
104
125
  id: storyId,
105
126
  reporting,
106
127
  parameters: parameters2,
107
128
  globals,
108
129
  viewMode
109
130
  }) => {
110
- let a11yParameter = parameters2.a11y, a11yGlobals = globals.a11y, shouldRunEnvironmentIndependent = a11yParameter?.disable !== !0 && a11yParameter?.test !== "off" && a11yGlobals?.manual !== !0, getMode = () => {
131
+ let a11yParameter = parameters2.a11y, a11yGlobals = globals.a11y, shouldRunEnvironmentIndependent = !!!globals.ghostStories && a11yParameter?.disable !== !0 && a11yParameter?.test !== "off" && a11yGlobals?.manual !== !0, getMode = () => {
111
132
  switch (a11yParameter?.test) {
112
133
  case "todo":
113
134
  return "warning";
@@ -148,7 +169,8 @@ var vitestMatchersExtended = !1, afterEach = async ({
148
169
  }, initialGlobals = {
149
170
  a11y: {
150
171
  manual: !1
151
- }
172
+ },
173
+ vision: void 0
152
174
  }, parameters = {
153
175
  a11y: {
154
176
  test: "todo"
@@ -156,6 +178,7 @@ var vitestMatchersExtended = !1, afterEach = async ({
156
178
  };
157
179
 
158
180
  export {
181
+ decorators,
159
182
  afterEach,
160
183
  initialGlobals,
161
184
  parameters,
@@ -0,0 +1,116 @@
1
+ // src/constants.ts
2
+ var ADDON_ID = "storybook/a11y", PANEL_ID = `${ADDON_ID}/panel`, PARAM_KEY = "a11y", VISION_GLOBAL_KEY = "vision", UI_STATE_ID = `${ADDON_ID}/ui`, RESULT = `${ADDON_ID}/result`, REQUEST = `${ADDON_ID}/request`, RUNNING = `${ADDON_ID}/running`, ERROR = `${ADDON_ID}/error`, MANUAL = `${ADDON_ID}/manual`, SELECT = `${ADDON_ID}/select`, DOCUMENTATION_LINK = "writing-tests/accessibility-testing", DOCUMENTATION_DISCREPANCY_LINK = `${DOCUMENTATION_LINK}#why-are-my-tests-failing-in-different-environments`;
3
+ var EVENTS = { RESULT, REQUEST, RUNNING, ERROR, MANUAL, SELECT }, STATUS_TYPE_ID_COMPONENT_TEST = "storybook/component-test", STATUS_TYPE_ID_A11Y = "storybook/a11y";
4
+
5
+ // src/visionSimulatorFilters.ts
6
+ var filters = {
7
+ blurred: {
8
+ label: "Blurred vision",
9
+ filter: "blur(2px)",
10
+ percentage: 22.9
11
+ },
12
+ deuteranomaly: {
13
+ label: "Deuteranomaly",
14
+ filter: 'url("#storybook-a11y-vision-deuteranomaly")',
15
+ percentage: 2.7
16
+ },
17
+ deuteranopia: {
18
+ label: "Deuteranopia",
19
+ filter: 'url("#storybook-a11y-vision-deuteranopia")',
20
+ percentage: 0.56
21
+ },
22
+ protanomaly: {
23
+ label: "Protanomaly",
24
+ filter: 'url("#storybook-a11y-vision-protanomaly")',
25
+ percentage: 0.66
26
+ },
27
+ protanopia: {
28
+ label: "Protanopia",
29
+ filter: 'url("#storybook-a11y-vision-protanopia")',
30
+ percentage: 0.59
31
+ },
32
+ tritanomaly: {
33
+ label: "Tritanomaly",
34
+ filter: 'url("#storybook-a11y-vision-tritanomaly")',
35
+ percentage: 0.01
36
+ },
37
+ tritanopia: {
38
+ label: "Tritanopia",
39
+ filter: 'url("#storybook-a11y-vision-tritanopia")',
40
+ percentage: 0.016
41
+ },
42
+ achromatopsia: {
43
+ label: "Achromatopsia",
44
+ filter: 'url("#storybook-a11y-vision-achromatopsia")',
45
+ percentage: 1e-4
46
+ },
47
+ grayscale: {
48
+ label: "Grayscale",
49
+ filter: "grayscale(100%)"
50
+ }
51
+ }, filterDefs = `<svg id="storybook-a11y-vision-filters" style="display: none !important;">
52
+ <defs>
53
+ <filter id="storybook-a11y-vision-protanopia">
54
+ <feColorMatrix
55
+ in="SourceGraphic"
56
+ type="matrix"
57
+ values="0.567, 0.433, 0, 0, 0 0.558, 0.442, 0, 0, 0 0, 0.242, 0.758, 0, 0 0, 0, 0, 1, 0"
58
+ />
59
+ </filter>
60
+ <filter id="storybook-a11y-vision-protanomaly">
61
+ <feColorMatrix
62
+ in="SourceGraphic"
63
+ type="matrix"
64
+ values="0.817, 0.183, 0, 0, 0 0.333, 0.667, 0, 0, 0 0, 0.125, 0.875, 0, 0 0, 0, 0, 1, 0"
65
+ />
66
+ </filter>
67
+ <filter id="storybook-a11y-vision-deuteranopia">
68
+ <feColorMatrix
69
+ in="SourceGraphic"
70
+ type="matrix"
71
+ values="0.625, 0.375, 0, 0, 0 0.7, 0.3, 0, 0, 0 0, 0.3, 0.7, 0, 0 0, 0, 0, 1, 0"
72
+ />
73
+ </filter>
74
+ <filter id="storybook-a11y-vision-deuteranomaly">
75
+ <feColorMatrix
76
+ in="SourceGraphic"
77
+ type="matrix"
78
+ values="0.8, 0.2, 0, 0, 0 0.258, 0.742, 0, 0, 0 0, 0.142, 0.858, 0, 0 0, 0, 0, 1, 0"
79
+ />
80
+ </filter>
81
+ <filter id="storybook-a11y-vision-tritanopia">
82
+ <feColorMatrix
83
+ in="SourceGraphic"
84
+ type="matrix"
85
+ values="0.95, 0.05, 0, 0, 0 0, 0.433, 0.567, 0, 0 0, 0.475, 0.525, 0, 0 0, 0, 0, 1, 0"
86
+ />
87
+ </filter>
88
+ <filter id="storybook-a11y-vision-tritanomaly">
89
+ <feColorMatrix
90
+ in="SourceGraphic"
91
+ type="matrix"
92
+ values="0.967, 0.033, 0, 0, 0 0, 0.733, 0.267, 0, 0 0, 0.183, 0.817, 0, 0 0, 0, 0, 1, 0"
93
+ />
94
+ </filter>
95
+ <filter id="storybook-a11y-vision-achromatopsia">
96
+ <feColorMatrix
97
+ in="SourceGraphic"
98
+ type="matrix"
99
+ values="0.299, 0.587, 0.114, 0, 0 0.299, 0.587, 0.114, 0, 0 0.299, 0.587, 0.114, 0, 0 0, 0, 0, 1, 0"
100
+ />
101
+ </filter>
102
+ </defs>
103
+ </svg>`;
104
+
105
+ export {
106
+ ADDON_ID,
107
+ PANEL_ID,
108
+ PARAM_KEY,
109
+ VISION_GLOBAL_KEY,
110
+ DOCUMENTATION_DISCREPANCY_LINK,
111
+ EVENTS,
112
+ STATUS_TYPE_ID_COMPONENT_TEST,
113
+ STATUS_TYPE_ID_A11Y,
114
+ filters,
115
+ filterDefs
116
+ };
package/dist/index.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import {
2
2
  preview_exports
3
- } from "./_browser-chunks/chunk-KJORJJOQ.js";
3
+ } from "./_browser-chunks/chunk-2FVV6YOY.js";
4
4
  import {
5
5
  PARAM_KEY
6
- } from "./_browser-chunks/chunk-3FKQRDK3.js";
6
+ } from "./_browser-chunks/chunk-7OPMK7TU.js";
7
7
  import "./_browser-chunks/chunk-4BE7D4DS.js";
8
8
 
9
9
  // src/index.ts
package/dist/manager.js CHANGED
@@ -5,12 +5,15 @@ import {
5
5
  PANEL_ID,
6
6
  PARAM_KEY,
7
7
  STATUS_TYPE_ID_A11Y,
8
- STATUS_TYPE_ID_COMPONENT_TEST
9
- } from "./_browser-chunks/chunk-3FKQRDK3.js";
8
+ STATUS_TYPE_ID_COMPONENT_TEST,
9
+ VISION_GLOBAL_KEY,
10
+ filterDefs,
11
+ filters
12
+ } from "./_browser-chunks/chunk-7OPMK7TU.js";
10
13
  import "./_browser-chunks/chunk-4BE7D4DS.js";
11
14
 
12
15
  // src/manager.tsx
13
- import React9 from "react";
16
+ import React8 from "react";
14
17
  import { Badge as Badge3 } from "storybook/internal/components";
15
18
  import { addons, types, useAddonState as useAddonState2, useStorybookApi as useStorybookApi3 } from "storybook/manager-api";
16
19
 
@@ -2100,76 +2103,12 @@ var RotatingIcon = styled5(SyncIcon2)(({ theme: theme2 }) => ({
2100
2103
  };
2101
2104
 
2102
2105
  // src/components/VisionSimulator.tsx
2103
- import React8, { useState as useState4 } from "react";
2106
+ import React7 from "react";
2104
2107
  import { Select } from "storybook/internal/components";
2105
2108
  import { AccessibilityIcon } from "@storybook/icons";
2106
- import { Global, styled as styled6 } from "storybook/theming";
2107
-
2108
- // src/components/ColorFilters.tsx
2109
- import * as React7 from "react";
2110
- var Filters = (props) => React7.createElement("svg", { ...props }, React7.createElement("defs", null, React7.createElement("filter", { id: "protanopia" }, React7.createElement(
2111
- "feColorMatrix",
2112
- {
2113
- in: "SourceGraphic",
2114
- type: "matrix",
2115
- values: "0.567, 0.433, 0, 0, 0 0.558, 0.442, 0, 0, 0 0, 0.242, 0.758, 0, 0 0, 0, 0, 1, 0"
2116
- }
2117
- )), React7.createElement("filter", { id: "protanomaly" }, React7.createElement(
2118
- "feColorMatrix",
2119
- {
2120
- in: "SourceGraphic",
2121
- type: "matrix",
2122
- values: "0.817, 0.183, 0, 0, 0 0.333, 0.667, 0, 0, 0 0, 0.125, 0.875, 0, 0 0, 0, 0, 1, 0"
2123
- }
2124
- )), React7.createElement("filter", { id: "deuteranopia" }, React7.createElement(
2125
- "feColorMatrix",
2126
- {
2127
- in: "SourceGraphic",
2128
- type: "matrix",
2129
- values: "0.625, 0.375, 0, 0, 0 0.7, 0.3, 0, 0, 0 0, 0.3, 0.7, 0, 0 0, 0, 0, 1, 0"
2130
- }
2131
- )), React7.createElement("filter", { id: "deuteranomaly" }, React7.createElement(
2132
- "feColorMatrix",
2133
- {
2134
- in: "SourceGraphic",
2135
- type: "matrix",
2136
- values: "0.8, 0.2, 0, 0, 0 0.258, 0.742, 0, 0, 0 0, 0.142, 0.858, 0, 0 0, 0, 0, 1, 0"
2137
- }
2138
- )), React7.createElement("filter", { id: "tritanopia" }, React7.createElement(
2139
- "feColorMatrix",
2140
- {
2141
- in: "SourceGraphic",
2142
- type: "matrix",
2143
- values: "0.95, 0.05, 0, 0, 0 0, 0.433, 0.567, 0, 0 0, 0.475, 0.525, 0, 0 0, 0, 0, 1, 0"
2144
- }
2145
- )), React7.createElement("filter", { id: "tritanomaly" }, React7.createElement(
2146
- "feColorMatrix",
2147
- {
2148
- in: "SourceGraphic",
2149
- type: "matrix",
2150
- values: "0.967, 0.033, 0, 0, 0 0, 0.733, 0.267, 0, 0 0, 0.183, 0.817, 0, 0 0, 0, 0, 1, 0"
2151
- }
2152
- )), React7.createElement("filter", { id: "achromatopsia" }, React7.createElement(
2153
- "feColorMatrix",
2154
- {
2155
- in: "SourceGraphic",
2156
- type: "matrix",
2157
- values: "0.299, 0.587, 0.114, 0, 0 0.299, 0.587, 0.114, 0, 0 0.299, 0.587, 0.114, 0, 0 0, 0, 0, 1, 0"
2158
- }
2159
- ))));
2160
-
2161
- // src/components/VisionSimulator.tsx
2162
- var iframeId = "storybook-preview-iframe", baseList = [
2163
- { name: "blurred vision", percentage: 22.9 },
2164
- { name: "deuteranomaly", percentage: 2.7 },
2165
- { name: "deuteranopia", percentage: 0.56 },
2166
- { name: "protanomaly", percentage: 0.66 },
2167
- { name: "protanopia", percentage: 0.59 },
2168
- { name: "tritanomaly", percentage: 0.01 },
2169
- { name: "tritanopia", percentage: 0.016 },
2170
- { name: "achromatopsia", percentage: 1e-4 },
2171
- { name: "grayscale" }
2172
- ], getFilter = (filterName) => filterName ? filterName === "blurred vision" ? "blur(2px)" : filterName === "grayscale" ? "grayscale(100%)" : `url('#${filterName}')` : "none", Hidden = styled6.div({
2109
+ import { useGlobals as useGlobals2 } from "storybook/manager-api";
2110
+ import { styled as styled6 } from "storybook/theming";
2111
+ var Hidden = styled6.div({
2173
2112
  "&, & svg": {
2174
2113
  position: "absolute",
2175
2114
  width: 0,
@@ -2178,48 +2117,37 @@ var iframeId = "storybook-preview-iframe", baseList = [
2178
2117
  }), ColorIcon = styled6.span(
2179
2118
  {
2180
2119
  background: "linear-gradient(to right, #F44336, #FF9800, #FFEB3B, #8BC34A, #2196F3, #9C27B0)",
2181
- borderRadius: "1rem",
2120
+ borderRadius: 14,
2182
2121
  display: "block",
2183
- height: "1rem",
2184
- width: "1rem"
2122
+ flexShrink: 0,
2123
+ height: 14,
2124
+ width: 14
2185
2125
  },
2186
2126
  ({ $filter }) => ({
2187
- filter: getFilter($filter)
2127
+ filter: filters[$filter].filter || "none"
2188
2128
  }),
2189
2129
  ({ theme: theme2 }) => ({
2190
2130
  boxShadow: `${theme2.appBorderColor} 0 0 0 1px inset`
2191
2131
  })
2192
2132
  ), VisionSimulator = () => {
2193
- let [filter, setFilter] = useState4(null), options = baseList.map(({ name, percentage }) => {
2194
- let description = percentage !== void 0 ? `${percentage}% of users` : void 0;
2195
- return {
2196
- title: name,
2197
- description,
2198
- icon: React8.createElement(ColorIcon, { $filter: name }),
2199
- value: name
2200
- };
2201
- });
2202
- return React8.createElement(React8.Fragment, null, filter && React8.createElement(
2203
- Global,
2204
- {
2205
- styles: {
2206
- [`#${iframeId}`]: {
2207
- filter: getFilter(filter.name)
2208
- }
2209
- }
2210
- }
2211
- ), React8.createElement(
2133
+ let [globals, updateGlobals] = useGlobals2(), value = globals[VISION_GLOBAL_KEY], options = Object.entries(filters).map(([key, { label, percentage }]) => ({
2134
+ title: label,
2135
+ description: percentage ? `${percentage}% of users` : void 0,
2136
+ icon: React7.createElement(ColorIcon, { $filter: key }),
2137
+ value: key
2138
+ }));
2139
+ return React7.createElement(React7.Fragment, null, React7.createElement(
2212
2140
  Select,
2213
2141
  {
2214
2142
  resetLabel: "Reset color filter",
2215
- onReset: () => setFilter(null),
2216
- icon: React8.createElement(AccessibilityIcon, null),
2143
+ onReset: () => updateGlobals({ [VISION_GLOBAL_KEY]: void 0 }),
2144
+ icon: React7.createElement(AccessibilityIcon, null),
2217
2145
  ariaLabel: "Vision simulator",
2218
- defaultOptions: filter?.name,
2146
+ defaultOptions: value,
2219
2147
  options,
2220
- onSelect: (selected) => setFilter(() => ({ name: selected }))
2148
+ onSelect: (selected) => updateGlobals({ [VISION_GLOBAL_KEY]: selected })
2221
2149
  }
2222
- ), React8.createElement(Hidden, null, React8.createElement(Filters, null)));
2150
+ ), React7.createElement(Hidden, { dangerouslySetInnerHTML: { __html: filterDefs } }));
2223
2151
  };
2224
2152
 
2225
2153
  // src/manager.tsx
@@ -2232,19 +2160,19 @@ var Title2 = () => {
2232
2160
  results: void 0,
2233
2161
  error: void 0,
2234
2162
  status: "initial"
2235
- }), violationsNb = results?.violations?.length ?? 0, incompleteNb = results?.incomplete?.length ?? 0, count = violationsNb + incompleteNb, suffix = count === 0 ? null : React9.createElement(Badge3, { compact: !0, status: selectedPanel === PANEL_ID ? "active" : "neutral" }, count);
2236
- return React9.createElement("div", { style: { display: "flex", alignItems: "center", gap: 6 } }, React9.createElement("span", null, "Accessibility"), suffix);
2163
+ }), violationsNb = results?.violations?.length ?? 0, incompleteNb = results?.incomplete?.length ?? 0, count = violationsNb + incompleteNb, suffix = count === 0 ? null : React8.createElement(Badge3, { compact: !0, status: selectedPanel === PANEL_ID ? "active" : "neutral" }, count);
2164
+ return React8.createElement("div", { style: { display: "flex", alignItems: "center", gap: 6 } }, React8.createElement("span", null, "Accessibility"), suffix);
2237
2165
  };
2238
2166
  addons.register(ADDON_ID, (api) => {
2239
2167
  addons.add(PANEL_ID, {
2240
2168
  title: "",
2241
2169
  type: types.TOOL,
2242
2170
  match: ({ viewMode, tabId }) => viewMode === "story" && !tabId,
2243
- render: () => React9.createElement(VisionSimulator, null)
2171
+ render: () => React8.createElement(VisionSimulator, null)
2244
2172
  }), addons.add(PANEL_ID, {
2245
2173
  title: Title2,
2246
2174
  type: types.PANEL,
2247
- render: ({ active = !0 }) => React9.createElement(A11yContextProvider, null, active ? React9.createElement(A11YPanel, null) : null),
2175
+ render: ({ active = !0 }) => React8.createElement(A11yContextProvider, null, active ? React8.createElement(A11YPanel, null) : null),
2248
2176
  paramKey: PARAM_KEY
2249
2177
  });
2250
2178
  });
@@ -1,10 +1,10 @@
1
- import CJS_COMPAT_NODE_URL_vesx4721b3j from 'node:url';
2
- import CJS_COMPAT_NODE_PATH_vesx4721b3j from 'node:path';
3
- import CJS_COMPAT_NODE_MODULE_vesx4721b3j from "node:module";
1
+ import CJS_COMPAT_NODE_URL_dth0w8svdjl from 'node:url';
2
+ import CJS_COMPAT_NODE_PATH_dth0w8svdjl from 'node:path';
3
+ import CJS_COMPAT_NODE_MODULE_dth0w8svdjl from "node:module";
4
4
 
5
- var __filename = CJS_COMPAT_NODE_URL_vesx4721b3j.fileURLToPath(import.meta.url);
6
- var __dirname = CJS_COMPAT_NODE_PATH_vesx4721b3j.dirname(__filename);
7
- var require = CJS_COMPAT_NODE_MODULE_vesx4721b3j.createRequire(import.meta.url);
5
+ var __filename = CJS_COMPAT_NODE_URL_dth0w8svdjl.fileURLToPath(import.meta.url);
6
+ var __dirname = CJS_COMPAT_NODE_PATH_dth0w8svdjl.dirname(__filename);
7
+ var require = CJS_COMPAT_NODE_MODULE_dth0w8svdjl.createRequire(import.meta.url);
8
8
 
9
9
  // ------------------------------------------------------------
10
10
  // end of CJS compatibility banner, injected by Storybook's esbuild configuration
package/dist/preview.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ import * as storybook_internal_csf from 'storybook/internal/csf';
1
2
  import { AfterEach } from 'storybook/internal/types';
2
3
  import { Selector, SelectorList, RunOptions, Spec } from 'axe-core';
3
4
 
@@ -37,14 +38,16 @@ interface A11yParameters {
37
38
  test?: A11yTest;
38
39
  }
39
40
 
41
+ declare const decorators: storybook_internal_csf.DecoratorFunction[];
40
42
  declare const afterEach: AfterEach<any>;
41
43
  declare const initialGlobals: {
42
44
  a11y: {
43
45
  manual: boolean;
44
46
  };
47
+ vision: undefined;
45
48
  };
46
49
  declare const parameters: {
47
50
  a11y: A11yParameters;
48
51
  };
49
52
 
50
- export { afterEach, initialGlobals, parameters };
53
+ export { afterEach, decorators, initialGlobals, parameters };
package/dist/preview.js CHANGED
@@ -1,12 +1,14 @@
1
1
  import {
2
2
  afterEach,
3
+ decorators,
3
4
  initialGlobals,
4
5
  parameters
5
- } from "./_browser-chunks/chunk-KJORJJOQ.js";
6
- import "./_browser-chunks/chunk-3FKQRDK3.js";
6
+ } from "./_browser-chunks/chunk-2FVV6YOY.js";
7
+ import "./_browser-chunks/chunk-7OPMK7TU.js";
7
8
  import "./_browser-chunks/chunk-4BE7D4DS.js";
8
9
  export {
9
10
  afterEach,
11
+ decorators,
10
12
  initialGlobals,
11
13
  parameters
12
14
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@storybook/addon-a11y",
3
- "version": "10.2.0-alpha.8",
3
+ "version": "10.2.0-beta.0",
4
4
  "description": "Storybook Addon A11y: Test UI component compliance with WCAG web accessibility standards",
5
5
  "keywords": [
6
6
  "a11y",
@@ -60,17 +60,17 @@
60
60
  },
61
61
  "devDependencies": {
62
62
  "@radix-ui/react-tabs": "1.0.4",
63
- "@storybook/icons": "^2.0.0",
63
+ "@storybook/icons": "^2.0.1",
64
64
  "@testing-library/react": "^14.0.0",
65
- "execa": "^9.5.2",
65
+ "execa": "^9.6.1",
66
66
  "react": "^18.2.0",
67
67
  "react-dom": "^18.2.0",
68
68
  "react-resize-detector": "^7.1.2",
69
- "typescript": "^5.8.3",
69
+ "typescript": "^5.9.3",
70
70
  "vitest-axe": "^0.1.0"
71
71
  },
72
72
  "peerDependencies": {
73
- "storybook": "^10.2.0-alpha.8"
73
+ "storybook": "^10.2.0-beta.0"
74
74
  },
75
75
  "publishConfig": {
76
76
  "access": "public"
@@ -1,13 +0,0 @@
1
- // src/constants.ts
2
- var ADDON_ID = "storybook/a11y", PANEL_ID = `${ADDON_ID}/panel`, PARAM_KEY = "a11y", UI_STATE_ID = `${ADDON_ID}/ui`, RESULT = `${ADDON_ID}/result`, REQUEST = `${ADDON_ID}/request`, RUNNING = `${ADDON_ID}/running`, ERROR = `${ADDON_ID}/error`, MANUAL = `${ADDON_ID}/manual`, SELECT = `${ADDON_ID}/select`, DOCUMENTATION_LINK = "writing-tests/accessibility-testing", DOCUMENTATION_DISCREPANCY_LINK = `${DOCUMENTATION_LINK}#why-are-my-tests-failing-in-different-environments`;
3
- var EVENTS = { RESULT, REQUEST, RUNNING, ERROR, MANUAL, SELECT }, STATUS_TYPE_ID_COMPONENT_TEST = "storybook/component-test", STATUS_TYPE_ID_A11Y = "storybook/a11y";
4
-
5
- export {
6
- ADDON_ID,
7
- PANEL_ID,
8
- PARAM_KEY,
9
- DOCUMENTATION_DISCREPANCY_LINK,
10
- EVENTS,
11
- STATUS_TYPE_ID_COMPONENT_TEST,
12
- STATUS_TYPE_ID_A11Y
13
- };