Hide Addon Tab Globally in Storybook

Question

I wish to hide an Addon Tab globally (not per story). I don't wish to disable the addon itself, just hide its tab panel.

I'm using version 5.3.18 of Storybook with React and the addon tab I wish to hide is from addon "styled-component theme".

Sorry, I know this sounds a basic question but I just can't find out how to do this. Any help appreciated.

Answer 1

I'm unsure how to disable the addon bar - though it would be a nice to have. However if you want to disable one particular addon globally then the following should work. You could then do the below with all of your addons.

Assuming you want to disable the controls addon.

/* preview.ts */

export const parameters = {
  controls: { disabled: true },
};

Answer 2

I think you mean the panel instead of the controls addon ? You can configure this in the .storybook/manager.js file like this:

// .storybook/manager.js

import { addons } from '@storybook/addons';     
  
addons.setConfig({
    options: {showPanel: false}
});

There will be no more panel at the bottom of your stories :) Only when your single story has this parameter:

parameters={{ options: {showPanel: true} }}

It will show up again.