Skip to content

Commit

Permalink
fix: accordion initial expand with multiple expand
Browse files Browse the repository at this point in the history
  • Loading branch information
nathanielwarner committed Jan 7, 2025
1 parent 404c1a8 commit 5bf43ca
Showing 1 changed file with 18 additions and 6 deletions.
24 changes: 18 additions & 6 deletions es-ds-components/components/es-accordion-list.vue
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,7 @@ const props = withDefaults(defineProps<Props>(), {
variant: 'default',
});
// eslint-disable-next-line vue/require-prop-types
const model = defineModel();
const model = defineModel<string>();
// get the list of elements provided as children to the default slot
const initialChildren = useSlots().default?.() || [];
Expand All @@ -29,7 +28,9 @@ initialChildren.forEach((child) => {
}
});
const activeIndex = ref();
type ActiveChildren = null | number | number[];
const activeIndex: Ref<ActiveChildren> = ref(null);
watch(model, (newVal) => {
if (newVal) {
Expand All @@ -39,19 +40,30 @@ watch(model, (newVal) => {
const accordionTabs = children.map((child, index) => {
if (child.props.id === props.initialExpandedId || child.props.id === model.value) {
activeIndex.value = index;
if (props.allowMultipleExpand) {
activeIndex.value = [index];
} else {
activeIndex.value = index;
}
}
return child.children;
});
const updateActiveIndex = (index: any) => {
const updateActiveIndex = (index: ActiveChildren) => {
if (model.value) {
model.value = children[index]?.props.id || '';
if (typeof index === 'number') {
model.value = children[index]?.props.id || '';
} else if (index === null) {
model.value = '';
}
// There's another case where index will be an array. In that case, v-model is unsupported as specified
// in the documentation, so no update is made
}
};
</script>

<template>
<!-- @vue-expect-error PrimeVue's type information is wrong -->
<accordion
:multiple="allowMultipleExpand"
:active-index="activeIndex"
Expand Down

0 comments on commit 5bf43ca

Please sign in to comment.