@accesslint/storybook-addon 0.8.10 → 0.8.12

package/dist/manager.js

@@ -1,407 +1,416 @@
-import React, { useMemo, useState, useRef, useCallback } from 'react';
-import * as managerApi from 'storybook/manager-api';
-import { useChannel } from 'storybook/manager-api';
-import { styled, useTheme } from 'storybook/theming';
-import { STORY_CHANGED } from 'storybook/internal/core-events';
-
-var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
-  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
-}) : x)(function(x) {
-  if (typeof require !== "undefined") return require.apply(this, arguments);
-  throw Error('Dynamic require of "' + x + '" is not supported');
+import React, { useCallback, useMemo, useRef, useState } from "react";
+import * as managerApi from "storybook/manager-api";
+import { useChannel } from "storybook/manager-api";
+import { styled, useTheme } from "storybook/theming";
+import { STORY_CHANGED } from "storybook/internal/core-events";
+//#region \0rolldown/runtime.js
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, { get: (a, b) => (typeof require !== "undefined" ? require : a)[b] }) : x)(function(x) {
+	if (typeof require !== "undefined") return require.apply(this, arguments);
+	throw Error("Calling `require` for \"" + x + "\" in an environment that doesn't expose the `require` function. See https://rolldown.rs/in-depth/bundling-cjs#require-external-modules for more details.");
 });
