@gravity-ui/page-constructor 1.8.0-alfa.0 → 1.8.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## [1.8.0](https://github.com/gravity-ui/page-constructor/compare/v1.7.1...v1.8.0) (2022-12-02)
+
+
+### Features
+
+* add **navigation** ([99493a4](https://github.com/gravity-ui/page-constructor/commit/99493a4ab17af679bba250b3c7d00b4fe9256baa))
+
+
+## [1.7.1](https://github.com/gravity-ui/page-constructor/compare/v1.7.0...v1.7.1) (2022-11-29)
+
+
+### Bug Fixes
+
+* **ExtendedFeatures:** add props ([6254d62](https://github.com/gravity-ui/page-constructor/commit/6254d62b9ceded154d0fdcded9a554fd33772d13))
+* storybook content ([b98eccc](https://github.com/gravity-ui/page-constructor/commit/b98ecccc96cfba2376552e4c9314a559913455d9))
+
 ## [1.7.0](https://github.com/gravity-ui/page-constructor/compare/v1.6.1...v1.7.0) (2022-11-10)
 
 

package/README.md

@@ -32,59 +32,81 @@ const Page: WithChildren<PageProps> = ({content}) => (
 
 ```typescript
 interface PageConstructorProps {
-    content: PageContent; //Blocks data in JSON format.
-    shouldRenderBlock?: ShouldRenderBlock; // A function that is invoked when rendering each block and  lets you set conditions for its display.
-    custom?: Custom; //Custom blocks (see `Customization`).
-    renderMenu?: () => React.ReactNode; //A function that renders the page menu with navigation (we plan to add rendering for the default menu version).
+  content: PageContent; //Blocks data in JSON format.
+  shouldRenderBlock?: ShouldRenderBlock; // A function that is invoked when rendering each block and  lets you set conditions for its display.
+  custom?: Custom; //Custom blocks (see `Customization`).
+  renderMenu?: () => React.ReactNode; //A function that renders the page menu with navigation (we plan to add rendering for the default menu version).
+  navigation?: NavigationData; // Navigation data for using navigation component in JSON format
 }
 
 interface PageConstructorProviderProps {
-    isMobile?: boolean; //A flag indicating that the code is executed in mobile mode.
-    locale?: LocaleContextProps; //Info about the language and domain (used when generating and formatting links).
-    location?: Location; //API of the browser or router history, the page URL.
-    metrika?: Metrika; //Functions for sending analytics
-    ssrConfig?: SSR; //A flag indicating that the code is run on the server size.
-    theme?: 'light' | 'dark'; //Theme to render the page with.
+  isMobile?: boolean; //A flag indicating that the code is executed in mobile mode.
+  locale?: LocaleContextProps; //Info about the language and domain (used when generating and formatting links).
+  location?: Location; //API of the browser or router history, the page URL.
+  metrika?: Metrika; //Functions for sending analytics
+  ssrConfig?: SSR; //A flag indicating that the code is run on the server size.
+  theme?: 'light' | 'dark'; //Theme to render the page with.
 }
 
 export interface PageContent extends Animatable {
-    blocks: Block[];
-    menu?: Menu;
-    background?: MediaProps;
-    footnotes?: string[];
+  blocks: Block[];
+  menu?: Menu;
+  background?: MediaProps;
+  footnotes?: string[];
 }
 
 interface Custom {
-    blocks?: CustomItems;
-    subBlocks?:CustomItems;
-    headers?: CustomItems;
-    loadable?: LoadableConfig;
+  blocks?: CustomItems;
+  subBlocks?: CustomItems;
+  headers?: CustomItems;
+  loadable?: LoadableConfig;
 }
 
 type ShouldRenderBlock = (block: Block, blockKey: string) => Boolean;
 
-interface Location = {
-    history?: History;
-    search?: string;
-    hash?: string;
-    pathname?: string;
-    hostname?: string;
-};
-
-interface Locale = {
-    lang?: Lang;
-    tld?: string;
-};
-
-interface SSR = {
-    isServer?: boolean;
+interface Location {
+  history?: History;
+  search?: string;
+  hash?: string;
+  pathname?: string;
+  hostname?: string;
 }
 
-interface Metrika = {
-    metrika?: any;
-    pixel?: any;
+interface Locale {
+  lang?: Lang;
+  tld?: string;
 }
 
+interface SSR {
+  isServer?: boolean;
+}
+
+interface Metrika {
+  metrika?: any;
+  pixel?: any;
+}
+
+interface NavigationData {
+  logo: NavigationLogo;
+  header: HeaderData;
+}
+
+interface NavigationLogo {
+  icon: ImageProps;
+  text?: string;
+  url?: string;
+}
+
+interface HeaderData {
+  leftItems: NavigationItem[];
+  rightItems?: NavigationItem[];
+}
+
+interface NavigationLogo {
+  icon: ImageProps;
+  text?: string;
+  url?: string;
+}
 ```
 
 ### Custom blocks

package/build/cjs/blocks/Banner/schema.d.ts

@@ -4,11 +4,9 @@ export declare const BannerCardProps: {
     properties: {
         title: {
             type: string;
-            content: string;
         };
         subtitle: {
             type: string;
-            content: string;
         };
         image: {
             oneOf: ({
@@ -47,7 +45,6 @@ export declare const BannerCardProps: {
             properties: {
                 text: {
                     type: string;
-                    content: string;
                 };
                 url: {
                     type: string;
@@ -83,7 +80,6 @@ export declare const BannerCardProps: {
                             };
                             alt: {
                                 type: string;
-                                content: string;
                             };
                         };
                     })[];
@@ -206,11 +202,9 @@ export declare const BannerBlock: {
         properties: {
             title: {
                 type: string;
-                content: string;
             };
             subtitle: {
                 type: string;
-                content: string;
             };
             image: {
                 oneOf: ({
@@ -249,7 +243,6 @@ export declare const BannerBlock: {
                 properties: {
                     text: {
                         type: string;
-                        content: string;
                     };
                     url: {
                         type: string;
@@ -285,7 +278,6 @@ export declare const BannerBlock: {
                                 };
                                 alt: {
                                     type: string;
-                                    content: string;
                                 };
                             };
                         })[];
@@ -409,11 +401,9 @@ export declare const BannerCard: {
         properties: {
             title: {
                 type: string;
-                content: string;
             };
             subtitle: {
                 type: string;
-                content: string;
             };
             image: {
                 oneOf: ({
@@ -452,7 +442,6 @@ export declare const BannerCard: {
                 properties: {
                     text: {
                         type: string;
-                        content: string;
                     };
                     url: {
                         type: string;
@@ -488,7 +477,6 @@ export declare const BannerCard: {
                                 };
                                 alt: {
                                     type: string;
-                                    content: string;
                                 };
                             };
                         })[];

package/build/cjs/blocks/Banner/schema.js

@@ -7,10 +7,8 @@ exports.BannerCardProps = {
     required: ['title', 'button'],
     properties: Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.AnimatableProps), { title: {
             type: 'string',
-            content: 'text',
         }, subtitle: {
             type: 'string',
-            content: 'yfm',
         }, image: (0, common_1.withTheme)({
             type: 'string',
         }), disableCompress: {

package/build/cjs/blocks/CardLayout/schema.d.ts

@@ -10,7 +10,6 @@ export declare const CardLayoutProps: {
                 properties: {
                     text: {
                         type: string;
-                        content: string;
                     };
                     textSize: {
                         type: string;
@@ -25,12 +24,10 @@ export declare const CardLayoutProps: {
                 };
             } | {
                 type: string;
-                content: string;
             })[];
         };
         description: {
             type: string;
-            content: string;
         };
         colSizes: {
             type: string;
@@ -53,7 +50,6 @@ export declare const CardLayoutProps: {
             properties: {
                 text: {
                     type: string;
-                    content: string;
                 };
                 url: {
                     type: string;
@@ -84,7 +80,6 @@ export declare const CardLayoutBlock: {
                     properties: {
                         text: {
                             type: string;
-                            content: string;
                         };
                         textSize: {
                             type: string;
@@ -99,12 +94,10 @@ export declare const CardLayoutBlock: {
                     };
                 } | {
                     type: string;
-                    content: string;
                 })[];
             };
             description: {
                 type: string;
-                content: string;
             };
             colSizes: {
                 type: string;
@@ -127,7 +120,6 @@ export declare const CardLayoutBlock: {
                 properties: {
                     text: {
                         type: string;
-                        content: string;
                     };
                     url: {
                         type: string;

package/build/cjs/blocks/CardLayout/schema.js

@@ -6,10 +6,9 @@ exports.CardLayoutProps = {
     additionalProperties: false,
     required: ['title'],
     properties: Object.assign(Object.assign(Object.assign({}, common_1.BlockBaseProps), common_1.AnimatableProps), { title: {
-            oneOf: [{ type: 'string', content: 'text' }, common_1.TitleProps],
+            oneOf: [{ type: 'string' }, common_1.TitleProps],
         }, description: {
             type: 'string',
-            content: 'text',
         }, colSizes: common_1.containerSizesObject, children: common_1.ChildrenCardsProps }),
 };
 exports.CardLayoutBlock = {

package/build/cjs/blocks/Companies/schema.d.ts

@@ -5,7 +5,6 @@ export declare const CompaniesBlock: {
         properties: {
             title: {
                 type: string;
-                content: string;
             };
             images: {
                 oneOf: ({
@@ -23,7 +22,6 @@ export declare const CompaniesBlock: {
                         };
                         alt: {
                             type: string;
-                            content: string;
                         };
                     };
                 } | {

package/build/cjs/blocks/Companies/schema.js

@@ -8,7 +8,6 @@ exports.CompaniesBlock = {
         required: ['title', 'images'],
         properties: Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.AnimatableProps), { title: {
                 type: 'string',
-                content: 'text',
             }, images: (0, common_1.withTheme)({
                 type: 'object',
                 required: ['desktop', 'tablet', 'mobile'],
@@ -24,7 +23,6 @@ exports.CompaniesBlock = {
                     },
                     alt: {
                         type: 'string',
-                        content: 'text',
                     },
                 },
             }) }),

package/build/cjs/blocks/ContentLayout/schema.d.ts

@@ -18,7 +18,6 @@ export declare const ContentLayoutBlock: {
                                 properties: {
                                     text: {
                                         type: string;
-                                        content: string;
                                     };
                                     textSize: {
                                         type: string;
@@ -33,16 +32,13 @@ export declare const ContentLayoutBlock: {
                                 };
                             } | {
                                 type: string;
-                                content: string;
                             })[];
                         };
                         text: {
                             type: string;
-                            content: string;
                         };
                         additionalInfo: {
                             type: string;
-                            content: string;
                         };
                         size: {
                             type: string;
@@ -104,7 +100,6 @@ export declare const ContentLayoutBlock: {
                         };
                         alt: {
                             type: string;
-                            content: string;
                         };
                         disableCompress: {
                             type: string;
@@ -130,7 +125,6 @@ export declare const ContentLayoutBlock: {
                 properties: {
                     text: {
                         type: string;
-                        content: string;
                     };
                     url: {
                         type: string;

package/build/cjs/blocks/ExtendedFeatures/ExtendedFeatures.js

@@ -21,7 +21,7 @@ const ExtendedFeaturesBlock = ({ title, description, items, colSizes = DEFAULT_S
     return (react_1.default.createElement(components_1.AnimateBlock, { className: b(), animate: animated },
         react_1.default.createElement(components_1.BlockHeader, { title: title, description: description, className: b('header') }),
         react_1.default.createElement("div", { className: b('items') },
-            react_1.default.createElement(grid_1.Row, null, items.map(({ title: itemTitle, text, link, links, label, icon }) => {
+            react_1.default.createElement(grid_1.Row, null, items.map(({ title: itemTitle, text, link, links, label, icon, buttons, additionalInfo, }) => {
                 const itemLinks = links || [];
                 const iconThemed = icon && (0, utils_1.getThemedValue)(icon, theme);
                 const iconData = iconThemed && (0, utils_2.getMediaImage)(iconThemed);
@@ -34,7 +34,7 @@ const ExtendedFeaturesBlock = ({ title, description, items, colSizes = DEFAULT_S
                         itemTitle && (react_1.default.createElement("h5", { className: b('item-title') },
                             react_1.default.createElement(components_1.HTML, null, itemTitle),
                             label && (react_1.default.createElement("div", { className: b('item-label') }, label)))),
-                        react_1.default.createElement(sub_blocks_1.Content, { text: text, links: itemLinks, size: "s", colSizes: { all: 12, md: 12 } }))));
+                        react_1.default.createElement(sub_blocks_1.Content, { text: text, links: itemLinks, size: "s", colSizes: { all: 12, md: 12 }, buttons: buttons, additionalInfo: additionalInfo }))));
             })))));
 };
 exports.ExtendedFeaturesBlock = ExtendedFeaturesBlock;

package/build/cjs/blocks/ExtendedFeatures/schema.d.ts

@@ -4,11 +4,9 @@ export declare const ExtendedFeaturesItem: {
     properties: {
         title: {
             type: string;
-            content: string;
         };
         text: {
             type: string;
-            content: string;
         };
         label: {
             type: string;
@@ -21,7 +19,6 @@ export declare const ExtendedFeaturesItem: {
             properties: {
                 text: {
                     type: string;
-                    content: string;
                 };
                 url: {
                     type: string;
@@ -63,7 +60,6 @@ export declare const ExtendedFeaturesBlock: {
                     properties: {
                         text: {
                             type: string;
-                            content: string;
                         };
                         textSize: {
                             type: string;
@@ -78,12 +74,10 @@ export declare const ExtendedFeaturesBlock: {
                     };
                 } | {
                     type: string;
-                    content: string;
                 })[];
             };
             description: {
                 type: string;
-                content: string;
             };
             items: {
                 type: string;
@@ -111,7 +105,6 @@ export declare const ExtendedFeaturesBlock: {
                 properties: {
                     text: {
                         type: string;
-                        content: string;
                     };
                     url: {
                         type: string;

package/build/cjs/blocks/ExtendedFeatures/schema.js

@@ -9,11 +9,9 @@ exports.ExtendedFeaturesItem = {
     properties: {
         title: {
             type: 'string',
-            content: 'text',
         },
         text: {
             type: 'string',
-            content: 'yfm',
         },
         label: {
             type: 'string',
@@ -30,10 +28,9 @@ exports.ExtendedFeaturesBlock = {
         additionalProperties: false,
         required: [],
         properties: Object.assign(Object.assign(Object.assign({}, common_1.BlockBaseProps), common_1.AnimatableProps), { title: {
-                oneOf: [{ type: 'string', content: 'text' }, common_1.TitleProps],
+                oneOf: [{ type: 'string' }, common_1.TitleProps],
             }, description: {
                 type: 'string',
-                content: 'yfm',
             }, items: (0, utils_1.filteredArray)(exports.ExtendedFeaturesItem), colSizes: common_1.containerSizesObject }),
     },
 };

package/build/cjs/blocks/Header/schema.d.ts

@@ -97,7 +97,6 @@ export declare const HeaderBackgroundProps: {
                         };
                         text: {
                             type: string;
-                            content: string;
                         };
                     };
                 };
@@ -142,15 +141,12 @@ export declare const HeaderBackgroundProps: {
 export declare const HeaderProperties: {
     title: {
         type: string;
-        content: string;
     };
     overtitle: {
         type: string;
-        content: string;
     };
     description: {
         type: string;
-        content: string;
     };
     width: {
         type: string;
@@ -247,7 +243,6 @@ export declare const HeaderProperties: {
                         };
                         text: {
                             type: string;
-                            content: string;
                         };
                     };
                 };
@@ -272,7 +267,6 @@ export declare const HeaderProperties: {
             };
             title: {
                 type: string;
-                content: string;
             };
         };
     };
@@ -384,7 +378,6 @@ export declare const HeaderProperties: {
                                 };
                                 text: {
                                     type: string;
-                                    content: string;
                                 };
                             };
                         };
@@ -453,7 +446,6 @@ export declare const HeaderProperties: {
                         };
                         text: {
                             type: string;
-                            content: string;
                         };
                     };
                 };
@@ -475,15 +467,12 @@ export declare const HeaderBlock: {
         properties: {
             title: {
                 type: string;
-                content: string;
             };
             overtitle: {
                 type: string;
-                content: string;
             };
             description: {
                 type: string;
-                content: string;
             };
             width: {
                 type: string;
@@ -580,7 +569,6 @@ export declare const HeaderBlock: {
                                 };
                                 text: {
                                     type: string;
-                                    content: string;
                                 };
                             };
                         };
@@ -605,7 +593,6 @@ export declare const HeaderBlock: {
                     };
                     title: {
                         type: string;
-                        content: string;
                     };
                 };
             };
@@ -717,7 +704,6 @@ export declare const HeaderBlock: {
                                         };
                                         text: {
                                             type: string;
-                                            content: string;
                                         };
                                     };
                                 };
@@ -786,7 +772,6 @@ export declare const HeaderBlock: {
                                 };
                                 text: {
                                     type: string;
-                                    content: string;
                                 };
                             };
                         };
@@ -807,7 +792,6 @@ export declare const HeaderBlock: {
                 properties: {
                     text: {
                         type: string;
-                        content: string;
                     };
                     url: {
                         type: string;

package/build/cjs/blocks/Header/schema.js

@@ -13,15 +13,12 @@ exports.HeaderBackgroundProps = {
 exports.HeaderProperties = {
     title: {
         type: 'string',
-        content: 'text',
     },
     overtitle: {
         type: 'string',
-        content: 'text',
     },
     description: {
         type: 'string',
-        content: 'yfm',
     },
     width: {
         type: 'string',
@@ -43,7 +40,6 @@ exports.HeaderProperties = {
             },
             title: {
                 type: 'string',
-                content: 'text',
             },
         },
     },
@@ -77,7 +73,6 @@ exports.HeaderProperties = {
                         },
                         text: {
                             type: 'string',
-                            content: 'text',
                         },
                     },
                 },