Skip to content

Commit be265cd

Browse files
committed
fix: readme
1 parent a34c063 commit be265cd

File tree

1 file changed

+8
-7
lines changed

1 file changed

+8
-7
lines changed

README.md

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ npm install @gravity-ui/page-constructor
1212

1313
When creating pages, component-based approach is used: a page is built using a set of ready-made blocks that can be placed in any order. Each block has a certain type and set of input data parameters.
1414

15-
For the format of input data and list of available blocks, see the [documentation](http://localhost:7009/?path=/story/information--containers).
15+
For the format of input data and list of available blocks, see the [documentation](https://preview.yandexcloud.dev/page-constructor/?path=/story/information--blocks).
1616

1717
### Getting started
1818

@@ -32,8 +32,8 @@ const Page: WithChildren<PageProps> = ({content}) => (
3232

3333
```typescript
3434
interface PageConstructorProps {
35-
content: PageContent; //Block description in JSON format.
36-
shouldRenderBlock?: ShouldRenderBlock; // A function that is invoked when rendering each block and that lets you set conditions for its display.
35+
content: PageContent; //Blocks data in JSON format.
36+
shouldRenderBlock?: ShouldRenderBlock; // A function that is invoked when rendering each block and lets you set conditions for its display.
3737
custom?: Custom; //Custom blocks (see `Customization`).
3838
renderMenu?: () => React.ReactNode; //A function that renders the page menu with navigation (we plan to add rendering for the default menu version).
3939
}
@@ -97,7 +97,7 @@ To pass custom blocks to the constructor:
9797

9898
2. In your code, create an object with the block type (string) as a key and an imported block component as a value.
9999

100-
3. Pass the object you created to the `custom.blocks` or `custom.headers` parameter of the `PageConstructor` component (`custom.headers` specifies the block headers to be rendered separately above general content).
100+
3. Pass the object you created to the `custom.blocks`, `custom.headers` or `custom.subBlocks` parameter of the `PageConstructor` component (`custom.headers` specifies the block headers to be rendered separately above general content).
101101

102102
4. Now you can use the created block in input data (the `content` parameter) by specifying its type and data.
103103

@@ -150,21 +150,22 @@ Sub-blocks are components that can be used in the block `children` property. In
150150

151151
### How to add a new block to the `page-constructor`
152152

153-
1. In the `src/blocks` or `src/sub-blocks` directory, create a folder with the block/sub-block code.
153+
1. In the `src/blocks` or `src/sub-blocks` directory, create a folder with the block or sub-block code.
154154

155155
2. Add the block or sub-block name to enum `BlockType` or`SubBlockType` and describe its properties in the `src/models/blocks.ts` or `src/models/sub-blocks.ts` file in a similar way to the existing ones.
156156

157-
3. Add export for the block in the `src/blocks/index.ts` file and for the sub-block in the `src/components/index.ts` file.
157+
3. Add export for the block in the `src/blocks/index.ts` file and for the sub-block in the `src/sub-blocks/index.ts` file.
158158

159159
4. Add a new component or block to mapping in `src/constructor-items.ts`.
160160

161161
5. Add a validator for the new block:
162162

163-
- Add a `schema.ts` file to the block/sub-block directory. In this file, describe a parameter validator for the component in [`json-schema`](http://json-schema.org/) format.
163+
- Add a `schema.ts` file to the block or sub-block directory. In this file, describe a parameter validator for the component in [`json-schema`](http://json-schema.org/) format.
164164
- Export it in the `schema/validators/blocks.ts` or `schema/validators/sub-blocks.ts` file.
165165
- Add it to `enum` or `selectCases` in the `schema/index.ts` file.
166166

167167
6. In the block directory, add the `README.md` file with a description of input parameters.
168+
7. In the block directory add storybook demo in `__stories__` folder. (All demo content for story should be placed in `data.json` at story dir)
168169

169170
### Themes
170171

0 commit comments

Comments
 (0)