@mindfiredigital/page-builder-react/dist/index.mjs.map

React UI Page builder

{"version":3,"sources":["../src/components/PageBuilder.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\r\nimport ReactDOM from \"react-dom/client\";\r\n\r\n// Updated interfaces to support new configuration\r\ninterface DynamicComponents {\r\n  Basic: string[];\r\n  Extra: string[];\r\n  Custom?: Record<string, CustomComponentConfig>;\r\n}\r\n\r\ninterface CustomComponentConfig {\r\n  component: React.ComponentType<any> | string;\r\n  svg?: string;\r\n  title?: string;\r\n}\r\n\r\ninterface PageBuilderReactProps {\r\n  config: DynamicComponents;\r\n  customComponents?: Record<string, CustomComponentConfig>;\r\n}\r\n\r\nexport const PageBuilderReact: React.FC<PageBuilderReactProps> = ({ \r\n  config, \r\n  customComponents \r\n}) => {\r\n  const builderRef = useRef<HTMLElement>(null);\r\n  const [processedConfig, setProcessedConfig] = useState<DynamicComponents>(config);\r\n\r\n  useEffect(() => {\r\n    // Import web component\r\n    import(\"@mindfiredigital/page-builder-web-component\")\r\n      .catch(error => {\r\n        console.error(\"Failed to load web component:\", error);\r\n      });\r\n  }, []);\r\n\r\n  useEffect(() => {\r\n    // Create a copy of the original config\r\n    const modifiedConfig: DynamicComponents|any= JSON.parse(JSON.stringify(config));\r\n\r\n    // Merge custom components if provided\r\n    if (customComponents) {\r\n      // Ensure Custom property exists\r\n      modifiedConfig.Custom = modifiedConfig.Custom || {};\r\n\r\n      // Process each custom component\r\n      Object.entries(customComponents).forEach(([key, componentConfig]) => {\r\n        // Skip if component is not valid\r\n        if (!componentConfig.component) {\r\n          console.warn(`Skipping invalid component: ${key}`);\r\n          return;\r\n        }\r\n\r\n        // Create unique tag name\r\n        const tagName = `react-component-${key.toLowerCase()}`;\r\n\r\n        // Create custom element if not exists\r\n        if (!customElements.get(tagName)) {\r\n          class ReactComponentElement extends HTMLElement {\r\n            connectedCallback() {\r\n              const mountPoint = document.createElement(\"div\");\r\n              this.appendChild(mountPoint);\r\n              \r\n              try {\r\n                ReactDOM.createRoot(mountPoint).render(\r\n                  React.createElement(componentConfig.component)\r\n                );\r\n              } catch (error) {\r\n                console.error(`Error rendering ${key} component:`, error);\r\n              }\r\n            }\r\n          }\r\n          \r\n          // Define custom element\r\n          customElements.define(tagName, ReactComponentElement);\r\n        }\r\n\r\n        // Add to Custom components with web component tag\r\n        modifiedConfig.Custom[key]  = {\r\n          component: tagName,\r\n          svg: componentConfig.svg,\r\n          title: componentConfig.title\r\n        };\r\n      });\r\n    }\r\n\r\n    // Update state and set config\r\n    setProcessedConfig(modifiedConfig);\r\n  }, [config, customComponents]);\r\n\r\n  // Effect to set config on web component\r\n  useEffect(() => {\r\n    if (builderRef.current) {\r\n      try {\r\n        // Convert to JSON string\r\n        const configString = JSON.stringify(processedConfig);\r\n        \r\n        // Set config data attribute\r\n        builderRef.current.setAttribute(\"config-data\", configString);\r\n      } catch (error) {\r\n        console.error(\"Error setting config-data:\", error);\r\n      }\r\n    }\r\n  }, [processedConfig]);\r\n\r\n  return <page-builder ref={builderRef} />;\r\n};"],"mappings":";AAAA,OAAO,SAAS,WAAW,QAAQ,gBAAgB;AACnD,OAAO,cAAc;AAoBd,IAAM,mBAAoD,CAAC;AAAA,EAChE;AAAA,EACA;AACF,MAAM;AACJ,QAAM,aAAa,OAAoB,IAAI;AAC3C,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAA4B,MAAM;AAEhF,YAAU,MAAM;AAEd,WAAO,6CAA6C,EACjD,MAAM,WAAS;AACd,cAAQ,MAAM,iCAAiC,KAAK;AAAA,IACtD,CAAC;AAAA,EACL,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AAEd,UAAM,iBAAuC,KAAK,MAAM,KAAK,UAAU,MAAM,CAAC;AAG9E,QAAI,kBAAkB;AAEpB,qBAAe,SAAS,eAAe,UAAU,CAAC;AAGlD,aAAO,QAAQ,gBAAgB,EAAE,QAAQ,CAAC,CAAC,KAAK,eAAe,MAAM;AAEnE,YAAI,CAAC,gBAAgB,WAAW;AAC9B,kBAAQ,KAAK,+BAA+B,KAAK;AACjD;AAAA,QACF;AAGA,cAAM,UAAU,mBAAmB,IAAI,YAAY;AAGnD,YAAI,CAAC,eAAe,IAAI,OAAO,GAAG;AAChC,gBAAM,8BAA8B,YAAY;AAAA,YAC9C,oBAAoB;AAClB,oBAAM,aAAa,SAAS,cAAc,KAAK;AAC/C,mBAAK,YAAY,UAAU;AAE3B,kBAAI;AACF,yBAAS,WAAW,UAAU,EAAE;AAAA,kBAC9B,MAAM,cAAc,gBAAgB,SAAS;AAAA,gBAC/C;AAAA,cACF,SAAS,OAAP;AACA,wBAAQ,MAAM,mBAAmB,kBAAkB,KAAK;AAAA,cAC1D;AAAA,YACF;AAAA,UACF;AAGA,yBAAe,OAAO,SAAS,qBAAqB;AAAA,QACtD;AAGA,uBAAe,OAAO,GAAG,IAAK;AAAA,UAC5B,WAAW;AAAA,UACX,KAAK,gBAAgB;AAAA,UACrB,OAAO,gBAAgB;AAAA,QACzB;AAAA,MACF,CAAC;AAAA,IACH;AAGA,uBAAmB,cAAc;AAAA,EACnC,GAAG,CAAC,QAAQ,gBAAgB,CAAC;AAG7B,YAAU,MAAM;AACd,QAAI,WAAW,SAAS;AACtB,UAAI;AAEF,cAAM,eAAe,KAAK,UAAU,eAAe;AAGnD,mBAAW,QAAQ,aAAa,eAAe,YAAY;AAAA,MAC7D,SAAS,OAAP;AACA,gBAAQ,MAAM,8BAA8B,KAAK;AAAA,MACnD;AAAA,IACF;AAAA,EACF,GAAG,CAAC,eAAe,CAAC;AAEpB,SAAO,oCAAC,kBAAa,KAAK,YAAY;AACxC;","names":[]}