New story option : disable the right side panel

[troyere]

Hello !

In my team we started months ago the conception & the developpement of some components.

The documentation is now in charge of our product owner and product designer, and we have some needs in term of style, presentation : we're trying to make a more "human readable" documentation page for each component.

Technically we can do that with Histoire, but that implies to not use the right side panel, like, not at all, since all is at the center (texts, component, controls, and styles).

Right at the moment, we have no use of the right side panel. Problem now is : it waste spaces a bit now 😅

Would that be possible to have an option that disable the right side panel ?

Thanks in advance for your help 😉

[troyere]

I guess it would result to a new condition here (probably not only that 😁) :

https://github.com/histoire-dev/histoire/blob/main/packages/histoire-app/src/app/components/story/StoryView.vue#L90

[troyere]

Up

[khako]

Hello !
I am also interested in this feature. I can work on it but I'm wondering what is the best option. Maybe we can add a meta to the to disable the right panel and then in StoryView.vue add a condition to onlt display the StoryViewer ? It could be something like:

// StoryView.vue
...
const disableRightPanel = computed(() => storyStore.currentStory.meta?.disableRightPanel)
<template>
...
    <template v-else-if="disableRightPanel">
      <StoryViewer />
    </template>
</template>

// Button.story.vue
<Story :meta={ disableRightPanel: true }>
   ...
</Story>

Would it be better to create a dedicated props for Story ?

Thanks !