This is a work in progress

This is a proposal and discussion for improving the accessibility within the tallstackui components, this issue serves as a reference so we can track the progress and discuss the implementations for contributors to help with.

WAI-ARIA
From Mozilla
"sometimes making complex UI controls that involve unsemantic HTML and dynamic JavaScript-updated content can be difficult. WAI-ARIA is a technology that can help with such problems by adding in further semantics that browsers and assistive technologies can recognize and use to let users know what is going on"

I propose we review each component and make sure the html is semantic where possible and add any relevant Roles, Properties and States where we fall into the above quote "unsemantic HTML and dynamic JavaScript-updated content"

(Edit this section with a list of components with review with a - [ ] next to each one)

Keyboard Support
Components that require navigating should support the use of Tab, and Arrow keys, this will allow components to work with things like specialty joy stick, keyboards and other types of interfaces used by people with disabilities.

(Edit this section with a list of components with review with a - [ ] next to each one)

Implementations

• For adding support for Tab and Arrow keys should we use alpineJS inline in the blade files or put the logic in the associated JavaScript file of that component?
• The logic for some of the aria-* states/props (eg when something changes from true or false etc) should that logic be added with alpineJS inline in the blade file or in the associated JavaScript file of that component?
• How far should we go with the support of these states and props until we pass some sort of automated check?
• Should we include these accessibility changes in the automated testing for the components?

Note: I will edit and finish this later I just lost power and my UPS Battery is in a poor state so I have very little time before my computer loses power