@tanstack/devtools-a11y 0.0.1 → 0.1.1

package/dist/esm/core/utils/custom-audit.utils.js

@@ -0,0 +1,426 @@
+import { meetsThreshold } from "./ally-audit.utils.js";
+//#region src/core/utils/custom-audit.utils.ts
+/**
+* Custom accessibility rules for issues not covered by axe-core
+*
+* These rules detect common accessibility anti-patterns like:
+* - Click handlers on non-interactive elements
+* - Mouse-only event handlers without keyboard equivalents
+* - Static elements with interactive handlers
+*/
+/**
+* Interactive HTML elements that can receive focus and have implicit roles
+*/
+var INTERACTIVE_ELEMENTS = new Set([
+	"a",
+	"button",
+	"input",
+	"select",
+	"textarea",
+	"details",
+	"summary",
+	"audio",
+	"video"
+]);
+/**
+* Elements that are interactive when they have an href attribute
+*/
+var INTERACTIVE_WITH_HREF = new Set(["a", "area"]);
+/**
+* Interactive ARIA roles
+*/
+var INTERACTIVE_ROLES = new Set([
+	"button",
+	"checkbox",
+	"combobox",
+	"gridcell",
+	"link",
+	"listbox",
+	"menu",
+	"menubar",
+	"menuitem",
+	"menuitemcheckbox",
+	"menuitemradio",
+	"option",
+	"progressbar",
+	"radio",
+	"scrollbar",
+	"searchbox",
+	"slider",
+	"spinbutton",
+	"switch",
+	"tab",
+	"tabpanel",
+	"textbox",
+	"tree",
+	"treeitem"
+]);
+/**
+* Mouse-only events that should have keyboard equivalents
+*/
+var MOUSE_ONLY_EVENTS = [
+	"onclick",
+	"ondblclick",
+	"onmousedown",
+	"onmouseup",
+	"onmouseover",
+	"onmouseout",
+	"onmouseenter",
+	"onmouseleave"
+];
+/**
+* Keyboard events that would make an element accessible
+*/
+var KEYBOARD_EVENTS = [
+	"onkeydown",
+	"onkeyup",
+	"onkeypress"
+];
+/**
+* Selectors for devtools elements to exclude
+*/
+var DEVTOOLS_SELECTORS = [
+	"[data-testid=\"tanstack_devtools\"]",
+	"[data-devtools]",
+	"[data-devtools-panel]",
+	"[data-a11y-overlay]"
+];
+/**
+* Common root container element IDs used by frameworks.
+* React attaches event delegation to these elements, which would
+* cause false positives for click handler detection.
+*/
+var ROOT_CONTAINER_IDS = new Set([
+	"root",
+	"app",
+	"__next",
+	"__nuxt",
+	"__gatsby",
+	"app-root",
+	"svelte",
+	"q-app"
+]);
+/**
+* Check if an element is a root container (framework app mount point).
+* These elements often have React internals attached for event delegation
+* but don't actually have user-defined click handlers.
+*/
+function isRootContainer(element) {
+	if (element.id && ROOT_CONTAINER_IDS.has(element.id)) return true;
+	if (element.parentElement === document.body) {
+		const tagName = element.tagName.toLowerCase();
+		if (tagName === "div" || tagName === "main" || tagName === "section") {
+			const keys = Object.keys(element);
+			for (const key of keys) if (key.startsWith("__reactProps$")) {
+				const props = element[key];
+				if (props && typeof props === "object") {
+					const propsObj = props;
+					if ("children" in propsObj && !("onClick" in propsObj)) return true;
+				}
+			}
+		}
+	}
+	return false;
+}
+/**
+* Check if an element is inside devtools
+*/
+function isInsideDevtools(element) {
+	for (const selector of DEVTOOLS_SELECTORS) if (element.closest(selector)) return true;
+	return false;
+}
+/**
+* Check if element is interactive by nature
+*/
+function isInteractiveElement(element) {
+	const tagName = element.tagName.toLowerCase();
+	if (INTERACTIVE_ELEMENTS.has(tagName)) return !element.hasAttribute("disabled");
+	return INTERACTIVE_WITH_HREF.has(tagName) && element.hasAttribute("href");
+}
+/**
+* Check if element has an interactive ARIA role
+*/
+function hasInteractiveRole(element) {
+	const role = element.getAttribute("role");
+	return role !== null && INTERACTIVE_ROLES.has(role);
+}
+/**
+* Check if element is focusable (has tabindex)
+*/
+function isFocusable(element) {
+	const tabindex = element.getAttribute("tabindex");
+	if (tabindex === null) return false;
+	const tabindexValue = parseInt(tabindex, 10);
+	return !isNaN(tabindexValue) && tabindexValue >= 0;
+}
+/**
+* Check if element has click event handlers (via attribute or property)
+*/
+function hasClickHandler(element) {
+	if (element.hasAttribute("onclick")) return true;
+	if (typeof element.onclick === "function") return true;
+	const keys = Object.keys(element);
+	for (const key of keys) if (key.startsWith("__reactProps$") || key.startsWith("__reactFiber$") || key.startsWith("__reactEventHandlers$")) {
+		const props = element[key];
+		if (props && typeof props === "object") {
+			const propsObj = props;
+			if (typeof propsObj.onClick === "function" || typeof propsObj.onMouseDown === "function" || typeof propsObj.onMouseUp === "function") return true;
+		}
+	}
+	return false;
+}
+/**
+* Check if element has keyboard event handlers
+*/
+function hasKeyboardHandler(element) {
+	for (const event of KEYBOARD_EVENTS) if (element.hasAttribute(event)) return true;
+	const htmlElement = element;
+	if (typeof htmlElement.onkeydown === "function" || typeof htmlElement.onkeyup === "function" || typeof htmlElement.onkeypress === "function") return true;
+	const keys = Object.keys(element);
+	for (const key of keys) if (key.startsWith("__reactProps$")) {
+		const props = element[key];
+		if (props && typeof props === "object") {
+			const propsObj = props;
+			if (typeof propsObj.onKeyDown === "function" || typeof propsObj.onKeyUp === "function" || typeof propsObj.onKeyPress === "function") return true;
+		}
+	}
+	return false;
+}
+/**
+* Class prefixes to exclude from selectors (devtools overlay classes)
+*/
+var EXCLUDED_CLASS_PREFIXES = ["tsd-a11y-"];
+/**
+* Filter out devtools-injected classes from class list
+*/
+function filterClasses(classList) {
+	return Array.from(classList).filter((cls) => !EXCLUDED_CLASS_PREFIXES.some((prefix) => cls.startsWith(prefix)));
+}
+/**
+* Get a unique selector for an element
+*/
+function getSelector(element) {
+	if (element.id) return `#${element.id}`;
+	const tagName = element.tagName.toLowerCase();
+	const classes = filterClasses(element.classList).join(".");
+	const classSelector = classes ? `.${classes}` : "";
+	const parent = element.parentElement;
+	if (parent && parent !== document.body) {
+		const parentSelector = getSelector(parent);
+		const siblings = Array.from(parent.children).filter((el) => el.tagName === element.tagName);
+		if (siblings.length > 1) return `${parentSelector} > ${tagName}${classSelector}:nth-of-type(${siblings.indexOf(element) + 1})`;
+		return `${parentSelector} > ${tagName}${classSelector}`;
+	}
+	return `${tagName}${classSelector}`;
+}
+/**
+* Custom rule: Click handler on non-interactive element
+*
+* This rule detects elements that have click handlers but are not:
+* - Interactive HTML elements (button, a, input, etc.)
+* - Elements with interactive ARIA roles
+* - Elements with tabindex for keyboard access
+*/
+function checkClickHandlerOnNonInteractive(context = document, threshold = "serious") {
+	const issues = [];
+	const timestamp = Date.now();
+	const allElements = context.querySelectorAll("*");
+	for (const element of allElements) {
+		if (isInsideDevtools(element)) continue;
+		if (isRootContainer(element)) continue;
+		if (isInteractiveElement(element) || hasInteractiveRole(element)) continue;
+		if (!hasClickHandler(element)) continue;
+		const hasFocus = isFocusable(element);
+		const hasKeyboard = hasKeyboardHandler(element);
+		if (!hasFocus && !hasKeyboard) {
+			const selector = getSelector(element);
+			issues.push({
+				id: `click-handler-no-keyboard-${timestamp}-${issues.length}`,
+				ruleId: "click-handler-on-non-interactive",
+				impact: "serious",
+				message: "Element has a click handler but is not keyboard accessible. Add tabindex=\"0\" and keyboard event handlers, or use an interactive element like <button>.",
+				help: "Interactive elements must be keyboard accessible",
+				helpUrl: "https://www.w3.org/WAI/WCAG21/Understanding/keyboard-accessible",
+				wcagTags: ["wcag211", "wcag21a"],
+				nodes: [{
+					selector,
+					html: element.outerHTML.slice(0, 200)
+				}],
+				meetsThreshold: meetsThreshold("serious", threshold),
+				timestamp
+			});
+		} else if (hasFocus && !hasKeyboard) {
+			const selector = getSelector(element);
+			issues.push({
+				id: `click-handler-no-keyboard-handler-${timestamp}-${issues.length}`,
+				ruleId: "click-handler-on-non-interactive",
+				impact: "moderate",
+				message: "Element has a click handler and tabindex but no keyboard event handler. Add onKeyDown/onKeyPress to handle Enter/Space keys.",
+				help: "Interactive elements should respond to keyboard events",
+				helpUrl: "https://www.w3.org/WAI/WCAG21/Understanding/keyboard-accessible",
+				wcagTags: ["wcag211", "wcag21a"],
+				nodes: [{
+					selector,
+					html: element.outerHTML.slice(0, 200)
+				}],
+				meetsThreshold: meetsThreshold("moderate", threshold),
+				timestamp
+			});
+		}
+	}
+	return issues;
+}
+/**
+* Custom rule: Mouse-only event handlers
+*
+* Detects elements that have mouse event handlers (onmouseover, onmousedown, etc.)
+* without corresponding keyboard event handlers.
+*/
+function checkMouseOnlyEvents(context = document, threshold = "serious") {
+	const issues = [];
+	const timestamp = Date.now();
+	const mouseEventSelectors = MOUSE_ONLY_EVENTS.map((event) => `[${event}]`).join(", ");
+	const elements = context.querySelectorAll(mouseEventSelectors);
+	for (const element of elements) {
+		if (isInsideDevtools(element)) continue;
+		if (isInteractiveElement(element)) continue;
+		if (hasKeyboardHandler(element) || isFocusable(element)) continue;
+		const mouseEvents = [];
+		for (const event of MOUSE_ONLY_EVENTS) if (element.hasAttribute(event)) mouseEvents.push(event);
+		const selector = getSelector(element);
+		issues.push({
+			id: `mouse-only-events-${timestamp}-${issues.length}`,
+			ruleId: "mouse-only-event-handlers",
+			impact: "serious",
+			message: `Element has mouse-only event handlers (${mouseEvents.join(", ")}) without keyboard equivalents. Ensure functionality is available via keyboard.`,
+			help: "All functionality must be operable through keyboard",
+			helpUrl: "https://www.w3.org/WAI/WCAG21/Understanding/keyboard",
+			wcagTags: ["wcag211", "wcag21a"],
+			nodes: [{
+				selector,
+				html: element.outerHTML.slice(0, 200)
+			}],
+			meetsThreshold: meetsThreshold("serious", threshold),
+			timestamp
+		});
+	}
+	return issues;
+}
+/**
+* Custom rule: Static element with interactive semantics
+*
+* Detects elements like <div> or <span> that have role="button" but lack
+* proper keyboard handling (tabindex and key events).
+*/
+function checkStaticElementInteraction(context = document, threshold = "serious") {
+	const issues = [];
+	const timestamp = Date.now();
+	const roleSelectors = Array.from(INTERACTIVE_ROLES).map((role) => `[role="${role}"]`).join(", ");
+	const elements = context.querySelectorAll(roleSelectors);
+	for (const element of elements) {
+		if (isInsideDevtools(element)) continue;
+		if (isInteractiveElement(element)) continue;
+		const role = element.getAttribute("role");
+		const hasFocus = isFocusable(element);
+		const hasKeyboard = hasKeyboardHandler(element);
+		if (!hasFocus) {
+			const selector = getSelector(element);
+			issues.push({
+				id: `static-element-no-tabindex-${timestamp}-${issues.length}`,
+				ruleId: "static-element-interaction",
+				impact: "serious",
+				message: `Element with role="${role}" is not focusable. Add tabindex="0" to make it keyboard accessible.`,
+				help: "Elements with interactive roles must be focusable",
+				helpUrl: "https://www.w3.org/WAI/WCAG21/Techniques/aria/ARIA4#description",
+				wcagTags: [
+					"wcag211",
+					"wcag21a",
+					"wcag412"
+				],
+				nodes: [{
+					selector,
+					html: element.outerHTML.slice(0, 200)
+				}],
+				meetsThreshold: meetsThreshold("serious", threshold),
+				timestamp
+			});
+		}
+		if (role && [
+			"button",
+			"link",
+			"menuitem",
+			"option"
+		].includes(role) && !hasKeyboard && hasClickHandler(element)) {
+			const selector = getSelector(element);
+			issues.push({
+				id: `static-element-no-keyboard-${timestamp}-${issues.length}`,
+				ruleId: "static-element-interaction",
+				impact: "moderate",
+				message: `Element with role="${role}" has click handler but no keyboard handler. Add onKeyDown to handle Enter/Space.`,
+				help: "Elements with button-like roles should respond to Enter and Space keys",
+				helpUrl: "https://www.w3.org/WAI/WCAG21/Techniques/aria/ARIA4#description",
+				wcagTags: ["wcag211", "wcag21a"],
+				nodes: [{
+					selector,
+					html: element.outerHTML.slice(0, 200)
+				}],
+				meetsThreshold: meetsThreshold("moderate", threshold),
+				timestamp
+			});
+		}
+	}
+	return issues;
+}
+/**
+* Run all enabled custom rules
+*/
+function runCustomRules(context = document, config = {}, threshold = "serious") {
+	const { clickHandlerOnNonInteractive = true, mouseOnlyEventHandlers = true, staticElementInteraction = true } = config;
+	const issues = [];
+	if (clickHandlerOnNonInteractive) issues.push(...checkClickHandlerOnNonInteractive(context, threshold));
+	if (mouseOnlyEventHandlers) issues.push(...checkMouseOnlyEvents(context, threshold));
+	if (staticElementInteraction) issues.push(...checkStaticElementInteraction(context, threshold));
+	return issues;
+}
+/**
+* Get list of custom rule metadata (for UI display)
+*/
+function getCustomRules() {
+	return [
+		{
+			id: "click-handler-on-non-interactive",
+			description: "Ensures click handlers are only on keyboard-accessible elements",
+			tags: [
+				"custom",
+				"cat.keyboard",
+				"wcag21a",
+				"wcag211"
+			]
+		},
+		{
+			id: "mouse-only-event-handlers",
+			description: "Ensures mouse event handlers have keyboard equivalents",
+			tags: [
+				"custom",
+				"cat.keyboard",
+				"wcag21a",
+				"wcag211"
+			]
+		},
+		{
+			id: "static-element-interaction",
+			description: "Ensures elements with interactive roles are properly keyboard accessible",
+			tags: [
+				"custom",
+				"cat.keyboard",
+				"cat.aria",
+				"wcag21a",
+				"wcag211"
+			]
+		}
+	];
+}
+//#endregion
+export { getCustomRules, runCustomRules };
+
+//# sourceMappingURL=custom-audit.utils.js.map

