AIContainerCustom
interface
The configuration of the AI user interface container in the custom mode.
In this mode, integrator is responsible for rendering the AI user interface in the web page.
- Use
viewto access the view of the AI user interface, - Use
getTabIdsto read available IDs of individual tabs in the AI user interface, - Use
getTabto access individual tab views in the AI user interface, - Use
addTabto add a new tab to the AI user interface, - Use
activateTabto switch between tabs from the code.
For example, to integrate the AI user interface with custom containers on the web page, use the following code:
const tabsPlugin = editor.plugins.get( 'AITabs' );
for ( const id of tabsPlugin.view.getTabIds() ) {
const tab = tabsPlugin.view.getTab( id );
// Display tab button and panel in a custom container.
myButtonsContainer.appendChild( tab.button.element );
myPanelContainer.appendChild( tab.panel.element );
}
Copy code
Properties
-
showResizeButton : boolean | undefinedinheritedmodule:ai/aiconfig~AIContainerCustom#showResizeButtonThis option is used to show or hide the resize button in the AI user interface.
Defaults to
true. -
type : 'custom'module:ai/aiconfig~AIContainerCustom#type -
visibleByDefault : boolean | undefinedinheritedmodule:ai/aiconfig~AIContainerCustom#visibleByDefaultWhether the AI interface should be visible when the editor is created.