fix: remove role presentation from li, update readme

The specification of the presentation role on the `li` tags creates
a linting error within the new template linting in ember. The role
seems to have no functional impact on screenreaders, so it is
removed.

The example in the readme was updated to agree with the examples in
the dummy application.

README.md

@@ -26,18 +26,16 @@ $ ember install ivy-tabs
 
 ```handlebars
 {{#ivy-tabs selection=selection as |tabs|}}
-  {{#tabs.tablist as |tablist|}}
-    <ul role="presentation">
-      <li role="presentation">
-        {{#tablist.tab "TabA" on-select=(action (mut selection))}}Foo{{/tablist.tab}}
-      </li>
-      <li role="presentation">
-        {{#tablist.tab "TabB" on-select=(action (mut selection))}}Bar{{/tablist.tab}}
-      </li>
-      <li role="presentation">
-        {{#tablist.tab "TabC" on-select=(action (mut selection))}}Baz{{/tablist.tab}}
-      </li>
-    </ul>
+  {{#tabs.tablist tagName="ul" as |tablist|}}
+    <li>
+      {{#tablist.tab "TabA" on-select=(action (mut selection))}}Foo{{/tablist.tab}}
+    </li>
+    <li>
+      {{#tablist.tab "TabB" on-select=(action (mut selection))}}Bar{{/tablist.tab}}
+    </li>
+    <li>
+      {{#tablist.tab "TabC" on-select=(action (mut selection))}}Baz{{/tablist.tab}}
+    </li>
   {{/tabs.tablist}}
 
   {{#tabs.tabpanel "TabA"}}

tests/dummy/app/templates/dynamic-tabs.hbs

@@ -6,7 +6,7 @@
   {{#ivy-tabs selection=selection as |tabs|}}
     {{#tabs.tablist aria-label="Example Tabs" class="nav nav-tabs" id="dynamic-tablist" tagName="ul" as |tablist|}}
       {{#each model as |item|}}
-        <li class="nav-item {{if (eq selection item.index) "active"}}" role="presentation">
+        <li class="nav-item {{if (eq selection item.index) "active"}}">
           {{#tablist.tab item.index class="nav-link" on-select=(action (mut selection))}}
             <button aria-label="Close" class="close" type="button" {{action "removeItem" item}}>
               <span aria-hidden="true">&times;</span>

tests/dummy/app/templates/index.hbs

@@ -5,13 +5,13 @@
 <div class="example">
   {{#ivy-tabs selection=selection as |tabs|}}
     {{#tabs.tablist aria-label="Example Tabs" class="nav nav-tabs" id="basic-tablist" tagName="ul" as |tablist|}}
-      <li class="nav-item {{if (eq selection "A") "active"}}" role="presentation">
+      <li class="nav-item {{if (eq selection "A") "active"}}">
         {{#tablist.tab "A" class="nav-link" id="basic-tab-a" on-select=(action (mut selection))}}Tab A{{/tablist.tab}}
       </li>
-      <li class="nav-item {{if (eq selection "B") "active"}}" role="presentation">
+      <li class="nav-item {{if (eq selection "B") "active"}}">
         {{#tablist.tab "B" class="nav-link" id="basic-tab-b" on-select=(action (mut selection))}}Tab B{{/tablist.tab}}
       </li>
-      <li class="nav-item {{if (eq selection "C") "active"}}" role="presentation">
+      <li class="nav-item {{if (eq selection "C") "active"}}">
         {{#tablist.tab "C" class="nav-link" id="basic-tab-c" on-select=(action (mut selection))}}Tab C{{/tablist.tab}}
       </li>
     {{/tabs.tablist}}

tests/dummy/app/templates/query-params.hbs

@@ -5,13 +5,13 @@
 <div class="example">
   {{#ivy-tabs selection=selection as |tabs|}}
     {{#tabs.tablist aria-label="Example Tabs" class="nav nav-tabs" tagName="ul" as |tablist|}}
-      <li class="nav-item {{if (eq selection "A") "active"}}" role="presentation">
+      <li class="nav-item {{if (eq selection "A") "active"}}">
         {{#tablist.tab "A" class="nav-link" id="query-params-tab-a" on-select=(action (mut selection))}}Tab A{{/tablist.tab}}
       </li>
-      <li class="nav-item {{if (eq selection "B") "active"}}" role="presentation">
+      <li class="nav-item {{if (eq selection "B") "active"}}">
         {{#tablist.tab "B" class="nav-link" id="query-params-tab-b" on-select=(action (mut selection))}}Tab B{{/tablist.tab}}
       </li>
-      <li class="nav-item {{if (eq selection "C") "active"}}" role="presentation">
+      <li class="nav-item {{if (eq selection "C") "active"}}">
         {{#tablist.tab "C" class="nav-link" id="query-params-tab-c" on-select=(action (mut selection))}}Tab C{{/tablist.tab}}
       </li>
     {{/tabs.tablist}}