package/dist/esm/core/utils/custom-audit.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"custom-audit.utils.js","names":[],"sources":["../../../../src/core/utils/custom-audit.utils.ts"],"sourcesContent":["/**\n * Custom accessibility rules for issues not covered by axe-core\n *\n * These rules detect common accessibility anti-patterns like:\n * - Click handlers on non-interactive elements\n * - Mouse-only event handlers without keyboard equivalents\n * - Static elements with interactive handlers\n */\n\nimport { meetsThreshold } from './ally-audit.utils'\n\nimport type {\n  A11yIssue,\n  CustomRulesConfig,\n  SeverityThreshold,\n} from '../types/types'\n\n/**\n * Interactive HTML elements that can receive focus and have implicit roles\n */\nconst INTERACTIVE_ELEMENTS = new Set([\n  'a',\n  'button',\n  'input',\n  'select',\n  'textarea',\n  'details',\n  'summary',\n  'audio',\n  'video',\n])\n\n/**\n * Elements that are interactive when they have an href attribute\n */\nconst INTERACTIVE_WITH_HREF = new Set(['a', 'area'])\n\n/**\n * Interactive ARIA roles\n */\nconst INTERACTIVE_ROLES = new Set([\n  'button',\n  'checkbox',\n  'combobox',\n  'gridcell',\n  'link',\n  'listbox',\n  'menu',\n  'menubar',\n  'menuitem',\n  'menuitemcheckbox',\n  'menuitemradio',\n  'option',\n  'progressbar',\n  'radio',\n  'scrollbar',\n  'searchbox',\n  'slider',\n  'spinbutton',\n  'switch',\n  'tab',\n  'tabpanel',\n  'textbox',\n  'tree',\n  'treeitem',\n])\n\n/**\n * Mouse-only events that should have keyboard equivalents\n */\nconst MOUSE_ONLY_EVENTS = [\n  'onclick',\n  'ondblclick',\n  'onmousedown',\n  'onmouseup',\n  'onmouseover',\n  'onmouseout',\n  'onmouseenter',\n  'onmouseleave',\n]\n\n/**\n * Keyboard events that would make an element accessible\n */\nconst KEYBOARD_EVENTS = ['onkeydown', 'onkeyup', 'onkeypress']\n\n/**\n * Selectors for devtools elements to exclude\n */\nconst DEVTOOLS_SELECTORS = [\n  '[data-testid=\"tanstack_devtools\"]',\n  '[data-devtools]',\n  '[data-devtools-panel]',\n  '[data-a11y-overlay]',\n]\n\n/**\n * Common root container element IDs used by frameworks.\n * React attaches event delegation to these elements, which would\n * cause false positives for click handler detection.\n */\nconst ROOT_CONTAINER_IDS = new Set([\n  'root',\n  'app',\n  '__next', // Next.js\n  '__nuxt', // Nuxt\n  '__gatsby', // Gatsby\n  'app-root', // Angular\n  'svelte', // SvelteKit\n  'q-app', // Qwik\n])\n\n/**\n * Check if an element is a root container (framework app mount point).\n * These elements often have React internals attached for event delegation\n * but don't actually have user-defined click handlers.\n */\nfunction isRootContainer(element: Element): boolean {\n  // Check by ID\n  if (element.id && ROOT_CONTAINER_IDS.has(element.id)) {\n    return true\n  }\n\n  // Check if direct child of body (common for app containers)\n  if (element.parentElement === document.body) {\n    // Only consider it a root if it has no meaningful content attributes\n    // that would indicate it's an interactive element\n    const tagName = element.tagName.toLowerCase()\n    if (tagName === 'div' || tagName === 'main' || tagName === 'section') {\n      // Check if this looks like an app container (wraps most of the page)\n      // by checking if it has React fiber but no explicit onClick in props\n      const keys = Object.keys(element)\n      for (const key of keys) {\n        if (key.startsWith('__reactProps$')) {\n          const props = (element as unknown as Record<string, unknown>)[key]\n          if (props && typeof props === 'object') {\n            const propsObj = props as Record<string, unknown>\n            // If it has children but no onClick, it's likely a container\n            if ('children' in propsObj && !('onClick' in propsObj)) {\n              return true\n            }\n          }\n        }\n      }\n    }\n  }\n\n  return false\n}\n\n/**\n * Check if an element is inside devtools\n */\nfunction isInsideDevtools(element: Element): boolean {\n  for (const selector of DEVTOOLS_SELECTORS) {\n    if (element.closest(selector)) {\n      return true\n    }\n  }\n  return false\n}\n\n/**\n * Check if element is interactive by nature\n */\nfunction isInteractiveElement(element: Element): boolean {\n  const tagName = element.tagName.toLowerCase()\n\n  // Check if it's an inherently interactive element\n  if (INTERACTIVE_ELEMENTS.has(tagName)) {\n    // Disabled elements are not interactive\n    return !element.hasAttribute('disabled')\n  }\n\n  // Check if it's an element that becomes interactive with href\n  return INTERACTIVE_WITH_HREF.has(tagName) && element.hasAttribute('href')\n}\n\n/**\n * Check if element has an interactive ARIA role\n */\nfunction hasInteractiveRole(element: Element): boolean {\n  const role = element.getAttribute('role')\n  return role !== null && INTERACTIVE_ROLES.has(role)\n}\n\n/**\n * Check if element is focusable (has tabindex)\n */\nfunction isFocusable(element: Element): boolean {\n  const tabindex = element.getAttribute('tabindex')\n  if (tabindex === null) {\n    return false\n  }\n  const tabindexValue = parseInt(tabindex, 10)\n  return !isNaN(tabindexValue) && tabindexValue >= 0\n}\n\n/**\n * Check if element has click event handlers (via attribute or property)\n */\nfunction hasClickHandler(element: Element): boolean {\n  // Check for onclick attribute\n  if (element.hasAttribute('onclick')) {\n    return true\n  }\n\n  // Check for event listener via property (common in React/frameworks)\n  // Note: We can't detect addEventListener calls, but we can check common patterns\n  const htmlElement = element as HTMLElement\n\n  // Check if onclick property is set\n  if (typeof htmlElement.onclick === 'function') {\n    return true\n  }\n\n  // Check for React synthetic events (data attributes often indicate handlers)\n  // React 17+ uses __reactFiber$ and __reactProps$ prefixed properties\n  const keys = Object.keys(element)\n  for (const key of keys) {\n    if (\n      key.startsWith('__reactProps$') ||\n      key.startsWith('__reactFiber$') ||\n      key.startsWith('__reactEventHandlers$')\n    ) {\n      // Element has React internals, likely has event handlers\n      // We can't easily inspect these, so we'll check for common patterns\n      const props = (element as unknown as Record<string, unknown>)[key]\n      if (props && typeof props === 'object') {\n        const propsObj = props as Record<string, unknown>\n        if (\n          typeof propsObj.onClick === 'function' ||\n          typeof propsObj.onMouseDown === 'function' ||\n          typeof propsObj.onMouseUp === 'function'\n        ) {\n          return true\n        }\n      }\n    }\n  }\n\n  return false\n}\n\n/**\n * Check if element has keyboard event handlers\n */\nfunction hasKeyboardHandler(element: Element): boolean {\n  // Check for keyboard event attributes\n  for (const event of KEYBOARD_EVENTS) {\n    if (element.hasAttribute(event)) {\n      return true\n    }\n  }\n\n  const htmlElement = element as HTMLElement\n  if (\n    typeof htmlElement.onkeydown === 'function' ||\n    typeof htmlElement.onkeyup === 'function' ||\n    typeof htmlElement.onkeypress === 'function'\n  ) {\n    return true\n  }\n\n  // Check React props for keyboard handlers\n  const keys = Object.keys(element)\n  for (const key of keys) {\n    if (key.startsWith('__reactProps$')) {\n      const props = (element as unknown as Record<string, unknown>)[key]\n      if (props && typeof props === 'object') {\n        const propsObj = props as Record<string, unknown>\n        if (\n          typeof propsObj.onKeyDown === 'function' ||\n          typeof propsObj.onKeyUp === 'function' ||\n          typeof propsObj.onKeyPress === 'function'\n        ) {\n          return true\n        }\n      }\n    }\n  }\n\n  return false\n}\n\n/**\n * Class prefixes to exclude from selectors (devtools overlay classes)\n */\nconst EXCLUDED_CLASS_PREFIXES = ['tsd-a11y-']\n\n/**\n * Filter out devtools-injected classes from class list\n */\nfunction filterClasses(classList: DOMTokenList): Array<string> {\n  return Array.from(classList).filter(\n    (cls) => !EXCLUDED_CLASS_PREFIXES.some((prefix) => cls.startsWith(prefix)),\n  )\n}\n\n/**\n * Get a unique selector for an element\n */\nfunction getSelector(element: Element): string {\n  // Try to build a unique selector\n  if (element.id) {\n    return `#${element.id}`\n  }\n\n  const tagName = element.tagName.toLowerCase()\n  // Filter out devtools overlay classes (tsd-a11y-highlight, etc.)\n  const classes = filterClasses(element.classList).join('.')\n  const classSelector = classes ? `.${classes}` : ''\n\n  // Build path from parent\n  const parent = element.parentElement\n  if (parent && parent !== document.body) {\n    const parentSelector = getSelector(parent)\n    const siblings = Array.from(parent.children).filter(\n      (el) => el.tagName === element.tagName,\n    )\n    if (siblings.length > 1) {\n      const index = siblings.indexOf(element) + 1\n      return `${parentSelector} > ${tagName}${classSelector}:nth-of-type(${index})`\n    }\n    return `${parentSelector} > ${tagName}${classSelector}`\n  }\n\n  return `${tagName}${classSelector}`\n}\n\n/**\n * Custom rule: Click handler on non-interactive element\n *\n * This rule detects elements that have click handlers but are not:\n * - Interactive HTML elements (button, a, input, etc.)\n * - Elements with interactive ARIA roles\n * - Elements with tabindex for keyboard access\n */\nfunction checkClickHandlerOnNonInteractive(\n  context: Document | Element = document,\n  threshold: SeverityThreshold = 'serious',\n): Array<A11yIssue> {\n  const issues: Array<A11yIssue> = []\n  const timestamp = Date.now()\n\n  // Query all elements and check for click handlers\n  const allElements = context.querySelectorAll('*')\n\n  for (const element of allElements) {\n    // Skip devtools elements\n    if (isInsideDevtools(element)) {\n      continue\n    }\n\n    // Skip root container elements (e.g., #root, #app)\n    // These often have React event delegation attached but no actual click handlers\n    if (isRootContainer(element)) {\n      continue\n    }\n\n    // Skip if element is interactive\n    if (isInteractiveElement(element) || hasInteractiveRole(element)) {\n      continue\n    }\n\n    // Check if element has click handler\n    if (!hasClickHandler(element)) {\n      continue\n    }\n\n    // Element has click handler but is not interactive\n    // Check if it at least has keyboard access\n    const hasFocus = isFocusable(element)\n    const hasKeyboard = hasKeyboardHandler(element)\n\n    if (!hasFocus && !hasKeyboard) {\n      // Critical: No keyboard access at all\n      const selector = getSelector(element)\n      issues.push({\n        id: `click-handler-no-keyboard-${timestamp}-${issues.length}`,\n        ruleId: 'click-handler-on-non-interactive',\n        impact: 'serious',\n        message:\n          'Element has a click handler but is not keyboard accessible. Add tabindex=\"0\" and keyboard event handlers, or use an interactive element like <button>.',\n        help: 'Interactive elements must be keyboard accessible',\n        helpUrl:\n          'https://www.w3.org/WAI/WCAG21/Understanding/keyboard-accessible',\n        wcagTags: ['wcag211', 'wcag21a'],\n        nodes: [\n          {\n            selector,\n            html: element.outerHTML.slice(0, 200),\n          },\n        ],\n        meetsThreshold: meetsThreshold('serious', threshold),\n        timestamp,\n      })\n    } else if (hasFocus && !hasKeyboard) {\n      // Moderate: Has tabindex but no keyboard handler\n      const selector = getSelector(element)\n      issues.push({\n        id: `click-handler-no-keyboard-handler-${timestamp}-${issues.length}`,\n        ruleId: 'click-handler-on-non-interactive',\n        impact: 'moderate',\n        message:\n          'Element has a click handler and tabindex but no keyboard event handler. Add onKeyDown/onKeyPress to handle Enter/Space keys.',\n        help: 'Interactive elements should respond to keyboard events',\n        helpUrl:\n          'https://www.w3.org/WAI/WCAG21/Understanding/keyboard-accessible',\n        wcagTags: ['wcag211', 'wcag21a'],\n        nodes: [\n          {\n            selector,\n            html: element.outerHTML.slice(0, 200),\n          },\n        ],\n        meetsThreshold: meetsThreshold('moderate', threshold),\n        timestamp,\n      })\n    }\n  }\n\n  return issues\n}\n\n/**\n * Custom rule: Mouse-only event handlers\n *\n * Detects elements that have mouse event handlers (onmouseover, onmousedown, etc.)\n * without corresponding keyboard event handlers.\n */\nfunction checkMouseOnlyEvents(\n  context: Document | Element = document,\n  threshold: SeverityThreshold = 'serious',\n): Array<A11yIssue> {\n  const issues: Array<A11yIssue> = []\n  const timestamp = Date.now()\n  // default threshold will be provided by runCustomRules\n  // We'll accept threshold by adding a parameter in the function signature\n\n  // Build selector for elements with mouse events\n  const mouseEventSelectors = MOUSE_ONLY_EVENTS.map(\n    (event) => `[${event}]`,\n  ).join(', ')\n\n  const elements = context.querySelectorAll(mouseEventSelectors)\n\n  for (const element of elements) {\n    // Skip devtools elements\n    if (isInsideDevtools(element)) {\n      continue\n    }\n\n    // Skip interactive elements (they handle keyboard by default)\n    if (isInteractiveElement(element)) {\n      continue\n    }\n\n    // Check if element has keyboard handlers\n    if (hasKeyboardHandler(element) || isFocusable(element)) {\n      continue\n    }\n\n    const mouseEvents: Array<string> = []\n    for (const event of MOUSE_ONLY_EVENTS) {\n      if (element.hasAttribute(event)) {\n        mouseEvents.push(event)\n      }\n    }\n\n    const selector = getSelector(element)\n    issues.push({\n      id: `mouse-only-events-${timestamp}-${issues.length}`,\n      ruleId: 'mouse-only-event-handlers',\n      impact: 'serious',\n      message: `Element has mouse-only event handlers (${mouseEvents.join(', ')}) without keyboard equivalents. Ensure functionality is available via keyboard.`,\n      help: 'All functionality must be operable through keyboard',\n      helpUrl: 'https://www.w3.org/WAI/WCAG21/Understanding/keyboard',\n      wcagTags: ['wcag211', 'wcag21a'],\n      nodes: [\n        {\n          selector,\n          html: element.outerHTML.slice(0, 200),\n        },\n      ],\n      meetsThreshold: meetsThreshold('serious', threshold),\n      timestamp,\n    })\n  }\n\n  return issues\n}\n\n/**\n * Custom rule: Static element with interactive semantics\n *\n * Detects elements like <div> or <span> that have role=\"button\" but lack\n * proper keyboard handling (tabindex and key events).\n */\nfunction checkStaticElementInteraction(\n  context: Document | Element = document,\n  threshold: SeverityThreshold = 'serious',\n): Array<A11yIssue> {\n  const issues: Array<A11yIssue> = []\n  const timestamp = Date.now()\n\n  // Query elements with interactive roles\n  const roleSelectors = Array.from(INTERACTIVE_ROLES)\n    .map((role) => `[role=\"${role}\"]`)\n    .join(', ')\n\n  const elements = context.querySelectorAll(roleSelectors)\n\n  for (const element of elements) {\n    // Skip devtools elements\n    if (isInsideDevtools(element)) {\n      continue\n    }\n\n    // Skip inherently interactive elements\n    if (isInteractiveElement(element)) {\n      continue\n    }\n\n    const role = element.getAttribute('role')\n    const hasFocus = isFocusable(element)\n    const hasKeyboard = hasKeyboardHandler(element)\n\n    // Check for missing tabindex\n    if (!hasFocus) {\n      const selector = getSelector(element)\n      issues.push({\n        id: `static-element-no-tabindex-${timestamp}-${issues.length}`,\n        ruleId: 'static-element-interaction',\n        impact: 'serious',\n        message: `Element with role=\"${role}\" is not focusable. Add tabindex=\"0\" to make it keyboard accessible.`,\n        help: 'Elements with interactive roles must be focusable',\n        helpUrl:\n          'https://www.w3.org/WAI/WCAG21/Techniques/aria/ARIA4#description',\n        wcagTags: ['wcag211', 'wcag21a', 'wcag412'],\n        nodes: [\n          {\n            selector,\n            html: element.outerHTML.slice(0, 200),\n          },\n        ],\n        meetsThreshold: meetsThreshold('serious', threshold),\n        timestamp,\n      })\n    }\n\n    // Check for missing keyboard handlers (for button-like roles)\n    const requiresKeyboardActivation = ['button', 'link', 'menuitem', 'option']\n    if (\n      role &&\n      requiresKeyboardActivation.includes(role) &&\n      !hasKeyboard &&\n      hasClickHandler(element)\n    ) {\n      const selector = getSelector(element)\n      issues.push({\n        id: `static-element-no-keyboard-${timestamp}-${issues.length}`,\n        ruleId: 'static-element-interaction',\n        impact: 'moderate',\n        message: `Element with role=\"${role}\" has click handler but no keyboard handler. Add onKeyDown to handle Enter/Space.`,\n        help: 'Elements with button-like roles should respond to Enter and Space keys',\n        helpUrl:\n          'https://www.w3.org/WAI/WCAG21/Techniques/aria/ARIA4#description',\n        wcagTags: ['wcag211', 'wcag21a'],\n        nodes: [\n          {\n            selector,\n            html: element.outerHTML.slice(0, 200),\n          },\n        ],\n        meetsThreshold: meetsThreshold('moderate', threshold),\n        timestamp,\n      })\n    }\n  }\n\n  return issues\n}\n\n/**\n * Run all enabled custom rules\n */\nexport function runCustomRules(\n  context: Document | Element = document,\n  config: CustomRulesConfig = {},\n  threshold: SeverityThreshold = 'serious',\n): Array<A11yIssue> {\n  const {\n    clickHandlerOnNonInteractive = true,\n    mouseOnlyEventHandlers = true,\n    staticElementInteraction = true,\n  } = config\n\n  const issues: Array<A11yIssue> = []\n\n  if (clickHandlerOnNonInteractive) {\n    issues.push(...checkClickHandlerOnNonInteractive(context, threshold))\n  }\n\n  if (mouseOnlyEventHandlers) {\n    issues.push(...checkMouseOnlyEvents(context, threshold))\n  }\n\n  if (staticElementInteraction) {\n    issues.push(...checkStaticElementInteraction(context, threshold))\n  }\n\n  return issues\n}\n\n/**\n * Get list of custom rule metadata (for UI display)\n */\nexport function getCustomRules(): Array<{\n  id: string\n  description: string\n  tags: Array<string>\n}> {\n  return [\n    {\n      id: 'click-handler-on-non-interactive',\n      description:\n        'Ensures click handlers are only on keyboard-accessible elements',\n      tags: ['custom', 'cat.keyboard', 'wcag21a', 'wcag211'],\n    },\n    {\n      id: 'mouse-only-event-handlers',\n      description: 'Ensures mouse event handlers have keyboard equivalents',\n      tags: ['custom', 'cat.keyboard', 'wcag21a', 'wcag211'],\n    },\n    {\n      id: 'static-element-interaction',\n      description:\n        'Ensures elements with interactive roles are properly keyboard accessible',\n      tags: ['custom', 'cat.keyboard', 'cat.aria', 'wcag21a', 'wcag211'],\n    },\n  ]\n}\n"],"mappings":";;;;;;;;;;;;;AAoBA,IAAM,uBAAuB,IAAI,IAAI;CACnC;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,CAAC;;;;AAKF,IAAM,wBAAwB,IAAI,IAAI,CAAC,KAAK,OAAO,CAAC;;;;AAKpD,IAAM,oBAAoB,IAAI,IAAI;CAChC;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,CAAC;;;;AAKF,IAAM,oBAAoB;CACxB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;;;;AAKD,IAAM,kBAAkB;CAAC;CAAa;CAAW;CAAa;;;;AAK9D,IAAM,qBAAqB;CACzB;CACA;CACA;CACA;CACD;;;;;;AAOD,IAAM,qBAAqB,IAAI,IAAI;CACjC;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,CAAC;;;;;;AAOF,SAAS,gBAAgB,SAA2B;AAElD,KAAI,QAAQ,MAAM,mBAAmB,IAAI,QAAQ,GAAG,CAClD,QAAO;AAIT,KAAI,QAAQ,kBAAkB,SAAS,MAAM;EAG3C,MAAM,UAAU,QAAQ,QAAQ,aAAa;AAC7C,MAAI,YAAY,SAAS,YAAY,UAAU,YAAY,WAAW;GAGpE,MAAM,OAAO,OAAO,KAAK,QAAQ;AACjC,QAAK,MAAM,OAAO,KAChB,KAAI,IAAI,WAAW,gBAAgB,EAAE;IACnC,MAAM,QAAS,QAA+C;AAC9D,QAAI,SAAS,OAAO,UAAU,UAAU;KACtC,MAAM,WAAW;AAEjB,SAAI,cAAc,YAAY,EAAE,aAAa,UAC3C,QAAO;;;;;AAQnB,QAAO;;;;;AAMT,SAAS,iBAAiB,SAA2B;AACnD,MAAK,MAAM,YAAY,mBACrB,KAAI,QAAQ,QAAQ,SAAS,CAC3B,QAAO;AAGX,QAAO;;;;;AAMT,SAAS,qBAAqB,SAA2B;CACvD,MAAM,UAAU,QAAQ,QAAQ,aAAa;AAG7C,KAAI,qBAAqB,IAAI,QAAQ,CAEnC,QAAO,CAAC,QAAQ,aAAa,WAAW;AAI1C,QAAO,sBAAsB,IAAI,QAAQ,IAAI,QAAQ,aAAa,OAAO;;;;;AAM3E,SAAS,mBAAmB,SAA2B;CACrD,MAAM,OAAO,QAAQ,aAAa,OAAO;AACzC,QAAO,SAAS,QAAQ,kBAAkB,IAAI,KAAK;;;;;AAMrD,SAAS,YAAY,SAA2B;CAC9C,MAAM,WAAW,QAAQ,aAAa,WAAW;AACjD,KAAI,aAAa,KACf,QAAO;CAET,MAAM,gBAAgB,SAAS,UAAU,GAAG;AAC5C,QAAO,CAAC,MAAM,cAAc,IAAI,iBAAiB;;;;;AAMnD,SAAS,gBAAgB,SAA2B;AAElD,KAAI,QAAQ,aAAa,UAAU,CACjC,QAAO;AAQT,KAAI,OAHgB,QAGG,YAAY,WACjC,QAAO;CAKT,MAAM,OAAO,OAAO,KAAK,QAAQ;AACjC,MAAK,MAAM,OAAO,KAChB,KACE,IAAI,WAAW,gBAAgB,IAC/B,IAAI,WAAW,gBAAgB,IAC/B,IAAI,WAAW,wBAAwB,EACvC;EAGA,MAAM,QAAS,QAA+C;AAC9D,MAAI,SAAS,OAAO,UAAU,UAAU;GACtC,MAAM,WAAW;AACjB,OACE,OAAO,SAAS,YAAY,cAC5B,OAAO,SAAS,gBAAgB,cAChC,OAAO,SAAS,cAAc,WAE9B,QAAO;;;AAMf,QAAO;;;;;AAMT,SAAS,mBAAmB,SAA2B;AAErD,MAAK,MAAM,SAAS,gBAClB,KAAI,QAAQ,aAAa,MAAM,CAC7B,QAAO;CAIX,MAAM,cAAc;AACpB,KACE,OAAO,YAAY,cAAc,cACjC,OAAO,YAAY,YAAY,cAC/B,OAAO,YAAY,eAAe,WAElC,QAAO;CAIT,MAAM,OAAO,OAAO,KAAK,QAAQ;AACjC,MAAK,MAAM,OAAO,KAChB,KAAI,IAAI,WAAW,gBAAgB,EAAE;EACnC,MAAM,QAAS,QAA+C;AAC9D,MAAI,SAAS,OAAO,UAAU,UAAU;GACtC,MAAM,WAAW;AACjB,OACE,OAAO,SAAS,cAAc,cAC9B,OAAO,SAAS,YAAY,cAC5B,OAAO,SAAS,eAAe,WAE/B,QAAO;;;AAMf,QAAO;;;;;AAMT,IAAM,0BAA0B,CAAC,YAAY;;;;AAK7C,SAAS,cAAc,WAAwC;AAC7D,QAAO,MAAM,KAAK,UAAU,CAAC,QAC1B,QAAQ,CAAC,wBAAwB,MAAM,WAAW,IAAI,WAAW,OAAO,CAAC,CAC3E;;;;;AAMH,SAAS,YAAY,SAA0B;AAE7C,KAAI,QAAQ,GACV,QAAO,IAAI,QAAQ;CAGrB,MAAM,UAAU,QAAQ,QAAQ,aAAa;CAE7C,MAAM,UAAU,cAAc,QAAQ,UAAU,CAAC,KAAK,IAAI;CAC1D,MAAM,gBAAgB,UAAU,IAAI,YAAY;CAGhD,MAAM,SAAS,QAAQ;AACvB,KAAI,UAAU,WAAW,SAAS,MAAM;EACtC,MAAM,iBAAiB,YAAY,OAAO;EAC1C,MAAM,WAAW,MAAM,KAAK,OAAO,SAAS,CAAC,QAC1C,OAAO,GAAG,YAAY,QAAQ,QAChC;AACD,MAAI,SAAS,SAAS,EAEpB,QAAO,GAAG,eAAe,KAAK,UAAU,cAAc,eADxC,SAAS,QAAQ,QAAQ,GAAG,EACiC;AAE7E,SAAO,GAAG,eAAe,KAAK,UAAU;;AAG1C,QAAO,GAAG,UAAU;;;;;;;;;;AAWtB,SAAS,kCACP,UAA8B,UAC9B,YAA+B,WACb;CAClB,MAAM,SAA2B,EAAE;CACnC,MAAM,YAAY,KAAK,KAAK;CAG5B,MAAM,cAAc,QAAQ,iBAAiB,IAAI;AAEjD,MAAK,MAAM,WAAW,aAAa;AAEjC,MAAI,iBAAiB,QAAQ,CAC3B;AAKF,MAAI,gBAAgB,QAAQ,CAC1B;AAIF,MAAI,qBAAqB,QAAQ,IAAI,mBAAmB,QAAQ,CAC9D;AAIF,MAAI,CAAC,gBAAgB,QAAQ,CAC3B;EAKF,MAAM,WAAW,YAAY,QAAQ;EACrC,MAAM,cAAc,mBAAmB,QAAQ;AAE/C,MAAI,CAAC,YAAY,CAAC,aAAa;GAE7B,MAAM,WAAW,YAAY,QAAQ;AACrC,UAAO,KAAK;IACV,IAAI,6BAA6B,UAAU,GAAG,OAAO;IACrD,QAAQ;IACR,QAAQ;IACR,SACE;IACF,MAAM;IACN,SACE;IACF,UAAU,CAAC,WAAW,UAAU;IAChC,OAAO,CACL;KACE;KACA,MAAM,QAAQ,UAAU,MAAM,GAAG,IAAI;KACtC,CACF;IACD,gBAAgB,eAAe,WAAW,UAAU;IACpD;IACD,CAAC;aACO,YAAY,CAAC,aAAa;GAEnC,MAAM,WAAW,YAAY,QAAQ;AACrC,UAAO,KAAK;IACV,IAAI,qCAAqC,UAAU,GAAG,OAAO;IAC7D,QAAQ;IACR,QAAQ;IACR,SACE;IACF,MAAM;IACN,SACE;IACF,UAAU,CAAC,WAAW,UAAU;IAChC,OAAO,CACL;KACE;KACA,MAAM,QAAQ,UAAU,MAAM,GAAG,IAAI;KACtC,CACF;IACD,gBAAgB,eAAe,YAAY,UAAU;IACrD;IACD,CAAC;;;AAIN,QAAO;;;;;;;;AAST,SAAS,qBACP,UAA8B,UAC9B,YAA+B,WACb;CAClB,MAAM,SAA2B,EAAE;CACnC,MAAM,YAAY,KAAK,KAAK;CAK5B,MAAM,sBAAsB,kBAAkB,KAC3C,UAAU,IAAI,MAAM,GACtB,CAAC,KAAK,KAAK;CAEZ,MAAM,WAAW,QAAQ,iBAAiB,oBAAoB;AAE9D,MAAK,MAAM,WAAW,UAAU;AAE9B,MAAI,iBAAiB,QAAQ,CAC3B;AAIF,MAAI,qBAAqB,QAAQ,CAC/B;AAIF,MAAI,mBAAmB,QAAQ,IAAI,YAAY,QAAQ,CACrD;EAGF,MAAM,cAA6B,EAAE;AACrC,OAAK,MAAM,SAAS,kBAClB,KAAI,QAAQ,aAAa,MAAM,CAC7B,aAAY,KAAK,MAAM;EAI3B,MAAM,WAAW,YAAY,QAAQ;AACrC,SAAO,KAAK;GACV,IAAI,qBAAqB,UAAU,GAAG,OAAO;GAC7C,QAAQ;GACR,QAAQ;GACR,SAAS,0CAA0C,YAAY,KAAK,KAAK,CAAC;GAC1E,MAAM;GACN,SAAS;GACT,UAAU,CAAC,WAAW,UAAU;GAChC,OAAO,CACL;IACE;IACA,MAAM,QAAQ,UAAU,MAAM,GAAG,IAAI;IACtC,CACF;GACD,gBAAgB,eAAe,WAAW,UAAU;GACpD;GACD,CAAC;;AAGJ,QAAO;;;;;;;;AAST,SAAS,8BACP,UAA8B,UAC9B,YAA+B,WACb;CAClB,MAAM,SAA2B,EAAE;CACnC,MAAM,YAAY,KAAK,KAAK;CAG5B,MAAM,gBAAgB,MAAM,KAAK,kBAAkB,CAChD,KAAK,SAAS,UAAU,KAAK,IAAI,CACjC,KAAK,KAAK;CAEb,MAAM,WAAW,QAAQ,iBAAiB,cAAc;AAExD,MAAK,MAAM,WAAW,UAAU;AAE9B,MAAI,iBAAiB,QAAQ,CAC3B;AAIF,MAAI,qBAAqB,QAAQ,CAC/B;EAGF,MAAM,OAAO,QAAQ,aAAa,OAAO;EACzC,MAAM,WAAW,YAAY,QAAQ;EACrC,MAAM,cAAc,mBAAmB,QAAQ;AAG/C,MAAI,CAAC,UAAU;GACb,MAAM,WAAW,YAAY,QAAQ;AACrC,UAAO,KAAK;IACV,IAAI,8BAA8B,UAAU,GAAG,OAAO;IACtD,QAAQ;IACR,QAAQ;IACR,SAAS,sBAAsB,KAAK;IACpC,MAAM;IACN,SACE;IACF,UAAU;KAAC;KAAW;KAAW;KAAU;IAC3C,OAAO,CACL;KACE;KACA,MAAM,QAAQ,UAAU,MAAM,GAAG,IAAI;KACtC,CACF;IACD,gBAAgB,eAAe,WAAW,UAAU;IACpD;IACD,CAAC;;AAKJ,MACE,QAFiC;GAAC;GAAU;GAAQ;GAAY;GAAS,CAG9C,SAAS,KAAK,IACzC,CAAC,eACD,gBAAgB,QAAQ,EACxB;GACA,MAAM,WAAW,YAAY,QAAQ;AACrC,UAAO,KAAK;IACV,IAAI,8BAA8B,UAAU,GAAG,OAAO;IACtD,QAAQ;IACR,QAAQ;IACR,SAAS,sBAAsB,KAAK;IACpC,MAAM;IACN,SACE;IACF,UAAU,CAAC,WAAW,UAAU;IAChC,OAAO,CACL;KACE;KACA,MAAM,QAAQ,UAAU,MAAM,GAAG,IAAI;KACtC,CACF;IACD,gBAAgB,eAAe,YAAY,UAAU;IACrD;IACD,CAAC;;;AAIN,QAAO;;;;;AAMT,SAAgB,eACd,UAA8B,UAC9B,SAA4B,EAAE,EAC9B,YAA+B,WACb;CAClB,MAAM,EACJ,+BAA+B,MAC/B,yBAAyB,MACzB,2BAA2B,SACzB;CAEJ,MAAM,SAA2B,EAAE;AAEnC,KAAI,6BACF,QAAO,KAAK,GAAG,kCAAkC,SAAS,UAAU,CAAC;AAGvE,KAAI,uBACF,QAAO,KAAK,GAAG,qBAAqB,SAAS,UAAU,CAAC;AAG1D,KAAI,yBACF,QAAO,KAAK,GAAG,8BAA8B,SAAS,UAAU,CAAC;AAGnE,QAAO;;;;;AAMT,SAAgB,iBAIb;AACD,QAAO;EACL;GACE,IAAI;GACJ,aACE;GACF,MAAM;IAAC;IAAU;IAAgB;IAAW;IAAU;GACvD;EACD;GACE,IAAI;GACJ,aAAa;GACb,MAAM;IAAC;IAAU;IAAgB;IAAW;IAAU;GACvD;EACD;GACE,IAAI;GACJ,aACE;GACF,MAAM;IAAC;IAAU;IAAgB;IAAY;IAAW;IAAU;GACnE;EACF"}

