@aurodesignsystem-dev/auro-formkit 0.0.0-pr1457.1 → 0.0.0-pr1457.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (215) hide show
  1. package/components/checkbox/demo/accessibility.html +1 -1
  2. package/components/checkbox/demo/api.html +2 -1
  3. package/components/checkbox/demo/customize.html +1 -1
  4. package/components/checkbox/demo/demo-support.min.js +60 -0
  5. package/components/checkbox/demo/design.html +2 -1
  6. package/components/checkbox/demo/getting-started.html +1 -1
  7. package/components/checkbox/demo/getting-started.md +154 -0
  8. package/components/checkbox/demo/index.html +1 -1
  9. package/components/checkbox/demo/index.min.js +3 -2
  10. package/components/checkbox/demo/install.html +49 -0
  11. package/components/checkbox/demo/keyboard-behavior.html +1 -1
  12. package/components/checkbox/demo/pages.json +1 -0
  13. package/components/checkbox/demo/readme.html +2 -1
  14. package/components/checkbox/demo/styles.min.css +1 -1
  15. package/components/checkbox/demo/voiceover.html +1 -1
  16. package/components/checkbox/dist/auro-checkbox.d.ts +1 -0
  17. package/components/checkbox/dist/index.js +3 -2
  18. package/components/checkbox/dist/registered.js +3 -2
  19. package/components/combobox/demo/accessibility.html +1 -3
  20. package/components/combobox/demo/api.html +2 -3
  21. package/components/combobox/demo/customize.html +1 -1
  22. package/components/combobox/demo/demo-support.min.js +60 -0
  23. package/components/combobox/demo/design.html +2 -3
  24. package/components/combobox/demo/getting-started.html +1 -1
  25. package/components/combobox/demo/index.html +1 -1
  26. package/components/combobox/demo/install.html +50 -0
  27. package/components/combobox/demo/keyboard-behavior.html +1 -3
  28. package/components/combobox/demo/pages.json +1 -0
  29. package/components/combobox/demo/readme.html +2 -3
  30. package/components/combobox/demo/registered.min.js +5 -4
  31. package/components/combobox/demo/styles.min.css +1 -1
  32. package/components/combobox/demo/voiceover.html +1 -3
  33. package/components/combobox/dist/index.js +5 -4
  34. package/components/combobox/dist/registered.js +5 -4
  35. package/components/counter/README.md +21 -47
  36. package/components/counter/demo/accessibility.html +49 -0
  37. package/components/counter/demo/accessibility.md +34 -0
  38. package/components/counter/demo/api.html +13 -21
  39. package/components/counter/demo/api.md +49 -1299
  40. package/components/counter/demo/api.min.js +1 -8390
  41. package/components/counter/demo/auro-counter-group.min.js +8392 -0
  42. package/components/counter/demo/customize.html +53 -0
  43. package/components/counter/demo/customize.md +650 -0
  44. package/components/counter/demo/demo-support.js +1 -0
  45. package/components/counter/demo/demo-support.min.js +55792 -0
  46. package/components/counter/demo/design.html +52 -0
  47. package/components/counter/demo/design.md +192 -0
  48. package/components/counter/demo/getting-started.html +54 -0
  49. package/components/counter/demo/getting-started.md +482 -0
  50. package/components/counter/demo/index.html +14 -20
  51. package/components/counter/demo/index.md +117 -51
  52. package/components/counter/demo/index.min.js +1 -8390
  53. package/components/{dropdown/demo/keyboardBehavior.html → counter/demo/keyboard-behavior.html} +9 -42
  54. package/components/counter/demo/keyboardBehavior.html +7 -40
  55. package/components/counter/demo/pages.json +1 -0
  56. package/components/counter/demo/readme.html +12 -16
  57. package/components/counter/demo/readme.md +21 -47
  58. package/components/counter/demo/styles.min.css +1 -0
  59. package/components/counter/demo/styles.scss +1 -0
  60. package/components/counter/demo/voiceover.html +51 -0
  61. package/components/counter/demo/voiceover.md +80 -0
  62. package/components/counter/dist/index.js +2 -2
  63. package/components/counter/dist/registered.js +2 -2
  64. package/components/datepicker/demo/accessibility.html +2 -3
  65. package/components/datepicker/demo/api.html +2 -2
  66. package/components/datepicker/demo/auro-datepicker.min.js +5 -4
  67. package/components/datepicker/demo/customize.html +1 -1
  68. package/components/datepicker/demo/demo-support.min.js +60 -0
  69. package/components/datepicker/demo/design.html +3 -4
  70. package/components/datepicker/demo/getting-started.html +1 -1
  71. package/components/datepicker/demo/index.html +1 -1
  72. package/components/datepicker/demo/keyboard-behavior.html +2 -4
  73. package/components/datepicker/demo/pages.json +1 -0
  74. package/components/datepicker/demo/readme.html +2 -2
  75. package/components/datepicker/demo/styles.min.css +1 -1
  76. package/components/datepicker/demo/voiceover.html +2 -4
  77. package/components/datepicker/dist/index.js +5 -4
  78. package/components/datepicker/dist/registered.js +5 -4
  79. package/components/dropdown/README.md +0 -21
  80. package/components/dropdown/demo/accessibility.html +49 -0
  81. package/components/dropdown/demo/accessibility.md +45 -0
  82. package/components/dropdown/demo/api.html +11 -20
  83. package/components/dropdown/demo/api.md +40 -1364
  84. package/components/dropdown/demo/api.min.js +2 -5098
  85. package/components/dropdown/demo/auro-dropdown.min.js +5099 -0
  86. package/components/dropdown/demo/customize.html +54 -0
  87. package/components/dropdown/demo/customize.md +780 -0
  88. package/components/dropdown/demo/demo-support.js +1 -0
  89. package/components/dropdown/demo/demo-support.min.js +55792 -0
  90. package/components/dropdown/demo/design.html +52 -0
  91. package/components/dropdown/demo/design.md +186 -0
  92. package/components/dropdown/demo/getting-started.html +54 -0
  93. package/components/dropdown/demo/getting-started.md +463 -0
  94. package/components/dropdown/demo/index.html +12 -21
  95. package/components/dropdown/demo/index.md +78 -233
  96. package/components/dropdown/demo/index.min.js +1 -5097
  97. package/components/dropdown/demo/keyboard-behavior.html +48 -0
  98. package/components/dropdown/demo/pages.json +1 -0
  99. package/components/dropdown/demo/readme.html +8 -21
  100. package/components/dropdown/demo/readme.md +0 -21
  101. package/components/dropdown/demo/styles.min.css +1 -0
  102. package/components/dropdown/demo/styles.scss +1 -0
  103. package/components/dropdown/demo/voiceover.html +51 -0
  104. package/components/dropdown/demo/voiceover.md +63 -0
  105. package/components/dropdown/dist/index.js +1 -1
  106. package/components/dropdown/dist/registered.js +1 -1
  107. package/components/form/README.md +9 -9
  108. package/components/form/demo/accessibility.html +51 -0
  109. package/components/form/demo/accessibility.md +23 -0
  110. package/components/form/demo/api.html +12 -15
  111. package/components/form/demo/api.md +14 -290
  112. package/components/form/demo/api.min.js +2 -71921
  113. package/components/form/demo/auro-form.min.js +718 -0
  114. package/components/form/demo/autocomplete.html +2 -2
  115. package/components/form/demo/customize.html +54 -0
  116. package/components/form/demo/customize.md +246 -0
  117. package/components/form/demo/demo-support.js +1 -0
  118. package/components/form/demo/demo-support.min.js +55792 -0
  119. package/components/form/demo/getting-started.html +54 -0
  120. package/components/form/demo/getting-started.md +434 -0
  121. package/components/form/demo/index.html +13 -15
  122. package/components/form/demo/index.md +67 -97
  123. package/components/form/demo/index.min.js +2 -71921
  124. package/components/form/demo/keyboard-behavior.html +51 -0
  125. package/components/form/demo/pages.json +1 -0
  126. package/components/form/demo/readme.html +13 -18
  127. package/components/form/demo/readme.md +9 -9
  128. package/components/form/demo/registerDemoDeps.min.js +71212 -0
  129. package/components/form/demo/styles.min.css +1 -0
  130. package/components/form/demo/styles.scss +1 -0
  131. package/components/form/demo/voiceover.html +51 -0
  132. package/components/form/demo/voiceover.md +36 -0
  133. package/components/form/demo/working.html +3 -2
  134. package/components/input/demo/accessibility.html +1 -1
  135. package/components/input/demo/api.html +1 -1
  136. package/components/input/demo/auro-input.min.js +3 -2
  137. package/components/input/demo/customize.html +1 -1
  138. package/components/input/demo/demo-support.min.js +60 -0
  139. package/components/input/demo/design.html +2 -1
  140. package/components/input/demo/getting-started.html +1 -1
  141. package/components/input/demo/index.html +1 -1
  142. package/components/input/demo/keyboard-behavior.html +2 -1
  143. package/components/input/demo/pages.json +1 -0
  144. package/components/input/demo/readme.html +2 -2
  145. package/components/input/demo/styles.min.css +1 -1
  146. package/components/input/demo/voiceover.html +1 -1
  147. package/components/input/dist/base-input.d.ts +1 -0
  148. package/components/input/dist/index.js +3 -2
  149. package/components/input/dist/registered.js +3 -2
  150. package/components/menu/README.md +8 -26
  151. package/components/menu/demo/accessibility.html +53 -0
  152. package/components/menu/demo/accessibility.md +34 -0
  153. package/components/menu/demo/api.html +12 -18
  154. package/components/menu/demo/api.md +43 -1102
  155. package/components/menu/demo/api.min.js +2 -2288
  156. package/components/menu/demo/auro-menu.min.js +2289 -0
  157. package/components/menu/demo/customize.html +54 -0
  158. package/components/menu/demo/customize.md +637 -0
  159. package/components/menu/demo/demo-support.js +1 -0
  160. package/components/menu/demo/demo-support.min.js +55792 -0
  161. package/components/menu/demo/design.html +53 -0
  162. package/components/menu/demo/design.md +81 -0
  163. package/components/menu/demo/getting-started.html +54 -0
  164. package/components/menu/demo/getting-started.md +322 -0
  165. package/components/menu/demo/index.html +14 -20
  166. package/components/menu/demo/index.md +26 -63
  167. package/components/menu/demo/index.min.js +1 -2287
  168. package/components/menu/demo/keyboard-behavior.html +53 -0
  169. package/components/menu/demo/pages.json +1 -0
  170. package/components/menu/demo/readme.html +12 -16
  171. package/components/menu/demo/readme.md +8 -26
  172. package/components/menu/demo/styles.min.css +1 -0
  173. package/components/menu/demo/styles.scss +1 -0
  174. package/components/menu/demo/voiceover.html +53 -0
  175. package/components/menu/demo/voiceover.md +33 -0
  176. package/components/radio/demo/accessibility.html +2 -1
  177. package/components/radio/demo/api.html +2 -1
  178. package/components/radio/demo/customize.html +2 -1
  179. package/components/radio/demo/demo-support.min.js +60 -0
  180. package/components/radio/demo/design.html +2 -1
  181. package/components/radio/demo/getting-started.html +2 -1
  182. package/components/radio/demo/getting-started.md +154 -0
  183. package/components/radio/demo/index.html +1 -1
  184. package/components/radio/demo/index.min.js +1 -1
  185. package/components/radio/demo/keyboard-behavior.html +2 -1
  186. package/components/radio/demo/pages.json +1 -0
  187. package/components/radio/demo/readme.html +3 -3
  188. package/components/radio/demo/styles.min.css +1 -1
  189. package/components/radio/demo/voiceover.html +2 -1
  190. package/components/radio/dist/index.js +1 -1
  191. package/components/radio/dist/registered.js +1 -1
  192. package/components/select/demo/accessibility.html +1 -1
  193. package/components/select/demo/api.html +2 -1
  194. package/components/select/demo/customize.html +1 -1
  195. package/components/select/demo/demo-support.min.js +60 -0
  196. package/components/select/demo/design.html +2 -1
  197. package/components/select/demo/getting-started.html +1 -1
  198. package/components/select/demo/index.html +1 -1
  199. package/components/select/demo/install.html +50 -0
  200. package/components/select/demo/keyboard-behavior.html +1 -1
  201. package/components/select/demo/keyboardBehavior.html +1 -1
  202. package/components/select/demo/layout.html +2 -1
  203. package/components/select/demo/pages.json +1 -0
  204. package/components/select/demo/readme.html +2 -1
  205. package/components/select/demo/registered.min.js +2 -2
  206. package/components/select/demo/styles.min.css +1 -1
  207. package/components/select/demo/voiceover.html +1 -1
  208. package/components/select/dist/index.js +2 -2
  209. package/components/select/dist/registered.js +2 -2
  210. package/custom-elements.json +249 -246
  211. package/package.json +1 -1
  212. package/components/counter/demo/keyboard-behavior.md +0 -127
  213. package/components/dropdown/demo/keyboard-behavior.md +0 -72
  214. package/components/form/demo/keyboard-behavior.md +0 -38
  215. package/components/menu/demo/keyboard-behavior.md +0 -18
