Extensions/Authoring/contentTabs

Extensions add specific functionality to Learnosity APIs. They rely on modules within LT being available.

--

Adds the ability for authors to add any number of tabs within a rich-text content block. This is achieved by leveraging custom buttons.

Each tab can be labelled. You can set content within each tab.

Important

The active tab (ie the tab that will be in focus) will be the one that the author last had focus on when they changed content and saved. You probably want that to be the first tab. If it's not, you need to edit the question, click the first tab inside the rich-text editor, make sure to change something even if it's adding a character and removing it, then save.

Adding a custom button is a capability in Author API. Below is a code snippet of an Author API configuration object. Note the custom button is added under rich_text_editor.

You MUST use the object as defined below. Also, note the toolbar_settings which is required to place the custom button(s) where you want in the toolbar.

{
    "config": {
        "dependencies": {
            "question_editor_api": {
                "init_options": {
                    "rich_text_editor": {
                        "customButtons": [
                            {
                                "func": "LT.extensions.contentTabs.addContentTabs",
                                "icon": "https://raw.githubusercontent.com/michaelsharman/LT/refs/heads/main/src/authoring/extensions/ui/contentTabs/assets/images/icon_tabs.svg",
                                "label": "Add content tabs",
                                "name": "addContentTabs",
                                "attributes": ["content","stimulus","template"]
                            }
                        ],
                        "toolbar_settings": {
                            "ltr_toolbar": [
                                {
                                    "items": ["Bold","Italic","Underline","-","TextColor","-", "LrnUnderlinedIndicator","-","RemoveFormat","FontSize"],
                                    "name": "basicstyles"
                                },
                                {
                                    "items": ["NumberedList","BulletedList","-","Indent","Outdent"],
                                    "name": "list"
                                },
                                {
                                    "items": ["JustifyLeft","JustifyCenter","JustifyRight","JustifyBlock"],
                                    "name": "justify"
                                },
                                {
                                    "items": ["Link","Unlink"],
                                    "name": "link"
                                },
                                {
                                    "items": ["Image","LrnMath","Table","Blockquote","SpecialChar"],
                                    "name": "insert"
                                },
                                {
                                    "items": ["LrnSimpleFeature"],
                                    "name": "simplefeature"
                                },
                                {
                                    "items": ["LrnResource"],
                                    "name": "resource"
                                },
                                {
                                    "items": ["LrnEditAriaLabel","LrnPopupContent"],
                                    "name": "editAriaLabel"
                                },
                                {
                                    "name": "custombuttons"
                                },
                                {
                                    "items": ["Undo","Redo"],
                                    "name": "clipboard"
                                },
                                {
                                    "items": ["Styles"],
                                    "name": "style"
                                },
                                {
                                    "items": ["Sourcedialog"],
                                    "name": "mode"
                                },
                                {
                                    "items": ["lrn_datatable"],
                                    "name": "data"
                                }
                            ]
                        }
                    }
                }
            }
        }
    }
}

import { LT } from '@caspingus/lt/src/authoring/index';

LT.init(authorApp); // Set up LT with the Author API application instance variable
LT.extensions.contentTabs.run();