package/dist/esm/core/utils/export-audit.uitls.d.ts

@@ -0,0 +1,17 @@
+import { A11yAuditResult, ExportOptions } from '../types/types.js';
+/**
+ * Export audit results to JSON format
+ */
+export declare function exportToJson(result: A11yAuditResult, _options?: Partial<ExportOptions>): string;
+/**
+ * Export audit results to CSV format
+ */
+export declare function exportToCsv(result: A11yAuditResult, _options?: Partial<ExportOptions>): string;
+/**
+ * Export audit results and trigger download
+ */
+export declare function exportAuditResults(result: A11yAuditResult, options: ExportOptions): void;
+/**
+ * Generate a summary report as a formatted string
+ */
+export declare function generateSummaryReport(result: A11yAuditResult): string;

package/dist/esm/core/utils/export-audit.uitls.js

@@ -0,0 +1,83 @@
+//#region src/core/utils/export-audit.uitls.ts
+/**
+* Export audit results to JSON format
+*/
+function exportToJson(result, _options = {}) {
+	const exportData = {
+		meta: {
+			exportedAt: (/* @__PURE__ */ new Date()).toISOString(),
+			url: result.url,
+			auditTimestamp: result.timestamp,
+			duration: result.duration,
+			context: result.context
+		},
+		summary: result.summary,
+		issues: result.issues.map((issue) => ({
+			id: issue.id,
+			ruleId: issue.ruleId,
+			impact: issue.impact,
+			message: issue.message,
+			help: issue.help,
+			helpUrl: issue.helpUrl,
+			wcagTags: issue.wcagTags,
+			nodes: issue.nodes.map((node) => ({
+				selector: node.selector,
+				html: node.html,
+				failureSummary: node.failureSummary
+			}))
+		}))
+	};
+	return JSON.stringify(exportData, null, 2);
+}
+/**
+* Export audit results to CSV format
+*/
+function exportToCsv(result, _options = {}) {
+	const headers = [
+		"Rule ID",
+		"Impact",
+		"Message",
+		"Help URL",
+		"WCAG Tags",
+		"Selector",
+		"HTML"
+	];
+	const rows = [];
+	for (const issue of result.issues) for (const node of issue.nodes) rows.push([
+		issue.ruleId,
+		issue.impact,
+		issue.message.replace(/"/g, "\"\""),
+		issue.helpUrl,
+		issue.wcagTags.join("; "),
+		node.selector,
+		node.html.replace(/"/g, "\"\"")
+	]);
+	return [headers.map((h) => `"${h}"`).join(","), ...rows.map((row) => row.map((cell) => `"${cell}"`).join(","))].join("\n");
+}
+/**
+* Download a file with the given content
+*/
+function downloadFile(content, filename, mimeType) {
+	const blob = new Blob([content], { type: mimeType });
+	const url = URL.createObjectURL(blob);
+	const link = document.createElement("a");
+	link.href = url;
+	link.download = filename;
+	document.body.appendChild(link);
+	link.click();
+	document.body.removeChild(link);
+	URL.revokeObjectURL(url);
+}
+/**
+* Export audit results and trigger download
+*/
+function exportAuditResults(result, options) {
+	const { format, filename } = options;
+	const defaultFilename = `a11y-audit-${(/* @__PURE__ */ new Date()).toISOString().replace(/[:.]/g, "-")}`;
+	if (format === "json") downloadFile(exportToJson(result, options), `${filename || defaultFilename}.json`, "application/json");
+	else if (format === "csv") downloadFile(exportToCsv(result, options), `${filename || defaultFilename}.csv`, "text/csv");
+}
+//#endregion
+export { exportAuditResults };
+
+//# sourceMappingURL=export-audit.uitls.js.map

