{"revision":"c10276e953456835cdbb1f3a60d58ae1980be353","document":{"id":5226,"path":"conversational-interfaces/virtual-agent/va-carousel-input.md","title":"Carousel user input control","bundle":null,"doc_type":null,"release":"australia","body":"\n# Carousel user input control\n\nUse the Carousel user input control in a Virtual Agent topic to present a prompt and a horizontal series of labeled images. The user can select a single item from the carousel.\n\n**Tip:** If you want to change the default number of listed items per page, you can modify the **com.glide.cs.picker\\_page\\_limit** system property. The default value is 10.\n\n## Carousel input control properties for LLM topic discovery\n\n**Note:** The Carousel user input control is not supported in ServiceNow Otto in Virtual Agent.\n\n<table id=\"table_qmh_lgk_h1c\"><thead><tr><th>\n\nProperty\n\n</th><th>\n\nDescription\n\n</th></tr></thead><tbody><tr><td>\n\nNode name\n\n</td><td>\n\nName that identifies this node in the topic flow.\n\n</td></tr><tr><td>\n\nVariable name\n\n</td><td>\n\nName of the variable that stores the user response to this prompt. The variable name is automatically created from the **Node name** property.\n\n</td></tr><tr><td>\n\nAllow automatic slot-filling\n\n</td><td>\n\nToggle to allow this node’s value to be automatically set by other nodes, as well as during topic discovery. When this toggle is activated, the Detail description field changes from dynamic Data Pill Picker and script options to a static text field.\n\n</td></tr><tr><td>\n\nDetail description\n\n</td><td>\n\nDescription of the information that you need from users. If the **Allow automatic slot filling** toggle is deactivated, you can create a dynamic detail description by selecting the Data Pill Picker icon \\[Omitted image \"variable-reference-picker.png\"\\] Alt text: to define conditions, or select the Open Editor icon \\[Omitted image \"icon-script.png\"\\] Alt text: to enter a script. If the **Allow automatic slot filling** toggle is activated, you can only enter a static description.\n\n \\[Omitted image \"LLM-input-discoverable-toggle.png\"\\] Alt text: When the Allow automatic slot-filling toggle is inactive, the detail description includes Data Pill Picker and script dynamic options. When the toggle is active, the Detail description field becomes static.\n\n</td></tr><tr><td>\n\nDefine carousel items\n\n</td><td>\n\nUse a script to create items for selection in your carousel. The script should return an array containing one or more items. See the Example carousel item expression section in this topic.\n\n</td></tr><tr><td class=\"sub-head\" colspan=\"2\">\n\nAdvanced \\(optional\\)\n\n</td></tr><tr><td class=\"sub-head\" colspan=\"2\">\n\nEnforce user prompt\n\n</td></tr><tr><td>\n\nEnforce user prompt\n\n</td><td>\n\nToggle to open a field for a custom message shown to the user instead of the message generated by the large language model \\(LLM\\). You can create custom messages in plain language, input a script, or define conditions with the data pill picker.\n\n</td></tr><tr><td>\n\nValidation\n\n</td><td>\n\nAdd a script to validate the user input. For example, check if the user entered a valid email address.\n\n</td></tr><tr><td>\n\nAdditional instructions for LLM\n\n</td><td>\n\nFurther instructions to the LLM, such as adding data formats, restrictions, or default values for user responses. You can create additional instructions in plain language, input a script, or define conditions with the data pill picker.\n\n</td></tr><tr><td class=\"sub-head\" colspan=\"2\">\n\nHide or skip this node\n\n</td></tr><tr><td>\n\nConditionally show this node if\n\n</td><td>\n\nNo-code condition statement or low-code script that specifies a condition for presenting this node in the conversation. The condition must evaluate to true. This field is not applicable when the Carousel node is used within the Input Collector node.\n\n</td></tr><tr><td>\n\nAllow user to skip this node if\n\n</td><td>\n\nNo-code condition statement or low-code script that specifies a condition for letting users skip this node in the conversation. The condition must evaluate to true. You can set this field using either the condition builder or a script.\n\n If users enter a value such as `skip this step` when the conditions do not allow skipping, they receive a message saying the node cannot be skipped and are re-prompted to provide an answer.\n\n</td></tr></tbody>\n</table>## Example Carousel input control for LLM topic discovery\n\n<table id=\"table_tzy_zc2_d1c\"><thead><tr><th>\n\nCarousel properties\n\n</th><th>\n\nCarousel prompt\n\n</th></tr></thead><tbody><tr><td>\n\n\\[Omitted image \"va-carousel-llm-3.png\"\\] Alt text: All basic Carousel user input fields are openly available. Select any of the advanced options to toggle them open individually.\n\n</td><td>\n\n\\[Omitted image \"va-carousel-native.png\"\\] Alt text: An example chat in which the prompt asks, \"Please select the image.\"\n\n</td></tr></tbody>\n</table>## Carousel input control properties for NLU topic discovery\n\n<table id=\"table_nff_y1b_3db\"><thead><tr><th>\n\nProperty\n\n</th><th>\n\nDescription\n\n</th></tr></thead><tbody><tr><td>\n\nNode name\n\n</td><td>\n\nName that identifies this node in the topic flow.\n\n</td></tr><tr><td>\n\nVariable name\n\n</td><td>\n\nName of the variable that stores the user response to this prompt. The variable name is automatically created from the **Node name** property.\n\n</td></tr><tr><td>\n\nPrompt\n\n</td><td>\n\nPrompt or question for the user. The prompt can be either a text string or a script that returns text. This value is used only when the default value is not specified. For example: `What's your name?`\n\n</td></tr><tr><td>\n\nNLU entity\n\n</td><td>\n\nOption to associate an NLU entity with the node. If an NLU entity is associated with the input variable for this node, Virtual Agent can slot-fill the specified value based on the user's utterance. Select an entity from the list of entities associated with the topic intent.\n\n When you specify an entity for the node, the Do not ask users to confirm recognized entity toggle switch is displayed. When enabled, users are not prompted to confirm the extracted entity.\n\n This field is available only when NLU discovery is enabled on the instance.\n\n</td></tr><tr><td>\n\nDefine carousel items\n\n</td><td>\n\nUse a script to create items for selection in your carousel. The script should return an array containing one or more items. See the Example carousel item expression section in this topic.\n\n</td></tr><tr><td>\n\nNo records response message\n\n</td><td>\n\nMessage displayed to the user when the table search doesn’t return any records. The message can be either a text string or a script that returns text.\n\n</td></tr><tr><td class=\"sub-head\" colspan=\"2\">\n\nAdvanced\n\n</td></tr><tr><td class=\"sub-head\" colspan=\"2\">\n\nDefault value\n\n</td></tr><tr><td>\n\nDefault value\n\n</td><td>\n\nPredefined value for the user response to the question or prompt. The response defined in the **Default value confirmation** field asks the user to confirm the default value. If the user responds with `no`, the value becomes null. The default value can be either a text string or a script that returns text. For example, if you're using dot-walking, the default value might be: `Script Variables > Last username`. Or if you're using a script, the default value might be: `{{vaScripts.lastUsername}}`.\n\n</td></tr><tr><td class=\"sub-head\" colspan=\"2\">\n\nConfirmation messages\n\n</td></tr><tr><td>\n\nInput completion confirmation\n\n</td><td>\n\nBot response shown to the user when the node interaction is complete. The message can be either a text string or a script that returns text. For example, if you're using dot-walking: `Thanks, (Input Variables > Username)!` Or if you're using a script, the acknowledgement might be: `Thanks, {{vaInputs.username}}!`\n\n</td></tr><tr><td>\n\nDefault value confirmation\n\n</td><td>\n\nMessage that asks the user to verify that the value in the **Default value** field is correct. This message is used instead of a value in the **Prompt** field. It can contain either a text string or a script that returns text. For example, if you're using dot-walking: `Are you (Input Variables > Username)?` Or if you're using a script, the confirmation message might be: `Are you {{vaScripts.lastUsername}}?`.\n\n</td></tr><tr><td class=\"sub-head\" colspan=\"2\">\n\nConversation switching\n\n</td></tr><tr><td class=\"sub-head\" colspan=\"2\">\n\nThis section is available only when NLU discovery is enabled on the instance.\n\n</td></tr><tr><td>\n\nTurn on to let users change the subject\n\n</td><td>\n\nOption to enable NLU prediction for this node. If enabled, users can enter text to answer questions, regardless of the type of input control being used. Virtual Agent uses this utterance to match another existing intent, letting the user switch topics.\n\n</td></tr><tr><td class=\"sub-head\" colspan=\"2\">\n\nHide or skip this node\n\n</td></tr><tr><td>\n\nConditionally show this node if\n\n</td><td>\n\nNo-code condition statement or low-code script that specifies a condition for presenting this node in the conversation. The condition must evaluate to true.\n\n</td></tr><tr><td>\n\nAllow user to skip this node if\n\n</td><td>\n\nNo-code condition statement or low-code script that specifies a condition for letting users skip this node in the conversation. The condition must evaluate to true. You can set this field using either the condition builder or a script.\n\n</td></tr><tr><td>\n\nSkip reprompting if\n\n</td><td>\n\nNo-code condition statement or low-code script that specifies a condition for letting users skip reprompting in the conversation. When a preceding node is revisited through a topic loopback or Dialog Act, Virtual Agent bypasses this node and automatically retains its original value.\n\n</td></tr></tbody>\n</table>## Example Carousel input control for NLU topic discovery\n\n**Note:** Asset library controls may display and function differently in other channels.\n\n<table id=\"table_f1f_v2p_xdb\"><thead><tr><th>\n\nCarousel properties\n\n</th><th>\n\nCarousel prompt\n\n</th></tr></thead><tbody><tr><td rowspan=\"2\">\n\n\\[Omitted image \"va-carousel-properties.png\"\\] Alt text: Basic properties include the node name, prompt, NLU entity, script definition for carousel items, and a \"no records\" response message.\n\n</td><td>\n\n\\[Omitted image \"va-carousel-native.png\"\\] Alt text: Example chat in which the prompt asks, \"Select an image.\"\n\n</td></tr><tr><td>\n\n\\[Omitted image \"va-carousel-mobile.png\"\\] Alt text: Example chat in which the prompt asks, \"Please select one of the catalog items.\" The current selection shows an iMac computer.\n\n</td></tr></tbody>\n</table>## Example carousel item expression\n\n```\n(function execute() {\n    var options = [];\n       options.push(\n            {\n                'Name': 'Item 1',\n                'Value': 'item_1',\n                'Description': 'Acme keyboard model 200',\n                'Body': 'https://images.pexels.com/photos/688666/pexels-photo-688666.jpeg'\n                'Card_name': 'AcmeCard'\n                'Card_data': {\"identifier\":\"IT hardware and software\",\"header\":\"Acme keyboard model 200\",\"description\":\"The model 200 keyboard is a ten-key-less keyboard.\"}\n            }\n       );\n       options.push(\n            {\n                'Name': 'Item 2',\n                'Value': 'item_2',\n                'Description': 'Acme keyboard model 300',\n                'Body': 'https://images.pexels.com/photos/916472/pexels-photo-916472.jpeg'\n                'Card_name': 'AcmeCard'\n                'Card_data': {\"identifier\":\"IT hardware and software\",\"header\":\"Acme keyboard model 300\",\"description\":\"The model 300 keyboard is a full-size keyboard with a ten-key pad.\"}\n            }\n       );\n       return options;\n\n})()\n```\n\nThe script in the Carousel Item Expression property defines and returns an array containing the items that appear in your carousel. The elements of this array must contain `name`, `value`, and `body` keys. In the example, the script creates an array called `options` and adds two elements, each with the required keys. The images here are hard-coded as an example.\n\n|Key|Description|\n|---|-----------|\n|Name|Name of the carousel item. This name is shown below the image on the carousel.|\n|Value|Value for the item. When a user selects a carousel item, this value is stored in the variable named in the Variable name property.|\n|Description|Text string that describes the carousel item. The description is shown below the image name. A carousel with more than three items displays left and right arrows for scrolling through the images and a **Select** button under each item. If a description is over 140 characters, users can expand the content.|\n|Body|Image used in the carousel item. The value is a URL for an image file.|\n|Card\\_name|Text string header identifying the card shown in the carousel.|\n|Card\\_data|Array containing text strings to be presented on the card. Values include identifier, header, and description.|\n\n## Channel support\n\n<table id=\"table_ew4_kmx_rsb\"><thead><tr><th>\n\nChannel\n\n</th><th>\n\nLLM support\n\n</th><th>\n\nNLU/keyword support\n\n</th><th>\n\nConstraints\n\n</th></tr></thead><tbody><tr><td>\n\nWeb UI\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nSupported\n\n</td><td>\n\nNone\n\n</td></tr><tr><td>\n\nMobile UI\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nSupported\n\n</td><td>\n\nNone\n\n</td></tr><tr><td>\n\nServiceNow Otto panel\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nSupported\n\n</td><td>\n\nNone\n\n</td></tr><tr><td>\n\nMicrosoft Teams\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nSupported\n\n</td><td>\n\nNone. If the carousel contains more than 10 items, users must select **Next** to review the remaining items.\n\n</td></tr><tr><td>\n\nSlack\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nSupported\n\n</td><td>\n\nNone\n\n</td></tr><tr><td>\n\nWorkplace\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nSupported\n\n</td><td>\n\nNone\n\n</td></tr><tr><td>\n\nFacebook Messenger\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nSupported\n\n</td><td>\n\nThe title for an image has a maximum limit of 40 characters. The text for the image has a maximum character limit of 60 characters. A user can view only 10 images at a time. If there are more than 10 images, the pagination format is used to view more options. The default value of the maximum number of images in a carousel for a page is set in the **sn\\_va\\_fb\\_messenger.max\\_carousel\\_cards** system property. This property is found in the System Properties \\[sys\\_properties\\] table.\n\n</td></tr><tr><td>\n\nSMS Twilio\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nNot supported\n\n</td><td>\n\nNot applicable\n\n</td></tr><tr><td>\n\nLINE\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nSupported\n\n</td><td>\n\nThe title for an image has a maximum limit of 40 characters. The text for the image has a maximum character limit of 60 characters. A user can view only 10 images at a time. If there are more than 10 images, the pagination format is used to view more options. The default value of the maximum number of images in the carousel for a page is set in the **sn\\_va\\_line.max.carousel.cards** system property. The property is located in the System Properties \\[sys\\_properties\\] table.\n\n</td></tr><tr><td>\n\nWhatsApp\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nSupported\n\n</td><td>\n\nNone\n\n</td></tr><tr><td>\n\nApple Messages for Business\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nSupported\n\n</td><td>\n\nNone\n\n</td></tr><tr><td>\n\nAlexa \\(Voice\\)\n\n</td><td>\n\nNot Supported\n\n</td><td>\n\nSupported\n\n</td><td>\n\nFor screen devices, use touch scroll. For nonscreen devices, use voice pagination.\n\n</td></tr></tbody>\n</table>**Parent Topic:**[Assistant Designer user input controls](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/conversational-interfaces/virtual-agent/va-user-inputs.md)\n\n"}}