feat: add blocks readme to mdx

.storybook/main.ts

@@ -12,7 +12,7 @@ const config = {
     docs: {
         autodocs: true,
     },
-    stories: ['./stories/**/*.mdx', '../src/**/*.stories.@(ts|tsx)'],
+    stories: ['./stories/**/*.mdx', '../src/**/__stories__/*.mdx', '../src/**/*.stories.@(ts|tsx)'],
     addons: [
         '@storybook/preset-scss',
         {

.storybook/stories/documentation/Blocks.mdx

@@ -18,34 +18,34 @@ Each block has the following common properties:
 
 _[Common field types](?id=information--common-types&viewMode=docs)_
 
-## [Banner](?path=/story/blocks-banner--default&viewMode=docs)
+## [Banner](?path=/story/blocks-banner--docs&viewMode=docs)
 
-## [CardLayout](?path=/story/blocks-cardlayout--default&viewMode=docs)
+## [CardLayout](?path=/story/blocks-cardlayout--docs&viewMode=docs)
 
-## [Companies](?path=/story/blocks-companies--default&viewMode=docs)
+## [Companies](?path=/story/blocks-companies--docs&viewMode=docs)
 
-## [ContentLayout](?path=/story/blocks-contentlayout--default&viewMode=docs)
+## [ContentLayout](?path=/story/blocks-contentlayout--docs&viewMode=docs)
 
-## [ExtendedFeatures](?path=/story/blocks-extendedfeatures--default&viewMode=docs)
+## [ExtendedFeatures](?path=/story/blocks-extendedfeatures--docs&viewMode=docs)
 
-## [Header](?path=/story/blocks-header--default&viewMode=docs)
+## [Header](?path=/story/blocks-header--docs&viewMode=docs)
 
-## [HeaderSlider](?path=/story/blocks-headerslider--default&viewMode=docs)
+## [HeaderSlider](?path=/story/blocks-headerslider--docs&viewMode=docs)
 
-## [Icons](?path=/story/blocks-icons--default&viewMode=docs)
+## [Icons](?path=/story/blocks-icons--docs&viewMode=docs)
 
-## [Info](?path=/story/blocks-info--default&viewMode=docs)
+## [Info](?path=/story/blocks-info--docs&viewMode=docs)
 
-## [Media](?path=/story/blocks-media--default&viewMode=docs)
+## [Media](?path=/story/blocks-media--docs&viewMode=docs)
 
-## [PromoFeatures](?path=/story/blocks-promofeaturesblock--default-theme&viewMode=docs)
+## [PromoFeatures](?path=/story/blocks-promofeaturesblock--docs-theme&viewMode=docs)
 
-## [Questions](?path=/story/blocks-questions--default&viewMode=docs)
+## [Questions](?path=/story/blocks-questions--docs&viewMode=docs)
 
-## [Share](?path=/story/blocks-share--default&viewMode=docs)
+## [Share](?path=/story/blocks-share--docs&viewMode=docs)
 
-## [Slider](?path=/story/blocks-slider--default&viewMode=docs)
+## [Slider](?path=/story/blocks-slider--docs&viewMode=docs)
 
-## [Table](?path=/story/blocks-table--default&viewMode=docs)
+## [Table](?path=/story/blocks-table--docs&viewMode=docs)
 
-## [Tabs](?path=/story/blocks-tabs--default&viewMode=docs)
+## [Tabs](?path=/story/blocks-tabs--docs&viewMode=docs)

.storybook/stories/documentation/Sub Blocks.mdx

@@ -14,18 +14,18 @@ Fields common for all cards:
 
 _Cards are components that are only used together with the slider or layout:_
 
-## [BannerCard](?path=/story/blocks-banner--default&viewMode=docs)
+## [BannerCard](?path=/story/blocks-banner--docs&viewMode=docs)
 
-## [BasicCard](?path=/story/components-cards-basiccard--default&viewMode=docs)
+## [BasicCard](?path=/story/components-cards-basiccard--docs&viewMode=docs)
 
-## [Media](?path=/story/blocks-media--default&viewMode=docs)
+## [Media](?path=/story/blocks-media--docs&viewMode=docs)
 
-## [BackgroundCard](?path=/story/components-cards-backgroundcard--default&viewMode=docs)
+## [BackgroundCard](?path=/story/components-cards-backgroundcard--docs&viewMode=docs)
 
-## [Content](?path=/story/components-content--default&viewMode=docs)
+## [Content](?path=/story/components-content--docs&viewMode=docs)
 
-## [LayoutItem](?path=/story/components-layoutitem--default&viewMode=docs)
+## [LayoutItem](?path=/story/components-layoutitem--docs&viewMode=docs)
 
 ## [Price Detailed(deprecated)](?path=/story/components-cards-pricedetailed--marked-list&viewMode=docs)
 
-## [Divider](?path=/story/components-divider--default&viewMode=docs)
+## [Divider](?path=/story/components-divider--docs&viewMode=docs)

src/blocks/Banner/README.md → src/blocks/Banner/__stories__/Banner.mdx

@@ -1,4 +1,11 @@
-Banner block
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as BannerStories from './Banner.stories.tsx';
+
+<Meta of={BannerStories} />
+<StoryTemplate>
+## Parameters
 
 `type: 'banner-block'`
 
@@ -13,3 +20,4 @@ Banner block
 `color?: string` — Background color
 
 `button: Button` — Button
+</StoryTemplate>

src/blocks/CardLayout/README.md → src/blocks/CardLayout/__stories__/CardLayout.mdx

@@ -1,3 +1,12 @@
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as CardLayoutStories from './CardLayout.stories.tsx';
+
+<Meta of={CardLayoutStories} />
+<StoryTemplate>
+## Parameters
+
 `type: "card-layout-block"`
 
 `title?: Title | string` — Title.
@@ -20,3 +29,4 @@ The following blocks are currently supported:
 - [`Price Detailed` — Pricing](?path=/story/components-cards-pricedetailed--marked-list&viewMode=docs)
 - [`BackgroundCard` — Background card](?path=/story/components-cards-backgroundcard--default&viewMode=docs)
 - [`LayoutItem` — Component part of `Layout` component, consists with `Media` and `Content`](?path=/story/components-cards-layoutitem--default&viewMode=docs)
+</StoryTemplate>

src/blocks/Companies/__stories__/Companies.mdx

@@ -0,0 +1,16 @@
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as CompaniesStories from './Companies.stories.tsx';
+
+<Meta of={CompaniesStories} />
+<StoryTemplate>
+## Parameters
+
+`type: companies-block`
+
+`title: string` — Title
+
+`images: ImageDeviceProps` — Images for different screen sizes (see in common types)
+</StoryTemplate>
+

src/blocks/ContentLayout/README.md → src/blocks/ContentLayout/__stories__/ContentLayout.mdx

@@ -1,3 +1,12 @@
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as ContentLayoutStories from './ContentLayout.stories.tsx';
+
+<Meta of={ContentLayoutStories} />
+<StoryTemplate>
+## Parameters
+
 `properties:` — Content cube properties (optional)
 
 - `size?: 's' | 'l'` — Cube size that defines font sizes ('l' by default)
@@ -12,3 +21,4 @@
 
 - `href: string` — File download link
 - `text: string` — File description
+</StoryTemplate>

src/blocks/ExtendedFeatures/README.md → src/blocks/ExtendedFeatures/__stories__/ExtendedFeatures.mdx

@@ -1,4 +1,12 @@
-Extended Features block
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as ExtendedFeaturesStories from './ExtendedFeatures.stories.tsx';
+
+<Meta of={ExtendedFeaturesStories} />
+
+<StoryTemplate>
+## Parameters
 
 `type: "extended-features-block"`
 
@@ -24,3 +32,5 @@ Extended Features block
 - `md: number` — On a screen wider than 769px.
 - `lg: number` — On a screen wider than 1081px.
 - `xl: number` — On a screen wider than 1185px.
+</StoryTemplate>
+

src/blocks/FilterBlock/README.md → src/blocks/FilterBlock/__stories__/FilterBlock.mdx

@@ -1,3 +1,12 @@
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as FilterBlockStories from './FilterBlock.stories.tsx';
+
+<Meta of={FilterBlockStories} />
+<StoryTemplate>
+## Parameters
+
 `type: "filter-block"`
 
 `title?: Title | string` — Title.
@@ -17,3 +26,4 @@
 - `card: SubBlock` - card to show.
 
 `centered?: boolean` - Specifies whether the header and the tab panel are centered.
+</StoryTemplate>

src/blocks/Header/README.md → src/blocks/Header/__stories__/Header.mdx

@@ -1,6 +1,13 @@
-Header block
+import {Meta} from '@storybook/blocks';
 
-A page may only have one Header block.
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as HeaderStories from './Header.stories.tsx';
+
+<Meta of={HeaderStories} />
+<StoryTemplate>
+## Parameters
+
+There could be only one one Header block on the page.
 
 `type: 'header-block'`
 
@@ -38,3 +45,4 @@ A page may only have one Header block.
 `theme?: default | dark` — Sets the text color (black by default, white for the dark background).
 
 `verticalOffset?: 's' | 'm' | 'l' | 'xl'` — Top and bottom offsets from the text. (Values: 's' - 48px, 'm' - 80px, 'l' - 112px, 'xl' - 144px.)
+</StoryTemplate>

src/blocks/Info/README.md → src/blocks/Info/__stories__/Info.mdx

@@ -1,4 +1,11 @@
-Info block
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as InfoStories from './Info.stories.tsx';
+
+<Meta of={InfoStories} />
+<StoryTemplate>
+## Parameters
 
 `type: 'info-block'`
 
@@ -9,3 +16,5 @@ Info block
 `rightContent?` - See the [Content](?path=/story/components-content--default&viewMode=docs) component
 
 `leftContent?` - See the [Content](?path=/story/components-content--default&viewMode=docs) component
+</StoryTemplate>
+

src/blocks/Map/README.md → src/blocks/Map/__stories__/Map.mdx

@@ -1,4 +1,12 @@
-Map block
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as MapStories from './Map.stories.tsx';
+
+<Meta of={MapStories} />
+<StoryTemplate>
+
+## Parameters
 
 `type: map-block`
 
@@ -23,3 +31,4 @@ Map block
 [`links?: Link[]` — An array with link objects](?path=/story/information--common-types&viewMode=docs#link---link)
 
 [`buttons?: Button[]` — An array with button objects](?path=/story/information--common-types&viewMode=docs#button---button)
+</StoryTemplate>

src/blocks/Media/README.md → src/blocks/Media/__stories__/Media.mdx

@@ -1,4 +1,11 @@
-Media block
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as MediaStories from './Media.stories.tsx';
+
+<Meta of={MediaStories} />
+<StoryTemplate>
+## Parameters
 
 `type: media-block`
 
@@ -21,3 +28,5 @@ Media block
 [`links?: Link[]` — An array with link objects](?path=/story/information--common-types&viewMode=docs#link---link)
 
 [`buttons?: Button[]` — An array with button objects](?path=/story/information--common-types&viewMode=docs#button---button)
+
+</StoryTemplate>

src/blocks/Questions/README.md → src/blocks/Questions/__stories__/Questions.mdx

@@ -1,4 +1,11 @@
-Questions block
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as QuestionsStories from './Questions.stories.tsx';
+
+<Meta of={QuestionsStories} />
+<StoryTemplate>
+## Parameters
 
 `type: 'questions-block'`
 
@@ -18,3 +25,5 @@ Questions block
 - `text: string` — Question text
 - `link?: Link` — Link below the text (see [Link](?id=components-links-and-buttons-link--default&viewMode=docs))
 - `listStyle?: 'dash' | 'disk'` — If the text contains a list, it may be either with a dash (dash) or with dots (disk).
+</StoryTemplate>
+

src/blocks/Share/__stories__/Share.mdx

@@ -0,0 +1,22 @@
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as ShareStories from './Share.stories.tsx';
+
+<Meta of={ShareStories} />
+
+<StoryTemplate>
+## Parameters
+
+`type: share-block`;
+
+`title?: string` — Title
+
+`items?: []` - Share icons
+
+- `telegram`
+- `facebook`
+- `twitter`
+- `vk`
+</StoryTemplate>
+

src/blocks/Slider/README.md → src/blocks/Slider/__stories__/Slider.mdx

@@ -1,3 +1,12 @@
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as SliderStories from './Slider.stories.tsx';
+
+<Meta of={SliderStories} />
+<StoryTemplate>
+## Parameters
+
 The slider supports two types of content: loadable and from a config. Loadable content is loaded via the `loadable` property and content from a config via the `children` property.
 
 `type: "slider-block"`
@@ -39,3 +48,5 @@ The following blocks are currently supported:
 - [`BackgroundCard` — Background card](?path=/story/components-cards-backgroundcard--default&viewMode=docs)
 - [`LayoutItem` — `Media` + `Content` components in one card-like view](?path=/story/components-cards-layoutitem--default&viewMode=docs)
 - [`MediaCard` — Card with an image](?path=/story/блоки-media--default&viewMode=docs)
+
+</StoryTemplate>

src/blocks/Table/__stories__/Table.mdx

@@ -0,0 +1,15 @@
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as TableStories from './Table.stories.tsx';
+
+<Meta of={TableStories} />
+<StoryTemplate>
+## Parameters
+
+`type: 'table-block'`
+
+`title: string` — Title on the left
+
+`table: Table` — Table content
+</StoryTemplate>

src/blocks/Tabs/README.md → src/blocks/Tabs/__stories__/Tabs.mdx

@@ -1,4 +1,11 @@
-Tabs block
+import {Meta} from '@storybook/blocks';
+
+import {StoryTemplate} from '../../../demo/StoryTemplate.mdx';
+import * as TabsStories from './Tabs.stories.tsx';
+
+<Meta of={TabsStories} />
+<StoryTemplate>
+## Parameters
 
 `type: tabs-block`
 
@@ -31,3 +38,5 @@ Tabs block
 - `image?: string | ImageObjectProps` — Image.
 - [`media: Media` — Media description](?path=/story/information--common-types&viewMode=docs#media---picvideodatalens)
 - `caption?: string` — Image caption.
+
+</StoryTemplate>