From b42e517fdd33f87668bfb8dd84e9d5221273b8f5 Mon Sep 17 00:00:00 2001
From: Augustin <48162609+AugustinSorel@users.noreply.github.com>
Date: Wed, 19 Jun 2024 12:51:54 +0100
Subject: [PATCH] FEAT/adding types for the role attribute instead of string
 (#237)

Signed-off-by: Arthur Fiorette <47537704+arthurfiorette@users.noreply.github.com>
Co-authored-by: Arthur Fiorette <47537704+arthurfiorette@users.noreply.github.com>
---
 .changeset/slimy-ducks-run.md |  5 +++
 packages/html/jsx.d.ts        | 75 ++++++++++++++++++++++++++++++++++-
 2 files changed, 79 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/slimy-ducks-run.md

diff --git a/.changeset/slimy-ducks-run.md b/.changeset/slimy-ducks-run.md
new file mode 100644
index 000000000..ea4fab929
--- /dev/null
+++ b/.changeset/slimy-ducks-run.md
@@ -0,0 +1,5 @@
+---
+'@kitajs/html': minor
+---
+
+Added `role` attribute types
diff --git a/packages/html/jsx.d.ts b/packages/html/jsx.d.ts
index 821599e4a..882d4bb56 100644
--- a/packages/html/jsx.d.ts
+++ b/packages/html/jsx.d.ts
@@ -46,7 +46,7 @@ declare namespace JSX {
     hidden?: undefined | string | boolean;
     id?: undefined | number | string;
     popover?: undefined | boolean | 'auto' | 'manual';
-    role?: undefined | string;
+    role?: undefined | AriaRole;
     lang?: undefined | string;
     draggable?: undefined | string | boolean;
     spellcheck?: undefined | string | boolean;
@@ -852,3 +852,76 @@ declare namespace JSX {
     wbr: HtmlTag;
   }
 }
+
+// All the WAI-ARIA 1.1 role attribute values from https://www.w3.org/TR/wai-aria-1.1/#role_definitions
+type AriaRole =
+  | "alert"
+  | "alertdialog"
+  | "application"
+  | "article"
+  | "banner"
+  | "button"
+  | "cell"
+  | "checkbox"
+  | "columnheader"
+  | "combobox"
+  | "complementary"
+  | "contentinfo"
+  | "definition"
+  | "dialog"
+  | "directory"
+  | "document"
+  | "feed"
+  | "figure"
+  | "form"
+  | "grid"
+  | "gridcell"
+  | "group"
+  | "heading"
+  | "img"
+  | "link"
+  | "list"
+  | "listbox"
+  | "listitem"
+  | "log"
+  | "main"
+  | "marquee"
+  | "math"
+  | "menu"
+  | "menubar"
+  | "menuitem"
+  | "menuitemcheckbox"
+  | "menuitemradio"
+  | "navigation"
+  | "none"
+  | "note"
+  | "option"
+  | "presentation"
+  | "progressbar"
+  | "radio"
+  | "radiogroup"
+  | "region"
+  | "row"
+  | "rowgroup"
+  | "rowheader"
+  | "scrollbar"
+  | "search"
+  | "searchbox"
+  | "separator"
+  | "slider"
+  | "spinbutton"
+  | "status"
+  | "switch"
+  | "tab"
+  | "table"
+  | "tablist"
+  | "tabpanel"
+  | "term"
+  | "textbox"
+  | "timer"
+  | "toolbar"
+  | "tooltip"
+  | "tree"
+  | "treegrid"
+  | "treeitem"
+  | (string & {});