The Component Library is where Creators build and manage reusable Smart Components, custom components defined in code that behave like any built-in component. Smart Components are environment-level resources. A component built once is available to every Creator in the environment.
Access the Component Library from the IDE sidebar under Settings → Assets → Component Library.
Smart Component Types
The Component Library supports the following two types of Smart Components:
| Type | What it does |
|---|---|
| UI | Renders a visible interface element. Defined with HTML-like structure and CSS. The component receives typed input data and renders output for the end-user. |
| Logic | Processes data without rendering UI. Receives typed input data, applies a transformation, and returns typed output data. Use for reusable calculations, formatting, or data manipulation. |
Both types are configured using a typed interface system and QLang code.
Component Library List
The Component Library list displays all Smart Components available in the environment. The list can be filtered by the following types:
| Filter | Shows |
|---|---|
| All | All Smart Components regardless of type. |
| UI | UI Smart Components only. |
| Logic | Logic Smart Components only. |
Each row in the list displays the component name, type badge, and the date it was last updated.
Select a component to open it in the Component Builder for editing. Select Create Component to build a new one.
Shared and Private Smart Components
Smart Components created in the Component Library are shared, stored at the environment level and available in the component tray in every module.
Private Smart Components are stored inline on a specific module instead of in the shared library. Private components follow the module's lifecycle: they are included in module copies, rollbacks, and deletions. Use private Smart Components for logic specific to one module and not intended for reuse.
Private Smart Components are created directly from the Module Builder instead of from the Component Library. To edit a private Smart Component, select it on the canvas and click Edit. To promote a private component to the shared library, select Add to Library in the Component Builder.
Changelog
| Date | Change |
|---|---|
| 2026-07-01 | Added Edit button and Add to Library to Private Smart Components section (UQE-16091). |
| 2026-06-29 | Initial draft — source reviewed from codebase; browser verify pending. |