CardSection

A card section holds groups of widgets and provides visual separation between them.

Available for Google Workspace add-ons and Google Chat apps.

```javascript
const image = CardService.newImage();
// Build image ...
const textParagraph = CardService.newTextParagraph();
// Build text paragraph ...

const cardSection = CardService.newCardSection()
                        .setHeader('Section header')
                        .addWidget(image)
                        .addWidget(textParagraph);
```

### Methods

| Method | Return type | Brief description |
|---|---|---|
| `https://developers.google.com/apps-script/reference/card-service/card-section#addWidget(Widget)` | `https://developers.google.com/apps-script/reference/card-service/card-section#` | Adds the given widget to this section. |
| `https://developers.google.com/apps-script/reference/card-service/card-section#setCollapseControl(CollapseControl)` | `https://developers.google.com/apps-script/reference/card-service/card-section#` | Sets the customizable expand and collapse buttons of the section. |
| `https://developers.google.com/apps-script/reference/card-service/card-section#setCollapsible(Boolean)` | `https://developers.google.com/apps-script/reference/card-service/card-section#` | Sets whether the section can be collapsed. |
| `https://developers.google.com/apps-script/reference/card-service/card-section#setHeader(String)` | `https://developers.google.com/apps-script/reference/card-service/card-section#` | Sets the header of the section. |
| `https://developers.google.com/apps-script/reference/card-service/card-section#setId(String)` | `https://developers.google.com/apps-script/reference/card-service/card-section#` | Sets the unique ID assigned that's used to identify the section to be mutated. |
| `https://developers.google.com/apps-script/reference/card-service/card-section#setNumUncollapsibleWidgets(Integer)` | `https://developers.google.com/apps-script/reference/card-service/card-section#` | Sets the number of widgets that are still shown when this section is collapsed. |

## Detailed documentation

### `addWidget(widget)`

Adds the given widget to this section. Widgets are shown in the order they were added. You
can't add more than 100 widgets to a card section.

#### Parameters

| Name | Type | Description |
|---|---|---|
| `widget` | `https://developers.google.com/apps-script/reference/card-service/widget` | A widget to add to the section. |

#### Return


`https://developers.google.com/apps-script/reference/card-service/card-section#` --- This object, for chaining.

*** ** * ** ***

### `setCollapseControl(collapseControl)`

Sets the customizable expand and collapse buttons of the section. These buttons are shown only
if the section is collapsible. If this field isn't set, default buttons are used.

Available for Google Chat apps. In developer preview for Google Workspace add-ons.


> [!WARNING]
> **Developer Preview:** Available as part of the [Google Workspace Developer Preview Program](https://developers.google.com/workspace/preview), which grants early access to certain features.

<br />

```javascript
const collapseButton =
    CardService.newTextButton()
        .setTextButtonStyle(CardService.TextButtonStyle.BORDERLESS)
        .setText('show less');

const expandButton =
    CardService.newImageButton()
        .setImageButtonStyle(CardService.ImageButtonStyle.FILLED)
        .setMaterialIcon(CardService.newMaterialIcon().setName('bug_report'));

const collapsibleSection =
    CardService.newCardSection()
        .setCollapsible(true)
        .setNumUncollapsibleWidgets(1)
        .setCollapseControl(
            CardService.newCollapseControl()
                .setHorizontalAlign(CardService.HorizontalAlignment.CENTER)
                .setCollapseButton(collapseButton)
                .setExpandButton(expandButton),
        );
```

#### Parameters

| Name | Type | Description |
|---|---|---|
| `collapseControl` | `https://developers.google.com/apps-script/reference/card-service/collapse-control` | The collapse control setting. |

#### Return


`https://developers.google.com/apps-script/reference/card-service/card-section#` --- This object, for chaining.

*** ** * ** ***

### `setCollapsible(collapsible)`

Sets whether the section can be collapsed.

#### Parameters

| Name | Type | Description |
|---|---|---|
| `collapsible` | `Boolean` | The collapsible setting. |

#### Return


`https://developers.google.com/apps-script/reference/card-service/card-section#` --- This object, for chaining.

*** ** * ** ***

### `setHeader(header)`

Sets the header of the section. Optional.

#### Parameters

| Name | Type | Description |
|---|---|---|
| `header` | `String` | The header text. |

#### Return


`https://developers.google.com/apps-script/reference/card-service/card-section#` --- This object, for chaining.

*** ** * ** ***

### `setId(id)`

Sets the unique ID assigned that's used to identify the section to be mutated. Section mutation
is only supported in Add-Ons.

#### Parameters

| Name | Type | Description |
|---|---|---|
| `id` | `String` | The id of the section, with a limit of 64 characters and in format of \`\[a-zA-Z0-9-\]+\`. |

#### Return


`https://developers.google.com/apps-script/reference/card-service/card-section#` --- This object, for chaining.

*** ** * ** ***

### `setNumUncollapsibleWidgets(numUncollapsibleWidgets)`

Sets the number of widgets that are still shown when this section is collapsed. The widgets
shown are always the first ones that were added.

#### Parameters

| Name | Type | Description |
|---|---|---|
| `numUncollapsibleWidgets` | `Integer` | The number of widgets to show. |

#### Return


`https://developers.google.com/apps-script/reference/card-service/card-section#` --- This object, for chaining.