@cypress-design/vue-accordion 0.2.0 → 0.2.1

package/Accordion.vue

@@ -12,7 +12,7 @@
         <span
           v-if="(props.icon || slots.iconEl) && separator"
           :class="CssClasses.separator"
-          aria-role="separator"
+          role="separator"
         />
         <span class="flex-grow pr-[16px]">
           <span

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @cypress-design/vue-accordion
 
+## 0.2.1
+
+### Patch Changes
+
+- [`c798320`](https://github.com/cypress-io/cypress-design/commit/c798320236ec41a43eb74be80f407781e980aaf0) Thanks [@elevatebart](https://github.com/elevatebart)! - fix the aria-role of accordion separator
+
 ## 0.2.0
 
 ### Minor Changes

package/dist/index.es.mjs

@@ -19,11 +19,11 @@ const n = {
   body: e,
   compiledClasses: t,
   size: r,
-  class: a,
+  class: l,
   interactiveColorsOnGroup: u,
   ...p
 }) => {
-  const c = Object.keys(p).reduce((m, l) => (!B.includes(l) && l !== "name" && (m[l] = p[l]), m), {}), f = {
+  const c = Object.keys(p).reduce((m, a) => (!B.includes(a) && a !== "name" && (m[a] = p[a]), m), {}), f = {
     width: r,
     height: r,
     viewBox: `0 0 ${r} ${r}`,
@@ -33,16 +33,16 @@ const n = {
   };
   return t.length && (f.class = t.join(" ")), f;
 }, O = (e) => {
-  const { sizeWithDefault: t, compiledClasses: r } = z.getComponentAttributes({ ...e, availableSizes: ["8", "16"] }), a = {
+  const { sizeWithDefault: t, compiledClasses: r } = z.getComponentAttributes({ ...e, availableSizes: ["8", "16"] }), l = {
     8: '<path d="m1 2.5 3 3 3-3" stroke="currentColor" class="icon-dark" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>',
     16: '<path d="m4 6 4 4 4-4" stroke="currentColor" class="icon-dark" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>'
   }[t];
-  if (!a)
+  if (!l)
     throw Error(`Icon "chevron-down-small" is not available in size ${t}`);
   return g("svg", E({
     ...e,
     size: t,
-    body: a,
+    body: l,
     compiledClasses: r
   }));
 }, S = { class: "flex-grow pr-[16px]" }, A = /* @__PURE__ */ v({
@@ -58,13 +58,13 @@ const n = {
     fullWidthContent: { type: Boolean }
   },
   setup(e) {
-    const t = e, r = b(), a = x(null), u = x(null);
+    const t = e, r = b(), l = x(null), u = x(null);
     w(function() {
-      u.value && a.value && new D(u.value, a.value);
+      u.value && l.value && new D(u.value, l.value);
     });
     const p = t.icon;
     return (c, f) => {
-      var m, l;
+      var m, a;
       return d(), y("details", {
         ref_key: "$details",
         ref: u
@@ -85,7 +85,7 @@ const n = {
             (t.icon || o(r).iconEl) && e.separator ? (d(), y("span", {
               key: 0,
               class: s(o(n).separator),
-              "aria-role": "separator"
+              role: "separator"
             }, null, 2)) : k("", !0),
             i("span", S, [
               i("span", {
@@ -98,7 +98,7 @@ const n = {
                 key: 0,
                 class: s([
                   o(n).summaryDescription,
-                  (l = e.descriptionClassName) != null ? l : o(n).summaryDescriptionColor
+                  (a = e.descriptionClassName) != null ? a : o(n).summaryDescriptionColor
                 ])
               }, h(e.description), 3)) : k("", !0)
             ]),
@@ -110,7 +110,7 @@ const n = {
         ], 2),
         i("div", {
           ref_key: "$content",
-          ref: a,
+          ref: l,
           class: s(o(n).contentWrapper)
         }, [
           e.fullWidthContent ? C(c.$slots, "default", { key: 0 }) : (d(), y("div", {