docs: use helper for dark background

Author: Nikolai Lopin

src/components/Button/docs/Button.stories.tsx

@@ -2,6 +2,7 @@ import { StoryObj, Meta } from '@storybook/react';
 import React from 'react';
 import { Button } from '../Button';
 import TrashBinIcon from '../../../icons/actions/TrashBinIcon';
+import { onDarkBackground } from '../../../docs/parameters';
 
 const meta: Meta = {
     title: 'Components/Button/Button',
@@ -83,9 +84,7 @@ export const Inverted: Story = {
         inverted: true
     },
     parameters: {
-        backgrounds: {
-            default: 'dark'
-        }
+        ...onDarkBackground
     }
 };
 

src/components/Button/docs/TextButton.stories.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { StoryObj, Meta } from '@storybook/react';
 import { TextButton } from '../TextButton';
+import { onDarkBackground } from '../../../docs/parameters';
 
 const meta: Meta = {
     title: 'Components/Button/TextButton',
@@ -76,8 +77,6 @@ export const Inverted: Story = {
         inverted: true
     },
     parameters: {
-        backgrounds: {
-            default: 'dark'
-        }
+        ...onDarkBackground
     }
 };

src/components/Headline/docs/Headline.stories.tsx

@@ -1,5 +1,6 @@
 import { Meta, StoryObj } from '@storybook/react';
 import { DEFAULT_HEADLINE_SIZE, Headline } from '../Headline';
+import { onDarkBackground } from '../../../docs/parameters';
 
 const meta: Meta = {
     title: 'Components/Headline',
@@ -46,9 +47,7 @@ export const Inverted: Story = {
         inverted: true
     },
     parameters: {
-        backgrounds: {
-            default: 'dark'
-        }
+        ...onDarkBackground
     }
 };
 

src/components/HelperText/docs/HelperText.stories.tsx

@@ -1,5 +1,6 @@
 import { Meta, StoryObj } from '@storybook/react';
 import { HelperText } from '../HelperText';
+import { onDarkBackground } from '../../../docs/parameters';
 
 const meta: Meta = {
     title: 'Components/HelperText',
@@ -32,8 +33,6 @@ export const Inverted: Story = {
         inverted: true
     },
     parameters: {
-        backgrounds: {
-            default: 'dark'
-        }
+        ...onDarkBackground
     }
 };

src/components/Logo/docs/Logo.stories.tsx

@@ -1,5 +1,6 @@
 import { Meta, StoryObj } from '@storybook/react';
 import { Logo } from '../Logo';
+import { onDarkBackground } from '../../../docs/parameters';
 
 const meta: Meta<typeof Logo> = {
     title: 'Components/Logo',
@@ -36,8 +37,6 @@ export const Inverted: Story = {
         inverted: true
     },
     parameters: {
-        backgrounds: {
-            default: 'dark'
-        }
+        ...onDarkBackground
     }
 };