[Feature Request] Some improvements to reduce menu size.

[segalion]

I recently discovered lil-gui and I loved the simplicity and lightness of the library. Even so, I miss some things related to the need to reduce the size of the menus when there are lots of elements.

1. It would be ideal to be able to have up to 4 elements in a single row: 4 buttons, 4 input boxes (e.g. defining a simple "line" with 4 parameters (coordinates x,y,dx,xy) occupies 4 rows. Tweakpane solves it well, it even adds tabs , but this library seems too heavy to me (graphs, buffers, points....)

2. The folders are underused. They only serve to group/ungroup. I can think of 2 add 2 additional possibilities:
   2.1. Ability to sort (drag to change their order). It's a phenomenal feature for building things where order is important, and this type of menu would be ideal.
   2.2. Possibility of changing the folder-title (linked to one variableas as text entry, only available with a "edit icon").
   So then, folder could be expandable (allways), editable and movable (optional)

3. This is aesthetic, but it would be ideal to be able to include icons
   to the titles (which in many cases allows smaller and more intuitive menu design). I am thinking in Material Design Symbols as icons.

[segalion]

Hello. I've finally decided to create my own lil-gui wrapper.

For now I have managed to include the following elements:

✨ Features

• Icons in controllers and folders with .icon(iconName) access to >200.000 open source vector icons by its name.
• Multi-control rows with .append() instead of .add() can create compact UIs.
• Extend controllers to all standard html input types ("password","date","datetime-local","color","checkbox","number","range","radio","file","tel","url","week","search","month","email","submit","hidden","button" and "image")
• Custom context menus (floating gui to deploy contextmenus).
• Accordion Mode: Expands only one folder branch at a time for cleaner UI.
• Advanced Filtering: Search and highlight elements while keeping context.

[segalion]

If you are interested in icons, multicontroller rows, I have shared lil-xgui.

It results in a ultralight <7K wrapper that adds lot of functionality.

I would be happy to have it tested so we can improve it. I've only started with js, css npm for just 3 months and there may be beginner's mistakes.

[georgealways]

Very cool, thanks for sharing. I'd be happy to give it a look if there are any hosted examples.

[segalion]

I'm trying to create a demo with the examples in source.

GitHub pages

https://segalion.github.io/lil-xgui/

and

https://raw.githack.com/segalion/lil-xgui/main/examples/index.html

But I have problems to make it work. Maybe I can fix next week and improve examples with a little tutorial...