AdapTable Vue

AdapTable Vue Custom Components

Summary

  • There are 4 Custom Components that you can provide to AdapTable Vue
  • These are designed to extend and complement the main UI Components that AdapTable provides.
  • They all use VueFrameworkComponent internally
  • The Components which can be provided include:
    • Custom Toolbars in the Dashboard
    • Custom ToolPanels in the Adaptable Tool Panel Component
    • Custom Section in the Settings Panel
    • Custom Windows & Progress Indicators

AdapTable is designed to be extensible.

We expect developers to add additional, bespoke Vue components to meet their requirements.

In particular there are many different types of custom content which can be provided:

VueFrameworkComponent

All Custom Components which target AdapTable Vue leverage the VueFrameworkComponent function.

This gives you access to the Adaptable API, and returns a VueComponent:

export type VueFrameworkComponent<Component extends unknown = unknown> = ({
  adaptableApi,
}: {
  adaptableApi: AdaptableApi;
}) => Component;

Note

  • In all instances the VueFrameworkComponent function will be automatically invoked by AdapTable each time its containing element (Toolbar, Tool Panel or SettingsPanel) becomes visible
  • Similarly, AdapTable automatically unmounts the component when the containing element is hidden
PreviousDemo AppsNextToolbar