Class CardService

CardService

CardService provides the ability to create generic cards used across different Google extensibility products, such as Google Workspace Add-ons .

Below is a sample for an add-ons card.

return CardService.newCardBuilder()
         .setHeader(CardService.newCardHeader().setTitle("CardTitle"))
         .build();

Or you can return multiple Cards like so:

return [
  CardService.newCardBuilder().build(),
  CardService.newCardBuilder().build(),
  CardService.newCardBuilder().build()
]

The following shows how you could define a card with a header, text, an image and a menu item:

function createWidgetDemoCard() {
  return CardService
     .newCardBuilder()
     .setHeader(
         CardService.newCardHeader()
             .setTitle('Widget demonstration')
             .setSubtitle('Check out these widgets')
             .setImageStyle(CardService.ImageStyle.SQUARE)
             .setImageUrl(
                 'https://www.example.com/images/headerImage.png'))
     .addSection(
          CardService.newCardSection()
              .setHeader('Simple widgets')  // optional
              .addWidget(CardService.newTextParagraph().setText(
                  'These widgets are display-only. ' +
                  'A text paragraph can have multiple lines and ' +
                  'formatting.'))
              .addWidget(CardService.newImage().setImageUrl(
                  'https://www.example.com/images/mapsImage.png')))
     .addCardAction(CardService.newCardAction().setText('Gmail').setOpenLink(
         CardService.newOpenLink().setUrl('https://mail.google.com/mail')))
     .build();
}

Sample for a Chat Apps card.

const cardHeader = CardService.newCardHeader()
    .setTitle("Sasha")
    .setSubtitle("Software Engineer")
    .setImageUrl('https://developers.google.com/chat/images/quickstart-app-avatar.png')
    .setImageStyle(CardService.ImageStyle.CIRCLE)
    .setImageAltText("Avatar for Sasha");

const cardSection = CardService.newCardSection()
    .setHeader("Contact Info")
    .setCollapsible(true)
    .setNumUncollapsibleWidgets(1)
    .addWidget(
       CardService.newDecoratedText()
         .setStartIcon(CardService.newIconImage().setIcon(CardService.Icon.EMAIL))
         .setText("sasha@example.com"))
    .addWidget(
       CardService.newDecoratedText()
          .setStartIcon(CardService.newIconImage().setIcon(CardService.Icon.PERSON))
          .setText("<font color=\"#80e27e\">Online</font>"))
    .addWidget(
       CardService.newDecoratedText()
          .setStartIcon(CardService.newIconImage().setIcon(CardService.Icon.PHONE))
          .setText("+1 (555) 555-1234"))
    .addWidget(
       CardService.newButtonSet()
          .addButton(CardService.newTextButton()
           .setText("Share")
           .setOpenLink(CardService.newOpenLink().setUrl("https://example.com/share")))
          .addButton(CardService.newTextButton()
           .setText("Edit")
           .setOnClickAction(
         CardService.newAction().setFunctionName("goToView").setParameters({viewType:"EDIT"}))))

const card = CardService.newCardBuilder()
    .setHeader(cardHeader)
    .addSection(cardSection)
    .build();

Properties

Property Type Description
BorderType
BorderType The BorderType enumeration.
ComposedEmailType
ComposedEmailType The ComposedEmailType enumeration.
ContentType
ContentType The ContentType enumeration.
GridItemLayout
GridItemLayout The GridItemLayout enumeration.
HorizontalAlignment
HorizontalAlignment The HorizontalAlignment enumeration.
Icon
Icon The Icon enumeration.
ImageCropType
ImageCropType The ImageCropType enumeration.
ImageStyle
ImageStyle The ImageStyle enumeration.
LoadIndicator
LoadIndicator The LoadIndicator enumeration.
OnClose
OnClose The OnClose enumeration.
OpenAs
OpenAs The OpenAs enumeration.
SelectionInputType
SelectionInputType The SelectionInputType enumeration.
TextButtonStyle
TextButtonStyle The TextButtonStyle enumeration.
UpdateDraftBodyType
UpdateDraftBodyType The UpdateDraftBodyType enumeration.

Methods

