Change the order of tabs in the sidebar

This example demonstrates how we can change the tab orders in the sidebar which is created by the Default Layout plugin.

For example, we will switch the orders of the Bookmarks and Thumbnails tabs.

const defaultLayoutPluginInstance = defaultLayoutPlugin({
    sidebarTabs: (defaultTabs) => [
        defaultTabs[1], // Bookmarks tab
        defaultTabs[0], // Thumbnails tab
        defaultTabs[2], // Attachments tab
    ],
});

// Render
<Viewer fileUrl="..." plugins={[defaultLayoutPluginInstance]} />;

(The sample code)

Change the order of tabs in the sidebar

See also