Merge remote-tracking branch 'origin/main' into kbd-tags

w3c · Sep 12, 2024 · 3c32345 · 3c32345
2 parents 719388e + f877113
commit 3c32345
Show file tree

Hide file tree

Showing 17 changed files with 1,775 additions and 1,398 deletions.
diff --git a/.stylelintignore b/.stylelintignore
diff --git a/.stylelintrc b/.stylelintrc
diff --git a/.stylelintrc.mjs b/.stylelintrc.mjs
@@ -0,0 +1,21 @@
+/** @type {import('stylelint').Config} */
+export default {
+  extends: ['stylelint-config-standard'],
+  reportNeedlessDisables: true,
+  reportInvalidScopeDisables: true,
+  reportDescriptionlessDisables: true,
+  rules: {
+    'font-family-no-missing-generic-family-keyword': [
+      true,
+      {
+        ignoreFontFamilies: ['Font Awesome 5 Free'],
+      },
+    ],
+    'selector-class-pattern': null,
+    'selector-id-pattern': null,
+    // Fixable Stylelint 16 rules
+    'declaration-block-no-redundant-longhand-properties': null,
+    'media-feature-range-notation': null,
+  },
+  ignoreFiles: ['node_modules/', 'common/**/*.css', '**/bootstrap*.css'],
+};
diff --git a/.vnurc b/.vnurc
@@ -25,3 +25,5 @@ Bad value “none” for attribute “role” on element “svg”.
 Bad value “presentation” for attribute “role” on element “svg”.
 # https://github.com/validator/validator/issues/1122
 Element “input” is missing required attribute “aria-checked”.
+# https://github.com/w3c/aria-practices/issues/3070
+Attribute “aria-actions” not allowed on element “button” at this point.
diff --git a/content/about/coverage-and-quality/coverage-and-quality-report.html b/content/about/coverage-and-quality/coverage-and-quality-report.html
@@ -647,6 +647,7 @@ <h2 id="roles_with_more_than_one_label">Roles with More than One Guidance or Exa
 </td>
             <td><ul>
                 <li><a href="../../../content/patterns/carousel/examples/carousel-2-tablist.html">Auto-Rotating Image Carousel with Tabs for Slide Control</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
+                <li><a href="../../../content/patterns/tabs/examples/tabs-actions.html">Experimental  Tabs with Action Buttons</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-automatic.html">Tabs with Automatic Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-manual.html">Tabs with Manual Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
             </ul>
@@ -667,6 +668,7 @@ <h2 id="roles_with_more_than_one_label">Roles with More than One Guidance or Exa
             <td></td>
             <td><ul>
                 <li><a href="../../../content/patterns/carousel/examples/carousel-2-tablist.html">Auto-Rotating Image Carousel with Tabs for Slide Control</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
+                <li><a href="../../../content/patterns/tabs/examples/tabs-actions.html">Experimental  Tabs with Action Buttons</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-automatic.html">Tabs with Automatic Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-manual.html">Tabs with Manual Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
             </ul>
@@ -677,6 +679,7 @@ <h2 id="roles_with_more_than_one_label">Roles with More than One Guidance or Exa
             <td></td>
             <td><ul>
                 <li><a href="../../../content/patterns/carousel/examples/carousel-2-tablist.html">Auto-Rotating Image Carousel with Tabs for Slide Control</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
+                <li><a href="../../../content/patterns/tabs/examples/tabs-actions.html">Experimental  Tabs with Action Buttons</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-automatic.html">Tabs with Automatic Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-manual.html">Tabs with Manual Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
             </ul>
@@ -893,6 +896,7 @@ <h2 id="props_with_more_than_one_label">Properties and States with More than One
                 <li><a href="../../../content/patterns/menu-button/examples/menu-button-actions-active-descendant.html">Actions Menu Button  Using aria-activedescendant</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/menu-button/examples/menu-button-actions.html">Actions Menu Button  Using element.focus()</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/menu-button/examples/menu-button-links.html">Navigation Menu Button</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
+                <li><a href="../../../content/patterns/tabs/examples/tabs-actions.html">Experimental  Tabs with Action Buttons</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-automatic.html">Tabs with Automatic Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-manual.html">Tabs with Manual Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/toolbar/examples/toolbar.html">Toolbar</a></li>
@@ -1063,6 +1067,7 @@ <h2 id="props_with_more_than_one_label">Properties and States with More than One
                 <li><a href="../../../content/patterns/slider/examples/slider-temperature.html">Vertical Temperature Slider</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/spinbutton/examples/datepicker-spinbuttons.html">Date Picker Spin Button</a></li>
                 <li><a href="../../../content/patterns/switch/examples/switch-button.html">Switch  Using HTML Button</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
