ToolJet/docs/versioned_docs/version-2.12.0/app-builder/right-sidebar.md
Shubhendra Singh Chauhan 0be7df2b71
[docs] Marketplace 1.2 (#6969)
* [docs]harperdb nosql

* [docs]new operations in dynamodb

* [docs] minor changes in dynamodb

* [docs]redis revamp with encode-decode

* [docs]azure blob gds

* [docs]graphql authentication type udpate

* [docs]added v2.12.0

* minor fix in how to use inspector

* minor fix in pdf&filepicker
2023-08-09 12:17:43 +05:30

29 lines
1.4 KiB
Markdown

---
id: components-library
title: Components Library
---
The **Components Library** on the right sidebar contains all of the available components. Use this to drag-and-drop a component from the library to the canvas. It organizes components into sections and you can enter a search term to quickly find a component you need.
<div style={{textAlign: 'center'}}>
<img className="screenshot-full" src="/img/v2-beta/app-builder/rightsidebar/rightsidebar.png" alt="App Builder: Component library- right sidebar"/>
</div>
:::tip
Check the **[Components Catalog](/docs/widgets/overview)** here to know more about specific component.
:::
## Component Config Inspector
The Component Config Inspector is also called as component inspector. It contains all the available settings for the selected component and is where you **set values**, **update component names**, and **create event handlers**. The Component Inspector organizes settings into different sections, such as **Property** and **Styles**.
To open the Component Config Inspector, click on the component handle that is present on the top of the component including **⚙️ + Component Name** and the component inspector will open up on the right side:
<div style={{textAlign: 'center'}}>
<img className="screenshot-full" src="/img/v2-beta/app-builder/rightsidebar/component-inspector.gif" alt="App Builder: Component library- right sidebar"/>
</div>