@salesforce/storefront-next-runtime 1.0.0-alpha.0 → 1.0.0-alpha.1

package/dist/DesignFrame.js

@@ -1,204 +0,0 @@
-import { a as useDesignState, r as useDesignContext } from "./DesignContext.js";
-import React from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/design/react/hooks/useNodeToTargetStore.ts
-function useNodeToTargetStore({ parentId, componentId, contentLinkUuid, regionId, nodeRef, type, contentLinkUuids, componentTypeInclusions, componentTypeExclusions }) {
-	const { nodeToTargetMap } = useDesignState();
-	React.useEffect(() => {
-		if (nodeRef.current) nodeToTargetMap.set(nodeRef.current, {
-			parentId,
-			componentId,
-			contentLinkUuid,
-			regionId,
-			type,
-			contentLinkUuids,
-			componentTypeInclusions,
-			componentTypeExclusions
-		});
-	}, [
-		nodeRef,
-		parentId,
-		componentId,
-		contentLinkUuid,
-		regionId,
-		type,
-		contentLinkUuids,
-		nodeToTargetMap,
-		componentTypeInclusions,
-		componentTypeExclusions
-	]);
-}
-
-//#endregion
-//#region src/design/react/hooks/useComponentType.ts
-function useComponentType(componentId) {
-	const { pageDesignerConfig } = useDesignContext();
-	const { type = "" } = pageDesignerConfig?.components[componentId] ?? {};
-	return pageDesignerConfig?.componentTypes[type] ?? null;
-}
-
-//#endregion
-//#region src/design/react/components/DeleteToolboxButton.tsx
-const DeleteToolboxButton = ({ title, onClick, onMouseDown = () => {} }) => /* @__PURE__ */ jsx("button", {
-	className: "pd-design__frame__toolbox-button",
-	title,
-	type: "button",
-	onMouseDown,
-	onClick,
-	children: /* @__PURE__ */ jsx("svg", {
-		className: "pd-design__frame__delete-icon",
-		viewBox: "0 0 24 24",
-		fill: "none",
-		xmlns: "http://www.w3.org/2000/svg",
-		children: /* @__PURE__ */ jsx("path", {
-			d: "M18 6L6 18M6 6l12 12",
-			stroke: "currentColor",
-			strokeWidth: "2",
-			strokeLinecap: "round",
-			strokeLinejoin: "round"
-		})
-	})
-});
-
-//#endregion
-//#region src/design/react/components/MoveToolboxButton.tsx
-const MoveToolboxButton = ({ title }) => /* @__PURE__ */ jsx("button", {
-	className: "pd-design__frame__toolbox-button",
-	title,
-	type: "button",
-	children: /* @__PURE__ */ jsx("svg", {
-		className: "pd-design__frame__move-icon",
-		viewBox: "0 0 24 24",
-		xmlns: "http://www.w3.org/2000/svg",
-		children: /* @__PURE__ */ jsx("path", {
-			d: "M22.9 11.7l-3.8-4.2c-.3-.3-.6 0-.6.4v2.7h-4.7c-.2 0-.4-.2-.4-.4V5.5h2.7c.5 0 .7-.4.4-.6l-4.1-3.8c-.2-.2-.5-.2-.7 0L7.6 4.9c-.3.3-.1.6.4.6h2.6v4.7c0 .2-.2.4-.4.4H5.5V7.9c0-.5-.4-.7-.6-.4l-3.8 4.1c-.2.2-.2.5 0 .7l3.8 4.1c.3.3.6.1.6-.4v-2.6h4.7c.2 0 .4.2.4.4v4.7H7.9c-.5 0-.7.4-.4.6l4.1 3.8c.2.2.5.2.7 0l4.1-3.8c.3-.3.1-.6-.4-.6h-2.6v-4.7c0-.2.2-.4.4-.4h4.7v2.7c0 .5.4.7.6.4l3.8-4.1c.2-.3.2-.5 0-.7z",
-			stroke: "currentColor",
-			strokeWidth: "2",
-			strokeLinecap: "round",
-			strokeLinejoin: "round"
-		})
-	})
-});
-
-//#endregion
-//#region src/design/react/hooks/useLabels.ts
-function useLabels() {
-	const { pageDesignerConfig } = useDesignContext();
-	return pageDesignerConfig?.labels ?? {};
-}
-
-//#endregion
-//#region src/design/react/components/DesignOverlay.tsx
-/**
-* Copyright 2026 Salesforce, Inc.
-*
-* Licensed under the Apache License, Version 2.0 (the "License");
-* you may not use this file except in compliance with the License.
-* You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-*/
-const DesignOverlay = () => {
-	return /* @__PURE__ */ jsx("div", {
-		className: "pd-design__frame__overlay",
-		children: /* @__PURE__ */ jsx("svg", {
-			xmlns: "http://www.w3.org/2000/svg",
-			x: "0px",
-			y: "0px",
-			width: "52px",
-			height: "52px",
-			viewBox: "0 0 52 52",
-			enableBackground: "new 0 0 52 52",
-			xmlSpace: "preserve",
-			children: /* @__PURE__ */ jsx("path", {
-				fill: "#FFFFFF",
-				d: "M26,2C12.7,2,2,12.7,2,26s10.7,24,24,24s24-10.7,24-24S39.3,2,26,2z M26,7C26,7,26,7,26,7C26,7,26,7,26,7\n	C26,7,26,7,26,7z M28,7.1c-0.1,0-0.1,0-0.2,0C27.9,7.1,28,7.1,28,7.1z M26,45C15.5,45,7,36.5,7,26c0-1,0.1-2.1,0.3-3\n	c1.3,0.2,2.9,0.7,3.7,1.5c1.7,1.8,3.6,3.9,5.4,4.3c0,0-0.2,0.1-0.4,0.4c-0.2,0.3-0.4,0.9-0.4,1.9c0,4.7,4.4,1.9,4.4,6.6\n	c0,4.7,5.3,6.6,5.3,2.8s3.5-5.6,3.5-8.5s-2.7-2.8-4.4-3.8c-1.8-0.9-2.7-2.4-6.1-1.9c-1.8-1.7-2.8-3.1-2-4.7c0.9-1.7,4.6-2,4.6-4.6\n	s-2.5-3.1-4.3-3.1c-0.8,0-2.5-0.6-3.9-1.3c1.7-1.7,3.8-3.1,6-4.1c1.6,0.7,4.3,1.8,6.6,1.8c2.7,0,4.1-1.9,3.7-3.1\n	c4.5,0.7,8.5,3,11.4,6.2c-1.5,0.9-3.5,1.9-7,1.9c-4.6,0-4.6,4.7-1.9,5.6c2.8,0.9,5.6-1.8,6.5,0c0.9,1.8-6.5,1.8-4.6,6.4\n	c1.9,4.6,3.7-0.1,5.6,4.5c1.9,4.6,5.6-0.7,2.8-4.3c-1.2-1.6-0.9-6.5,1.9-6.5h0.9c0.4,1.6,0.7,3.3,0.7,5C45,36.5,36.5,45,26,45z"
-			})
-		})
-	});
-};
-
-//#endregion
-//#region src/design/react/components/DesignFrame.tsx
-const DesignFrame = ({ componentId, children, name, parentId, regionId, contentLinkUuid, localized = false, showFrame = false, showToolbox = true, isMoveable = true, className }) => {
-	const componentType = useComponentType(componentId ?? "");
-	const { deleteComponent } = useDesignState();
-	const labels = useLabels();
-	const nodeRef = React.useRef(null);
-	const handleDelete = React.useCallback((event) => {
-		event.stopPropagation();
-		if (componentId) deleteComponent({
-			componentId,
-			contentLinkUuid: contentLinkUuid ?? "",
-			sourceComponentId: parentId ?? "",
-			sourceRegionId: regionId ?? ""
-		});
-	}, [
-		deleteComponent,
-		componentId,
-		contentLinkUuid,
-		parentId,
-		regionId
-	]);
-	const stopPropagation = (event) => event.stopPropagation();
-	return /* @__PURE__ */ jsxs("div", {
-		className: [
-			"pd-design__frame",
-			showFrame && "pd-design__frame--visible",
-			className
-		].filter(Boolean).join(" "),
-		ref: nodeRef,
-		children: [
-			showFrame && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", { className: "pd-design__frame--x" }), /* @__PURE__ */ jsx("div", { className: "pd-design__frame--y" })] }),
-			/* @__PURE__ */ jsxs("div", {
-				className: "pd-design__frame__label",
-				onMouseDown: stopPropagation,
-				children: [
-					componentType?.image && /* @__PURE__ */ jsx("span", {
-						className: "pd-design__icon",
-						children: /* @__PURE__ */ jsx("img", {
-							src: componentType.image,
-							alt: ""
-						})
-					}),
-					/* @__PURE__ */ jsx("span", {
-						className: "pd-design__frame__name",
-						children: name
-					}),
-					!localized && /* @__PURE__ */ jsx("span", {
-						className: "pd-design__frame__fallback-badge",
-						children: labels.fallback ?? "Fallback"
-					})
-				]
-			}),
-			showToolbox && /* @__PURE__ */ jsxs("div", {
-				className: "pd-design__frame__toolbox",
-				children: [isMoveable && /* @__PURE__ */ jsx(MoveToolboxButton, { title: labels.moveComponent ?? "Move component" }), /* @__PURE__ */ jsx(DeleteToolboxButton, {
-					title: labels.deleteComponent ?? "Delete component",
-					onMouseDown: stopPropagation,
-					onClick: handleDelete
-				})]
-			}),
-			/* @__PURE__ */ jsx(DesignOverlay, {}),
-			children
-		]
-	});
-};
-DesignFrame.defaultProps = {
-	parentId: void 0,
-	componentId: void 0,
-	showToolbox: true,
-	regionId: void 0,
-	showFrame: false
-};
-
-//#endregion
-export { useNodeToTargetStore as i, useLabels as n, useComponentType as r, DesignFrame as t };
-//# sourceMappingURL=DesignFrame.js.map

