diff --git a/docs/workspace/imgs/properties-panel-ex.png b/docs/workspace/imgs/properties-panel-ex.png
new file mode 100644
index 0000000..36149f7
Binary files /dev/null and b/docs/workspace/imgs/properties-panel-ex.png differ
diff --git a/docs/workspace/properties-panel.md b/docs/workspace/properties-panel.md
index f7820db..1be58a1 100644
--- a/docs/workspace/properties-panel.md
+++ b/docs/workspace/properties-panel.md
@@ -17,7 +17,7 @@ The Properties Panel allows you to edit widget properties in real-time, providin
height: 0,
width: '100%'}}>
+
+
+
+#### Adding Additional Properties
+
+Some properties for widgets are hidden by default. However, any property that's accessible in the underlying widget can be set from the property panel. If you are looking for a property that's not currently visible, you can search for it or add it using the **+ Add Property** button at the top of the Property panel.
+
+
+
+
+
+
+### Conditional Values
+
+Properties that use conditional values are indicated by a branching icon (resembling a "Y" with arrows). These allow you to set different property values based on runtime conditions.
+
+When working with conditional values, you can:
+- Set up conditions using any valid Dart expression
+- Define different values for the true and false branches
+- Use any property type (widgets, colors, numbers, strings, etc.) in each branch
+- Nest conditions for more complex logic
+
+This feature is especially powerful for creating dynamic UIs that respond to state changes, user interactions, or other runtime conditions.
+
+
+
+
+
+
+### Action Functions
+
+Properties that represent actions or callbacks (such as `onPressed`, `onTap`, `onMapCreated`) are marked with action icons like a lightning bolt (⚡) or parentheses `()`. These indicate interactive behaviors that can be configured with event handlers or function calls.
+
+You can click on these properties to open the code editor and define the function that will be called when the action is triggered.
+
+
+
+
+
+
+
+### Code Blocks or Variables
+
+Properties that represent variables or code expressions (rather than actions or functions) are indicated with a code block icon (``).
+
+This icon highlights that the property's value is set via a variable or code rather than a simple constant or selection. Clicking this property will allow you to edit the associated code expression.
+
+
+
+
+
+
+
+#### Switching to Quick Code Viewer
To switch from the visual property editor to a code-based property editor, hover near the property and click the "Switch to Code View" button. You can also cmd+click this button to jump to the specific line in the code editor where the property is defined.
-:::
+
+
+
+
+
+
+
+## Constructors
+
+Many Flutter widgets support multiple constructors, each with different parameter sets. Constructors are different ways to initialize a widget:
+- **Default constructor**: The standard way to create a widget with all properties available
+- **Named constructors**: Often provide convenient shortcuts or specific configurations
+ - For example, `Container()` vs `Container.fromLTRB()` for setting left, top, right, bottom values
+ - Or `EdgeInsets.all()` vs `EdgeInsets.symmetric()` vs `EdgeInsets.only()` for padding
+
+When you switch constructors, the Properties Panel will update to show only the properties relevant to that specific constructor, making it easier to configure the widget for your specific use case.
+
+### Switch Constructors
+
+1. Select a widget in the Widget Tree or Canvas
+2. In the Properties Panel, locate the **Constructor** section at the top
+3. Click on the constructor dropdown (typically showing "Default" or the current constructor name)
+4. Select a different constructor from the available options
-## Adding Hidden Properties
-Some properties for widgets are hidden by default. However, any property that's accessible in the underlying widget can be set from the property panel.
-If you are looking for a hidden property, you can search for it or add it using the "+ Add Property" button at the top of the Property panel.
+
+
+
+
+
+
+:::tip[Constructor-Specific Properties]
+Some properties may only be available with certain constructors. If you don't see a property you need, try switching to a different constructor that supports it.
+:::
## Modifiers
@@ -91,7 +362,7 @@ Modifier widgets are hidden from the "Simplified View" in the [**widget tree**](
height: 0,
width: '100%'}}>