diff --git a/packages/vkui/.storybook/addons/source-tab/SourceTab.tsx b/packages/vkui/.storybook/addons/source-tab/SourceTab.tsx index 0aa66dcb28..661bb4af3b 100644 --- a/packages/vkui/.storybook/addons/source-tab/SourceTab.tsx +++ b/packages/vkui/.storybook/addons/source-tab/SourceTab.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import type { StoryId } from '@storybook/types'; -import { SyntaxHighlighter } from '@storybook/components'; +import { AddonPanel, SyntaxHighlighter } from '@storybook/components'; import { SNIPPET_RENDERED } from '@storybook/docs-tools'; import { useChannel } from '@storybook/manager-api'; @@ -10,7 +10,7 @@ type SnippetRenderedArgs = { source: string; }; -export const SourceTab = () => { +export const SourceTab: React.FC<{ active: boolean }> = ({ active }) => { const [{ source }, handleSnippetRendered] = React.useState({ id: '', args: {}, @@ -21,15 +21,21 @@ export const SourceTab = () => { const sourceAvailable = Boolean(source); + if (!active) { + return null; + } + return ( - - {sourceAvailable ? source : 'Compiling...'} - + + + {sourceAvailable ? source : 'Compiling...'} + + ); }; diff --git a/packages/vkui/.storybook/addons/source-tab/register.tsx b/packages/vkui/.storybook/addons/source-tab/register.tsx index 66ea042e25..33d58273fd 100644 --- a/packages/vkui/.storybook/addons/source-tab/register.tsx +++ b/packages/vkui/.storybook/addons/source-tab/register.tsx @@ -1,5 +1,4 @@ import * as React from 'react'; -import { AddonPanel } from '@storybook/components'; import { addons, types } from '@storybook/manager-api'; import { SourceTab } from './SourceTab'; import { ADDON_ID, PANEL_ID } from './constants'; @@ -9,10 +8,6 @@ addons.register(ADDON_ID, () => { type: types.PANEL, title: 'Source', match: ({ viewMode }) => !!(viewMode && viewMode.match(/^story$/)), - render: ({ active = false }) => ( - - - - ), + render: ({ active = false }) => , }); });