npm - @gravity-ui/page-constructor - Versions diffs - 8.5.0-alpha.4 → 8.5.0-alpha.6 - Mend

@gravity-ui/page-constructor 8.5.0-alpha.4 → 8.5.0-alpha.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (96) hide show

package/build/cjs/blocks/ContentLayout/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const ContentLayoutBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             textContent: {
                 title: string;

package/build/cjs/blocks/ExtendedFeatures/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const ExtendedFeaturesBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             type: string;
             title: {

package/build/cjs/blocks/FilterBlock/index.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ declare const FilterBlockConfig: {
     schema: {
         name: string;
         group: string;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             allTag: boolean;
             description: string;

package/build/cjs/blocks/FilterBlock/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const FilterBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             allTag: boolean;
             description: string;

package/build/cjs/blocks/Form/index.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ declare const FormBlockConfig: {
     schema: {
         name: string;
         group: string;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             title: string;
             formData: {};

package/build/cjs/blocks/Form/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const FormBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             title: string;
             formData: {};

package/build/cjs/blocks/HeaderSlider/index.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ declare const HeaderSliderBlockConfig: {
     schema: {
         name: string;
         group: string;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             type: string;
             items: ({

package/build/cjs/blocks/HeaderSlider/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const HeaderSliderBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             type: string;
             items: ({

package/build/cjs/blocks/Icons/index.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ declare const IconsBlockConfig: {
     schema: {
         name: string;
         group: string;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             type: string;
             title: string;

package/build/cjs/blocks/Icons/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const IconsBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             type: string;
             title: string;

package/build/cjs/blocks/Info/index.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ declare const InfoBlockConfig: {
     schema: {
         name: string;
         group: string;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             type: string;
             title: string;

package/build/cjs/blocks/Info/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const InfoBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             type: string;
             title: string;

package/build/cjs/blocks/Map/index.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ declare const MapBlockConfig: {
     schema: {
         name: string;
         group: string;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             title: string;
         };

package/build/cjs/blocks/Map/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const MapBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             title: string;
         };

package/build/cjs/blocks/Media/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const MediaBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             title: string;
             description: string;

package/build/cjs/blocks/PromoFeaturesBlock/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const PromoFeaturesBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             title: string;
             theme: string;

package/build/cjs/blocks/Questions/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const QuestionsBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             type: string;
             title: string;

package/build/cjs/blocks/Share/index.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ declare const ShareBlockConfig: {
     schema: {
         name: string;
         group: string;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             items: string[];
             title: string;

package/build/cjs/blocks/Share/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const ShareBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             items: string[];
             title: string;

package/build/cjs/blocks/Slider/index.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ declare const SliderBlockConfig: {
     schema: {
         name: string;
         group: string;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             dots: boolean;
             type: string;

package/build/cjs/blocks/Slider/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const SliderBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             dots: boolean;
             type: string;

package/build/cjs/blocks/Table/index.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ declare const TableBlockConfig: {
     schema: {
         name: string;
         group: string;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             type: string;
             title: string;

package/build/cjs/blocks/Table/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const TableBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             type: string;
             title: string;

package/build/cjs/blocks/Tabs/index.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ declare const TabsBlockConfig: {
     schema: {
         name: string;
         group: string;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             title: string;
             items: {

package/build/cjs/blocks/Tabs/index_deprecated.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ declare const TabsBlockConfig: {
         name: string;
         group: string;
         hidden: boolean;
-        inputs: import("../../form-generator-v2/types.js").Fields;
+        inputs: import("../../form-generator-v2/index.js").Fields;
         default: {
             title: string;
             items: {

package/build/cjs/common/constants.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export declare const POST_MESSAGE_SOURCE = "page-constructor-editor";

package/build/cjs/common/constants.js ADDED Viewed

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.POST_MESSAGE_SOURCE = void 0;
+exports.POST_MESSAGE_SOURCE = 'page-constructor-editor';
+//# sourceMappingURL=constants.js.map

package/build/cjs/common/constants.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"constants.js","sourceRoot":"../../../src","sources":["common/constants.ts"],"names":[],"mappings":";;;AAAa,QAAA,mBAAmB,GAAG,yBAAyB,CAAC","sourcesContent":["export const POST_MESSAGE_SOURCE = 'page-constructor-editor';\n"]}

package/build/cjs/common/postMessage.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import { ActionMessageTypes, EventMessageTypes } from "./types/index.js";
+export declare function isValidPostMessage(data: unknown): data is Record<string, unknown>;
 export declare function requestActionPostMessage<K extends keyof ActionMessageTypes>(action: K, data: ActionMessageTypes[K], destinationElement: Window): void;
 export declare function listenPostMessageEvents<K extends keyof EventMessageTypes>(action: K, callback: (data: EventMessageTypes[K]) => void): () => void;
 export declare function usePostMessageAPIListener<K extends keyof EventMessageTypes>(action: K, callback: (data: EventMessageTypes[K]) => void, deps?: unknown[]): void;

package/build/cjs/common/postMessage.js CHANGED Viewed

@@ -1,26 +1,34 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.isValidPostMessage = isValidPostMessage;
 exports.requestActionPostMessage = requestActionPostMessage;
 exports.listenPostMessageEvents = listenPostMessageEvents;
 exports.usePostMessageAPIListener = usePostMessageAPIListener;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
+const constants_1 = require("./constants.js");
+function isValidPostMessage(data) {
+    return (typeof data === 'object' &&
+        data !== null &&
+        data.source === constants_1.POST_MESSAGE_SOURCE);
+}
 function requestActionPostMessage(action, data, destinationElement) {
-    const message = { action, data };
+    const message = { action, data, source: constants_1.POST_MESSAGE_SOURCE };
     destinationElement.postMessage(message, '*');
 }
 function listenPostMessageEvents(action, callback) {
     const onMessage = (e) => {
+        if (!isValidPostMessage(e.data)) {
+            return undefined;
+        }
         const message = e.data;
-        if ('action' in message && message.action === action) {
+        if (message.action === action) {
             return callback(message.data);
         }
         return undefined;
     };
     window.addEventListener('message', onMessage);
-    return () => {
-        window.removeEventListener('message', onMessage);
-    };
+    return () => window.removeEventListener('message', onMessage);
 }
 function usePostMessageAPIListener(action, callback, deps = []) {
     React.useEffect(() => {

package/build/cjs/common/postMessage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"postMessage.js","sourceRoot":"../../../src","sources":["common/postMessage.ts"],"names":[],"mappings":";;~~AAIA~~,4DAOC;AAED,0DAmBC;AAED,8DASC;;~~AA3CD~~,qDAA+B;~~AAI~~/B,SAAgB,wBAAwB,CACpC,MAAS,EACT,IAA2B,EAC3B,kBAA0B;IAE1B,MAAM,OAAO,GAAG,EAAC,MAAM,EAAE,IAAI,EAA6B,CAAC;~~IAC3D~~,kBAAkB,CAAC,WAAW,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;AACjD,CAAC;AAED,SAAgB,uBAAuB,CACnC,MAAS,EACT,QAA8C;IAE9C,MAAM,SAAS,GAAG,CAAC,CAAe,EAAE,EAAE;QAClC,~~MAAM~~,~~OAAO~~,~~GAAG~~,CAAC,CAAC,~~IAAgC~~,CAAC;~~QAEnD~~,~~IAAI~~,~~QAAQ~~,~~IAAI~~,OAAO,IAAI,OAAO,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;~~YACnD~~,OAAO,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QAClC,CAAC;QAED,OAAO,SAAS,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;~~IAE9C~~,OAAO,GAAG,EAAE~~;QACR~~,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;~~IACrD~~,CAAC~~,CAAC~~;~~AACN,CAAC;~~AAED,SAAgB,yBAAyB,CACrC,MAAS,EACT,QAA8C,EAC9C,OAAkB,EAAE;IAEpB,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,OAAO,uBAAuB,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;QACjD,uDAAuD;IAC3D,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC;AAClB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {ActionMessageTypes, EventMessageTypes, PostMessageAPIMessage} from './types';\n\nexport function requestActionPostMessage<K extends keyof ActionMessageTypes>(\n action: K,\n data: ActionMessageTypes[K],\n destinationElement: Window,\n) {\n const message = {action, data} as PostMessageAPIMessage<K>;\n destinationElement.postMessage(message, '*');\n}\n\nexport function listenPostMessageEvents<K extends keyof EventMessageTypes>(\n action: K,\n callback: (data: EventMessageTypes[K]) => void,\n) {\n const onMessage = (e: MessageEvent) => {\n const message = e.data as PostMessageAPIMessage<K>;\n\n if (~~'action' in~~ message ~~&& message~~.action === action) {\n return callback(message.data);\n }\n\n return undefined;\n };\n\n window.addEventListener('message', onMessage);\n\n return () => ~~{\n~~ window.removeEventListener('message', onMessage);\n }~~;\n}~~\n\nexport function usePostMessageAPIListener<K extends keyof EventMessageTypes>(\n action: K,\n callback: (data: EventMessageTypes[K]) => void,\n deps: unknown[] = [],\n) {\n React.useEffect(() => {\n return listenPostMessageEvents(action, callback);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [...deps]);\n}\n"]}
1	+ {"version":3,"file":"postMessage.js","sourceRoot":"../../../src","sources":["common/postMessage.ts"],"names":[],"mappings":";;AAKA,gDAMC;AAED,4DAOC;AAED,0DAmBC;AAED,8DASC;;AApDD,qDAA+B;AAE/B,8CAAgD;AAGhD,SAAgB,kBAAkB,CAAC,IAAa;IAC5C,OAAO,CACH,OAAO,IAAI,KAAK,QAAQ;QACxB,IAAI,KAAK,IAAI;QACZ,IAAgC,CAAC,MAAM,KAAK,+BAAmB,CACnE,CAAC;AACN,CAAC;AAED,SAAgB,wBAAwB,CACpC,MAAS,EACT,IAA2B,EAC3B,kBAA0B;IAE1B,MAAM,OAAO,GAAG,EAAC,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,+BAAmB,EAA6B,CAAC;IACxF,kBAAkB,CAAC,WAAW,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;AACjD,CAAC;AAED,SAAgB,uBAAuB,CACnC,MAAS,EACT,QAA8C;IAE9C,MAAM,SAAS,GAAG,CAAC,CAAe,EAAE,EAAE;QAClC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;YAC9B,OAAO,SAAS,CAAC;QACrB,CAAC;QAED,MAAM,OAAO,GAAG,CAAC,CAAC,IAAgC,CAAC;QACnD,IAAI,OAAO,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;YAC5B,OAAO,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QAClC,CAAC;QAED,OAAO,SAAS,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IAC9C,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;AAClE,CAAC;AAED,SAAgB,yBAAyB,CACrC,MAAS,EACT,QAA8C,EAC9C,OAAkB,EAAE;IAEpB,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,OAAO,uBAAuB,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;QACjD,uDAAuD;IAC3D,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC;AAClB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {POST_MESSAGE_SOURCE} from './constants';\nimport {ActionMessageTypes, EventMessageTypes, PostMessageAPIMessage} from './types';\n\nexport function isValidPostMessage(data: unknown): data is Record<string, unknown> {\n return (\n typeof data === 'object' &&\n data !== null &&\n (data as Record<string, unknown>).source === POST_MESSAGE_SOURCE\n );\n}\n\nexport function requestActionPostMessage<K extends keyof ActionMessageTypes>(\n action: K,\n data: ActionMessageTypes[K],\n destinationElement: Window,\n) {\n const message = {action, data, source: POST_MESSAGE_SOURCE} as PostMessageAPIMessage<K>;\n destinationElement.postMessage(message, '*');\n}\n\nexport function listenPostMessageEvents<K extends keyof EventMessageTypes>(\n action: K,\n callback: (data: EventMessageTypes[K]) => void,\n) {\n const onMessage = (e: MessageEvent) => {\n if (!isValidPostMessage(e.data)) {\n return undefined;\n }\n\n const message = e.data as PostMessageAPIMessage<K>;\n if (message.action === action) {\n return callback(message.data);\n }\n\n return undefined;\n };\n\n window.addEventListener('message', onMessage);\n return () => window.removeEventListener('message', onMessage);\n}\n\nexport function usePostMessageAPIListener<K extends keyof EventMessageTypes>(\n action: K,\n callback: (data: EventMessageTypes[K]) => void,\n deps: unknown[] = [],\n) {\n React.useEffect(() => {\n return listenPostMessageEvents(action, callback);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [...deps]);\n}\n"]}

package/build/cjs/common/types/messages.d.ts CHANGED Viewed

@@ -1,9 +1,12 @@
+import { POST_MESSAGE_SOURCE } from "../constants.js";
 import { EditorState } from "../store.js";
 import { MessageTypes } from "./actions.js";
 export type PostMessageAPIMessage<K extends keyof MessageTypes> = {
     action: K;
     data: MessageTypes[K];
+    source: typeof POST_MESSAGE_SOURCE;
 };
 export type StoreSyncMessage = {
     state: EditorState;
+    source: typeof POST_MESSAGE_SOURCE;
 };

package/build/cjs/common/types/messages.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"messages.js","sourceRoot":"../../../../src","sources":["common/types/messages.ts"],"names":[],"mappings":"","sourcesContent":["import {EditorState} from '../store';\n\nimport {MessageTypes} from './actions';\n\nexport type PostMessageAPIMessage<K extends keyof MessageTypes> = {\n action: K;\n data: MessageTypes[K];\n};\n\nexport type StoreSyncMessage = {\n state: EditorState;\n};\n"]}
1	+ {"version":3,"file":"messages.js","sourceRoot":"../../../../src","sources":["common/types/messages.ts"],"names":[],"mappings":"","sourcesContent":["import {POST_MESSAGE_SOURCE} from '../constants';\nimport {EditorState} from '../store';\n\nimport {MessageTypes} from './actions';\n\nexport type PostMessageAPIMessage<K extends keyof MessageTypes> = {\n action: K;\n data: MessageTypes[K];\n source: typeof POST_MESSAGE_SOURCE;\n};\n\nexport type StoreSyncMessage = {\n state: EditorState;\n source: typeof POST_MESSAGE_SOURCE;\n};\n"]}

package/build/cjs/context/editorStoreContext/PCEditorStoreProvider.js CHANGED Viewed

@@ -4,6 +4,7 @@ exports.PCEditorStoreProvider = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
+const postMessage_1 = require("../../common/postMessage.js");
 const store_1 = require("../../common/store.js");
 const usePostMessageAPI_1 = require("../../hooks/usePostMessageAPI.js");
 const PCEditorStoreContext_1 = require("./PCEditorStoreContext.js");
@@ -16,13 +17,14 @@ const PCEditorStoreProvider = ({ children }) => {
     }, []);
     React.useEffect(() => {
         const onMessage = (e) => {
+            if (!(0, postMessage_1.isValidPostMessage)(e.data)) {
+                return;
+            }
             const message = e.data;
             syncStore(message);
         };
         window.addEventListener('message', onMessage);
-        return () => {
-            window.removeEventListener('message', onMessage);
-        };
+        return () => window.removeEventListener('message', onMessage);
     }, [syncStore]);
     // When Page Constructor runs inside the editor preview iframe, keyboard focus stays in the iframe
     // after clicking the canvas — parent window never receives Cmd+Z. Forward to parent via postMessage.

package/build/cjs/context/editorStoreContext/PCEditorStoreProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PCEditorStoreProvider.js","sourceRoot":"../../../../src","sources":["context/editorStoreContext/PCEditorStoreProvider.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAI/B,iDAAoE;AAEpE,wEAAmE;AAEnE,oEAA4D;AAIrD,MAAM,qBAAqB,GAAG,CAAC,EAAC,QAAQ,EAA6B,EAAE,EAAE;IAC5E,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,EAAyB,CAAC;IAEvD,MAAM,SAAS,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,OAAyB,EAAE,EAAE;QAC9D,IAAI,QAAQ,CAAC,OAAO,IAAI,OAAO,CAAC,KAAK,EAAE,CAAC;YACpC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QAC7C,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,MAAM,SAAS,GAAG,CAAC,CAAe,EAAE,EAAE;YAClC,MAAM,OAAO,GAAG,CAAC,CAAC,IAAwB,CAAC;YAC3C,SAAS,CAAC,OAAO,CAAC,CAAC;QACvB,CAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;~~QAE9C~~,OAAO,GAAG,EAAE~~;YACR~~,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;~~QACrD~~,CAAC,~~CAAC;IACN,CAAC,~~EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,kGAAkG;IAClG,qGAAqG;IACrG,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,MAAM,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;YAC5D,OAAO,SAAS,CAAC;QACrB,CAAC;QACD,MAAM,SAAS,GAAG,CAAC,CAAgB,EAAE,EAAE;YACnC,IAAI,CAAC,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,KAAK,GAAG,EAAE,CAAC;gBAC3D,OAAO;YACX,CAAC;YAED,MAAM,MAAM,GAAG,CAAC,CAAC,MAA4B,CAAC;YAC9C,IAAI,MAAM,EAAE,OAAO,CAAC,mDAAmD,CAAC,EAAE,CAAC;gBACvE,OAAO;YACX,CAAC;YAED,CAAC,CAAC,cAAc,EAAE,CAAC;YAEnB,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC;gBACb,IAAA,wCAAoB,EAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC;YAC/C,CAAC;iBAAM,CAAC;gBACJ,IAAA,wCAAoB,EAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC;YAC/C,CAAC;QACL,CAAC,CAAC;QACF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC;QACpD,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC;IACxE,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;QACpB,QAAQ,CAAC,OAAO,GAAG,IAAA,2BAAmB,GAAE,CAAC;IAC7C,CAAC;IAED,OAAO,CACH,uBAAC,2CAAoB,CAAC,QAAQ,IAC1B,KAAK,EAAE;YACH,KAAK,EAAE,QAAQ,CAAC,OAAO;SAC1B,YAEA,QAAQ,GACmB,CACnC,CAAC;AACN,CAAC,CAAC;~~AA/DW~~,QAAA,qBAAqB,~~yBA+DhC~~","sourcesContent":["import * as React from 'react';\n\nimport {StoreApi} from 'zustand';\n\nimport {EditorState, createPCEditorStore} from '../../common/store';\nimport {StoreSyncMessage} from '../../common/types';\nimport {sendEventPostMessage} from '../../hooks/usePostMessageAPI';\n\nimport {PCEditorStoreContext} from './PCEditorStoreContext';\n\ninterface PCEditorStoreProviderProps extends React.PropsWithChildren {}\n\nexport const PCEditorStoreProvider = ({children}: PCEditorStoreProviderProps) => {\n const storeRef = React.useRef<StoreApi<EditorState>>();\n\n const syncStore = React.useCallback((message: StoreSyncMessage) => {\n if (storeRef.current && message.state) {\n storeRef.current.setState(message.state);\n }\n }, []);\n\n React.useEffect(() => {\n const onMessage = (e: MessageEvent) => {\n const message = e.data as StoreSyncMessage;\n syncStore(message);\n };\n\n window.addEventListener('message', onMessage);\n\n return () => ~~{\n~~ window.removeEventListener('message', onMessage);\n ~~};\n~~ }, [syncStore]);\n\n // When Page Constructor runs inside the editor preview iframe, keyboard focus stays in the iframe\n // after clicking the canvas — parent window never receives Cmd+Z. Forward to parent via postMessage.\n React.useEffect(() => {\n if (typeof window === 'undefined' \|\| window.parent === window) {\n return undefined;\n }\n const onKeyDown = (e: KeyboardEvent) => {\n if (!(e.metaKey \|\| e.ctrlKey) \|\| e.key.toLowerCase() !== 'z') {\n return;\n }\n\n const target = e.target as HTMLElement \| null;\n if (target?.closest('input, textarea, select, [contenteditable=\"true\"]')) {\n return;\n }\n\n e.preventDefault();\n\n if (e.shiftKey) {\n sendEventPostMessage('ON_EDITOR_REDO', {});\n } else {\n sendEventPostMessage('ON_EDITOR_UNDO', {});\n }\n };\n window.addEventListener('keydown', onKeyDown, true);\n return () => window.removeEventListener('keydown', onKeyDown, true);\n }, []);\n\n if (!storeRef.current) {\n storeRef.current = createPCEditorStore();\n }\n\n return (\n <PCEditorStoreContext.Provider\n value={{\n state: storeRef.current,\n }}\n >\n {children}\n </PCEditorStoreContext.Provider>\n );\n};\n"]}
1	+ {"version":3,"file":"PCEditorStoreProvider.js","sourceRoot":"../../../../src","sources":["context/editorStoreContext/PCEditorStoreProvider.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAI/B,6DAA4D;AAC5D,iDAAoE;AAEpE,wEAAmE;AAEnE,oEAA4D;AAIrD,MAAM,qBAAqB,GAAG,CAAC,EAAC,QAAQ,EAA6B,EAAE,EAAE;IAC5E,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,EAAyB,CAAC;IAEvD,MAAM,SAAS,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,OAAyB,EAAE,EAAE;QAC9D,IAAI,QAAQ,CAAC,OAAO,IAAI,OAAO,CAAC,KAAK,EAAE,CAAC;YACpC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QAC7C,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,MAAM,SAAS,GAAG,CAAC,CAAe,EAAE,EAAE;YAClC,IAAI,CAAC,IAAA,gCAAkB,EAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;gBAC9B,OAAO;YACX,CAAC;YAED,MAAM,OAAO,GAAG,CAAC,CAAC,IAAwB,CAAC;YAC3C,SAAS,CAAC,OAAO,CAAC,CAAC;QACvB,CAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QAC9C,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IAClE,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,kGAAkG;IAClG,qGAAqG;IACrG,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,MAAM,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;YAC5D,OAAO,SAAS,CAAC;QACrB,CAAC;QACD,MAAM,SAAS,GAAG,CAAC,CAAgB,EAAE,EAAE;YACnC,IAAI,CAAC,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,KAAK,GAAG,EAAE,CAAC;gBAC3D,OAAO;YACX,CAAC;YAED,MAAM,MAAM,GAAG,CAAC,CAAC,MAA4B,CAAC;YAC9C,IAAI,MAAM,EAAE,OAAO,CAAC,mDAAmD,CAAC,EAAE,CAAC;gBACvE,OAAO;YACX,CAAC;YAED,CAAC,CAAC,cAAc,EAAE,CAAC;YAEnB,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC;gBACb,IAAA,wCAAoB,EAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC;YAC/C,CAAC;iBAAM,CAAC;gBACJ,IAAA,wCAAoB,EAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC;YAC/C,CAAC;QACL,CAAC,CAAC;QACF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC;QACpD,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC;IACxE,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;QACpB,QAAQ,CAAC,OAAO,GAAG,IAAA,2BAAmB,GAAE,CAAC;IAC7C,CAAC;IAED,OAAO,CACH,uBAAC,2CAAoB,CAAC,QAAQ,IAC1B,KAAK,EAAE;YACH,KAAK,EAAE,QAAQ,CAAC,OAAO;SAC1B,YAEA,QAAQ,GACmB,CACnC,CAAC;AACN,CAAC,CAAC;AAhEW,QAAA,qBAAqB,yBAgEhC","sourcesContent":["import * as React from 'react';\n\nimport {StoreApi} from 'zustand';\n\nimport {isValidPostMessage} from '../../common/postMessage';\nimport {EditorState, createPCEditorStore} from '../../common/store';\nimport {StoreSyncMessage} from '../../common/types';\nimport {sendEventPostMessage} from '../../hooks/usePostMessageAPI';\n\nimport {PCEditorStoreContext} from './PCEditorStoreContext';\n\ninterface PCEditorStoreProviderProps extends React.PropsWithChildren {}\n\nexport const PCEditorStoreProvider = ({children}: PCEditorStoreProviderProps) => {\n const storeRef = React.useRef<StoreApi<EditorState>>();\n\n const syncStore = React.useCallback((message: StoreSyncMessage) => {\n if (storeRef.current && message.state) {\n storeRef.current.setState(message.state);\n }\n }, []);\n\n React.useEffect(() => {\n const onMessage = (e: MessageEvent) => {\n if (!isValidPostMessage(e.data)) {\n return;\n }\n\n const message = e.data as StoreSyncMessage;\n syncStore(message);\n };\n\n window.addEventListener('message', onMessage);\n return () => window.removeEventListener('message', onMessage);\n }, [syncStore]);\n\n // When Page Constructor runs inside the editor preview iframe, keyboard focus stays in the iframe\n // after clicking the canvas — parent window never receives Cmd+Z. Forward to parent via postMessage.\n React.useEffect(() => {\n if (typeof window === 'undefined' \|\| window.parent === window) {\n return undefined;\n }\n const onKeyDown = (e: KeyboardEvent) => {\n if (!(e.metaKey \|\| e.ctrlKey) \|\| e.key.toLowerCase() !== 'z') {\n return;\n }\n\n const target = e.target as HTMLElement \| null;\n if (target?.closest('input, textarea, select, [contenteditable=\"true\"]')) {\n return;\n }\n\n e.preventDefault();\n\n if (e.shiftKey) {\n sendEventPostMessage('ON_EDITOR_REDO', {});\n } else {\n sendEventPostMessage('ON_EDITOR_UNDO', {});\n }\n };\n window.addEventListener('keydown', onKeyDown, true);\n return () => window.removeEventListener('keydown', onKeyDown, true);\n }, []);\n\n if (!storeRef.current) {\n storeRef.current = createPCEditorStore();\n }\n\n return (\n <PCEditorStoreContext.Provider\n value={{\n state: storeRef.current,\n }}\n >\n {children}\n </PCEditorStoreContext.Provider>\n );\n};\n"]}

package/build/cjs/editor-v2/context/editorStore/MainEditorStoreProvider.js CHANGED Viewed

@@ -4,6 +4,7 @@ exports.MainEditorStoreProvider = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
+const constants_1 = require("../../../common/constants.js");
 const utils_1 = require("../../../common/utils.js");
 const store_1 = require("../../store.js");
 const iframeContext_1 = require("../iframeContext/index.js");
@@ -14,6 +15,7 @@ const MainEditorStoreProvider = ({ children }) => {
     const sendPostMessage = React.useCallback((data) => {
         const message = {
             state: data,
+            source: constants_1.POST_MESSAGE_SOURCE,
         };
         if (iframeElement && iframeElement.contentWindow) {
             iframeElement.contentWindow.postMessage(message, '*');

package/build/cjs/editor-v2/context/editorStore/MainEditorStoreProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MainEditorStoreProvider.js","sourceRoot":"../../../../../src","sources":["editor-v2/context/editorStore/MainEditorStoreProvider.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;~~AAM~~/B,oDAA+C;AAC/C,0CAA2D;AAC3D,6DAA+C;AAE/C,wEAAgE;AAIzD,MAAM,uBAAuB,GAAG,CAAC,EAAC,QAAQ,EAA0B,EAAE,EAAE;IAC3E,MAAM,EAAC,aAAa,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,6BAAa,CAAC,CAAC;IACxD,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,EAAyB,CAAC;IAEvD,MAAM,eAAe,GAAG,KAAK,CAAC,WAAW,CACrC,CAAC,IAAiB,EAAE,EAAE;QAClB,MAAM,OAAO,GAAqB;YAC9B,KAAK,EAAE,IAAI;~~SACd~~,CAAC;QAEF,IAAI,aAAa,IAAI,aAAa,CAAC,aAAa,EAAE,CAAC;YAC/C,aAAa,CAAC,aAAa,CAAC,WAAW,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;QAC1D,CAAC;IACL,CAAC,EACD,CAAC,aAAa,CAAC,CAClB,CAAC;IAEF,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;QACpB,QAAQ,CAAC,OAAO,GAAG,IAAA,yBAAiB,GAAE,CAAC;IAC3C,CAAC;IAED,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC,KAAK,EAAE,EAAE;YAClC,MAAM,EAAC,WAAW,EAAE,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,GAAG,QAAQ,EAAC,GAAG,KAAK,CAAC;YACtF,eAAe,CAAC,IAAA,gBAAQ,EAAC,EAAC,GAAG,QAAQ,EAAE,WAAW,EAAE,EAAE,EAAE,aAAa,EAAE,EAAE,EAAC,CAAC,CAAC,CAAC;QACjF,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,OAAO,CACH,uBAAC,+CAAsB,CAAC,QAAQ,IAC5B,KAAK,EAAE;YACH,KAAK,EAAE,QAAQ,CAAC,OAAO;SAC1B,YAEA,QAAQ,GACqB,CACrC,CAAC;AACN,CAAC,CAAC;~~AArCW~~,QAAA,uBAAuB,~~2BAqClC~~","sourcesContent":["import * as React from 'react';\n\nimport {StoreApi} from 'zustand';\n\nimport {EditorState} from '../../../common/store';\nimport {StoreSyncMessage} from '../../../common/types';\nimport {removeFn} from '../../../common/utils';\nimport {EditorStore, createEditorStore} from '../../store';\nimport {IframeContext} from '../iframeContext';\n\nimport {MainEditorStoreContext} from './MainEditorStoreContext';\n\ninterface MainEditorProviderProps extends React.PropsWithChildren {}\n\nexport const MainEditorStoreProvider = ({children}: MainEditorProviderProps) => {\n const {iframeElement} = React.useContext(IframeContext);\n const storeRef = React.useRef<StoreApi<EditorStore>>();\n\n const sendPostMessage = React.useCallback(\n (data: EditorState) => {\n const message: StoreSyncMessage = {\n state: data,\n };\n\n if (iframeElement && iframeElement.contentWindow) {\n iframeElement.contentWindow.postMessage(message, '*');\n }\n },\n [iframeElement],\n );\n\n if (!storeRef.current) {\n storeRef.current = createEditorStore();\n }\n\n React.useEffect(() => {\n storeRef.current?.subscribe((state) => {\n const {historyPast: _historyPast, historyFuture: _historyFuture, ...syncable} = state;\n sendPostMessage(removeFn({...syncable, historyPast: [], historyFuture: []}));\n });\n }, [sendPostMessage]);\n\n return (\n <MainEditorStoreContext.Provider\n value={{\n state: storeRef.current,\n }}\n >\n {children}\n </MainEditorStoreContext.Provider>\n );\n};\n"]}
1	+ {"version":3,"file":"MainEditorStoreProvider.js","sourceRoot":"../../../../../src","sources":["editor-v2/context/editorStore/MainEditorStoreProvider.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAI/B,4DAA8D;AAG9D,oDAA+C;AAC/C,0CAA2D;AAC3D,6DAA+C;AAE/C,wEAAgE;AAIzD,MAAM,uBAAuB,GAAG,CAAC,EAAC,QAAQ,EAA0B,EAAE,EAAE;IAC3E,MAAM,EAAC,aAAa,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,6BAAa,CAAC,CAAC;IACxD,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,EAAyB,CAAC;IAEvD,MAAM,eAAe,GAAG,KAAK,CAAC,WAAW,CACrC,CAAC,IAAiB,EAAE,EAAE;QAClB,MAAM,OAAO,GAAqB;YAC9B,KAAK,EAAE,IAAI;YACX,MAAM,EAAE,+BAAmB;SAC9B,CAAC;QAEF,IAAI,aAAa,IAAI,aAAa,CAAC,aAAa,EAAE,CAAC;YAC/C,aAAa,CAAC,aAAa,CAAC,WAAW,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;QAC1D,CAAC;IACL,CAAC,EACD,CAAC,aAAa,CAAC,CAClB,CAAC;IAEF,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;QACpB,QAAQ,CAAC,OAAO,GAAG,IAAA,yBAAiB,GAAE,CAAC;IAC3C,CAAC;IAED,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC,KAAK,EAAE,EAAE;YAClC,MAAM,EAAC,WAAW,EAAE,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,GAAG,QAAQ,EAAC,GAAG,KAAK,CAAC;YACtF,eAAe,CAAC,IAAA,gBAAQ,EAAC,EAAC,GAAG,QAAQ,EAAE,WAAW,EAAE,EAAE,EAAE,aAAa,EAAE,EAAE,EAAC,CAAC,CAAC,CAAC;QACjF,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,OAAO,CACH,uBAAC,+CAAsB,CAAC,QAAQ,IAC5B,KAAK,EAAE;YACH,KAAK,EAAE,QAAQ,CAAC,OAAO;SAC1B,YAEA,QAAQ,GACqB,CACrC,CAAC;AACN,CAAC,CAAC;AAtCW,QAAA,uBAAuB,2BAsClC","sourcesContent":["import * as React from 'react';\n\nimport {StoreApi} from 'zustand';\n\nimport {POST_MESSAGE_SOURCE} from '../../../common/constants';\nimport {EditorState} from '../../../common/store';\nimport {StoreSyncMessage} from '../../../common/types';\nimport {removeFn} from '../../../common/utils';\nimport {EditorStore, createEditorStore} from '../../store';\nimport {IframeContext} from '../iframeContext';\n\nimport {MainEditorStoreContext} from './MainEditorStoreContext';\n\ninterface MainEditorProviderProps extends React.PropsWithChildren {}\n\nexport const MainEditorStoreProvider = ({children}: MainEditorProviderProps) => {\n const {iframeElement} = React.useContext(IframeContext);\n const storeRef = React.useRef<StoreApi<EditorStore>>();\n\n const sendPostMessage = React.useCallback(\n (data: EditorState) => {\n const message: StoreSyncMessage = {\n state: data,\n source: POST_MESSAGE_SOURCE,\n };\n\n if (iframeElement && iframeElement.contentWindow) {\n iframeElement.contentWindow.postMessage(message, '*');\n }\n },\n [iframeElement],\n );\n\n if (!storeRef.current) {\n storeRef.current = createEditorStore();\n }\n\n React.useEffect(() => {\n storeRef.current?.subscribe((state) => {\n const {historyPast: _historyPast, historyFuture: _historyFuture, ...syncable} = state;\n sendPostMessage(removeFn({...syncable, historyPast: [], historyFuture: []}));\n });\n }, [sendPostMessage]);\n\n return (\n <MainEditorStoreContext.Provider\n value={{\n state: storeRef.current,\n }}\n >\n {children}\n </MainEditorStoreContext.Provider>\n );\n};\n"]}

package/build/cjs/form-builder-v2/FormBuilderV2.js CHANGED Viewed

@@ -27,7 +27,7 @@ const b = (0, cn_1.formBuilderV2Cn)('main');
 const PALETTE_MIN = 160;
 const PALETTE_MAX = 400;
 const PALETTE_DEFAULT = 220;
-const INSPECTOR_MIN = 240;
+const INSPECTOR_MIN = 270;
 const INSPECTOR_MAX = 560;
 const INSPECTOR_DEFAULT = 320;
 const FormBuilderShell = ({ className, density }) => {

package/build/cjs/form-builder-v2/FormBuilderV2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormBuilderV2.js","sourceRoot":"../../../src","sources":["form-builder-v2/FormBuilderV2.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport type {DragDropEvents} from '@dnd-kit/abstract';\nimport type {DragDropManager, Draggable, Droppable} from '@dnd-kit/dom';\nimport {move} from '@dnd-kit/helpers';\nimport {DragDropProvider, DragOverlay} from '@dnd-kit/react';\nimport {Code, Eye, Pencil} from '@gravity-ui/icons';\nimport {Button, Icon, SegmentedRadioGroup} from '@gravity-ui/uikit';\n\nimport type {Content} from '../form-generator-v2/types';\n\nimport {CanvasContentProvider} from './CanvasContentContext';\nimport {Canvas} from './components/Canvas/Canvas';\nimport {ContentTab} from './components/ContentTab/ContentTab';\nimport {DragOverlayPreview} from './components/DragOverlayPreview/DragOverlayPreview';\nimport {Inspector} from './components/Inspector/Inspector';\nimport {PALETTE_DRAGGABLE_PREFIX, Palette} from './components/Palette/Palette';\nimport {ResizeHandle} from './components/ResizeHandle/ResizeHandle';\nimport {SchemaPopup} from './components/SchemaPopup/SchemaPopup';\nimport {FormProvider, useFormContext} from './hooks/FormContext';\nimport {FormField} from './types';\nimport {formBuilderV2Cn} from './utils/cn';\nimport {isDropAfter, isPaletteData, isSectionDropData} from './utils/dragData';\nimport {applyGroupsMap, buildGroupsMap} from './utils/fieldGroups';\nimport {findFieldById} from './utils/fieldTree';\nimport {stripIds} from './utils/stripIds';\n\nimport './FormBuilderV2.scss';\n\nconst b = formBuilderV2Cn('main');\n\ntype DndEvents = DragDropEvents<Draggable, Droppable, DragDropManager>;\ntype DragEndEvent = Parameters<DndEvents['dragend']>[0];\n\ntype Mode = 'edit' \| 'preview';\n\nexport type FormBuilderDensity = 'full' \| 'compact';\n\nconst PALETTE_MIN = 160;\nconst PALETTE_MAX = 400;\nconst PALETTE_DEFAULT = 220;\nconst INSPECTOR_MIN = 240;\nconst INSPECTOR_MAX = 560;\nconst INSPECTOR_DEFAULT = 320;\n\ninterface FormBuilderV2Props {\n className?: string;\n formFields: FormField[];\n onChange?: (fields: FormField[]) => void;\n\n density?: FormBuilderDensity;\n}\n\ninterface FormBuilderShellProps {\n className?: string;\n density: FormBuilderDensity;\n}\n\nconst FormBuilderShell = ({className, density}: FormBuilderShellProps) => {\n const [mode, setMode] = React.useState<Mode>('edit');\n const [canvasContent, setCanvasContent] = React.useState<Content>({});\n const [templateContent, setTemplateContent] = React.useState<Content>({});\n const [paletteWidth, setPaletteWidth] = React.useState(PALETTE_DEFAULT);\n const [inspectorWidth, setInspectorWidth] = React.useState(INSPECTOR_DEFAULT);\n const [schemaPopupOpen, setSchemaPopupOpen] = React.useState(false);\n const schemaButtonRef = React.useRef<HTMLButtonElement \| null>(null);\n\n const isCompact = density === 'compact';\n\n const {\n formFields,\n setAllFields,\n addField,\n addFieldToSection,\n insertFieldBefore,\n insertFieldAfter,\n moveFieldToSection,\n } = useFormContext();\n\n const schema = React.useMemo(() => stripIds(formFields), [formFields]);\n\n const handleDragEnd = React.useCallback(\n (event: DragEndEvent) => {\n if (event.canceled) return;\n const {source, target} = event.operation;\n if (!source) return;\n\n const paletteData = isPaletteData(source.data) ? source.data : null;\n const isPaletteDrag =\n paletteData !== null \|\| String(source.id).startsWith(PALETTE_DRAGGABLE_PREFIX);\n\n if (isPaletteDrag) {\n const type = paletteData?.type;\n if (!type) return;\n if (!target) {\n addField(type);\n return;\n }\n\n if (isSectionDropData(target.data)) {\n addFieldToSection(target.data.sectionId, type);\n return;\n }\n\n if (String(target.id) === String(source.id)) {\n addField(type);\n return;\n }\n\n const dropAfter = isDropAfter(\n event.operation.position?.current?.y,\n target.shape?.center?.y,\n );\n if (dropAfter) {\n insertFieldAfter(String(target.id), type);\n } else {\n insertFieldBefore(String(target.id), type);\n }\n return;\n }\n\n if (target && isSectionDropData(target.data)) {\n moveFieldToSection(String(source.id), target.data.sectionId);\n return;\n }\n\n const groups = buildGroupsMap(formFields);\n const nextGroups = move(groups, event);\n const nextFields = applyGroupsMap(nextGroups);\n setAllFields(nextFields);\n },\n [\n addField,\n addFieldToSection,\n formFields,\n insertFieldBefore,\n insertFieldAfter,\n moveFieldToSection,\n setAllFields,\n ],\n );\n\n const gridStyle = {\n '--fb2-palette-w': `${paletteWidth}px`,\n '--fb2-inspector-w': `${inspectorWidth}px`,\n } as React.CSSProperties;\n\n return (\n <div className={b({compact: density === 'compact'}, className)}>\n <CanvasContentProvider\n content={canvasContent}\n setContent={setCanvasContent}\n templateContent={templateContent}\n setTemplateContent={setTemplateContent}\n >\n <div className={b('toolbar')}>\n <SegmentedRadioGroup<Mode>\n size=\"m\"\n value={mode}\n onUpdate={setMode}\n options={[\n {\n value: 'edit',\n content: (\n <span className={b('toolbar-option')}>\n <Icon data={Pencil} size={14} />\n Edit\n </span>\n ),\n },\n {\n value: 'preview',\n content: (\n <span className={b('toolbar-option')}>\n <Icon data={Eye} size={14} />\n Preview\n </span>\n ),\n },\n ]}\n />\n <Button\n ref={schemaButtonRef}\n view=\"outlined\"\n size=\"m\"\n onClick={() => setSchemaPopupOpen((prev) => !prev)}\n >\n <Icon data={Code} size={14} />\n Schema\n </Button>\n <SchemaPopup\n schema={schema}\n onApply={setAllFields}\n open={schemaPopupOpen}\n onOpenChange={setSchemaPopupOpen}\n anchorElement={schemaButtonRef.current}\n />\n </div>\n\n {mode === 'edit' ? (\n <DragDropProvider onDragEnd={handleDragEnd}>\n <div className={b('visual')} style={gridStyle}>\n <aside className={b('palette')}>\n <Palette />\n </aside>\n {!isCompact && (\n <ResizeHandle\n value={paletteWidth}\n min={PALETTE_MIN}\n max={PALETTE_MAX}\n direction=\"left\"\n onChange={setPaletteWidth}\n />\n )}\n <main className={b('canvas')}>\n <Canvas />\n </main>\n <ResizeHandle\n value={inspectorWidth}\n min={INSPECTOR_MIN}\n max={INSPECTOR_MAX}\n direction=\"right\"\n onChange={setInspectorWidth}\n />\n <aside className={b('inspector')}>\n <Inspector />\n </aside>\n </div>\n <DragOverlay dropAnimation={null}>\n {(source) => {\n if (!source) return null;\n if (isPaletteData(source.data)) {\n return <DragOverlayPreview type={source.data.type} />;\n }\n const field = findFieldById(formFields, String(source.id));\n if (!field) return null;\n return <DragOverlayPreview type={field.type} field={field} />;\n }}\n </DragOverlay>\n </DragDropProvider>\n ) : (\n <ContentTab />\n )}\n </CanvasContentProvider>\n </div>\n );\n};\n\nexport const FormBuilderV2 = ({\n className,\n formFields,\n onChange,\n density = 'full',\n}: FormBuilderV2Props) => {\n return (\n <FormProvider formFields={formFields} onChange={onChange}>\n <FormBuilderShell className={className} density={density} />\n </FormProvider>\n );\n};\n"]}
1	+ {"version":3,"file":"FormBuilderV2.js","sourceRoot":"../../../src","sources":["form-builder-v2/FormBuilderV2.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport type {DragDropEvents} from '@dnd-kit/abstract';\nimport type {DragDropManager, Draggable, Droppable} from '@dnd-kit/dom';\nimport {move} from '@dnd-kit/helpers';\nimport {DragDropProvider, DragOverlay} from '@dnd-kit/react';\nimport {Code, Eye, Pencil} from '@gravity-ui/icons';\nimport {Button, Icon, SegmentedRadioGroup} from '@gravity-ui/uikit';\n\nimport type {Content} from '../form-generator-v2/types';\n\nimport {CanvasContentProvider} from './CanvasContentContext';\nimport {Canvas} from './components/Canvas/Canvas';\nimport {ContentTab} from './components/ContentTab/ContentTab';\nimport {DragOverlayPreview} from './components/DragOverlayPreview/DragOverlayPreview';\nimport {Inspector} from './components/Inspector/Inspector';\nimport {PALETTE_DRAGGABLE_PREFIX, Palette} from './components/Palette/Palette';\nimport {ResizeHandle} from './components/ResizeHandle/ResizeHandle';\nimport {SchemaPopup} from './components/SchemaPopup/SchemaPopup';\nimport {FormProvider, useFormContext} from './hooks/FormContext';\nimport {FormField} from './types';\nimport {formBuilderV2Cn} from './utils/cn';\nimport {isDropAfter, isPaletteData, isSectionDropData} from './utils/dragData';\nimport {applyGroupsMap, buildGroupsMap} from './utils/fieldGroups';\nimport {findFieldById} from './utils/fieldTree';\nimport {stripIds} from './utils/stripIds';\n\nimport './FormBuilderV2.scss';\n\nconst b = formBuilderV2Cn('main');\n\ntype DndEvents = DragDropEvents<Draggable, Droppable, DragDropManager>;\ntype DragEndEvent = Parameters<DndEvents['dragend']>[0];\n\ntype Mode = 'edit' \| 'preview';\n\nexport type FormBuilderDensity = 'full' \| 'compact';\n\nconst PALETTE_MIN = 160;\nconst PALETTE_MAX = 400;\nconst PALETTE_DEFAULT = 220;\nconst INSPECTOR_MIN = 270;\nconst INSPECTOR_MAX = 560;\nconst INSPECTOR_DEFAULT = 320;\n\ninterface FormBuilderV2Props {\n className?: string;\n formFields: FormField[];\n onChange?: (fields: FormField[]) => void;\n\n density?: FormBuilderDensity;\n}\n\ninterface FormBuilderShellProps {\n className?: string;\n density: FormBuilderDensity;\n}\n\nconst FormBuilderShell = ({className, density}: FormBuilderShellProps) => {\n const [mode, setMode] = React.useState<Mode>('edit');\n const [canvasContent, setCanvasContent] = React.useState<Content>({});\n const [templateContent, setTemplateContent] = React.useState<Content>({});\n const [paletteWidth, setPaletteWidth] = React.useState(PALETTE_DEFAULT);\n const [inspectorWidth, setInspectorWidth] = React.useState(INSPECTOR_DEFAULT);\n const [schemaPopupOpen, setSchemaPopupOpen] = React.useState(false);\n const schemaButtonRef = React.useRef<HTMLButtonElement \| null>(null);\n\n const isCompact = density === 'compact';\n\n const {\n formFields,\n setAllFields,\n addField,\n addFieldToSection,\n insertFieldBefore,\n insertFieldAfter,\n moveFieldToSection,\n } = useFormContext();\n\n const schema = React.useMemo(() => stripIds(formFields), [formFields]);\n\n const handleDragEnd = React.useCallback(\n (event: DragEndEvent) => {\n if (event.canceled) return;\n const {source, target} = event.operation;\n if (!source) return;\n\n const paletteData = isPaletteData(source.data) ? source.data : null;\n const isPaletteDrag =\n paletteData !== null \|\| String(source.id).startsWith(PALETTE_DRAGGABLE_PREFIX);\n\n if (isPaletteDrag) {\n const type = paletteData?.type;\n if (!type) return;\n if (!target) {\n addField(type);\n return;\n }\n\n if (isSectionDropData(target.data)) {\n addFieldToSection(target.data.sectionId, type);\n return;\n }\n\n if (String(target.id) === String(source.id)) {\n addField(type);\n return;\n }\n\n const dropAfter = isDropAfter(\n event.operation.position?.current?.y,\n target.shape?.center?.y,\n );\n if (dropAfter) {\n insertFieldAfter(String(target.id), type);\n } else {\n insertFieldBefore(String(target.id), type);\n }\n return;\n }\n\n if (target && isSectionDropData(target.data)) {\n moveFieldToSection(String(source.id), target.data.sectionId);\n return;\n }\n\n const groups = buildGroupsMap(formFields);\n const nextGroups = move(groups, event);\n const nextFields = applyGroupsMap(nextGroups);\n setAllFields(nextFields);\n },\n [\n addField,\n addFieldToSection,\n formFields,\n insertFieldBefore,\n insertFieldAfter,\n moveFieldToSection,\n setAllFields,\n ],\n );\n\n const gridStyle = {\n '--fb2-palette-w': `${paletteWidth}px`,\n '--fb2-inspector-w': `${inspectorWidth}px`,\n } as React.CSSProperties;\n\n return (\n <div className={b({compact: density === 'compact'}, className)}>\n <CanvasContentProvider\n content={canvasContent}\n setContent={setCanvasContent}\n templateContent={templateContent}\n setTemplateContent={setTemplateContent}\n >\n <div className={b('toolbar')}>\n <SegmentedRadioGroup<Mode>\n size=\"m\"\n value={mode}\n onUpdate={setMode}\n options={[\n {\n value: 'edit',\n content: (\n <span className={b('toolbar-option')}>\n <Icon data={Pencil} size={14} />\n Edit\n </span>\n ),\n },\n {\n value: 'preview',\n content: (\n <span className={b('toolbar-option')}>\n <Icon data={Eye} size={14} />\n Preview\n </span>\n ),\n },\n ]}\n />\n <Button\n ref={schemaButtonRef}\n view=\"outlined\"\n size=\"m\"\n onClick={() => setSchemaPopupOpen((prev) => !prev)}\n >\n <Icon data={Code} size={14} />\n Schema\n </Button>\n <SchemaPopup\n schema={schema}\n onApply={setAllFields}\n open={schemaPopupOpen}\n onOpenChange={setSchemaPopupOpen}\n anchorElement={schemaButtonRef.current}\n />\n </div>\n\n {mode === 'edit' ? (\n <DragDropProvider onDragEnd={handleDragEnd}>\n <div className={b('visual')} style={gridStyle}>\n <aside className={b('palette')}>\n <Palette />\n </aside>\n {!isCompact && (\n <ResizeHandle\n value={paletteWidth}\n min={PALETTE_MIN}\n max={PALETTE_MAX}\n direction=\"left\"\n onChange={setPaletteWidth}\n />\n )}\n <main className={b('canvas')}>\n <Canvas />\n </main>\n <ResizeHandle\n value={inspectorWidth}\n min={INSPECTOR_MIN}\n max={INSPECTOR_MAX}\n direction=\"right\"\n onChange={setInspectorWidth}\n />\n <aside className={b('inspector')}>\n <Inspector />\n </aside>\n </div>\n <DragOverlay dropAnimation={null}>\n {(source) => {\n if (!source) return null;\n if (isPaletteData(source.data)) {\n return <DragOverlayPreview type={source.data.type} />;\n }\n const field = findFieldById(formFields, String(source.id));\n if (!field) return null;\n return <DragOverlayPreview type={field.type} field={field} />;\n }}\n </DragOverlay>\n </DragDropProvider>\n ) : (\n <ContentTab />\n )}\n </CanvasContentProvider>\n </div>\n );\n};\n\nexport const FormBuilderV2 = ({\n className,\n formFields,\n onChange,\n density = 'full',\n}: FormBuilderV2Props) => {\n return (\n <FormProvider formFields={formFields} onChange={onChange}>\n <FormBuilderShell className={className} density={density} />\n </FormProvider>\n );\n};\n"]}

package/build/cjs/form-builder-v2/components/Palette/Palette.js CHANGED Viewed

@@ -43,7 +43,7 @@ const PaletteTile = ({ type, label, icon, onClick }) => {
         ref(element);
         handleRef(element);
     }, [ref, handleRef]);
-    return ((0, jsx_runtime_1.jsxs)(uikit_1.Button, { ref: setRefs, view: "flat", size: "m", className: b('tile', { dragging: isDragging }), onClick: onClick, title: label, children: [(0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icon, size: 18 }), (0, jsx_runtime_1.jsx)("span", { className: b('tile-label'), children: label })] }));
+    return ((0, jsx_runtime_1.jsx)(uikit_1.Tooltip, { content: label, placement: "right", openDelay: 500, children: (0, jsx_runtime_1.jsxs)(uikit_1.Button, { ref: setRefs, view: "flat", size: "m", className: b('tile', { dragging: isDragging }), onClick: onClick, children: [(0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icon, size: 18 }), (0, jsx_runtime_1.jsx)("span", { className: b('tile-label'), children: label })] }) }));
 };
 const Palette = () => {
     const { addField, addFieldToSection, formFields, selectedFieldId } = (0, FormContext_1.useFormContext)();

package/build/cjs/form-builder-v2/components/Palette/Palette.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Palette.js","sourceRoot":"../../../../../src","sources":["form-builder-v2/components/Palette/Palette.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,sCAAyE;AACzE,0CAA4C;AAC5C,~~6CAA2D~~;~~AAG3D~~,4DAAuD;AAEvD,0CAA+C;AAE/C,wDAA8E;AAM9E,MAAM,CAAC,GAAG,IAAA,oBAAe,EAAC,SAAS,CAAC,CAAC;AAExB,QAAA,wBAAwB,GAAG,UAAU,CAAC;AAEnD,MAAM,eAAe,GAAG,CACpB,MAAmB,EACnB,UAAyB,EACzB,kBAAiC,IAAI,EACZ,EAAE;IAC3B,IAAI,CAAC,UAAU;QAAE,OAAO,IAAI,CAAC;IAC7B,KAAK,MAAM,KAAK,IAAI,MAAM,EAAE,CAAC;QACzB,IAAI,KAAK,CAAC,EAAE,KAAK,UAAU,EAAE,CAAC;YAC1B,OAAO,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,CAAC;QACjE,CAAC;QACD,IAAI,KAAK,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;YAC3B,MAAM,MAAM,GAAG,eAAe,CAAC,KAAK,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC;YACnE,IAAI,MAAM,KAAK,SAAS;gBAAE,OAAO,MAAM,CAAC;QAC5C,CAAC;IACL,CAAC;IACD,OAAO,SAAS,CAAC;AACrB,CAAC,CAAC;AASF,MAAM,aAAa,GAAG,CAAC,CAAC;AAExB,MAAM,cAAc,GAAG;IACnB,mBAAa,CAAC,SAAS,CAAC;QACpB,qBAAqB,EAAE,CAAC,IAAI,kCAA4B,CAAC,QAAQ,CAAC,EAAC,KAAK,EAAE,aAAa,EAAC,CAAC,CAAC;KAC7F,CAAC;CACL,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,EAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAmB,EAAE,EAAE;IACnE,MAAM,EAAC,GAAG,EAAE,SAAS,EAAE,UAAU,EAAC,GAAG,IAAA,oBAAY,EAAC;QAC9C,EAAE,EAAE,GAAG,gCAAwB,GAAG,IAAI,EAAE;QACxC,IAAI,EAAE,EAAC,IAAI,EAAE,SAAS,EAAE,IAAI,EAAC;QAC7B,OAAO,EAAE,cAAc;KAC1B,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,KAAK,CAAC,WAAW,CAC7B,CAAC,OAAiC,EAAE,EAAE;QAClC,GAAG,CAAC,OAAO,CAAC,CAAC;QACb,SAAS,CAAC,OAAO,CAAC,CAAC;IACvB,CAAC,EACD,CAAC,GAAG,EAAE,SAAS,CAAC,CACnB,CAAC;IAEF,OAAO,CACH,wBAAC,cAAM,IACH,GAAG,EAAE,OAAO,EACZ,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,GAAG,EACR,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,QAAQ,EAAE,UAAU,EAAC,CAAC,EAC5C,OAAO,EAAE,OAAO,~~EAChB~~,~~KAAK,EAAE,KAAK,aAEZ,~~uBAAC,YAAI,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,GAAI,EAC9B,iCAAM,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,YAAG,KAAK,GAAQ,IAC3C,~~CACZ~~,CAAC;AACN,CAAC,CAAC;AAEK,MAAM,OAAO,GAAG,GAAG,EAAE;IACxB,MAAM,EAAC,QAAQ,EAAE,iBAAiB,EAAE,UAAU,EAAE,eAAe,EAAC,GAAG,IAAA,4BAAc,GAAE,CAAC;IAEpF,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAC7B,GAAG,EAAE,CAAC,eAAe,CAAC,UAAU,EAAE,eAAe,CAAC,EAClD,CAAC,UAAU,EAAE,eAAe,CAAC,CAChC,CAAC;IAEF,MAAM,SAAS,GAAG,CAAC,IAAsB,EAAE,EAAE;QACzC,IAAI,WAAW,EAAE,CAAC;YACd,iBAAiB,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;QACzC,CAAC;aAAM,CAAC;YACJ,QAAQ,CAAC,IAAI,CAAC,CAAC;QACnB,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACH,wBAAC,YAAI,IAAC,SAAS,EAAE,CAAC,EAAE,EAAE,IAAI,EAAC,UAAU,aACjC,iCAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,aACvB,uBAAC,YAAI,IAAC,OAAO,EAAC,aAAa,0BAAiB,EAC5C,uBAAC,YAAI,IAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,sFAE/B,IACL,EACN,gCAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YACrB,uBAAW,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACvB,uBAAC,WAAW,IAER,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,0BAAc,CAAC,IAAI,CAAC,EAC3B,IAAI,EAAE,sBAAU,CAAC,IAAI,CAAC,EACtB,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,IAJzB,IAAI,CAKX,CACL,CAAC,GACA,IACH,CACV,CAAC;AACN,CAAC,CAAC;AArCW,QAAA,OAAO,WAqClB","sourcesContent":["import * as React from 'react';\n\nimport {PointerActivationConstraints, PointerSensor} from '@dnd-kit/dom';\nimport {useDraggable} from '@dnd-kit/react';\nimport {Button, Card, Icon, Text} from '@gravity-ui/uikit';\nimport type {IconData} from '@gravity-ui/uikit';\n\nimport {useFormContext} from '../../hooks/FormContext';\nimport {BuilderFieldType, FormField} from '../../types';\nimport {formBuilderV2Cn} from '../../utils/cn';\nimport type {PaletteDragData} from '../../utils/dragData';\nimport {FIELD_TYPES, PALETTE_LABELS, TYPE_ICONS} from '../../utils/fieldMeta';\n\nimport './Palette.scss';\n\nexport type {PaletteDragData};\n\nconst b = formBuilderV2Cn('palette');\n\nexport const PALETTE_DRAGGABLE_PREFIX = 'palette:';\n\nconst findContainerId = (\n fields: FormField[],\n selectedId: string \| null,\n parentSectionId: string \| null = null,\n): string \| null \| undefined => {\n if (!selectedId) return null;\n for (const field of fields) {\n if (field.id === selectedId) {\n return field.type === 'section' ? field.id : parentSectionId;\n }\n if (field.type === 'section') {\n const nested = findContainerId(field.fields, selectedId, field.id);\n if (nested !== undefined) return nested;\n }\n }\n return undefined;\n};\n\ninterface PaletteTileProps {\n type: BuilderFieldType;\n label: string;\n icon: IconData;\n onClick: () => void;\n}\n\nconst DRAG_DISTANCE = 4;\n\nconst paletteSensors = [\n PointerSensor.configure({\n activationConstraints: [new PointerActivationConstraints.Distance({value: DRAG_DISTANCE})],\n }),\n];\n\nconst PaletteTile = ({type, label, icon, onClick}: PaletteTileProps) => {\n const {ref, handleRef, isDragging} = useDraggable({\n id: `${PALETTE_DRAGGABLE_PREFIX}${type}`,\n data: {kind: 'palette', type},\n sensors: paletteSensors,\n });\n\n const setRefs = React.useCallback(\n (element: HTMLButtonElement \| null) => {\n ref(element);\n handleRef(element);\n },\n [ref, handleRef],\n );\n\n return (\n <Button\n ref={setRefs}\n view=\"flat\"\n size=\"m\"\n className={b('tile', {dragging: isDragging})}\n onClick={onClick}\n ~~title={label}\n~~ >\n <Icon data={icon} size={18} />\n <span className={b('tile-label')}>{label}</span>\n </Button>\n );\n};\n\nexport const Palette = () => {\n const {addField, addFieldToSection, formFields, selectedFieldId} = useFormContext();\n\n const containerId = React.useMemo(\n () => findContainerId(formFields, selectedFieldId),\n [formFields, selectedFieldId],\n );\n\n const handleAdd = (type: BuilderFieldType) => {\n if (containerId) {\n addFieldToSection(containerId, type);\n } else {\n addField(type);\n }\n };\n\n return (\n <Card className={b()} view=\"outlined\">\n <div className={b('header')}>\n <Text variant=\"subheader-2\">Add field</Text>\n <Text variant=\"caption-1\" color=\"hint\">\n Click to add, or drag onto the canvas to drop at a specific position.\n </Text>\n </div>\n <div className={b('items')}>\n {FIELD_TYPES.map((type) => (\n <PaletteTile\n key={type}\n type={type}\n label={PALETTE_LABELS[type]}\n icon={TYPE_ICONS[type]}\n onClick={() => handleAdd(type)}\n />\n ))}\n </div>\n </Card>\n );\n};\n"]}
1	+ {"version":3,"file":"Palette.js","sourceRoot":"../../../../../src","sources":["form-builder-v2/components/Palette/Palette.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {PointerActivationConstraints, PointerSensor} from '@dnd-kit/dom';\nimport {useDraggable} from '@dnd-kit/react';\nimport {Button, Card, Icon, Text, Tooltip} from '@gravity-ui/uikit';\nimport type {IconData} from '@gravity-ui/uikit';\n\nimport {useFormContext} from '../../hooks/FormContext';\nimport {BuilderFieldType, FormField} from '../../types';\nimport {formBuilderV2Cn} from '../../utils/cn';\nimport type {PaletteDragData} from '../../utils/dragData';\nimport {FIELD_TYPES, PALETTE_LABELS, TYPE_ICONS} from '../../utils/fieldMeta';\n\nimport './Palette.scss';\n\nexport type {PaletteDragData};\n\nconst b = formBuilderV2Cn('palette');\n\nexport const PALETTE_DRAGGABLE_PREFIX = 'palette:';\n\nconst findContainerId = (\n fields: FormField[],\n selectedId: string \| null,\n parentSectionId: string \| null = null,\n): string \| null \| undefined => {\n if (!selectedId) return null;\n for (const field of fields) {\n if (field.id === selectedId) {\n return field.type === 'section' ? field.id : parentSectionId;\n }\n if (field.type === 'section') {\n const nested = findContainerId(field.fields, selectedId, field.id);\n if (nested !== undefined) return nested;\n }\n }\n return undefined;\n};\n\ninterface PaletteTileProps {\n type: BuilderFieldType;\n label: string;\n icon: IconData;\n onClick: () => void;\n}\n\nconst DRAG_DISTANCE = 4;\n\nconst paletteSensors = [\n PointerSensor.configure({\n activationConstraints: [new PointerActivationConstraints.Distance({value: DRAG_DISTANCE})],\n }),\n];\n\nconst PaletteTile = ({type, label, icon, onClick}: PaletteTileProps) => {\n const {ref, handleRef, isDragging} = useDraggable({\n id: `${PALETTE_DRAGGABLE_PREFIX}${type}`,\n data: {kind: 'palette', type},\n sensors: paletteSensors,\n });\n\n const setRefs = React.useCallback(\n (element: HTMLButtonElement \| null) => {\n ref(element);\n handleRef(element);\n },\n [ref, handleRef],\n );\n\n return (\n <Tooltip content={label} placement=\"right\" openDelay={500}>\n <Button\n ref={setRefs}\n view=\"flat\"\n size=\"m\"\n className={b('tile', {dragging: isDragging})}\n onClick={onClick}\n >\n <Icon data={icon} size={18} />\n <span className={b('tile-label')}>{label}</span>\n </Button>\n </Tooltip>\n );\n};\n\nexport const Palette = () => {\n const {addField, addFieldToSection, formFields, selectedFieldId} = useFormContext();\n\n const containerId = React.useMemo(\n () => findContainerId(formFields, selectedFieldId),\n [formFields, selectedFieldId],\n );\n\n const handleAdd = (type: BuilderFieldType) => {\n if (containerId) {\n addFieldToSection(containerId, type);\n } else {\n addField(type);\n }\n };\n\n return (\n <Card className={b()} view=\"outlined\">\n <div className={b('header')}>\n <Text variant=\"subheader-2\">Add field</Text>\n <Text variant=\"caption-1\" color=\"hint\">\n Click to add, or drag onto the canvas to drop at a specific position.\n </Text>\n </div>\n <div className={b('items')}>\n {FIELD_TYPES.map((type) => (\n <PaletteTile\n key={type}\n type={type}\n label={PALETTE_LABELS[type]}\n icon={TYPE_ICONS[type]}\n onClick={() => handleAdd(type)}\n />\n ))}\n </div>\n </Card>\n );\n};\n"]}