package/components/menu/demo/accessibility.md ADDED
@@ -0,0 +1,34 @@
1
+ <auro-header level="1" id="overview">Menu - Accessibility</auro-header>
2
+ <div class="contentWrapper">
3
+ <div class="mainContent">
4
+ <div class="scrollWrapper">
5
+ <section>
6
+ <auro-header level="2" id="menuRole">Menu Role</auro-header>
7
+ <p>The <code>auro-menu</code> component renders with <code>role="listbox"</code>. Each <code>auro-menuoption</code> renders with <code>role="option"</code>. This semantic structure allows assistive technologies to communicate the list of options and their states.</p>
8
+ </section>
9
+ <section>
10
+ <auro-header level="2" id="optionStates">Option States</auro-header>
11
+ <p>Menu options communicate their state to assistive technologies:</p>
12
+ <ul>
13
+ <li><strong>Selected:</strong> The <code>aria-selected</code> attribute is set to <code>true</code> on the selected option(s).</li>
14
+ <li><strong>Disabled:</strong> The <code>aria-disabled</code> attribute is set to <code>true</code> on disabled options, preventing interaction.</li>
15
+ <li><strong>Hidden:</strong> Options with the <code>hidden</code> attribute are removed from the accessible tree.</li>
16
+ </ul>
17
+ </section>
18
+ <section>
19
+ <auro-header level="2" id="keyboardInteraction">Keyboard Interaction</auro-header>
20
+ <p>The menu supports full keyboard navigation:</p>
21
+ <ul>
22
+ <li><strong>Arrow Down / Arrow Up:</strong> Moves focus between options.</li>
23
+ <li><strong>Enter / Space:</strong> Selects the currently focused option.</li>
24
+ <li><strong>Home / End:</strong> Moves focus to the first or last option.</li>
25
+ </ul>
26
+ <p>See the <auro-hyperlink href="keyboardBehavior">Keyboard Behavior</auro-hyperlink> page for full details.</p>
27
+ </section>
28
+ <section>
29
+ <auro-header level="2" id="multiselect">Multi-Select</auro-header>
30
+ <p>When the <code>multiselect</code> attribute is set, <code>aria-multiselectable="true"</code> is applied to the menu, allowing multiple options to be selected. Each option's <code>aria-selected</code> attribute reflects its individual selection state.</p>
31
+ </section>
32
+ </div>
33
+ </div>
34
+ </div>
package/components/menu/demo/api.html CHANGED
@@ -18,8 +18,8 @@
18
18
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
19
19
  <title>Auro Web Component Demo | auro-menu</title>
