Database

The LABEL component is used to display text, which can be either static or dynamic (from the database). This component is ideal for adding descriptions, titles, totals, filtered general information, or any other textual information. Interactions include opening modals, executing actions, manipulating data via SQL, opening forms, and more.

2. How to Configure

Drag to Screen: Drag the LABEL component to the screen where you want to display the text.

2.1. Data

Configure the View: Configure the View using SQL, Data Analysis View, or Dimension View if you want to feed the label with data from the database. It must return only one row and one column.

2.2. Personalize

2.2.1. General Settings

Text: Enter the text to be displayed by the component. Variables can be used to display dynamic data in the label.

Scroll: If the label content exceeds its size, enabling this option will generate an internal scroll.

Selectable Text: Allows users to select the text, making it possible to copy it using "Ctrl + C."

Size: Define the relative font size, which changes according to the user's screen resolution.

Minimum Font Size (px): Set the minimum font size to prevent the text from becoming too small on lower resolutions.

Font: Choose the font for the text.

Text Formatting: Adjust text formatting, including bold, italic, underline, text color, alignment, and style.

Text Color: Set the label text color.

Background Color: Set the label background color.

Transparency: Define the opacity of the label.

Border Settings: Configure outline, color, thickness, and border-radius.

Tooltip: Add a tooltip that will be displayed when hovering over the label.

Include Hyperlink: Allows you to include a link that opens in a new browser tab.

2.2.2. Animation

Transition: Enable to apply a background color transition effect when hovering over the label.

Transition Color: Define the background color for when the cursor hovers over the label.

Elevation: Enable to add a shadow effect that gives depth to the element.

Elevation Level: Define the depth level of the shadow effect.

2.2.3. Dynamic Visibility

The Dynamic Visibility functionality allows the label to become visible or invisible based on the value returned by a View. The component will disappear if the value is 0 or null and will appear for any other number. This functionality can be applied using the component’s own View or the screen’s View, offering flexibility in configuring and controlling component behavior.

Referencing the Component’s Own View: When configured to use the component’s own View, Dynamic Visibility is based on the first row and column returned by the View to determine visibility.
Referencing the Screen’s View: If visibility is configured to reference the screen’s View, users can specify the desired intersection using variable commands. For example, the "$A1" command can be used to get the value from the first row and column of the screen’s View.

2.2.4. Reactivity

Manually Choose Components to Update: If you want to understand how and why to use this functionality, refer to the "Reactivity" documentation.

2.3. Interactions

None: The label will have no interaction.

Action: Define an action to be executed when interacting with the label.

Database Action: Allows performing data manipulation operations such as INSERT, UPDATE, DELETE, or calling PROCEDURES.

Form: Opens a form upon interacting with the label.

Modal: Opens a modal upon interacting with the label.

3. Label Sets

Label sets are ready-made groupings of labels that facilitate the organization and display of information. These sets can be altered for various uses. In these groups, components are grouped so that dragging, resizing, or shrinking them adjusts all the elements together. If you want to modify only a specific label within the set, you must ungroup the components first. For more information on how to ungroup, refer to the "Component Layout" documentation.

3.1. Cards

These are simpler label sets. They can include texts, icons, values, and comparisons, depending on the chosen model.

3.2. Card Group

Larger sets that group multiple cards to display detailed and comparative information.

3.3. Headers

Pre-made components for displaying page titles.