Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
40 changes: 40 additions & 0 deletions content/en/actions/app_builder/components/_index.md
Original file line number Diff line number Diff line change
Expand Up @@ -894,6 +894,46 @@
{{% /collapse-content %}}


{{% collapse-content title="Side panel" level="h3" %}}
Side panel components have the following properties.

### General

Title
: The title for the side panel.<br>
**Value**: string

### Appearance

Width

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I saw that if the end user does not include the "%" it is not working. Worth mentioning that.

: Determines the width of the side panel. A percent sign (`%`) must be included after the value.<br>

Check warning on line 909 in content/en/actions/app_builder/components/_index.md

View workflow job for this annotation

GitHub Actions / vale

Datadog.words_case_insensitive

Use '%' instead of 'percent'.
**Value**: integer

Hide Close Button
: Determines whether side panel displays an X to close the panel.<br>
**Provided values**: on, off

### Events

Event
: **Values**: toggle open, close, open

Reaction

Check notice on line 921 in content/en/actions/app_builder/components/_index.md

View workflow job for this annotation

GitHub Actions / vale

Datadog.sentencelength

Suggestion: Try to keep your sentence length to 25 words or fewer.
: **Values**: custom, close modal, download file, open modal, open side panel, close side panel, set component state, set state variable value, toast notification, trigger action

State Functions
: setIsOpen<br>
**Example**: `sidePanel0.setIsOpen(true)` sets the state of `sidePanel0` to open.

For more information on events, see [Events][1].

### Inspect data

Displays properties and values in JSON format.

{{% /collapse-content %}}


{{% collapse-content title="Tab" level="h3" %}}

Tab components have the following properties.
Expand Down