20
20
 
21
- <!-- Prism.js Stylesheet -->
22
- <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/themes/prism.css"/>
21
+ <!-- highlight.js Stylesheet -->
22
+ <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.9.0/build/styles/github.min.css"/>
23
23
 
24
24
  <!-- Legacy reference is still needed to support auro-menu's use of legacy token values at this time -->
25
25
  <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/legacy/auro-classic/CSSCustomProperties.css"/>
@@ -31,32 +31,26 @@
31
31
  <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/bundled/themes/alaska.global.min.css" />
32
32
 
33
33
  <!-- Demo Specific Styles -->
34
- <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/demoWrapper.css" />
35
- <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/elementDemoStyles.css" />
36
- </head>
34
+ <link rel="stylesheet" type="text/css" href="./styles.min.css" />
35
+ </head>
37
36
  <body class="auro-markdown">
38
37
  <main></main>
39
38
 
40
39
  <script type="module">
41
- import 'https://cdn.jsdelivr.net/npm/marked@latest/marked.min.js';
42
- import 'https://cdn.jsdelivr.net/npm/prismjs@latest/prism.js';
43
- fetch('./api.md')
44
- .then((response) => response.text())
45
- .then((text) => {
46
- const rawHtml = marked.parse(text);
47
- document.querySelector('main').innerHTML = rawHtml;
48
- Prism.highlightAll();
49
- });
40
+ import { renderPage } from './demo-support.min.js';
41
+ await renderPage('./api.md');
50
42
  </script>
43
+
51
44
  <!-- If additional elements are needed for the demo, add them here. -->
52
45
  <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@latest/+esm" type="module"></script>
46
+ <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-header@latest/+esm" type="module"></script>
47
+ <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-hyperlink@latest/+esm" type="module"></script>
48
+ <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-icon@latest/+esm" type="module"></script>
53
49
  <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@latest/auro-input/+esm" type="module"></script>
54
50
  <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-button@latest/+esm" type="module"></script>
55
51
  <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-loader@latest/+esm" type="module"></script>
56
52
  <script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@latest/auro-radio/+esm"></script>
57
- <script type="module" data-demo-script="true">
58
- import { initExamples } from "./api.min.js"
59
- initExamples();
60
- </script>
53
+
54
+ <script src="./api.min.js" data-demo-script="true" type="module"></script>
61
55
  </body>
62
56
  </html>