Method Return type Brief description
Action Creates a new Action .
ActionResponseBuilder Creates a new ActionResponseBuilder .
ActionStatus Creates a new ActionStatus .
Attachment Creates a new Attachment .
AuthorizationAction Creates a new AuthorizationAction .
AuthorizationException Creates a new AuthorizationException .
BorderStyle Creates a new BorderStyle .
ButtonSet Creates a new ButtonSet .
CalendarEventActionResponseBuilder Creates a new CalendarEventActionResponseBuilder .
CardAction Creates a new CardAction .
CardBuilder Creates a new CardBuilder .
CardHeader Creates a new CardHeader .
CardSection Creates a new CardSection .
CardWithId Creates a new CardWithId .
ChatActionResponse Creates a new ChatActionResponse .
ChatResponseBuilder Creates a new ChatResponseBuilder .
Column Creates a new Column .
Columns Creates a new set of Columns .
ComposeActionResponseBuilder Creates a new ComposeActionResponseBuilder .
DatePicker Creates a new DatePicker .
DateTimePicker Creates a new DateTimePicker .
DecoratedText Creates a new DecoratedText .
Dialog Creates a new Dialog .
DialogAction Creates a new DialogAction .
Divider Creates a new Divider .
DriveItemsSelectedActionResponseBuilder Creates a new DriveItemsSelectedActionResponseBuilder .
EditorFileScopeActionResponseBuilder Creates a new EditorFileScopeActionResponseBuilder .
FixedFooter Creates a new FixedFooter .
Grid Creates a new Grid .
GridItem Creates a new GridItem .
IconImage Creates a new IconImage .
Image Creates a new Image .
ImageButton Creates a new ImageButton .
ImageComponent Creates a new ImageComponent .
ImageCropStyle Creates a new ImageCropStyle .
KeyValue Creates a new KeyValue .
LinkPreview Creates a new LinkPreview .
Navigation Creates a new Navigation .
Notification Creates a new Notification .
OpenLink Creates a new OpenLink .
SelectionInput Creates a new SelectionInput .
Suggestions Creates a new Suggestions .
SuggestionsResponseBuilder Creates a new SuggestionsResponseBuilder .
Switch Creates a new Switch .
TextButton Creates a new TextButton .
TextInput Creates a new TextInput .
TextParagraph Creates a new TextParagraph .
TimePicker Creates a new TimePicker .
UniversalActionResponseBuilder Creates a new UniversalActionResponseBuilder .
UpdateDraftActionResponseBuilder Creates a new UpdateDraftActionResponseBuilder .
UpdateDraftBccRecipientsAction Creates a new UpdateDraftBccRecipientsAction ;
UpdateDraftBodyAction Creates a new UpdateDraftBodyAction .
UpdateDraftCcRecipientsAction Creates a new UpdateDraftCcRecipientsAction .
UpdateDraftSubjectAction Creates a new UpdateDraftSubjectAction .
UpdateDraftToRecipientsAction Creates a new UpdateDraftToRecipientsAction .
Validation Creates a new Validation .

Detailed documentation

newAction()

Creates a new Action .

Return

Action — An empty Action.


newActionResponseBuilder()

Creates a new ActionResponseBuilder .

Return

ActionResponseBuilder — An empty ActionResponse builder.


newActionStatus()

Creates a new ActionStatus .

Only available for Google Chat apps. Not available for Google Workspace Add-ons.

const actionStatus = CardService.newActionStatus()
    .setStatusCode(CardService.Status.OK)
    .setUserFacingMessage('Success');

Return

ActionStatus — An empty ActionStatus.


newAttachment()

Creates a new Attachment .

Return

Attachment — An empty attachment.


newAuthorizationAction()

Creates a new AuthorizationAction .

Return

AuthorizationAction — An empty AuthorizationAction.


newAuthorizationException()

Creates a new AuthorizationException .

Return

AuthorizationException — An empty AuthorizationException.


newBorderStyle()

Creates a new BorderStyle .

Return

BorderStyle — An empty BorderStyle.


newButtonSet()

Creates a new ButtonSet .

Return

ButtonSet — An empty ButtonSet.


newCalendarEventActionResponseBuilder()


newCardAction()

Creates a new CardAction .

Return

CardAction — An empty CardAction.


newCardBuilder()

Creates a new CardBuilder .

Return

CardBuilder — An empty Card builder.


newCardHeader()

Creates a new CardHeader .

Return

CardHeader — An empty CardHeader.


newCardSection()

Creates a new CardSection .

Return

CardSection — An empty CardSection.


newCardWithId()

Creates a new CardWithId . This is used to send a card in a Google Chat message. card ID is a unique identifier for a card in a message when sending multiple cards.

Only available for Google Chat apps. Not available for Google Workspace Add-ons.

const cardSection = CardService.newCardSection();
cardSection.addWidget(
    CardService.newTextParagraph().setText('This is a text paragraph widget.'));

