fix(list): list item slots wasn't passed due to slot name prefix

jd-solanki · jd-solanki · commit eec949fa684a · 2023-02-19T23:19:33.000+05:30
diff --git a/packages/anu-vue/src/components/list/AList.vue b/packages/anu-vue/src/components/list/AList.vue
@@ -3,7 +3,7 @@ import type { ExtractPropTypes } from 'vue'
 import type { ListPropItems } from './props'
 import { listProps } from './props'
 import type { listSlots } from './slots'
-import { listItemSlot } from './slots'
+import { listItemSlots } from './slots'
 import { isObject } from '@/utils/helpers'
 import { useGroupModel } from '@/composables'
 import { AListItem } from '@/components/list-item'
@@ -70,12 +70,11 @@ const handleListItemClick = (item: ListPropItems[number]) => {
       >
         <!-- ℹ️ Recursively pass down slots to child -->
         <template
-          v-for="name in Object.keys(listItemSlot)"
-          #[name]="slotProps"
+          v-for="{ originalKey: originalSlotName, prefixedKey: updatedSlotName } in listItemSlots"
+          #[originalSlotName]="slotProps"
         >
-          <!-- ℹ️ v-if condition will omit passing slots. Here, we don't want to pass default slot. -->
           <slot
-            :name="name"
+            :name="updatedSlotName"
             :index="index"
             v-bind="slotProps || {}"
           />
diff --git a/packages/anu-vue/src/components/list/slots.ts b/packages/anu-vue/src/components/list/slots.ts
@@ -1,5 +1,6 @@
 import type { ListPropItems } from './props'
-import { listItemSlots } from '@/components/list-item/slots'
+import { listItemSlots as listItemComponentSlots } from '@/components/list-item/slots'
+import { prefixObjectKeys } from '@/utils/helpers'
 
 export const listOwnSlots = {
   before: {},
@@ -9,22 +10,25 @@ export const listOwnSlots = {
   after: {},
 } as const
 
-export const listItemSlot = {
-  'item-prepend': {
-    item: listItemSlots.prepend.item,
-    index: Number(),
-  },
-  'item-item': {
-    item: listItemSlots.item.item,
-    index: Number(),
-  },
-  'item-append': {
-    item: listItemSlots.append.item,
-    index: Number(),
-  },
-} as const
+// export const listItemSlots = {
+//   'item-prepend': {
+//     item: listItemComponentSlots.prepend.item,
+//     index: Number(),
+//   },
+//   'item-item': {
+//     item: listItemComponentSlots.item.item,
+//     index: Number(),
+//   },
+//   'item-append': {
+//     item: listItemComponentSlots.append.item,
+//     index: Number(),
+//   },
+// } as const
+
+const { 'item-default': _, ...listItemSlots } = prefixObjectKeys(listItemComponentSlots, 'item-')
+export { listItemSlots }
 
 export const listSlots = {
-  ...listItemSlot,
+  ...listItemSlots,
   ...listOwnSlots,
 } as const
