Patch/13.5.3

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rei/cedar",
-  "version": "13.5.2",
+  "version": "13.5.3",
   "description": "REI Cedar Component Library",
   "homepage": "https://rei.github.io/rei-cedar/",
   "license": "MIT",
@@ -65,7 +65,7 @@
     "backstopjs": "^5.3.0",
     "c8": "^7.11.0",
     "chalk": "^4.1.0",
-    "chromedriver": "^113.0.0",
+    "chromedriver": "^114.0.0",
     "concat": "^1.0.3",
     "cross-env": "^7.0.3",
     "cz-conventional-changelog": "^3.3.0",

src/components/accordion/CdrAccordion.vue

@@ -74,7 +74,6 @@ export default defineComponent({
 
   setup(props, ctx) {
     const unwrap = inject('unwrap', false);
-    const isGrouped = inject('grouped', false) ? 'li' : 'div';
     const style = useCssModule();
     const accordionContentEl = ref(null);
     const focused = ref(false);
@@ -158,7 +157,6 @@ export default defineComponent({
       headingClass,
       headingContent,
       headingContentStyle,
-      isGrouped,
       unwrap,
       accordionContentEl,
       focused,
@@ -184,8 +182,7 @@ export default defineComponent({
 </script>
 
 <template>
-  <component
-    :is="isGrouped"
+  <div
     :class="!isUnwrapped
       ? mapClasses(style, baseClass, compactClass, borderAlignedClass, focusedClass, noSpacingClass)
       : null"
@@ -205,7 +202,6 @@ export default defineComponent({
         :id="id"
         v-on="listeners"
         :aria-expanded="!isUnwrapped ? `${opened}` : null"
-        :aria-pressed="!isUnwrapped ? `${opened}` : null"
         :aria-controls="!isUnwrapped ? `${id}-collapsible` : null"
       >
         <span
@@ -238,7 +234,7 @@ export default defineComponent({
         <slot />
       </div>
     </div>
-  </component>
+  </div>
 </template>
 
 <style lang="scss" module src="./styles/CdrAccordion.module.scss">

src/components/accordion/CdrAccordionGroup.vue

@@ -38,7 +38,6 @@ export default defineComponent({
       isUnwrapped: !!props.unwrap,
     });
     provide('unwrap', unwrapped);
-    provide('grouped', true);
 
     const nextIdx = computed(() => {
       const idx = currentIdx.value + 1;
@@ -103,15 +102,15 @@ export default defineComponent({
 </script>
 
 <template>
-  <ul
+  <div
     :class="style[baseClass]"
     ref="accordionGroupEl"
     @focusin="focusin"
     @keydown="handleKeyDown"
   >
     <!-- @slot CdrAccordionGroup content (i.e. CdrAccordion components) -->
     <slot />
-  </ul>
+  </div>
 </template>
 
 <style lang="scss" module src="./styles/CdrAccordionGroup.module.scss">

src/components/accordion/__tests__/CdrAccordionGroup.spec.js

@@ -70,12 +70,6 @@ describe('CdrAccordionGroup', () => {
     it('renders correctly', () => {
       expect(wrapper.element).toMatchSnapshot()
     });
-
-    describe('a11y requirements', () => {
-      it('accordion groups are organized into unordered lists', () => {
-        expect(wrapper.element.tagName).toBe('UL');
-      })
-    });
   });
 
   describe('with string value for unwrapped prop', ()=>{

src/components/accordion/__tests__/__snapshots__/CdrAccordion.spec.js.snap

@@ -60,7 +60,6 @@ exports[`CdrAccordion > component snapshot when wrapped > renders correctly 1`]
     <button
       aria-controls="test-collapsible"
       aria-expanded="false"
-      aria-pressed="false"
       class="cdr-accordion__button js-cdr-accordion-button"
       id="test"
     >

src/components/accordion/__tests__/__snapshots__/CdrAccordionGroup.spec.js.snap

@@ -1,12 +1,12 @@
 // Vitest Snapshot v1
 
 exports[`CdrAccordionGroup > when unwrapped > renders correctly 1`] = `
-<ul
+<div
   class="cdr-accordion-group"
 >
   <!-- @slot CdrAccordionGroup content (i.e. CdrAccordion components) -->
 
-  <li
+  <div
     class=""
     id="tab1-accordion"
   >
@@ -46,8 +46,8 @@ exports[`CdrAccordionGroup > when unwrapped > renders correctly 1`] = `
 
       </div>
     </div>
-  </li>
-  <li
+  </div>
+  <div
     class=""
     id="tab2-accordion"
   >
@@ -87,8 +87,8 @@ exports[`CdrAccordionGroup > when unwrapped > renders correctly 1`] = `
 
       </div>
     </div>
-  </li>
-  <li
+  </div>
+  <div
     class=""
     id="tab3-accordion"
   >
@@ -128,18 +128,18 @@ exports[`CdrAccordionGroup > when unwrapped > renders correctly 1`] = `
 
       </div>
     </div>
-  </li>
+  </div>
 
-</ul>
+</div>
 `;
 
 exports[`CdrAccordionGroup > when wrapped > renders correctly 1`] = `
-<ul
+<div
   class="cdr-accordion-group"
 >
   <!-- @slot CdrAccordionGroup content (i.e. CdrAccordion components) -->
 
-  <li
+  <div
     class="cdr-accordion cdr-accordion--focused"
     id="tab1-accordion"
   >
@@ -153,7 +153,6 @@ exports[`CdrAccordionGroup > when wrapped > renders correctly 1`] = `
       <button
         aria-controls="tab1-collapsible"
         aria-expanded="false"
-        aria-pressed="false"
         class="cdr-accordion__button js-cdr-accordion-button"
         id="tab1"
       >
@@ -198,8 +197,8 @@ exports[`CdrAccordionGroup > when wrapped > renders correctly 1`] = `
 
       </div>
     </div>
-  </li>
-  <li
+  </div>
+  <div
     class="cdr-accordion"
     id="tab2-accordion"
   >
@@ -213,7 +212,6 @@ exports[`CdrAccordionGroup > when wrapped > renders correctly 1`] = `
       <button
         aria-controls="tab2-collapsible"
         aria-expanded="false"
-        aria-pressed="false"
         class="cdr-accordion__button js-cdr-accordion-button"
         id="tab2"
       >
@@ -258,8 +256,8 @@ exports[`CdrAccordionGroup > when wrapped > renders correctly 1`] = `
 
       </div>
     </div>
-  </li>
-  <li
+  </div>
+  <div
     class="cdr-accordion"
     id="tab3-accordion"
   >
@@ -273,7 +271,6 @@ exports[`CdrAccordionGroup > when wrapped > renders correctly 1`] = `
       <button
         aria-controls="tab3-collapsible"
         aria-expanded="false"
-        aria-pressed="false"
         class="cdr-accordion__button js-cdr-accordion-button"
         id="tab3"
       >
@@ -318,18 +315,18 @@ exports[`CdrAccordionGroup > when wrapped > renders correctly 1`] = `
 
       </div>
     </div>
-  </li>
+  </div>
 
-</ul>
+</div>
 `;
 
 exports[`CdrAccordionGroup > with string value for unwrapped prop > renders correctly 1`] = `
-<ul
+<div
   class="cdr-accordion-group"
 >
   <!-- @slot CdrAccordionGroup content (i.e. CdrAccordion components) -->
 
-  <li
+  <div
     class=""
     id="tab1-accordion"
   >
@@ -369,8 +366,8 @@ exports[`CdrAccordionGroup > with string value for unwrapped prop > renders corr
 
       </div>
     </div>
-  </li>
-  <li
+  </div>
+  <div
     class=""
     id="tab2-accordion"
   >
@@ -410,8 +407,8 @@ exports[`CdrAccordionGroup > with string value for unwrapped prop > renders corr
 
       </div>
     </div>
-  </li>
-  <li
+  </div>
+  <div
     class=""
     id="tab3-accordion"
   >
@@ -451,7 +448,7 @@ exports[`CdrAccordionGroup > with string value for unwrapped prop > renders corr
 
       </div>
     </div>
-  </li>
+  </div>
 
-</ul>
+</div>
 `;

src/components/icon/CdrIcon.vue

@@ -6,7 +6,10 @@ import mapClasses from '../../utils/mapClasses';
 import { responsiveModifyClass } from '../../utils/buildClass';
 import propValidator from '../../utils/propValidator';
 
-/** Communicates meaning through graphics representing simple and complex ideas */
+/** Communicates meaning through graphics representing simple and complex ideas
+ * @demoComponentNames icon-account-profile, icon-camera
+ */
+
 export default defineComponent({
   name: 'CdrIcon',
   props: {