package/dist/esm/core/utils/export-audit.uitls.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"export-audit.uitls.js","names":[],"sources":["../../../../src/core/utils/export-audit.uitls.ts"],"sourcesContent":["import type { A11yAuditResult, ExportOptions } from '../types/types'\n\n/**\n * Export audit results to JSON format\n */\nexport function exportToJson(\n  result: A11yAuditResult,\n  _options: Partial<ExportOptions> = {},\n): string {\n  const exportData = {\n    meta: {\n      exportedAt: new Date().toISOString(),\n      url: result.url,\n      auditTimestamp: result.timestamp,\n      duration: result.duration,\n      context: result.context,\n    },\n    summary: result.summary,\n    issues: result.issues.map((issue) => ({\n      id: issue.id,\n      ruleId: issue.ruleId,\n      impact: issue.impact,\n      message: issue.message,\n      help: issue.help,\n      helpUrl: issue.helpUrl,\n      wcagTags: issue.wcagTags,\n      nodes: issue.nodes.map((node) => ({\n        selector: node.selector,\n        html: node.html,\n        failureSummary: node.failureSummary,\n      })),\n    })),\n  }\n\n  return JSON.stringify(exportData, null, 2)\n}\n\n/**\n * Export audit results to CSV format\n */\nexport function exportToCsv(\n  result: A11yAuditResult,\n  _options: Partial<ExportOptions> = {},\n): string {\n  const headers = [\n    'Rule ID',\n    'Impact',\n    'Message',\n    'Help URL',\n    'WCAG Tags',\n    'Selector',\n    'HTML',\n  ]\n\n  const rows: Array<Array<string>> = []\n\n  for (const issue of result.issues) {\n    for (const node of issue.nodes) {\n      rows.push([\n        issue.ruleId,\n        issue.impact,\n        issue.message.replace(/\"/g, '\"\"'),\n        issue.helpUrl,\n        issue.wcagTags.join('; '),\n        node.selector,\n        node.html.replace(/\"/g, '\"\"'),\n      ])\n    }\n  }\n\n  return [\n    headers.map((h) => `\"${h}\"`).join(','),\n    ...rows.map((row) => row.map((cell) => `\"${cell}\"`).join(',')),\n  ].join('\\n')\n}\n\n/**\n * Download a file with the given content\n */\nfunction downloadFile(\n  content: string,\n  filename: string,\n  mimeType: string,\n): void {\n  const blob = new Blob([content], { type: mimeType })\n  const url = URL.createObjectURL(blob)\n  const link = document.createElement('a')\n  link.href = url\n  link.download = filename\n  document.body.appendChild(link)\n  link.click()\n  document.body.removeChild(link)\n  URL.revokeObjectURL(url)\n}\n\n/**\n * Export audit results and trigger download\n */\nexport function exportAuditResults(\n  result: A11yAuditResult,\n  options: ExportOptions,\n): void {\n  const { format, filename } = options\n  const timestamp = new Date().toISOString().replace(/[:.]/g, '-')\n  const defaultFilename = `a11y-audit-${timestamp}`\n\n  if (format === 'json') {\n    const content = exportToJson(result, options)\n    downloadFile(\n      content,\n      `${filename || defaultFilename}.json`,\n      'application/json',\n    )\n    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n  } else if (format === 'csv') {\n    const content = exportToCsv(result, options)\n    downloadFile(content, `${filename || defaultFilename}.csv`, 'text/csv')\n  }\n}\n\n/**\n * Generate a summary report as a formatted string\n */\nexport function generateSummaryReport(result: A11yAuditResult): string {\n  const { summary } = result\n\n  const lines = [\n    '='.repeat(50),\n    'ACCESSIBILITY AUDIT REPORT',\n    '='.repeat(50),\n    '',\n    `URL: ${result.url}`,\n    `Date: ${new Date(result.timestamp).toLocaleString()}`,\n    `Duration: ${result.duration.toFixed(2)}ms`,\n    '',\n    '-'.repeat(50),\n    'SUMMARY',\n    '-'.repeat(50),\n    '',\n    `Total Issues: ${summary.total}`,\n    `  - Critical: ${summary.critical}`,\n    `  - Serious: ${summary.serious}`,\n    `  - Moderate: ${summary.moderate}`,\n    `  - Minor: ${summary.minor}`,\n    '',\n    `Passing Rules: ${summary.passes}`,\n    `Incomplete Checks: ${summary.incomplete}`,\n    '',\n  ]\n\n  if (result.issues.length > 0) {\n    lines.push('-'.repeat(50))\n    lines.push('ISSUES')\n    lines.push('-'.repeat(50))\n    lines.push('')\n\n    const issuesByImpact = {\n      critical: result.issues.filter((i) => i.impact === 'critical'),\n      serious: result.issues.filter((i) => i.impact === 'serious'),\n      moderate: result.issues.filter((i) => i.impact === 'moderate'),\n      minor: result.issues.filter((i) => i.impact === 'minor'),\n    }\n\n    for (const [impact, issues] of Object.entries(issuesByImpact)) {\n      if (issues.length > 0) {\n        lines.push(`[${impact.toUpperCase()}]`)\n        for (const issue of issues) {\n          lines.push(`  - ${issue.ruleId}: ${issue.message}`)\n          lines.push(`    Selector: ${issue.nodes[0]?.selector}`)\n          lines.push(`    Learn more: ${issue.helpUrl}`)\n          lines.push('')\n        }\n      }\n    }\n  }\n\n  lines.push('='.repeat(50))\n\n  return lines.join('\\n')\n}\n"],"mappings":";;;;AAKA,SAAgB,aACd,QACA,WAAmC,EAAE,EAC7B;CACR,MAAM,aAAa;EACjB,MAAM;GACJ,6BAAY,IAAI,MAAM,EAAC,aAAa;GACpC,KAAK,OAAO;GACZ,gBAAgB,OAAO;GACvB,UAAU,OAAO;GACjB,SAAS,OAAO;GACjB;EACD,SAAS,OAAO;EAChB,QAAQ,OAAO,OAAO,KAAK,WAAW;GACpC,IAAI,MAAM;GACV,QAAQ,MAAM;GACd,QAAQ,MAAM;GACd,SAAS,MAAM;GACf,MAAM,MAAM;GACZ,SAAS,MAAM;GACf,UAAU,MAAM;GAChB,OAAO,MAAM,MAAM,KAAK,UAAU;IAChC,UAAU,KAAK;IACf,MAAM,KAAK;IACX,gBAAgB,KAAK;IACtB,EAAE;GACJ,EAAE;EACJ;AAED,QAAO,KAAK,UAAU,YAAY,MAAM,EAAE;;;;;AAM5C,SAAgB,YACd,QACA,WAAmC,EAAE,EAC7B;CACR,MAAM,UAAU;EACd;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CAED,MAAM,OAA6B,EAAE;AAErC,MAAK,MAAM,SAAS,OAAO,OACzB,MAAK,MAAM,QAAQ,MAAM,MACvB,MAAK,KAAK;EACR,MAAM;EACN,MAAM;EACN,MAAM,QAAQ,QAAQ,MAAM,OAAK;EACjC,MAAM;EACN,MAAM,SAAS,KAAK,KAAK;EACzB,KAAK;EACL,KAAK,KAAK,QAAQ,MAAM,OAAK;EAC9B,CAAC;AAIN,QAAO,CACL,QAAQ,KAAK,MAAM,IAAI,EAAE,GAAG,CAAC,KAAK,IAAI,EACtC,GAAG,KAAK,KAAK,QAAQ,IAAI,KAAK,SAAS,IAAI,KAAK,GAAG,CAAC,KAAK,IAAI,CAAC,CAC/D,CAAC,KAAK,KAAK;;;;;AAMd,SAAS,aACP,SACA,UACA,UACM;CACN,MAAM,OAAO,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAE,MAAM,UAAU,CAAC;CACpD,MAAM,MAAM,IAAI,gBAAgB,KAAK;CACrC,MAAM,OAAO,SAAS,cAAc,IAAI;AACxC,MAAK,OAAO;AACZ,MAAK,WAAW;AAChB,UAAS,KAAK,YAAY,KAAK;AAC/B,MAAK,OAAO;AACZ,UAAS,KAAK,YAAY,KAAK;AAC/B,KAAI,gBAAgB,IAAI;;;;;AAM1B,SAAgB,mBACd,QACA,SACM;CACN,MAAM,EAAE,QAAQ,aAAa;CAE7B,MAAM,kBAAkB,+BADN,IAAI,MAAM,EAAC,aAAa,CAAC,QAAQ,SAAS,IAAI;AAGhE,KAAI,WAAW,OAEb,cADgB,aAAa,QAAQ,QAAQ,EAG3C,GAAG,YAAY,gBAAgB,QAC/B,mBACD;UAEQ,WAAW,MAEpB,cADgB,YAAY,QAAQ,QAAQ,EACtB,GAAG,YAAY,gBAAgB,OAAO,WAAW"}

package/dist/esm/core/utils/ui.utils.d.ts

@@ -0,0 +1,24 @@
+import { A11yIssue, RuleSetPreset, SeverityThreshold } from '../types/types.js';
+export declare function scrollToElement(selector: string): boolean;
+/**
+ * Severity levels mapped to numeric values for comparison (higher = more severe)
+ */
+export declare const SEVERITY_ORDER: Record<SeverityThreshold, number>;
+export declare const SEVERITY_LABELS: Record<SeverityThreshold, string>;
+export declare const RULE_SET_LABELS: Record<RuleSetPreset, string>;
+/**
+ * Highlight a single element with the specified severity
+ */
+export declare function highlightElement(selector: string, impact?: SeverityThreshold, options?: {
+    showTooltip?: boolean;
+    ruleId?: string;
+}): void;
+/**
+ * Highlight all elements with issues.
+ * Shows all issues per element in the tooltip, using the most severe for highlighting.
+ */
+export declare function highlightAllIssues(issues: Array<A11yIssue>): void;
+/**
+ * Clear all highlights from the page
+ */
+export declare function clearHighlights(): void;