The first time you create a project, you see this screen.
This is your main utility toolbelt. Drag the components on the interface to use them.
This is the area where you build and see your project. Within this area, you can pan and zoom to move around.
Space + drag
Middle-click + drag
Shift + scroll (horizontal)
Two fingers swipe
Ctrl + Scroll
This is where you create your layouts. It can be a page or a component. The mechanics depend on your layout engine setup (at the beginning of the project).
Click to select a compoent
Shift + click to add to selection
Shift + click to unselect
Draw a rectangle to select
Drag to move
Shift + drag to restrict movement vertically/horizontally
Alt + drag to duplicate
Corners to resize
Shift + resize to maintain proportions
Alt + resize to maintain simetry
Resize + drag in multiple elements
Add elements by dragging
Add elements on sides
Resize elements on the side
Select ancestor elements in the lower breadcrumb
Each node has a direction different from its parent
each flex slot have 3 options of size types
Size types editor
This makes the slot expand proportionally to its parent. Measured in %, this is great for content containers, blank areas, and other non-functional slots.
Expand size type
This size type makes the size fixed in pixels, no matter its parent's size. Measured in pixels, this is great for navbars, sidebars, footers, and other navigation elements.
Fixed size type
Fit to content
This size type makes the size equal to the minimum required by its content. This cannot be resized once is defined by its content only. Great for buttons, inputs, and other components in the interface.
Fit to content
When you want any kind of logic on your application, you need actions. This feature allows you to call APIs, change pages, etc.
Click to add actions
Select an action
Select what you want to do
Actions can be dispatched from multiple types of triggers
Drag to reutilize actions
Views can have actions too
Actions can have actions as well
Triggers can be selected too
This is where you can see the entities of your projects.
delete page (need confirmation)
These are the reutilized elements on your interface. You can use them for navbars, sidebars, footers, cards, and other repeated pieces of the layout.