fix: Accordion context

teleskop150750 · teleskop150750 · commit acdb39f9a84a · 2024-09-19T09:19:35.000+03:00
diff --git a/packages/vue-primitives/src/accordion/AccordionItem.vue b/packages/vue-primitives/src/accordion/AccordionItem.vue
@@ -33,7 +33,7 @@ provideAccordionItemContext({
 provideCollapsibleContext({
   contentId: useId(),
   disabled() {
-    return props.disabled
+    return disabled.value
   },
   open,
   onOpenToggle() {
diff --git a/packages/vue-primitives/src/accordion/AccordionRoot.vue b/packages/vue-primitives/src/accordion/AccordionRoot.vue
@@ -32,12 +32,8 @@ const TYPE_SINGLE = 'single' as const satisfies AccordionType
 const getItems = useCollection(Collection.provideCollectionContext(elRef))
 
 const onKeydown = composeEventHandlers<KeyboardEvent>((event) => {
-  if (props.disabled)
-    return
   emit('keydown', event)
 }, (event) => {
-  if (props.disabled)
-    return
   if (!ACCORDION_KEYS.includes(event.key))
     return
   const target = event.target as HTMLElement
@@ -150,6 +146,7 @@ provideAccordionContext({
 <template>
   <Primitive
     :ref="forwardElement"
+    :data-disabled="disabled"
     :data-orientation="orientation"
     @keydown="onKeydown"
   >
diff --git a/packages/vue-primitives/src/accordion/AccordionTrigger.vue b/packages/vue-primitives/src/accordion/AccordionTrigger.vue
@@ -25,11 +25,11 @@ const forwardElement = useForwardElement($el)
 const accordionContext = useAccordionContext('AccordionTrigger')
 const itemContext = useAccordionItemContext('AccordionHeader')
 
-const context = useCollapsibleContext('CollapsibleTrigger')
+const collapsibleContext = useCollapsibleContext('CollapsibleTrigger')
 
 const onClick = composeEventHandlers<MouseEvent>((event) => {
   emit('click', event)
-}, context.onOpenToggle)
+}, collapsibleContext.onOpenToggle)
 </script>
 
 <template>
@@ -42,11 +42,11 @@ const onClick = composeEventHandlers<MouseEvent>((event) => {
     :[DATA_COLLECTION_ITEM]="true"
 
     type="button"
-    :aria-controls="context.contentId"
-    :aria-expanded="context.open.value || false"
-    :data-state="getState(context.open.value)"
-    :data-disabled="context.disabled() ? '' : undefined"
-    :disabled="context.disabled()"
+    :aria-controls="collapsibleContext.contentId"
+    :aria-expanded="itemContext.open.value || false"
+    :data-state="getState(itemContext.open.value)"
+    :data-disabled="itemContext.disabled.value ? '' : undefined"
+    :disabled="itemContext.disabled.value"
     @click="onClick"
   >
     <slot />