-
-// src/constants.ts
-var ADDON_ID = "accesslint/a11y";
-var PARAM_KEY = "accesslint";
-var STATUS_TYPE_ID = "accesslint/a11y";
-var RESULT_EVENT = `${ADDON_ID}/result`;
-var HIGHLIGHT_ADDON_ID = "storybook/highlight";
-var HIGHLIGHT = `${HIGHLIGHT_ADDON_ID}/add`;
-var REMOVE_HIGHLIGHT = `${HIGHLIGHT_ADDON_ID}/remove`;
-var IMPACT_COLOR = {
-  critical: "#d32f2f",
-  serious: "#d32f2f",
-  moderate: "#c43e00",
-  minor: "#999999"
+//#endregion
+//#region src/constants.ts
+const ADDON_ID = "accesslint/a11y";
+const PARAM_KEY = "accesslint";
+const STATUS_TYPE_ID = "accesslint/a11y";
+const RESULT_EVENT = `${ADDON_ID}/result`;
+const HIGHLIGHT_ADDON_ID = "storybook/highlight";
+const HIGHLIGHT = `${HIGHLIGHT_ADDON_ID}/add`;
+const REMOVE_HIGHLIGHT = `${HIGHLIGHT_ADDON_ID}/remove`;
+//#endregion
+//#region src/Panel.tsx
+const IMPACT_COLOR = {
+	critical: "#d32f2f",
+	serious: "#d32f2f",
+	moderate: "#c43e00",
+	minor: "#999999"
 };
-var IMPACT_ICON = {
-  critical: "\u2716",
-  serious: "\u2716",
-  moderate: "\u26A0",
-  minor: "\xB7"
+const IMPACT_ICON = {
+	critical: "✖",
+	serious: "✖",
+	moderate: "⚠",
+	minor: "·"
 };
-var IMPACT_ORDER = {
-  critical: 0,
-  serious: 1,
-  moderate: 2,
-  minor: 3
+const IMPACT_ORDER = {
+	critical: 0,
+	serious: 1,
+	moderate: 2,
+	minor: 3
 };
-var LEVEL_COLOR = {
-  A: "#2e7d32",
-  AA: "#1565c0",
-  AAA: "#6a1b9a"
+const LEVEL_COLOR = {
+	A: "#2e7d32",
+	AA: "#1565c0",
+	AAA: "#6a1b9a"
 };
-var Panel = ({ active }) => {
-  const theme = useTheme();
-  const isDark = theme.base === "dark";
-  const colors = useMemo(() => ({
-    text: theme.textColor || (isDark ? "#e0e0e0" : "#424242"),
-    textMuted: theme.textMutedColor || (isDark ? "#999" : "#616161"),
-    bg: theme.appContentBg || (isDark ? "#1a1a1a" : "#fff"),
-    bgDetails: isDark ? "#2a2a2a" : "#f5f5f5",
-    bgSelected: isDark ? "#1a3a5c" : "#e3f2fd",
-    border: theme.appBorderColor || (isDark ? "#444" : "#f0f0f0"),
-    codeBg: isDark ? "#333" : "#fff",
-    codeBorder: isDark ? "#555" : "#e0e0e0",
-    tagBg: isDark ? "#444" : "#e0e0e0",
-    tagText: isDark ? "#ccc" : "#616161",
-    ruleId: isDark ? "#64b5f6" : "#1565c0"
-  }), [isDark, theme]);
-  const [violations, setViolations] = useState([]);
-  const [ruleCount, setRuleCount] = useState(0);
-  const [skippedReason, setSkippedReason] = useState(null);
-  const [expandedIndex, setExpandedIndex] = useState(null);
-  const [highlightedIndex, setHighlightedIndex] = useState(null);
-  const buttonRefs = useRef([]);
-  const emit = useChannel({
-    [RESULT_EVENT]: ({ result }) => {
-      if (result.skipped) {
-        setViolations([]);
-        setRuleCount(0);
-        setSkippedReason(result.reason ?? "skipped");
-        setExpandedIndex(null);
-        setHighlightedIndex(null);
-        return;
-      }
-      setViolations(result.violations ?? []);
-      setRuleCount(result.ruleCount ?? 0);
-      setSkippedReason(null);
-      setExpandedIndex(null);
-      setHighlightedIndex(null);
-    },
-    [STORY_CHANGED]: () => {
-      setViolations([]);
-      setRuleCount(0);
-      setSkippedReason(null);
-      setExpandedIndex(null);
-      setHighlightedIndex(null);
-    }
-  });
-  const sorted = useMemo(
-    () => [...violations].sort((a, b) => (IMPACT_ORDER[a.impact] ?? 4) - (IMPACT_ORDER[b.impact] ?? 4)),
-    [violations]
-  );
-  const handleKeyDown = useCallback((e, index) => {
-    let next = null;
-    switch (e.key) {
-      case "ArrowDown":
-        next = Math.min(index + 1, sorted.length - 1);
-        break;
-      case "ArrowUp":
-        next = Math.max(index - 1, 0);
-        break;
-      case "Home":
-        next = 0;
-        break;
-      case "End":
-        next = sorted.length - 1;
-        break;
-      default:
-        return;
-    }
-    e.preventDefault();
-    buttonRefs.current[next]?.focus();
-  }, [sorted.length]);
-  if (!active) return null;
-  const passed = ruleCount - new Set(violations.map((v) => v.ruleId)).size;
-  return /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", height: "100%", fontFamily: "system-ui, sans-serif" } }, ruleCount > 0 && /* @__PURE__ */ React.createElement("div", { style: {
-    display: "flex",
-    gap: "12px",
-    padding: "8px 12px",
-    fontSize: "11px",
-    color: colors.textMuted,
-    borderBottom: `1px solid ${colors.border}`,
-    flexShrink: 0
-  } }, /* @__PURE__ */ React.createElement("span", null, ruleCount, " rules"), /* @__PURE__ */ React.createElement("span", { style: { color: "#2e7d32" } }, passed, " passed"), /* @__PURE__ */ React.createElement("span", { style: { color: violations.length > 0 ? "#d32f2f" : colors.textMuted } }, new Set(violations.map((v) => v.ruleId)).size, " failed")), violations.length === 0 ? /* @__PURE__ */ React.createElement("p", { style: { padding: "12px", margin: 0, fontSize: "13px", color: colors.textMuted } }, skippedReason ? `Accessibility audit skipped (${skippedReason} tag).` : "No accessibility violations found.") : /* @__PURE__ */ React.createElement("div", { style: { flex: 1, overflow: "auto", minHeight: 0 } }, /* @__PURE__ */ React.createElement(
-    "ul",
-    {
-      style: { listStyle: "none", padding: 0, margin: 0 },
-      "aria-label": "Accessibility violations"
-    },
-    sorted.map((v, i) => {
-      const isOpen = expandedIndex === i;
-      return /* @__PURE__ */ React.createElement("li", { key: i, style: { borderBottom: `1px solid ${colors.border}` } }, /* @__PURE__ */ React.createElement(
-        "button",
-        {
-          ref: (el) => {
-            buttonRefs.current[i] = el;
-          },
-          type: "button",
-          onClick: () => {
-            setExpandedIndex(isOpen ? null : i);
-            if (highlightedIndex !== null) {
-              emit(REMOVE_HIGHLIGHT);
-              setHighlightedIndex(null);
-            }
-          },
-          onKeyDown: (e) => handleKeyDown(e, i),
-          "aria-expanded": isOpen,
-          style: {
-            width: "100%",
-            padding: "8px 12px",
-            background: isOpen ? colors.bgSelected : "transparent",
-            border: "none",
-            font: "inherit",
-            fontSize: "12px",
-            textAlign: "left",
-            cursor: "pointer",
-            color: colors.text
-          }
-        },
-        /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: "6px" } }, /* @__PURE__ */ React.createElement(
-          "span",
-          {
-            "aria-hidden": "true",
-            style: {
-              color: IMPACT_COLOR[v.impact],
-              fontWeight: "bold",
-              fontSize: "12px"
-            }
-          },
-          IMPACT_ICON[v.impact]
-        ), /* @__PURE__ */ React.createElement("span", { style: { color: IMPACT_COLOR[v.impact], fontSize: "11px" } }, v.impact), /* @__PURE__ */ React.createElement("code", { style: { fontSize: "11px", color: colors.ruleId } }, v.ruleId)),
-        /* @__PURE__ */ React.createElement("div", { style: { marginTop: "2px", color: colors.text, fontSize: "12px" } }, v.message)
-      ), isOpen && /* @__PURE__ */ React.createElement("div", { style: { padding: "4px 12px 12px", background: colors.bgDetails } }, v.description && /* @__PURE__ */ React.createElement("p", { style: { margin: "4px 0 8px", fontSize: "12px", color: colors.text } }, v.description), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", gap: "6px", flexWrap: "wrap", marginBottom: "8px" } }, v.level && /* @__PURE__ */ React.createElement("span", { style: {
-        display: "inline-block",
-        padding: "0 5px",
-        fontSize: "10px",
-        fontWeight: 600,
-        borderRadius: "3px",
-        color: "#fff",
-        background: LEVEL_COLOR[v.level] || "#666",
-        lineHeight: "18px"
-      } }, "WCAG ", v.level), v.wcag?.map((ref) => /* @__PURE__ */ React.createElement(
-        "span",
-        {
-          key: ref,
-          style: {
-            display: "inline-block",
-            padding: "0 5px",
-            fontSize: "10px",
-            fontWeight: 500,
-            borderRadius: "3px",
-            color: colors.tagText,
-            background: colors.tagBg,
-            lineHeight: "18px"
-          }
-        },
-        ref
-      ))), v.guidance && /* @__PURE__ */ React.createElement("div", { style: { marginBottom: "8px" } }, /* @__PURE__ */ React.createElement("div", { style: { fontSize: "11px", fontWeight: 500, color: colors.textMuted, marginBottom: "4px" } }, "How to fix"), /* @__PURE__ */ React.createElement("p", { style: { margin: 0, fontSize: "12px", color: colors.text, whiteSpace: "pre-wrap" } }, v.guidance)), v.html && /* @__PURE__ */ React.createElement("div", { style: { marginBottom: "8px" } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: "4px" } }, /* @__PURE__ */ React.createElement("div", { style: { fontSize: "11px", fontWeight: 500, color: colors.textMuted } }, "Element"), /* @__PURE__ */ React.createElement(
-        "button",
-        {
-          type: "button",
-          onClick: () => {
-            if (highlightedIndex === i) {
-              emit(REMOVE_HIGHLIGHT);
-              setHighlightedIndex(null);
-            } else {
-              const color = v.impact === "critical" || v.impact === "serious" ? "#d32f2f" : "#c43e00";
-              const localSelector = v.selector.replace(/^.*>>>\s*iframe>\s*/, "");
-              emit(HIGHLIGHT, {
-                elements: [localSelector],
-                color,
-                style: "solid"
-              });
-              setHighlightedIndex(i);
-            }
-          },
-          style: {
-            padding: "2px 8px",
-            fontSize: "11px",
-            fontWeight: 500,
-            border: `1px solid ${colors.codeBorder}`,
-            borderRadius: "4px",
-            background: highlightedIndex === i ? IMPACT_COLOR[v.impact] : colors.codeBg,
-            color: highlightedIndex === i ? "#fff" : colors.text,
-            cursor: "pointer"
-          }
-        },
-        "Highlight"
-      )), /* @__PURE__ */ React.createElement(
-        "pre",
-        {
-          style: {
-            margin: 0,
-            padding: "6px 8px",
-            fontSize: "11px",
-            color: colors.text,
-            background: colors.codeBg,
-            border: `1px solid ${colors.codeBorder}`,
-            borderRadius: "4px",
-            overflow: "auto",
-            whiteSpace: "pre-wrap",
-            wordBreak: "break-all"
-          }
-        },
-        v.html
-      ))));
-    })
-  )));
+const Panel = ({ active }) => {
+	const theme = useTheme();
+	const isDark = theme.base === "dark";
+	const colors = useMemo(() => ({
+		text: theme.textColor || (isDark ? "#e0e0e0" : "#424242"),
+		textMuted: theme.textMutedColor || (isDark ? "#999" : "#616161"),
+		bg: theme.appContentBg || (isDark ? "#1a1a1a" : "#fff"),
+		bgDetails: isDark ? "#2a2a2a" : "#f5f5f5",
+		bgSelected: isDark ? "#1a3a5c" : "#e3f2fd",
+		border: theme.appBorderColor || (isDark ? "#444" : "#f0f0f0"),
+		codeBg: isDark ? "#333" : "#fff",
+		codeBorder: isDark ? "#555" : "#e0e0e0",
+		tagBg: isDark ? "#444" : "#e0e0e0",
+		tagText: isDark ? "#ccc" : "#616161",
+		ruleId: isDark ? "#64b5f6" : "#1565c0"
+	}), [isDark, theme]);
+	const [violations, setViolations] = useState([]);
+	const [ruleCount, setRuleCount] = useState(0);
+	const [skippedReason, setSkippedReason] = useState(null);
+	const [expandedIndex, setExpandedIndex] = useState(null);
+	const [highlightedIndex, setHighlightedIndex] = useState(null);
+	const buttonRefs = useRef([]);
+	const emit = useChannel({
+		[RESULT_EVENT]: ({ result }) => {
+			if (result.skipped) {
+				setViolations([]);
+				setRuleCount(0);
+				setSkippedReason(result.reason ?? "skipped");
+				setExpandedIndex(null);
+				setHighlightedIndex(null);
+				return;
+			}
+			setViolations(result.violations ?? []);
+			setRuleCount(result.ruleCount ?? 0);
+			setSkippedReason(null);
+			setExpandedIndex(null);
+			setHighlightedIndex(null);
+		},
+		[STORY_CHANGED]: () => {
+			setViolations([]);
+			setRuleCount(0);
+			setSkippedReason(null);
+			setExpandedIndex(null);
+			setHighlightedIndex(null);
+		}
+	});
+	const sorted = useMemo(() => [...violations].sort((a, b) => (IMPACT_ORDER[a.impact] ?? 4) - (IMPACT_ORDER[b.impact] ?? 4)), [violations]);
+	const handleKeyDown = useCallback((e, index) => {
+		let next = null;
+		switch (e.key) {
+			case "ArrowDown":
+				next = Math.min(index + 1, sorted.length - 1);
+				break;
+			case "ArrowUp":
+				next = Math.max(index - 1, 0);
+				break;
+			case "Home":
+				next = 0;
+				break;
+			case "End":
+				next = sorted.length - 1;
+				break;
+			default: return;
+		}
+		e.preventDefault();
+		buttonRefs.current[next]?.focus();
+	}, [sorted.length]);
+	if (!active) return null;
+	const passed = ruleCount - new Set(violations.map((v) => v.ruleId)).size;
+	return /* @__PURE__ */ React.createElement("div", { style: {
+		display: "flex",
+		flexDirection: "column",
+		height: "100%",
+		fontFamily: "system-ui, sans-serif"
+	} }, ruleCount > 0 && /* @__PURE__ */ React.createElement("div", { style: {
+		display: "flex",
+		gap: "12px",
+		padding: "8px 12px",
+		fontSize: "11px",
+		color: colors.textMuted,
+		borderBottom: `1px solid ${colors.border}`,
+		flexShrink: 0
+	} }, /* @__PURE__ */ React.createElement("span", null, ruleCount, " rules"), /* @__PURE__ */ React.createElement("span", { style: { color: "#2e7d32" } }, passed, " passed"), /* @__PURE__ */ React.createElement("span", { style: { color: violations.length > 0 ? "#d32f2f" : colors.textMuted } }, new Set(violations.map((v) => v.ruleId)).size, " failed")), violations.length === 0 ? /* @__PURE__ */ React.createElement("p", { style: {
+		padding: "12px",
+		margin: 0,
+		fontSize: "13px",
+		color: colors.textMuted
+	} }, skippedReason ? `Accessibility audit skipped (${skippedReason} tag).` : "No accessibility violations found.") : /* @__PURE__ */ React.createElement("div", { style: {
+		flex: 1,
+		overflow: "auto",
+		minHeight: 0
+	} }, /* @__PURE__ */ React.createElement("ul", {
+		style: {
+			listStyle: "none",
+			padding: 0,
+			margin: 0
+		},
+		"aria-label": "Accessibility violations"
+	}, sorted.map((v, i) => {
+		const isOpen = expandedIndex === i;
+		return /* @__PURE__ */ React.createElement("li", {
+			key: i,
+			style: { borderBottom: `1px solid ${colors.border}` }
+		}, /* @__PURE__ */ React.createElement("button", {
+			ref: (el) => {
+				buttonRefs.current[i] = el;
+			},
+			type: "button",
+			onClick: () => {
+				setExpandedIndex(isOpen ? null : i);
+				if (highlightedIndex !== null) {
+					emit(REMOVE_HIGHLIGHT);
+					setHighlightedIndex(null);
+				}
+			},
+			onKeyDown: (e) => handleKeyDown(e, i),
+			"aria-expanded": isOpen,
+			style: {
+				width: "100%",
+				padding: "8px 12px",
+				background: isOpen ? colors.bgSelected : "transparent",
+				border: "none",
+				font: "inherit",
+				fontSize: "12px",
+				textAlign: "left",
+				cursor: "pointer",
+				color: colors.text
+			}
+		}, /* @__PURE__ */ React.createElement("div", { style: {
+			display: "flex",
+			alignItems: "center",
+			gap: "6px"
+		} }, /* @__PURE__ */ React.createElement("span", {
+			"aria-hidden": "true",
+			style: {
+				color: IMPACT_COLOR[v.impact],
+				fontWeight: "bold",
+				fontSize: "12px"
+			}
+		}, IMPACT_ICON[v.impact]), /* @__PURE__ */ React.createElement("span", { style: {
+			color: IMPACT_COLOR[v.impact],
+			fontSize: "11px"
+		} }, v.impact), /* @__PURE__ */ React.createElement("code", { style: {
+			fontSize: "11px",
+			color: colors.ruleId
+		} }, v.ruleId)), /* @__PURE__ */ React.createElement("div", { style: {
+			marginTop: "2px",
+			color: colors.text,
+			fontSize: "12px"
+		} }, v.message)), isOpen && /* @__PURE__ */ React.createElement("div", { style: {
+			padding: "4px 12px 12px",
+			background: colors.bgDetails
+		} }, v.description && /* @__PURE__ */ React.createElement("p", { style: {
+			margin: "4px 0 8px",
+			fontSize: "12px",
+			color: colors.text
+		} }, v.description), /* @__PURE__ */ React.createElement("div", { style: {
+			display: "flex",
+			gap: "6px",
+			flexWrap: "wrap",
+			marginBottom: "8px"
+		} }, v.level && /* @__PURE__ */ React.createElement("span", { style: {
+			display: "inline-block",
+			padding: "0 5px",
+			fontSize: "10px",
+			fontWeight: 600,
+			borderRadius: "3px",
+			color: "#fff",
+			background: LEVEL_COLOR[v.level] || "#666",
+			lineHeight: "18px"
+		} }, "WCAG ", v.level), v.wcag?.map((ref) => /* @__PURE__ */ React.createElement("span", {
+			key: ref,
+			style: {
+				display: "inline-block",
+				padding: "0 5px",
+				fontSize: "10px",
+				fontWeight: 500,
+				borderRadius: "3px",
+				color: colors.tagText,
+				background: colors.tagBg,
+				lineHeight: "18px"
+			}
+		}, ref))), v.guidance && /* @__PURE__ */ React.createElement("div", { style: { marginBottom: "8px" } }, /* @__PURE__ */ React.createElement("div", { style: {
+			fontSize: "11px",
+			fontWeight: 500,
+			color: colors.textMuted,
+			marginBottom: "4px"
+		} }, "How to fix"), /* @__PURE__ */ React.createElement("p", { style: {
+			margin: 0,
+			fontSize: "12px",
+			color: colors.text,
+			whiteSpace: "pre-wrap"
+		} }, v.guidance)), v.html && /* @__PURE__ */ React.createElement("div", { style: { marginBottom: "8px" } }, /* @__PURE__ */ React.createElement("div", { style: {
+			display: "flex",
+			alignItems: "center",
+			justifyContent: "space-between",
+			marginBottom: "4px"
+		} }, /* @__PURE__ */ React.createElement("div", { style: {
+			fontSize: "11px",
+			fontWeight: 500,
+			color: colors.textMuted
+		} }, "Element"), /* @__PURE__ */ React.createElement("button", {
+			type: "button",
+			onClick: () => {
+				if (highlightedIndex === i) {
+					emit(REMOVE_HIGHLIGHT);
+					setHighlightedIndex(null);
+				} else {
+					const color = v.impact === "critical" || v.impact === "serious" ? "#d32f2f" : "#c43e00";
+					emit(HIGHLIGHT, {
+						elements: [v.selector.replace(/^.*>>>\s*iframe>\s*/, "")],
+						color,
+						style: "solid"
+					});
+					setHighlightedIndex(i);
+				}
+			},
+			style: {
+				padding: "2px 8px",
+				fontSize: "11px",
+				fontWeight: 500,
+				border: `1px solid ${colors.codeBorder}`,
+				borderRadius: "4px",
+				background: highlightedIndex === i ? IMPACT_COLOR[v.impact] : colors.codeBg,
+				color: highlightedIndex === i ? "#fff" : colors.text,
+				cursor: "pointer"
+			}
+		}, "Highlight")), /* @__PURE__ */ React.createElement("pre", { style: {
+			margin: 0,
+			padding: "6px 8px",
+			fontSize: "11px",
+			color: colors.text,
+			background: colors.codeBg,
+			border: `1px solid ${colors.codeBorder}`,
+			borderRadius: "4px",
+			overflow: "auto",
+			whiteSpace: "pre-wrap",
+			wordBreak: "break-all"
+		} }, v.html))));
+	}))));
 };
