feat: storybook 9

.storybook/decorators/withLang.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
 import {Lang, configure} from '@gravity-ui/uikit';
-import type {Decorator} from '@storybook/react';
+import type {Decorator} from '@storybook/react-webpack5';
 
 export const withLang: Decorator = (Story, context) => {
     const lang = context.globals.lang;

.storybook/decorators/withMobile.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
 import {MobileProvider} from '@gravity-ui/uikit';
-import type {Decorator} from '@storybook/react';
+import type {Decorator} from '@storybook/react-webpack5';
 
 export const withMobile: Decorator = (Story, context) => {
     const platform = context.globals.platform;

.storybook/focus-addon/register.tsx

@@ -1,4 +1,4 @@
-import {addons} from '@storybook/manager-api';
+import {addons} from 'storybook/manager-api';
 
 addons.register('initialFocus', () => {
     addons.getChannel().on('currentStoryWasSet', () => focusIframe());

.storybook/main.ts

@@ -6,8 +6,6 @@ const config: StorybookConfig = {
 
     addons: [
         '@storybook/addon-links',
-        { name: '@storybook/addon-essentials', options: { backgrounds: false } },
-        '@storybook/addon-interactions',
         'storybook-preset-inline-svg',
         './theme-addon/register.tsx',
         './focus-addon/register.tsx',
@@ -21,12 +19,6 @@ const config: StorybookConfig = {
         options: {}
     },
 
-    docs: {},
-
-    core: {
-        disableTelemetry: true,
-    },
-
     typescript: {
         reactDocgen: 'react-docgen-typescript'
     },
@@ -108,8 +100,11 @@ const config: StorybookConfig = {
         );
 
         return config;
-    }
+    },
 
+    features: {
+      backgrounds: false
+    }
 };
 
 export default config;

.storybook/manager.ts

@@ -1,4 +1,4 @@
-import {addons} from '@storybook/manager-api';
+import {addons} from 'storybook/manager-api';
 import {themes} from './theme';
 
 addons.setConfig({

.storybook/preview.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import type {Decorator, Preview} from '@storybook/react';
+import type {Decorator, Preview} from '@storybook/react-webpack5';
 import {ThemeProvider, MobileProvider, Lang, configure as uiKitConfigure} from '@gravity-ui/uikit';
 import {withMobile} from './decorators/withMobile';
 import {withLang} from './decorators/withLang';

.storybook/theme-addon/register.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import {addons, types} from '@storybook/manager-api';
-import {useGlobals, type API} from '@storybook/manager-api';
+import {addons, types} from 'storybook/manager-api';
+import {useGlobals, type API} from 'storybook/manager-api';
 import {getThemeType} from '@gravity-ui/uikit';
 import {themes} from '../theme';
 

.storybook/theme.ts

@@ -1,4 +1,4 @@
-import {create} from '@storybook/theming';
+import {create} from 'storybook/theming';
 
 const CloudThemeLight = create({
     base: 'light',