iOS Toolbar Buttons

The KBToolbar.json file contains the definition for the toolbar in the keyboard extension. The structure of the JSON file is an array of toolbar items, each with the following maximal structure.

Note: Not all fields need to be present, in fact only the first two are required.

{
    "order": 3,
    "buttonType": "socialHub",
    "useTint": true,
    "iconResource": "kb_toolbar_items_repository_3",
    "include": [
      "twitch",
      "tiktok",
      "facebook",
      "instagram",
      "rss"
    ],
    "title": "social hub title"
// and in another context you can also have URL
		"url": "https://www.google.com"
  },

• "order": - controls the order of toolbar buttons in the keyboard toolbar. If there are more than 7 buttons specified, automatically the 7th is generated to be the More button, and all buttons starting from the 7th in the order of “order” field are displayed in the More section.
• "buttonType" - this can be one of:

public enum ButtonType: String {        
        case socialHub        // container for social sub-items
        case gifs
        case stickers
        case webLink          // link to a web page in browser, or deep-link inside app
        case brand            // brand logo button
        case themes        
        case settings
        case embeddedBrowser  // embedded browser
        case tappaText        // chat feature
        case deeplink				  // deeplinks into main app

        // social
        case twitter
        case youtube
        case facebook
        case instagram
        case twitch
        case tiktok
        case rss
}

where the types under social can appear as subitems in the bottom of the socialHub item, or as standalone items

• "useTint" - if the button icon uses or not the tint from the theme, default is false
• "iconResource" - the name of the UI asset that exists in Media.assets and contains the icon image of the toolbar button. If not present, a default representation is chosen based on type. See

Assets

• "include" - items can include subitems (bottom-bar). Example:

"buttonType": "socialHub",
"include": [
      "instagram",
      "twitter",
      "tiktok"
],

• "title" - if the current toolbar item is not in the main (first 7) items, this is the Title that appears for the button. If not present, the title will be missing.
• "url" - this field serves a dual purpose depending on the type of button. For buttons like "brand" or "webLink", clicking on the button will open the URL specified in this field, directing the user to the associated web page. In the case of a deeplink button, the "url" field allows the client to set a deeplink URL, which will be dynamically populated with text input from the keyboard, indicated by the placeholder [[KB_TEXT]]. This enables the button to perform context-specific actions based on user input, enhancing interactivity and personalization in the user's experience.