-
-// src/manager.tsx
-var { addons, types, useChannel: useChannel2, useStorybookApi } = managerApi;
-var PANEL_ID = `${ADDON_ID}/panel`;
-var TEST_PROVIDER_ID = `${ADDON_ID}/test-provider`;
-var _getStatusStore = managerApi.experimental_getStatusStore;
-var _getTestProviderStore = managerApi.experimental_getTestProviderStore;
-var _useTestProviderStore = managerApi.experimental_useTestProviderStore ?? null;
-var hasTestProvider = !!(_getStatusStore && _getTestProviderStore);
-var statusStore = hasTestProvider ? _getStatusStore(STATUS_TYPE_ID) : null;
-var testProviderStore = hasTestProvider ? _getTestProviderStore(TEST_PROVIDER_ID) : null;
-if (testProviderStore && statusStore) {
-  testProviderStore.onClearAll(() => {
-    statusStore.unset();
-  });
-}
-var ActionList = null;
-var Form = null;
+//#endregion
+//#region src/manager.tsx
+const { addons, types, useChannel: useChannel$1, useStorybookApi } = managerApi;
+const PANEL_ID = `${ADDON_ID}/panel`;
+const TEST_PROVIDER_ID = `${ADDON_ID}/test-provider`;
+const _getStatusStore = managerApi.experimental_getStatusStore;
+const _getTestProviderStore = managerApi.experimental_getTestProviderStore;
+const _useTestProviderStore = managerApi.experimental_useTestProviderStore ?? null;
+const hasTestProvider = !!(_getStatusStore && _getTestProviderStore);
+const statusStore = hasTestProvider ? _getStatusStore(STATUS_TYPE_ID) : null;
+const testProviderStore = hasTestProvider ? _getTestProviderStore(TEST_PROVIDER_ID) : null;
+if (testProviderStore && statusStore) testProviderStore.onClearAll(() => {
+	statusStore.unset();
+});
+let ActionList = null;
+let Form = null;
 try {
-  const components = __require("storybook/internal/components");
-  ActionList = components.ActionList ?? null;
-  Form = components.Form ?? null;
-} catch {
-}
-var Title = () => {
-  const [count, setCount] = React.useState(0);
-  useChannel2({
-    [RESULT_EVENT]: ({ result }) => {
-      setCount(result.skipped ? 0 : result.violations?.length ?? 0);
-    }
-  });
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, "AccessLint", count > 0 && /* @__PURE__ */ React.createElement("span", { style: {
-    display: "inline-block",
-    marginLeft: "8px",
-    minWidth: "18px",
-    padding: "0 5px",
-    lineHeight: "18px",
-    borderRadius: "9px",
-    fontSize: "11px",
-    fontWeight: "bold",
-    textAlign: "center",
-    background: "currentColor",
-    color: "inherit"
-  } }, /* @__PURE__ */ React.createElement("span", { style: { color: "#fff" } }, count)));
+	const components = __require("storybook/internal/components");
+	ActionList = components.ActionList ?? null;
+	Form = components.Form ?? null;
+} catch {}
+const Title = () => {
+	const [count, setCount] = React.useState(0);
+	useChannel$1({ [RESULT_EVENT]: ({ result }) => {
+		setCount(result.skipped ? 0 : result.violations?.length ?? 0);
+	} });
+	return /* @__PURE__ */ React.createElement(React.Fragment, null, "AccessLint", count > 0 && /* @__PURE__ */ React.createElement("span", { style: {
+		display: "inline-block",
+		marginLeft: "8px",
+		minWidth: "18px",
+		padding: "0 5px",
+		lineHeight: "18px",
+		borderRadius: "9px",
+		fontSize: "11px",
+		fontWeight: "bold",
+		textAlign: "center",
+		background: "currentColor",
+		color: "inherit"
+	} }, /* @__PURE__ */ React.createElement("span", { style: { color: "#fff" } }, count)));
 };
