Display size of collapsed arrays/objects

[marcklingen]

I want to show the size of collapsed arrays/objects to help users understand that they can expand it. (I understand that displaySize is wip/canary)

Currently (even when displaySize={true})

Suggestion

---

Thank you for your effort on this, this package is super useful!

[marcklingen]

Is there a smart way to achieve this with customizeNode? If I render a custom element to add the size of the array, I cannot use setFold to change whether it is collapsed

[YYsuni]

This is indeed an issue that I haven't considered, and I will optimize it soon. Thank you for bringing this to my attention.🫡❤️

[YYsuni]

Hi, I have updated it as you suggested, which makes a better experience. You can use it by running npm i react18-json-view@canary, or view the website: https://jv.yysuni.com/.
Thanks for the advice.❤️😁

[marcklingen]

Hi @YYsuni, thank you, just upgrade and it looks great.

It might be interesting to offer more options:

• displaySize={true} -> all, current implementation
• displaySize={"collapsed"} -> this is what we are looking for, size only on collapsed objects
• displaySize={"expanded"} -> previous behavior, no size on collapsed objects

Example from our app

-> size on collapsed objects is very useful, on expanded ones it is a bit noisy and not necessary

[YYsuni]

You are a genius, I never thought of that before.😆 , I will do it.

[YYsuni]

Now I have finished it and released the lastest canary version.🙌

[YYsuni]

Now it is available in the latest version.

[marcklingen]

Thank you! Already getting positive feedback by users on the new JSON viewer in Langfuse:

good set of UI features: you got me with the ability to copy parts of json!

Added shoutout to our changelog.

[YYsuni]

haha😄😄 congratualtion!