update docs for a11y-no-noninteractive-tabindex and rename from a11y-no-nointeractive-tabindex -> a11y-no-noninteractive-tabindex

site/content/docs/05-accessibility-warnings.md

@@ -250,6 +250,17 @@ Some HTML elements have default ARIA roles. Giving these elements an ARIA role t
 
 ---
 
+### `a11y-no-noninteractive-tabindex`
+
+Tab key navigation should be limited to elements on the page that can be interacted with.
+
+```sv
+<!-- A11y: not interactive element cannot have positive tabIndex value -->
+<div tabindex='0' />
+```
+
+---
+
 ### `a11y-positive-tabindex`
 
 Avoid positive `tabindex` property values. This will move elements out of the expected tab order, creating a confusing experience for keyboard users.

src/compiler/compile/compiler_warnings.ts

@@ -179,8 +179,8 @@ export default {
 		code: 'a11y-missing-content',
 		message: `A11y: <${name}> element should have child content`
 	}),
-	a11y_no_nointeractive_tabindex: {
+	a11y_no_noninteractive_tabindex: {
-		code: 'a11y-no-nointeractive-tabindex',
+		code: 'a11y-no-noninteractive-tabindex',
 		message: 'A11y: not interactive element cannot have positive tabIndex value'
 	},
 	redundant_event_modifier_for_touch: {

src/compiler/compile/nodes/Element.ts

@@ -550,11 +550,11 @@ export default class Element extends Node {
 			}
 		});
 
-		// no-nointeractive-tabindex
+		// no-noninteractive-tabindex
 		if (!is_interactive_element(this.name, attribute_map) && !is_interactive_roles(attribute_map.get('role')?.get_static_value() as ARIARoleDefintionKey)) {
 			const tab_index = attribute_map.get('tabindex');
 			if (tab_index && (!tab_index.is_static || Number(tab_index.get_static_value()) >= 0)) {
-				component.warn(this, compiler_warnings.a11y_no_nointeractive_tabindex);
+				component.warn(this, compiler_warnings.a11y_no_noninteractive_tabindex);
 			}
 		}
 	}

test/validator/samples/a11y-no-nointeractive-tabindex/warnings.json

@@ -1,6 +1,6 @@
 [
 	{
-		"code": "a11y-no-nointeractive-tabindex",
+		"code": "a11y-no-noninteractive-tabindex",
 		"end": {
 			"character": 241,
 			"column": 20,
@@ -15,7 +15,7 @@
 		}
 	},
 	{
-		"code": "a11y-no-nointeractive-tabindex",
+		"code": "a11y-no-noninteractive-tabindex",
 		"end": {
 			"character": 277,
 			"column": 35,
@@ -30,7 +30,7 @@
 		}
 	},
 	{
-		"code": "a11y-no-nointeractive-tabindex",
+		"code": "a11y-no-noninteractive-tabindex",
 		"end": {
 			"character": 302,
 			"column": 24,
@@ -45,7 +45,7 @@
 		}
 	},
 	{
-		"code": "a11y-no-nointeractive-tabindex",
+		"code": "a11y-no-noninteractive-tabindex",
 		"end": {
 			"character": 329,
 			"column": 26,