Composite

Prev Next

Available in Classic and VPC

This document describes the Composite component of the response components of a chatbot answer.

The Composite component consists of the following two basic components.

These components allow you to set the chatbot's response to each feature in Chatbot Builder, and return the response results in JSON format.

Template component

The Template component consists of cover, content table, and foot table.

Template component response body

The following is the response body of the Template component.

Field Type Required Description
type String Required Component type
  • Only template is available among the 2 basic components for the Template component
title String Optional Component title
  • Short bold text
subTitle String Optional Subcomponent title
  • Short gray text
data Object Optional Template component configuration information
data.cover Object Required Cover information
data.description String Optional Component detailed descriptions
  • Long text
data.contentBackgroundImage String Optional Background image URL displayed in the content table area
  • Must be a URL of https format
data.contentTable Array Optional contentTable details
  • Two-dimensional cell array
  • Up to three rows can be set
  • For more information, see Basic component
data.footBackgroundImage String Optional Background image URL displayed in the foot table area
  • Must be a URL of https format
data.footTable Array Optional footTable details
  • Components are identical to contentTable but can only be displayed if contentTable exists
data.footTableShowRows Integer Optional Maximum number of rows
  • If the number of rows is greater than the maximum, the maximum rows should be displayed and collapsed, and an expand button should be added
  • Display all rows when not set
data.action Action Optional Component action information

Table

The following describes Table.

Field Type Required Description
rowSpan Integer Required Number of rows occupied by cells in the table (span)
colSpan Integer Required Number of columns occupied by cells in the table (span)
data Object Optional data area information of the Template component
data.type String Conditional Component type
data.title String Conditional Component name
data.subTitle String Conditional Subcomponent name
data.data Object Conditional Subcomponent configuration information
data.data.type String Conditional Subcomponent type
data.data.iconUrl String Conditional Icon URL address
data.data.action Object Conditional Component action information
data.data.action.type String Conditional Component action type
data.data.action.data Object Conditional Component action details

Template component response example

The following is a sample response of the Template component.

{
    "type": "template",
    "title": "optional, short bold text",
    "subTitle": "optional, short gray text",
    "data":{
        "cover":{
            "contentTableShowRows": 3, 
            "contentTable":
            [ 
                "colSpan": 1,
                "rowSpan": 2,
                "data":{}
            ]
        }
    },
    "footTableShowRows":3, 
    "footBackgroundImage":"https://ssl.pstatic.net/CloudFunctions.png",
    "footTable":[] 
}

Persistent Menu component

The Persistent Menu component is displayed when the user taps the menu button in the chatbar, and is always included in the Open response. Other responses that don't change utils contain the permanentMenu content.

Persistent Menu response body

The following is the response body of Persistent Menu.

Field Type Required Description
type String Required Persistent menu type
  • Only template is available among the 2 basic components for the Template component
title String Optional Persistent menu name
  • Displayed on the chatbar
data Object Optional Persistent menu configuration information
  • cover is not used
data.contentBackgroundImage String Conditional Background image URL displayed in the content table area
  • Displayed only if the image component exists in contentTable
  • Must be a URL of https format
data.contentTable Array Conditional contentTable details
  • footTable is not used

contentTable

The following describes data.contentTable.

Field Type Required Description
rowSpan Integer Required Number of rows occupied by cells in the table (span)
colSpan Integer Required Number of columns occupied by cells in the table (span)
data Object Optional Component configuration information
data.type String Conditional Component type
data.title String Conditional Component name
data.subTitle String Conditional Subcomponent name
data.data Object Conditional Subcomponent configuration information
data.data.type String Conditional Subcomponent type
data.data.action Object Conditional Component action information
data.data.action.type String Conditional Component action type
data.data.action.data Object Conditional Component action details

Persistent Menu response example

The following is a sample response of Persistent Menu.

{
    "type": "template",
    "title": "persistentMenu",
    "data": {
        "contentBackgroundImage": "url",
        "contentTable": []
    }
}

Carousel component

The Carousel component consists of a carousel of answers that repeat the same format.

Carousel component response body

The following is the response body of the Carousel component.

Field Type Required Description
type String Required Component type
  • Only carousel is available among the 2 basic components for the Carousel component
title String Optional Component title
  • Short bold text
subTitle String Optional Subcomponent title
  • Short gray text
data Object Optional Carousel component configuration information
data.cards Array Optional Information about the cards that make up the carousel

Carousel component response example

The following is a sample response of the Carousel component.

{
    "type": "carousel",
    "title": "optional, short bold text",
    "subTitle": "optional, short gray text",
    "data" : 
    {
        "cards": [{}]
    }
}