+                <li><a href="../../../content/patterns/tabs/examples/tabs-actions.html">Experimental  Tabs with Action Buttons</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-automatic.html">Tabs with Automatic Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-manual.html">Tabs with Manual Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/treeview/examples/treeview-1a.html">File Directory Treeview  Using Computed Properties</a></li>
@@ -1174,6 +1179,7 @@ <h2 id="props_with_more_than_one_label">Properties and States with More than One
                 <li><a href="../../../content/patterns/listbox/examples/listbox-grouped.html">Listbox  with Grouped Options</a></li>
                 <li><a href="../../../content/patterns/listbox/examples/listbox-rearrangeable.html">Listboxes with Rearrangeable Options</a></li>
                 <li><a href="../../../content/patterns/listbox/examples/listbox-scrollable.html">Scrollable Listbox</a></li>
+                <li><a href="../../../content/patterns/tabs/examples/tabs-actions.html">Experimental  Tabs with Action Buttons</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-automatic.html">Tabs with Automatic Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/tabs/examples/tabs-manual.html">Tabs with Manual Activation</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../../../content/patterns/treeview/examples/treeview-1a.html">File Directory Treeview  Using Computed Properties</a></li>
@@ -1272,23 +1278,23 @@ <h3 id="example_summary">Coding Summary</h3>
         <tbody>
           <tr>
             <th scope="row">Total Examples</th>
-            <td id="example_summary_total">60</td>
+            <td id="example_summary_total">61</td>
           </tr>
           <tr>
             <th scope="row">High Contrast Documentation</th>
-            <td id="example_summary_hc">31</td>
+            <td id="example_summary_hc">32</td>
           </tr>
           <tr>
             <th scope="row">Uses SVG</th>
-            <td id="example_summary_svg">34</td>
+            <td id="example_summary_svg">35</td>
           </tr>
           <tr>
             <th scope="row">Uses <code>forced-colors</code> media query</th>
             <td id="example_summary_force_colors">2</td>
           </tr>
           <tr>
             <th scope="row">Uses <code>currentColor</code> value</th>
-            <td id="example_summary_current_color">27</td>
+            <td id="example_summary_current_color">28</td>
           </tr>
 <!--
           <tr>
@@ -1306,15 +1312,15 @@ <h3 id="example_summary">Coding Summary</h3>
           </tr>
           <tr>
             <th scope="row">Use Class</th>
-            <td id="example_summary_class">36</td>
+            <td id="example_summary_class">37</td>
           </tr>
           <tr>
             <th scope="row">Use Prototype</th>
             <td id="example_summary_prototype">22</td>
           </tr>
           <tr>
             <th scope="row">Mouse Events</th>
-            <td id="example_summary_mouse">15</td>
+            <td id="example_summary_mouse">16</td>
           </tr>
           <tr>
             <th scope="row">Pointer Events</th>
@@ -2017,6 +2023,19 @@ <h3 id="example_coding_practices">Coding Practices</h3>
             <td>2</td>
             <td></td>
           </tr>
+          <tr>
+            <td><a href="../../../content/patterns/tabs/examples/tabs-actions.html">Experimental  Tabs with Action Buttons</a></td>
+            <td>class</td>
+            <td></td>
+            <td></td>
+            <td>Yes</td>
+            <td>ex1</td>
+            <td>5</td>
+            <td>3</td>
+            <td>7</td>
+            <td>3</td>
+            <td>menu,menuitem,aria-expanded,aria-haspopup,aria-hidden,aria-label</td>
+          </tr>
           <tr>
             <td><a href="../../../content/patterns/tabs/examples/tabs-automatic.html">Tabs with Automatic Activation</a></td>
             <td>class</td>
@@ -2440,6 +2459,14 @@ <h3 id="example_graphics_techniques">SVG and High Contrast Techniques</h3>
             <td></td>
             <td>Yes</td>
           </tr>
+          <tr>
+            <td><a href="../../../content/patterns/tabs/examples/tabs-actions.html">Experimental  Tabs with Action Buttons</a></td>
+            <td>Yes</td>
+            <td>Yes</td>
+            <td></td>
+            <td></td>
+            <td>Yes</td>
+          </tr>
           <tr>
             <td><a href="../../../content/patterns/toolbar/examples/toolbar.html">Toolbar</a></td>
             <td>Yes</td>
@@ -2586,6 +2613,11 @@ <h3 id="example_mouse_pointer">Mouse and Pointer Events</h3>
             <td></td>
             <td>Yes</td>
           </tr>
+          <tr>
+            <td><a href="../../../content/patterns/tabs/examples/tabs-actions.html">Experimental  Tabs with Action Buttons</a></td>
+            <td>Yes</td>
+            <td></td>
+          </tr>
           <tr>
             <td><a href="../../../content/patterns/toolbar/examples/toolbar.html">Toolbar</a></td>
             <td>Yes</td>