Editor special mechanics

Dynamic slot

Dynamic slots are containers that allow content to be populated in different instances of the component. The ‘Dynamic slot’ in Jux operates in two stages:

1. The source component phase: where the dynamic slot was created

2. The instance of the component phase: where the dynamic slot is populated

Source component phase

To create a dynamic slot, click on the 'Settings' button in the top right corner of the Properties panel. From the drop down menu, select the ‘Add Dynamic Slot’ option.

This action will add a purple dynamic slot layer to the Object Navigator on the left, positioned as the top-most layer in the layer stack. The dynamic slot is a draggable layer, just like layers of ordinary objects, so you can drag it to the correct place in the objects hierarchy.

On the canvas itself, the dynamic slot will occupy the space allocated for it and will always be marked by a purple dashed border.

The dynamic slot does not have any stylistic properties. The only options in the DDP are the dynamic slot settings for its usage in component instance.

The settings include 3 types:

1. A multi-select list for allowed components

2. A limit on the number of components

3. The option to allow divs, text, and asset objects to be placed into the dynamic slot.

If no options are selected in the ‘allow components,’ all components in the library can be placed in the dynamic slot. Selecting specific components will restrict the slot to only those components when populating the instance of the source component.

Instance of the component phase

Once the source component has been configured with the appropriate dynamic slot settings, you can use the component instance and populate the dynamic slot with any number of other component instances, as permitted by the settings. If you weren't the designer that created the source component, you can select the dynamic slot layer to view the list of allowed components, as set by the person who created the source component.

There are two ways to place allowed components into your dynamic slot:

1. Drag the component into the dynamic slot on the canvas.

2. Click on any of the ‘tags’ that are in the ‘allowed components’ area.

When dragging a component into a dynamic slot, Jux will either allow or prevent the placement of the component based on the dynamic slot settings established in the source component.

Depending on the source component's settings , you might also be able to place text / asset / div objects in your dynamic slot.

Overall, the dynamic slot is a powerful feature that allows you to make your source components both generic and broadly applicable, while giving your instances the flexibility and expansiveness you need.