-var StyledActionList = ActionList ? styled(ActionList)({ padding: 0 }) : styled.div({ padding: 0 });
-var StatusDot = styled.div(
-  {
-    width: 6,
-    height: 6,
-    margin: 4,
-    borderRadius: "50%",
-    background: "var(--status-color)"
-  },
-  ({ status, theme }) => status === "positive" && {
-    "--status-color": theme.color.positive
-  },
-  ({ status, theme }) => status === "negative" && {
-    "--status-color": theme.color.negative
-  },
-  ({ status, theme }) => status === "unknown" && {
-    "--status-color": theme.textMutedColor
-  }
-);
-var TestProviderWidget = () => {
-  const [violationCount, setViolationCount] = React.useState(null);
-  const api = useStorybookApi();
-  const providerState = _useTestProviderStore ? _useTestProviderStore((state) => state[TEST_PROVIDER_ID]) : null;
-  React.useEffect(() => {
-    if (!statusStore) return;
-    const unsub = statusStore.onSelect(() => {
-      api.setSelectedPanel(PANEL_ID);
-      api.togglePanel(true);
-    });
-    return unsub;
-  }, [api]);
-  useChannel2({
-    [RESULT_EVENT]: ({ storyId, result, status: status2 }) => {
-      const violations = result.skipped ? [] : result.violations ?? [];
-      setViolationCount(violations.length);
-      if (statusStore && storyId) {
-        const hasViolations2 = violations.length > 0;
-        const isWarning = status2 === "warning";
-        statusStore.set([{
-          value: result.skipped ? "status-value:unknown" : hasViolations2 ? isWarning ? "status-value:warning" : "status-value:error" : "status-value:success",
-          typeId: STATUS_TYPE_ID,
-          storyId,
-          title: "AccessLint",
-          description: result.skipped ? "Skipped" : hasViolations2 ? `${violations.length} violation${violations.length === 1 ? "" : "s"}` : "No violations",
-          sidebarContextMenu: true
-        }]);
-      }
-      if (testProviderStore && providerState === "test-provider-state:running") {
-        testProviderStore.setState("test-provider-state:succeeded");
-      }
-    }
-  });
-  const hasViolations = violationCount !== null && violationCount > 0;
-  const status = violationCount === null ? "unknown" : hasViolations ? "negative" : "positive";
-  const openPanel = () => {
-    api.setSelectedPanel(PANEL_ID);
-    api.togglePanel(true);
-  };
-  if (ActionList && Form) {
-    return /* @__PURE__ */ React.createElement(StyledActionList, null, /* @__PURE__ */ React.createElement(ActionList.Item, null, /* @__PURE__ */ React.createElement(ActionList.Action, { as: "label", readOnly: true }, /* @__PURE__ */ React.createElement(ActionList.Icon, null, /* @__PURE__ */ React.createElement(Form.Checkbox, { name: "AccessLint", checked: true, disabled: true })), /* @__PURE__ */ React.createElement(ActionList.Text, null, "AccessLint")), /* @__PURE__ */ React.createElement(
-      ActionList.Button,
-      {
-        ariaLabel: violationCount === null ? "AccessLint: not run yet" : hasViolations ? `AccessLint: ${violationCount} violation${violationCount === 1 ? "" : "s"}` : "AccessLint: no violations",
-        disabled: violationCount === null,
-        onClick: openPanel
-      },
-      hasViolations ? violationCount : null,
-      /* @__PURE__ */ React.createElement(StatusDot, { status })
-    )));
-  }
-  return /* @__PURE__ */ React.createElement(
-    StyledActionList,
-    {
-      style: { display: "flex", alignItems: "center", gap: 8, padding: "6px 8px", cursor: "pointer" },
-      onClick: openPanel
-    },
-    /* @__PURE__ */ React.createElement(StatusDot, { status }),
-    /* @__PURE__ */ React.createElement("span", { style: { fontSize: 12 } }, "AccessLint"),
-    hasViolations && /* @__PURE__ */ React.createElement("span", { style: { fontSize: 11, fontWeight: "bold" } }, violationCount)
-  );
+const StyledActionList = ActionList ? styled(ActionList)({ padding: 0 }) : styled.div({ padding: 0 });
+const StatusDot = styled.div({
+	width: 6,
+	height: 6,
+	margin: 4,
+	borderRadius: "50%",
+	background: "var(--status-color)"
+}, ({ status, theme }) => status === "positive" && { "--status-color": theme.color.positive }, ({ status, theme }) => status === "negative" && { "--status-color": theme.color.negative }, ({ status, theme }) => status === "unknown" && { "--status-color": theme.textMutedColor });
+const TestProviderWidget = () => {
+	const [violationCount, setViolationCount] = React.useState(null);
+	const api = useStorybookApi();
+	const providerState = _useTestProviderStore ? _useTestProviderStore((state) => state[TEST_PROVIDER_ID]) : null;
+	React.useEffect(() => {
+		if (!statusStore) return;
+		return statusStore.onSelect(() => {
+			api.setSelectedPanel(PANEL_ID);
+			api.togglePanel(true);
+		});
+	}, [api]);
+	useChannel$1({ [RESULT_EVENT]: ({ storyId, result, status }) => {
+		const violations = result.skipped ? [] : result.violations ?? [];
+		setViolationCount(violations.length);
+		if (statusStore && storyId) {
+			const hasViolations = violations.length > 0;
+			const isWarning = status === "warning";
+			statusStore.set([{
+				value: result.skipped ? "status-value:unknown" : hasViolations ? isWarning ? "status-value:warning" : "status-value:error" : "status-value:success",
+				typeId: STATUS_TYPE_ID,
+				storyId,
+				title: "AccessLint",
+				description: result.skipped ? "Skipped" : hasViolations ? `${violations.length} violation${violations.length === 1 ? "" : "s"}` : "No violations",
+				sidebarContextMenu: true
+			}]);
+		}
+		if (testProviderStore && providerState === "test-provider-state:running") testProviderStore.setState("test-provider-state:succeeded");
+	} });
+	const hasViolations = violationCount !== null && violationCount > 0;
+	const status = violationCount === null ? "unknown" : hasViolations ? "negative" : "positive";
+	const openPanel = () => {
+		api.setSelectedPanel(PANEL_ID);
+		api.togglePanel(true);
+	};
+	if (ActionList && Form) return /* @__PURE__ */ React.createElement(StyledActionList, null, /* @__PURE__ */ React.createElement(ActionList.Item, null, /* @__PURE__ */ React.createElement(ActionList.Action, {
+		as: "label",
+		readOnly: true
+	}, /* @__PURE__ */ React.createElement(ActionList.Icon, null, /* @__PURE__ */ React.createElement(Form.Checkbox, {
+		name: "AccessLint",
+		checked: true,
+		disabled: true
+	})), /* @__PURE__ */ React.createElement(ActionList.Text, null, "AccessLint")), /* @__PURE__ */ React.createElement(ActionList.Button, {
+		ariaLabel: violationCount === null ? "AccessLint: not run yet" : hasViolations ? `AccessLint: ${violationCount} violation${violationCount === 1 ? "" : "s"}` : "AccessLint: no violations",
+		disabled: violationCount === null,
+		onClick: openPanel
+	}, hasViolations ? violationCount : null, /* @__PURE__ */ React.createElement(StatusDot, { status }))));
+	return /* @__PURE__ */ React.createElement(StyledActionList, {
+		style: {
+			display: "flex",
+			alignItems: "center",
+			gap: 8,
+			padding: "6px 8px",
+			cursor: "pointer"
+		},
+		onClick: openPanel
+	}, /* @__PURE__ */ React.createElement(StatusDot, { status }), /* @__PURE__ */ React.createElement("span", { style: { fontSize: 12 } }, "AccessLint"), hasViolations && /* @__PURE__ */ React.createElement("span", { style: {
+		fontSize: 11,
+		fontWeight: "bold"
+	} }, violationCount));
 };
-var SidebarContextMenu = ({ context }) => {
-  const api = useStorybookApi();
-  if (context.type !== "story" || !ActionList) return null;
-  return /* @__PURE__ */ React.createElement(
-    ActionList.Item,
-    {
-      onClick: () => {
-        api.selectStory(context.id);
-        api.setSelectedPanel(PANEL_ID);
-        api.togglePanel(true);
-      }
-    },
-    /* @__PURE__ */ React.createElement(ActionList.Text, null, "View AccessLint results")
-  );
+const SidebarContextMenu = ({ context }) => {
+	const api = useStorybookApi();
+	if (context.type !== "story" || !ActionList) return null;
+	return /* @__PURE__ */ React.createElement(ActionList.Item, { onClick: () => {
+		api.selectStory(context.id);
+		api.setSelectedPanel(PANEL_ID);
+		api.togglePanel(true);
+	} }, /* @__PURE__ */ React.createElement(ActionList.Text, null, "View AccessLint results"));
 };
 addons.register(ADDON_ID, () => {
-  addons.add(PANEL_ID, {
-    title: Title,
-    type: types.PANEL,
-    render: Panel,
-    paramKey: PARAM_KEY
-  });
-  if (hasTestProvider && types.experimental_TEST_PROVIDER) {
-    addons.add(TEST_PROVIDER_ID, {
-      type: types.experimental_TEST_PROVIDER,
-      render: () => /* @__PURE__ */ React.createElement(TestProviderWidget, null),
-      sidebarContextMenu: ({ context }) => /* @__PURE__ */ React.createElement(SidebarContextMenu, { context })
-    });
-  }
+	addons.add(PANEL_ID, {
+		title: Title,
+		type: types.PANEL,
+		render: Panel,
+		paramKey: PARAM_KEY
+	});
+	if (hasTestProvider && types.experimental_TEST_PROVIDER) addons.add(TEST_PROVIDER_ID, {
+		type: types.experimental_TEST_PROVIDER,
+		render: () => /* @__PURE__ */ React.createElement(TestProviderWidget, null),
+		sidebarContextMenu: ({ context }) => /* @__PURE__ */ React.createElement(SidebarContextMenu, { context })
+	});
 });
+//#endregion