@gravity-ui/page-constructor 8.4.2 → 8.5.0-alpha.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "8.4.2",
+  "version": "8.5.0-alpha.0",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "type": "commonjs",
@@ -24,14 +24,33 @@
       "require": "./build/cjs/editor/index.js",
       "import": "./build/esm/editor/index.js"
     },
+    "./editor-v2": {
+      "types": "./build/esm/editor-v2/index.d.ts",
+      "require": "./build/cjs/editor-v2/index.js",
+      "import": "./build/esm/editor-v2/index.js"
+    },
+    "./form-generator": {
+      "types": "./build/esm/form-generator/index.d.ts",
+      "require": "./build/cjs/form-generator/index.js",
+      "import": "./build/esm/form-generator/index.js"
+    },
+    "./form-builder": {
+      "types": "./build/esm/form-builder/index.d.ts",
+      "require": "./build/cjs/form-builder/index.js",
+      "import": "./build/esm/form-builder/index.js"
+    },
+    "./gravity-blocks": {
+      "types": "./build/esm/gravity-blocks/index.d.ts",
+      "require": "./build/cjs/gravity-blocks/index.js",
+      "import": "./build/esm/gravity-blocks/index.js"
+    },
     "./server": {
       "types": "./server/index.d.ts",
       "require": "./server/index.js",
       "import": "./server/index.js"
     },
     "./styles/*": "./styles/*",
-    "./widget/*": "./widget/*",
-    "./schema/*": "./schema/*"
+    "./widget/*": "./widget/*"
   },
   "main": "./build/cjs/index.js",
   "module": "./build/esm/index.js",
@@ -44,6 +63,18 @@
       "editor": [
         "./build/esm/editor/index.d.ts"
       ],
+      "editor-v2": [
+        "./build/esm/editor-v2/index.d.ts"
+      ],
+      "form-generator": [
+        "./build/esm/form-generator/index.d.ts"
+      ],
+      "form-builder": [
+        "./build/esm/form-builder/index.d.ts"
+      ],
+      "gravity-blocks": [
+        "./build/esm/gravity-blocks/index.d.ts"
+      ],
       "server": [
         "./server/index.d.ts"
       ]
@@ -53,8 +84,7 @@
     "build",
     "styles",
     "server",