const card = CardService.newCardBuilder()
    .setHeader(CardService.newCardHeader().setTitle('Card title'))
    .addSection(cardSection)
    .build();

const cardWithId = CardService.newCardWithId()
    .setCardId('card_id')
    .setCard(card);

Return

CardWithId — An empty CardWithId .


newChatActionResponse()

Creates a new ChatActionResponse .

Only available for Google Chat apps. Not available for Google Workspace Add-ons.

const card = CardService.newCardBuilder()
    .setHeader(CardService.newCardHeader().setTitle('Card title')).build();
const dialog = CardService.newDialog()
    .setBody(card);

const dialogAction = CardService.newDialogAction()
    .setDialog(dialog)

const chatActionResponse = CardService.newChatActionResponse()
    .setResponseType(CardService.ResponseType.DIALOG)
    .setDialogAction(dialogAction);

Return

ChatActionResponse — An empty ChatActionResponse .


newChatResponseBuilder()

Creates a new ChatResponseBuilder .

Only available for Google Chat apps. Not available for Google Workspace Add-ons.

const cardSection = CardService.newCardSection();
cardSection.addWidget(
    CardService.newTextParagraph().setText('This is a text paragraph widget.'));

const card = CardService.newCardBuilder()
    .setHeader(CardService.newCardHeader().setTitle('Card title'))
    .addSection(cardSection)
    .build();

const cardWithId = CardService.newCardWithId()
    .setCardId('card_id')
    .setCard(card);

const chatResponse = CardService.newChatResponseBuilder()
    .addCardsV2(cardWithId)
    .build();

Return

ChatResponseBuilder — An empty ChatResponseBuilder.


newColumn()

Creates a new Column .

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

const columnWidget = CardService.newTextParagraph();
const column = CardService.newColumn()
    .setHorizontalSizeStyle(CardService.HorizontalSizeStyle.FILL_AVAILABLE_SPACE)
    .setHorizontalAlignment(CardService.HorizontalAlignment.CENTER)
    .setVerticalAlignment(CardService.VerticalAlignment.CENTER)
    .addWidget(columnWidget);

Return

Column — An empty Column.


newColumns()

Creates a new set of Columns .

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

const firstColumn = CardService.newColumn()
    .setHorizontalSizeStyle(CardService.HorizontalSizeStyle.FILL_AVAILABLE_SPACE)
    .setHorizontalAlignment(CardService.HorizontalAlignment.CENTER)
    .setVerticalAlignment(CardService.VerticalAlignment.CENTER);
const secondColumn = CardService.newColumn()
    .setHorizontalSizeStyle(CardService.HorizontalSizeStyle.FILL_AVAILABLE_SPACE)
    .setHorizontalAlignment(CardService.HorizontalAlignment.CENTER)
    .setVerticalAlignment(CardService.VerticalAlignment.CENTER);
const columns = CardService.newColumns()
    .addColumn(column)
    .addColumn(secondColumn)
    .setWrapStyle(CardService.WrapStyle.WRAP);

Return

Columns — An empty set of Columns.


newComposeActionResponseBuilder()

Creates a new ComposeActionResponseBuilder .

Return

ComposeActionResponseBuilder — An empty ComposeActionResponse builder.


newDatePicker()

Creates a new DatePicker .

Return

DatePicker — An empty DatePicker.


newDateTimePicker()

Creates a new DateTimePicker .

Return

DateTimePicker — An empty DateTimePicker.


newDecoratedText()

Creates a new DecoratedText .

Return

DecoratedText — An empty DecoratedText.


newDialog()

Creates a new Dialog .

Only available for Google Chat apps. Not available for Google Workspace Add-ons.

const card = CardService.newCardBuilder()
    .setHeader(CardService.newCardHeader().setTitle('Card title')).build();

// Sets the card of the dialog.
const dialog = CardService.newDialog()
    .setBody(card);

Return

Dialog — An empty Dialog .


newDialogAction()

Creates a new DialogAction .

Only available for Google Chat apps. Not available for Google Workspace Add-ons.

const card = CardService.newCardBuilder()
    .setHeader(CardService.newCardHeader().setTitle('Card title')).build();
const dialog = CardService.newDialog()
    .setBody(card);

const dialogAction = CardService.newDialogAction()
    .setDialog(dialog)

Return

DialogAction — An empty DialogAction .


newDivider()

Creates a new Divider . The following sample builds a simple card with 2 paragraphs separated by a divider.

