Containers

Containers can contain any widgets. Children can inherit from the container's properties by using the following syntax : @{parent.propertyName}. It can be used to:

If the retreived property is an object ([] / {}), it can be used as is or one can retreive a specfic item from it: @{parent.variables.0} will try to return the first item of the parent's variables property.


Panel

Panels can contains tabs or widgets. These can be absolutely positioned and can overflow their parent's size (which will then display scrollbars). When a panel contains tabs, it can send and receive its active tab's index through osc.

{
    type:'panel',
    // etc
}

scroll

widgets

tabs

variables

layout

spacing


Strip

Unidirectionnal panel with stretching capability. By default, children widgets that don't have an explicit width/height set will be shrinked to respect the sizes specified by others. Adding flex:1; to a children's css will give it the ability the fill the remaining space. Multiple children can have a flex:x; css property (x will ponderate their expansion).

{
  type:'strip',
  // etc
}

horizontal

stretch

widgets


Modals are buttons that turn into a centered popup panels when enabled. They can only contain widgets. They can send and receive their state via osc (1 to enable, 0 to disable).

{
    type:'modal',
    // etc
}

doubleTap

popupWidth / popupHeight

options