-    "widget",
-    "schema"
+    "widget"
   ],
   "sideEffects": [
     "*.css",
@@ -73,6 +103,7 @@
     "lint": "run-p lint:js lint:styles lint:prettier typecheck",
     "typecheck": "tsc --noEmit",
     "dev": "npm run storybook:start",
+    "dev:playground": "cd playground && vite -c vite.config.mts",
     "storybook:start": "storybook dev -p 7009",
     "storybook:build": "storybook build -c .storybook -o storybook-static",
     "start": "node dist",
@@ -82,6 +113,7 @@
     "build:widget": "webpack --config widget.webpack.js",
     "build:schema": "webpack --config schema.webpack.js",
     "build": "run-p build:client build:server build:widget build:schema",
+    "build:playground": "echo wip",
     "prepublishOnly": "npm run lint && npm run build",
     "prepare": "husky install",
     "test": "jest",
@@ -97,20 +129,26 @@
   },
   "dependencies": {
     "@bem-react/classname": "^1.6.0",
+    "@dnd-kit/helpers": "^0.3.2",
+    "@dnd-kit/react": "^0.3.2",
     "@gravity-ui/components": "^4.0.1",
     "@gravity-ui/dynamic-forms": "^5.0.0",
     "@gravity-ui/i18n": "^1.7.0",
+    "@gravity-ui/navigation": "^3.11.1",
     "@react-spring/web": "^9.7.3",
     "ajv": "^8.12.0",
     "ajv-keywords": "^5.1.0",
+    "deep-object-diff": "^1.1.9",
     "final-form": "^4.20.9",
     "github-buttons": "2.23.0",
+    "immutable": "^4.3.7",
     "js-yaml-source-map": "^0.2.2",
     "lodash": "^4.17.21",
     "monaco-editor": "^0.52.2",
     "react-final-form": "^6.5.9",
     "react-monaco-editor": "^0.53.0",
     "react-player": "^2.9.0",
+    "react-resizable-panels": "^2.1.3",
     "react-slick": "^0.29.0",
     "react-transition-group": "^4.4.2",
     "react-waypoint": "^10.1.0",
@@ -119,7 +157,8 @@
     "swiper": "^10.2.0",
     "typograf": "^7.4.1",
     "utility-types": "^3.10.0",
-    "uuid": "^9.0.0"
+    "uuid": "^9.0.0",
+    "zustand": "^4.5.2"
   },
   "peerDependencies": {
     "@diplodoc/transform": "^4.28.2",
@@ -140,7 +179,7 @@
     "@gravity-ui/prettier-config": "^1.1.0",
     "@gravity-ui/stylelint-config": "^4.0.1",
     "@gravity-ui/tsconfig": "^1.0.0",
-    "@gravity-ui/uikit": "^7.13.1",
+    "@gravity-ui/uikit": "^7.29.0",
     "@playwright/experimental-ct-react": "^1.45.3",
     "@playwright/test": "^1.45.3",
     "@storybook/addon-actions": "^8.6.11",
@@ -169,12 +208,15 @@
     "@types/uuid": "^9.0.0",
     "@types/webpack-env": "^1.18.1",
     "@types/youtube-player": "^5.5.11",
+    "@vitejs/plugin-react": "^4.5.0",
     "autoprefixer": "^10.4.14",
     "babel-jest": "^30.2.0",
     "babel-loader": "^8.3.0",
+    "bem-cn-lite": "^4.1.0",
     "css-loader": "^5.2.7",
     "es5-ext": "0.10.53",
     "esbuild": "^0.25.11",
+    "esbuild-sass-plugin": "^3.7.0",
     "eslint": "^8.57.1",
     "eslint-plugin-no-not-accumulator-reassign": "^0.1.0",
     "eslint-plugin-react": "^7.37.4",
@@ -205,6 +247,7 @@
     "react": "^18.3.1",
     "react-docgen-typescript": "^2.2.2",
     "react-dom": "^18.3.1",
+    "react-router": "^7.6.1",
     "resolve-url-loader": "^3.1.5",
     "rimraf": "^6.0.1",
     "sass": "^1.63.6",
@@ -217,8 +260,9 @@
     "ts-jest": "^29.2.5",
     "tslib": "^2.4.0",
     "typescript": "^5.7.3",
+    "vite": "^6.3.5",
     "vite-plugin-commonjs": "^0.10.1",
-    "vite-plugin-svgr": "^4.2.0",
+    "vite-plugin-svgr": "^4.3.0",
     "webpack": "^5.98.0",
     "webpack-cli": "^6.0.1",
     "webpack-shell-plugin-next": "^2.3.1"

package/server/gravity-blocks/text-transform/config.d.ts

@@ -0,0 +1,33 @@
+import { TitleItemProps } from '../../models';
+import { Parser, Transformer, TransformerRaw, yfmTransformer } from './common';
+export declare const blockHeaderTransformer: ({
+    fields: string[];
+    transformer: typeof yfmTransformer;
+    parser: (transformer: Transformer, title: TitleItemProps | string) => string | {
+        text: string;
+        navTitle?: string;
+        anchor?: string;
+        justify?: import("../../models").Justify;
+        textSize?: import("../../models").TextSize;
+        url?: string;
+        urlTitle?: string;
+        custom?: string | React.ReactNode;
+        onClick?: () => void;
+        analyticsEvents?: import("../../models").AnalyticsEventsProp;
+    };
+    renderInline: boolean;
+} | {
+    fields: string[];
+    transformer: typeof yfmTransformer;
+    parser?: undefined;
+    renderInline?: undefined;
+})[];
+interface BlockConfig {
+    transformer: TransformerRaw;
+    fields?: string[];
+    parser?: Parser;
+    renderInline?: boolean;
+}
+export type BlocksConfig = Record<string, BlockConfig | BlockConfig[]>;
+export declare const config: BlocksConfig;
+export {};

package/server/gravity-blocks/text-transform/config.js

@@ -0,0 +1,448 @@
+"use strict";
+/* eslint-disable no-param-reassign */
+/* eslint-disable no-not-accumulator-reassign/no-not-accumulator-reassign */
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.config = exports.blockHeaderTransformer = void 0;
+const models_1 = require("../../models");
+const common_1 = require("./common");
+function parseTableBlockLegend(transformer, content) {
+    const legend = content === null || content === void 0 ? void 0 : content.legend;
+    return Object.assign(Object.assign({}, (content || {})), { legend: legend && legend.map((string) => transformer(string)) });
+}
+function parseTableBlockContent(transformer, content) {
+    const legend = content === null || content === void 0 ? void 0 : content.legend;
+    const tableContent = content === null || content === void 0 ? void 0 : content.content;
+    return Object.assign(Object.assign({}, (content || {})), { content: tableContent &&
+            tableContent.map((row, i) => row.map((cell, j) => {
+                if (legend) {
+                    if (i === 0 || j === 0) {
+                        return transformer(cell);
+                    }
+                    return cell;
+                }
+                else {
+                    return transformer(cell);
+                }
+            })) });
+}
+function parseFeatures(transformer, items) {
+    return items.map((_a) => {
+        var { title, text } = _a, rest = __rest(_a, ["title", "text"]);
+        return (Object.assign({ title: title && transformer(title), text: text && transformer(text) }, rest));
+    });
+}
+function parsePromoFeatures(transformer, items) {
+    return items.map((_a) => {
+        var { text } = _a, rest = __rest(_a, ["text"]);
+        return (Object.assign({ text: transformer(text) }, rest));
+    });
+}
+const parseTitle = (transformer, title) => typeof title === 'object' && 'text' in title
+    ? Object.assign(Object.assign({}, title), { text: transformer(title.text) }) : title && transformer(title);
+const parseItemsTitle = (transformer, items) => items.map((_a) => {
+    var { title } = _a, rest = __rest(_a, ["title"]);
+    return (Object.assign({ title: title && parseTitle(transformer, title) }, rest));
+});
+function parsePriceDetailedBlock(transformer, block) {
+    const { priceType } = block;
+    /* eslint-disable no-not-accumulator-reassign/no-not-accumulator-reassign */
+    block.items = block.items.map((item) => {
+        const { description, items: details = [] } = item;
+        if (priceType === 'marked-list') {
+            item.items = details.map((detail) => {
+                detail.text = detail.text && transformer(detail.text);
+                return detail;
+            });
+        }
+        else {
+            item.items = details.map((detail) => {
+                detail.description = detail.description && transformer(detail.description);
+                return detail;
+            });
+        }
+        item.description = transformer(description);
+        return item;
+    });
+    /* eslint-enable no-not-accumulator-reassign/no-not-accumulator-reassign */
+    return block;
+}
+const parseContentLayout = (transformer, content) => {
+    if (content) {
+        const { text, additionalInfo, list } = content;
+        /* eslint-disable no-not-accumulator-reassign/no-not-accumulator-reassign */
+        if (text) {
+            content.text = transformer(text);
+        }
+        if (additionalInfo) {
+            content.additionalInfo = transformer(additionalInfo);
+        }
+        if (list) {
+            content.list = list.map((item) => {
+                if (item === null || item === void 0 ? void 0 : item.text) {
+                    return Object.assign(Object.assign({}, item), { text: transformer(item.text) });
+                }
+                return item;
+            });
+        }
+        /* eslint-enable no-not-accumulator-reassign/no-not-accumulator-reassign */
+    }
+    return content;
+};
+function parseContentLayoutTitle(transformer, content) {
+    if (content === null || content === void 0 ? void 0 : content.title) {
+        const { title } = content;
+        // eslint-disable-next-line no-not-accumulator-reassign/no-not-accumulator-reassign
+        content.title = title && parseTitle(transformer, title);
+    }
+    return content;
+}
+exports.blockHeaderTransformer = [
+    {
+        fields: ['title'],
+        transformer: common_1.yfmTransformer,
+        parser: parseTitle,
+        renderInline: true,
+    },
+    {
+        fields: ['description'],
+        transformer: common_1.yfmTransformer,
+    },
+];
+exports.config = {
+    [models_1.SubBlockType.BasicCard]: [
+        {
+            fields: ['title'],
+            transformer: common_1.yfmTransformer,
+            renderInline: true,
+        },
+        {
+            fields: ['text', 'additionalInfo'],
+            transformer: common_1.yfmTransformer,
+        },
+    ],
+    [models_1.SubBlockType.BackgroundCard]: [
+        {
+            fields: ['title', 'text', 'additionalInfo'],
+            transformer: common_1.yfmTransformer,
+        },
+        {
+            fields: ['list'],
+            transformer: common_1.yfmTransformer,
+            parser: (0, common_1.createItemsParser)(['text']),
+        },
+    ],
+    [models_1.SubBlockType.ImageCard]: [
+        {
+            fields: ['title', 'text', 'additionalInfo'],
+            transformer: common_1.yfmTransformer,
+        },
+    ],
+    [models_1.SubBlockType.LayoutItem]: [
+        {
+            fields: ['content'],
+            parser: parseContentLayout,
+            transformer: common_1.yfmTransformer,
+        },
+        {
+            fields: ['content'],
+            parser: parseContentLayoutTitle,
+            transformer: common_1.yfmTransformer,
+            renderInline: true,
+        },
+        {
+            fields: ['metaInfo'],
+            parser: (0, common_1.createItemsParser)([]),
+            transformer: common_1.yfmTransformer,
+        },
+    ],
+    [models_1.SubBlockType.Quote]: [
+        {
+            fields: ['text', 'yfmText'],
+            transformer: common_1.yfmTransformer,
+            renderInline: true,
+        },
+    ],
+    [models_1.BlockType.ExtendedFeaturesBlock]: [
+        ...exports.blockHeaderTransformer,
+        {
+            fields: ['items'],
+            transformer: common_1.yfmTransformer,
+            parser: (0, common_1.createItemsParser)(['title']),
+            renderInline: true,
+        },
+        {
+            fields: ['items'],
+            transformer: common_1.yfmTransformer,
+            parser: (0, common_1.createItemsParser)(['text', 'additionalInfo']),
+        },
+        {
+            fields: ['items'],
+            transformer: common_1.yfmTransformer,
+            parser: (0, common_1.createItemsParser)(['list.text']),
+            renderInline: true,
+        },
+    ],
+    [models_1.BlockType.PromoFeaturesBlock]: [
+        ...exports.blockHeaderTransformer,
+        {
+            fields: ['items'],
+            transformer: common_1.yfmTransformer,
+            parser: parsePromoFeatures,
+        },
+    ],
+    [models_1.BlockType.SliderOldBlock]: exports.blockHeaderTransformer,
+    [models_1.BlockType.SliderBlock]: exports.blockHeaderTransformer,
+    [models_1.BlockType.CompaniesBlock]: exports.blockHeaderTransformer,
+    [models_1.BlockType.QuestionsBlock]: [
+        {
+            fields: ['title', 'text', 'additionalInfo'],
+            transformer: common_1.yfmTransformer,
+            renderInline: true,
+        },
+        {
+            fields: ['items'],
+            transformer: common_1.yfmTransformer,
+            parser: parseFeatures,
+        },
+        {
+            fields: ['list'],
+            transformer: common_1.yfmTransformer,
+            parser: parseFeatures,
+        },
+    ],
+    [models_1.BlockType.FoldableListBlock]: [
+        {
+            fields: ['title'],
+            transformer: common_1.typografTransformer,
+        },
+        {
+            fields: ['text', 'additionalInfo'],
+            transformer: common_1.yfmTransformer,
+        },
+        {
+            fields: ['items'],
+            transformer: common_1.yfmTransformer,
+            parser: parseFeatures,
+        },
+        {
+            fields: ['list'],
+            transformer: common_1.yfmTransformer,
+            parser: parseFeatures,
+        },
+    ],
+    [models_1.BlockType.BannerBlock]: [
+        {
+            fields: ['title'],
+            transformer: common_1.yfmTransformer,
+            renderInline: true,
+        },
+        {
+            fields: ['subtitle'],
+            transformer: common_1.yfmTransformer,
+        },
+    ],
+    [models_1.SubBlockType.BannerCard]: [
+        {
+            fields: ['title'],
+            transformer: common_1.yfmTransformer,
+            renderInline: true,
+        },
+        {
+            fields: ['subtitle'],
+            transformer: common_1.yfmTransformer,
+        },
+    ],
+    [models_1.BlockType.MediaBlock]: [
+        ...exports.blockHeaderTransformer,
+        {
+            fields: ['additionalInfo'],
+            transformer: common_1.yfmTransformer,
+        },
+        {
+            fields: ['list'],
+            transformer: common_1.yfmTransformer,
+            parser: (0, common_1.createItemsParser)(['text']),
+        },
+    ],
+    [models_1.BlockType.MapBlock]: [
+        ...exports.blockHeaderTransformer,
+        {
+            fields: ['title', 'additionalInfo'],
+            transformer: common_1.yfmTransformer,
+        },
+    ],
+    [models_1.BlockType.TabsBlock]: [
+        ...exports.blockHeaderTransformer,
+        {
+            fields: ['items'],
+            transformer: common_1.yfmTransformer,
+            parser: (0, common_1.createItemsParser)(['text', 'additionalInfo', 'caption']),
+        },
+        {
+            fields: ['items'],
+            transformer: common_1.yfmTransformer,
+            parser: parseItemsTitle,
+            renderInline: true,
+        },
+        {
+            fields: ['items'],
+            transformer: common_1.yfmTransformer,
+            parser: (0, common_1.createItemsParser)(['list.text']),
+            renderInline: true,
+        },
+    ],
+    [models_1.BlockType.TableBlock]: [
+        {
+            fields: ['title'],
+            transformer: common_1.yfmTransformer,
+            renderInline: true,
+        },
+        {
+            fields: ['table'],
+            transformer: common_1.yfmTransformer,
+            parser: parseTableBlockLegend,
+        },
+        {
+            fields: ['table'],
+            transformer: common_1.yfmTransformer,
+            parser: parseTableBlockContent,
+            renderInline: true,
+        },
+    ],
+    [models_1.BlockType.HeaderSliderBlock]: [
+        {
+            fields: ['items'],
+            transformer: common_1.yfmTransformer,
+            parser: (0, common_1.createItemsParser)(['title', 'overtitle', 'description']),
+            renderInline: true,
+        },
+    ],
+    [models_1.SubBlockType.PriceDetailed]: [
+        {
+            transformer: common_1.yfmTransformer,
+            parser: parsePriceDetailedBlock,
+        },
+    ],
+    [models_1.BlockType.HeaderBlock]: [
+        {
+            fields: ['description', 'additionalInfo'],
+            transformer: common_1.yfmTransformer,
+        },
+        {
+            fields: ['overtitle', 'title'],
+            transformer: common_1.yfmTransformer,
+            renderInline: true,
+        },
+    ],
+    [models_1.BlockType.HeroBlock]: [
+        {
+            fields: ['text', 'additionalInfo', 'list'],
+            transformer: common_1.yfmTransformer,
+        },
+        {
+            fields: ['title'],
+            transformer: common_1.yfmTransformer,
+            parser: parseTitle,
+            renderInline: true,
+        },
+        {
+            fields: ['list'],
+            transformer: common_1.yfmTransformer,
+            parser: (0, common_1.createItemsParser)(['title', 'text']),
+        },
+    ],
+    [models_1.BlockType.ContentLayoutBlock]: [
+        {
+            fields: ['textContent'],
+            transformer: common_1.yfmTransformer,
+            parser: parseContentLayout,
+        },
+        {
+            fields: ['textContent'],
+            transformer: common_1.yfmTransformer,
+            parser: parseContentLayoutTitle,
+            renderInline: true,
+        },
+    ],
+    [models_1.SubBlockType.Content]: [
+        {
+            fields: ['text', 'additionalInfo'],
+            transformer: common_1.yfmTransformer,
+        },
+        {
+            fields: ['title'],
+            transformer: common_1.yfmTransformer,
+            parser: parseTitle,
+            renderInline: true,
+        },
+        {
+            fields: ['list'],
+            transformer: common_1.yfmTransformer,
+            parser: (0, common_1.createItemsParser)(['title', 'text']),
+        },
+    ],
+    [models_1.BlockType.InfoBlock]: [
+        {
+            fields: ['title'],
+            transformer: common_1.yfmTransformer,
+            renderInline: true,
+        },
+        {
+            fields: ['rightContent', 'leftContent'],
+            transformer: common_1.yfmTransformer,
+            parser: parseContentLayout,
+        },
+        {
+            fields: ['rightContent', 'leftContent'],
+            transformer: common_1.yfmTransformer,
+            parser: parseContentLayoutTitle,
+            renderInline: true,
+        },
+    ],
+    [models_1.BlockType.ShareBlock]: [
+        {
+            fields: ['title'],
+            transformer: common_1.yfmTransformer,
+            renderInline: true,
+        },
+    ],
+    [models_1.BlockType.CardLayoutBlock]: exports.blockHeaderTransformer,
+    [models_1.BlockType.FilterBlock]: exports.blockHeaderTransformer,
+    [models_1.BlockType.IconsBlock]: exports.blockHeaderTransformer,
+    [models_1.SubBlockType.PriceCard]: [
+        {
+            fields: ['title'],
+            transformer: common_1.yfmTransformer,
+            renderInline: true,
+        },
+        {
+            fields: ['list'],
+            transformer: common_1.yfmTransformer,
+            parser: (0, common_1.createItemsParser)(['title', 'text']),
+        },
+    ],
+    [models_1.BlockType.FormBlock]: [
+        {
+            fields: ['textContent'],
+            transformer: common_1.yfmTransformer,
+            parser: parseContentLayout,
+        },
+        {
+            fields: ['textContent'],
+            transformer: common_1.yfmTransformer,
+            parser: parseContentLayoutTitle,
+            renderInline: true,
+        },
+    ],
+};

package/server/gravity-blocks/text-transform/transformers.d.ts

@@ -0,0 +1,18 @@
+import { MarkdownItPluginCb } from '@diplodoc/transform/lib/plugins/typings';
+import { ConstructorBlock } from '../../models/constructor';
+import { Lang } from './types';
+export type ContentVariables = Record<string, string>;
+export type ContentTransformerProps = {
+    content: {
+        blocks?: ConstructorBlock[];
+    };
+    options: {
+        lang: Lang;
+        customConfig?: {};
+        vars?: ContentVariables;
+        plugins?: MarkdownItPluginCb[];
+    };
+};
+export declare const contentTransformer: ({ content, options }: ContentTransformerProps) => {
+    blocks: ConstructorBlock[];
+};

package/server/index.d.ts

@@ -1 +1 @@
-export * from './text-transform';
+export * from './gravity-blocks/text-transform';

package/server/index.js

@@ -14,4 +14,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./text-transform"), exports);
+__exportStar(require("./gravity-blocks/text-transform"), exports);