function buildCard() {
    let cardSection1TextParagraph1 = CardService.newTextParagraph()
        .setText('Hello world!');

    let cardSection1Divider1 = CardService.newDivider();

    let cardSection1TextParagraph2 = CardService.newTextParagraph()
        .setText('Hello world!');

    let cardSection1 = CardService.newCardSection()
        .addWidget(cardSection1TextParagraph1)
        .addWidget(cardSection1Divider1)
        .addWidget(cardSection1TextParagraph2);

    let card = CardService.newCardBuilder()
        .addSection(cardSection1)
        .build();

   return card;
}

Return

Divider — A divider.


newDriveItemsSelectedActionResponseBuilder()


newEditorFileScopeActionResponseBuilder()


newFixedFooter()

Creates a new FixedFooter .

Return

FixedFooter — An empty FixedFooter.


newGrid()

Creates a new Grid .

Return

Grid — An empty Grid.


newGridItem()

Creates a new GridItem .

Return

GridItem — An empty GridItem.


newIconImage()

Creates a new IconImage .

Return

IconImage — An empty icon image.


newImage()

Creates a new Image .

Return

Image — An empty Image.


newImageButton()

Creates a new ImageButton .

Return

ImageButton — An empty ImageButton.


newImageComponent()

Creates a new ImageComponent .

Return

ImageComponent — An empty ImageComponent.


newImageCropStyle()

Creates a new ImageCropStyle .

Return

ImageCropStyle — An empty ImageCropStyle.


newKeyValue()

Creates a new KeyValue .

Return

KeyValue — An empty KeyValue.


newLinkPreview()

Creates a new LinkPreview .

const decoratedText = CardService.newDecoratedText()
    .setTopLabel('Hello')
    .setText('Hi!');

const cardSection = CardService.newCardSection()
    .addWidget(decoratedText);

const card = CardService.newCardBuilder()
    .addSection(cardSection)
    .build();

const linkPreview = CardService.newLinkPreview()
    .setPreviewCard(card)
    .setTitle('Smart chip title');

Return

LinkPreview — An empty LinkPreview.


newNavigation()

Creates a new Navigation .

Return

Navigation — An empty Navigation.


newNotification()

Creates a new Notification .

Return

Notification — An empty Notification.


Creates a new OpenLink .

Return

OpenLink — An empty OpenLink.


newSelectionInput()

Creates a new SelectionInput .

Return

SelectionInput — An empty SelectionInput.


newSuggestions()

Creates a new Suggestions .

Return

Suggestions — An empty Suggestions.


newSuggestionsResponseBuilder()

Creates a new SuggestionsResponseBuilder .

Return

SuggestionsResponseBuilder — An empty SuggestionsResponse builder.


newSwitch()

Creates a new Switch .

Return

Switch — An empty Switch.


newTextButton()

Creates a new TextButton .

Return

TextButton — An empty TextButton.


newTextInput()

Creates a new TextInput .

Return

TextInput — An empty TextInput.


newTextParagraph()

Creates a new TextParagraph .

Return

TextParagraph — An empty TextParagraph.


newTimePicker()

Creates a new TimePicker .

Return

TimePicker — An empty TimePicker.


newUniversalActionResponseBuilder()

Creates a new UniversalActionResponseBuilder .

Return

UniversalActionResponseBuilder — An empty UniversalActionResponse builder.


newUpdateDraftActionResponseBuilder()

Creates a new UpdateDraftActionResponseBuilder .

Return

UpdateDraftActionResponseBuilder — An empty UpdateDraftActionResponseBuilder.


newUpdateDraftBccRecipientsAction()

Creates a new UpdateDraftBccRecipientsAction ;

Return

UpdateDraftBccRecipientsAction — An empty UpdateDraftBccRecipientsAction.


newUpdateDraftBodyAction()

Creates a new UpdateDraftBodyAction .

Return

UpdateDraftBodyAction — An empty UpdateDraftBodyAction.


newUpdateDraftCcRecipientsAction()

Creates a new UpdateDraftCcRecipientsAction .

Return

UpdateDraftCcRecipientsAction — An Empty UpdateDraftCcRecipientsAction.


newUpdateDraftSubjectAction()

Creates a new UpdateDraftSubjectAction .

Return

UpdateDraftSubjectAction — An empty UpdateDraftSubjectAction.


newUpdateDraftToRecipientsAction()

Creates a new UpdateDraftToRecipientsAction .

Return

UpdateDraftToRecipientsAction — An empty UpdateDraftToRecipientsAction.


newValidation()

Creates a new Validation .

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

const validation = CardService.newValidation()
    .setCharacterLimit(5)
    .setInputType(CardService.InputType.EMAIL);

Return

Validation — An empty validation.