container-override.stories.mdx

import { useRef } from 'react'; import { Meta, DocsContainer, Story, ArgsTable } from '@storybook/addon-docs';

<Meta title="Addons/Docs/container-override" parameters={{ docs: { // eslint-disable-next-line react/prop-types container: ({ children, context }) => { const countRef = useRef(); countRef.current = (countRef.current || 0) + 1; return ( <div style={{ border: '5px solid red' }}>{children}

Container rendered {countRef.current} times

Try changing:

• the arg - story should rerender but container should not
• a global (eg theme) - both should rerender

); }, }, }} />

export const Component = () => { const countRef = useRef(); countRef.current = (countRef.current || 0) + 1; return

Story rendered {countRef.current} times

; };

<Story name="dummy" parameters={{ layout: 'fullscreen' }}>