Bug: AList error when default slot is used without providing items prop about anu

[jd-solanki]

Hi @soulsam480

Why do you need default slot?

You might be looking for item slot to render the custom content inside the list item, right?

[jd-solanki]

Hi @soulsam480

item prop be super flexible

prop or slot?

if your gihub sponsors is open, would love to contribute some

Thanks for the honor. I will open sponsorship later but first I want to provide some value via this framework.

Regarding the last reply, I pushed new commit that:

• Allows item slot so that you can customize the list item rendering. item slot provides item & index as slot props.

Source code

I hope this will resolve this issue. Have you checked the anu with latest update (I haven't released the change yet but you can try master branch)

Awaiting your response.

[soulsam480]

prop or slot?

Ah sorry, I meant a slot.

I hope this will resolve this issue. Have you checked the anu with latest update (I haven't released the change yet but you can try master branch)

Awaiting your response.

Just checked, super work. I think this solves my thing. thx for your work again.

[soulsam480]

I suspect the error is coming from here

anu/packages/anu-vue/src/components/list/AList.tsx

Line 76 in c0026f8

options: props.items[0].value ? props.items.map(i => i.value) : props.items.length,

. Please tell me how can I help.

[jd-solanki]

Maybe we have to do:

- props.items[0].value ? props.items.map(i => i.value) : props.items.length
+ props.items && props.items[0].value ? props.items.map(i => i.value) : props.items.length

However, we might have to take care of other things like click:

anu/packages/anu-vue/src/components/list/AList.tsx

Line 102 in c0026f8

const handleListItemClick = (index: number) => {

[jd-solanki]

Maybe I should learn how to write tests now

[jd-solanki]

@soulsam480 I'm on it

[jd-solanki]

Closed via 467f8df

[soulsam480]

Hi @soulsam480

Why do you need default slot?

You might be looking for item slot to render the custom content inside the list item, right?

@jd-solanki Yessir correct. Also the current API design is great, but in terms of flexibility, I think we can do better. e.g. in a list along with prepend and append slots, an item prop be super flexible. I think you already know this, but taking some inspiration from the API design of Quasar will be a great idea as it's the holy grail of vue component lib IMO. anyways awesome work, if your gihub sponsors is open, would love to contribute some.

[soulsam480]

Maybe we have to do:

- props.items[0].value ? props.items.map(i => i.value) : props.items.length
+ props.items && props.items[0].value ? props.items.map(i => i.value) : props.items.length

However, we might have to take care of other things like click:

anu/packages/anu-vue/src/components/list/AList.tsx

Line 102 in c0026f8

const handleListItemClick = (index: number) => {

I think this will still fail, if the items array is empty, i.e. first item is undefined and the error will be can't read property value of undefined. fix can be making it an optional chain e.g.

 props.items && props.items[0]?.value ? props.items.map(i => i.value) : props.items.length