package/dist/DesignFrame.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DesignFrame.js","names":[],"sources":["../src/design/react/hooks/useNodeToTargetStore.ts","../src/design/react/hooks/useComponentType.ts","../src/design/react/components/DeleteToolboxButton.tsx","../src/design/react/components/MoveToolboxButton.tsx","../src/design/react/hooks/useLabels.ts","../src/design/react/components/DesignOverlay.tsx","../src/design/react/components/DesignFrame.tsx"],"sourcesContent":["/**\n * Copyright 2026 Salesforce, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\nimport { useDesignState } from './useDesignState';\nimport type { NodeToTargetMapEntry } from '../context/DesignStateContext';\n\nexport function useNodeToTargetStore({\n    parentId,\n    componentId,\n    contentLinkUuid,\n    regionId,\n    nodeRef,\n    type,\n    contentLinkUuids,\n    componentTypeInclusions,\n    componentTypeExclusions,\n}: Partial<NodeToTargetMapEntry> & {\n    nodeRef: React.RefObject<Element | null>;\n}): void {\n    const { nodeToTargetMap } = useDesignState();\n\n    React.useEffect(() => {\n        if (nodeRef.current) {\n            nodeToTargetMap.set(nodeRef.current, {\n                parentId,\n                componentId,\n                contentLinkUuid,\n                regionId,\n                type,\n                contentLinkUuids,\n                componentTypeInclusions,\n                componentTypeExclusions,\n            } as NodeToTargetMapEntry);\n        }\n    }, [\n        nodeRef,\n        parentId,\n        componentId,\n        contentLinkUuid,\n        regionId,\n        type,\n        contentLinkUuids,\n        nodeToTargetMap,\n        componentTypeInclusions,\n        componentTypeExclusions,\n    ]);\n}\n","/**\n * Copyright 2026 Salesforce, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { useDesignContext } from '../context/DesignContext';\nimport type { ComponentType } from '../../messaging-api/domain-types';\n\nexport function useComponentType(componentId: string): ComponentType | null {\n    const { pageDesignerConfig } = useDesignContext();\n    const { type = '' } = pageDesignerConfig?.components[componentId] ?? {};\n\n    return pageDesignerConfig?.componentTypes[type] ?? null;\n}\n","/**\n * Copyright 2026 Salesforce, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport type React from 'react';\n\nexport const DeleteToolboxButton = ({\n    title,\n    onClick,\n    onMouseDown = () => {\n        /* noop */\n    },\n}: {\n    title: string;\n    onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;\n    onMouseDown?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n}): React.JSX.Element => (\n    <button\n        className=\"pd-design__frame__toolbox-button\"\n        title={title}\n        type=\"button\"\n        onMouseDown={onMouseDown}\n        onClick={onClick}>\n        <svg\n            className=\"pd-design__frame__delete-icon\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n                d=\"M18 6L6 18M6 6l12 12\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n        </svg>\n    </button>\n);\n","/**\n * Copyright 2026 Salesforce, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport type React from 'react';\n\nexport const MoveToolboxButton = ({ title }: { title: string }): React.JSX.Element => (\n    <button className=\"pd-design__frame__toolbox-button\" title={title} type=\"button\">\n        <svg className=\"pd-design__frame__move-icon\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n                d=\"M22.9 11.7l-3.8-4.2c-.3-.3-.6 0-.6.4v2.7h-4.7c-.2 0-.4-.2-.4-.4V5.5h2.7c.5 0 .7-.4.4-.6l-4.1-3.8c-.2-.2-.5-.2-.7 0L7.6 4.9c-.3.3-.1.6.4.6h2.6v4.7c0 .2-.2.4-.4.4H5.5V7.9c0-.5-.4-.7-.6-.4l-3.8 4.1c-.2.2-.2.5 0 .7l3.8 4.1c.3.3.6.1.6-.4v-2.6h4.7c.2 0 .4.2.4.4v4.7H7.9c-.5 0-.7.4-.4.6l4.1 3.8c.2.2.5.2.7 0l4.1-3.8c.3-.3.1-.6-.4-.6h-2.6v-4.7c0-.2.2-.4.4-.4h4.7v2.7c0 .5.4.7.6.4l3.8-4.1c.2-.3.2-.5 0-.7z\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n        </svg>\n    </button>\n);\n","/**\n * Copyright 2026 Salesforce, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { useDesignContext } from '../context/DesignContext';\n\nexport function useLabels(): Record<string, string> {\n    const { pageDesignerConfig } = useDesignContext();\n\n    return pageDesignerConfig?.labels ?? {};\n}\n","/**\n * Copyright 2026 Salesforce, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nexport const DesignOverlay = () => {\n    return (\n        <div className=\"pd-design__frame__overlay\">\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                x=\"0px\"\n                y=\"0px\"\n                width=\"52px\"\n                height=\"52px\"\n                viewBox=\"0 0 52 52\"\n                enableBackground=\"new 0 0 52 52\"\n                xmlSpace=\"preserve\">\n                <path\n                    fill=\"#FFFFFF\"\n                    d=\"M26,2C12.7,2,2,12.7,2,26s10.7,24,24,24s24-10.7,24-24S39.3,2,26,2z M26,7C26,7,26,7,26,7C26,7,26,7,26,7\n\tC26,7,26,7,26,7z M28,7.1c-0.1,0-0.1,0-0.2,0C27.9,7.1,28,7.1,28,7.1z M26,45C15.5,45,7,36.5,7,26c0-1,0.1-2.1,0.3-3\n\tc1.3,0.2,2.9,0.7,3.7,1.5c1.7,1.8,3.6,3.9,5.4,4.3c0,0-0.2,0.1-0.4,0.4c-0.2,0.3-0.4,0.9-0.4,1.9c0,4.7,4.4,1.9,4.4,6.6\n\tc0,4.7,5.3,6.6,5.3,2.8s3.5-5.6,3.5-8.5s-2.7-2.8-4.4-3.8c-1.8-0.9-2.7-2.4-6.1-1.9c-1.8-1.7-2.8-3.1-2-4.7c0.9-1.7,4.6-2,4.6-4.6\n\ts-2.5-3.1-4.3-3.1c-0.8,0-2.5-0.6-3.9-1.3c1.7-1.7,3.8-3.1,6-4.1c1.6,0.7,4.3,1.8,6.6,1.8c2.7,0,4.1-1.9,3.7-3.1\n\tc4.5,0.7,8.5,3,11.4,6.2c-1.5,0.9-3.5,1.9-7,1.9c-4.6,0-4.6,4.7-1.9,5.6c2.8,0.9,5.6-1.8,6.5,0c0.9,1.8-6.5,1.8-4.6,6.4\n\tc1.9,4.6,3.7-0.1,5.6,4.5c1.9,4.6,5.6-0.7,2.8-4.3c-1.2-1.6-0.9-6.5,1.9-6.5h0.9c0.4,1.6,0.7,3.3,0.7,5C45,36.5,36.5,45,26,45z\"\n                />\n            </svg>\n        </div>\n    );\n};\n","/**\n * Copyright 2026 Salesforce, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\nimport { useComponentType } from '../hooks/useComponentType';\nimport { DeleteToolboxButton } from './DeleteToolboxButton';\nimport { MoveToolboxButton } from './MoveToolboxButton';\nimport { useDesignState } from '../hooks/useDesignState';\nimport { useLabels } from '../hooks/useLabels';\nimport { DesignOverlay } from './DesignOverlay';\n\nexport const DesignFrame = ({\n    componentId,\n    children,\n    name,\n    parentId,\n    regionId,\n    contentLinkUuid,\n    localized = false,\n    showFrame = false,\n    showToolbox = true,\n    isMoveable = true,\n    className,\n}: React.PropsWithChildren<{\n    componentId?: string;\n    name: string;\n    localized?: boolean;\n    parentId?: string;\n    regionId?: string;\n    contentLinkUuid?: string;\n    showToolbox?: boolean;\n    showFrame?: boolean;\n    isMoveable?: boolean;\n    className?: string;\n}>): React.JSX.Element => {\n    const componentType = useComponentType(componentId ?? '');\n    const { deleteComponent } = useDesignState();\n    const labels = useLabels();\n    const nodeRef = React.useRef<HTMLDivElement>(null);\n\n    const handleDelete = React.useCallback(\n        (event: React.MouseEvent) => {\n            // Stop propagation so we don't select the component as well when\n            // this bubbles up.\n            event.stopPropagation();\n\n            if (componentId) {\n                deleteComponent({\n                    componentId,\n                    contentLinkUuid: contentLinkUuid ?? '',\n                    sourceComponentId: parentId ?? '',\n                    sourceRegionId: regionId ?? '',\n                });\n            }\n        },\n        [deleteComponent, componentId, contentLinkUuid, parentId, regionId]\n    );\n\n    const stopPropagation = (event: React.MouseEvent) => event.stopPropagation();\n\n    const classes = ['pd-design__frame', showFrame && 'pd-design__frame--visible', className].filter(Boolean).join(' ');\n\n    // TODO: For the frame label, when there is not enough space above the component to display it, we\n    // need to display it inside the container instead.\n    return (\n        <div className={classes} ref={nodeRef}>\n            {showFrame && (\n                <>\n                    <div className=\"pd-design__frame--x\" />\n                    <div className=\"pd-design__frame--y\" />\n                </>\n            )}\n            <div className=\"pd-design__frame__label\" onMouseDown={stopPropagation}>\n                {componentType?.image && (\n                    <span className=\"pd-design__icon\">\n                        <img src={componentType.image} alt=\"\" />\n                    </span>\n                )}\n                <span className=\"pd-design__frame__name\">{name}</span>\n                {!localized && (\n                    <span className=\"pd-design__frame__fallback-badge\">{labels.fallback ?? 'Fallback'}</span>\n                )}\n            </div>\n            {showToolbox && (\n                <div className=\"pd-design__frame__toolbox\">\n                    {isMoveable && <MoveToolboxButton title={labels.moveComponent ?? 'Move component'} />}\n                    <DeleteToolboxButton\n                        title={labels.deleteComponent ?? 'Delete component'}\n                        onMouseDown={stopPropagation}\n                        onClick={handleDelete}\n                    />\n                </div>\n            )}\n            <DesignOverlay />\n            {children}\n        </div>\n    );\n};\n\nDesignFrame.defaultProps = {\n    parentId: undefined,\n    componentId: undefined,\n    showToolbox: true,\n    regionId: undefined,\n    showFrame: false,\n};\n"],"mappings":"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"}