@erpsquad/common 1.8.81 → 1.8.82

package/dist/views/template-editor/components/EditorCanvas/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/template-editor/components/EditorCanvas.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\r\n/* eslint-disable react-hooks/exhaustive-deps */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React, { useState, useEffect, useRef, useMemo } from 'react';\r\nimport { useDroppable } from '@dnd-kit/core';\r\nimport EditorSection from './EditorSection';\r\nimport { Box, Container, Paper } from '@mui/material';\r\nimport Typography from '../../../components/typography/typography';\r\nimport SectionFormatPanel from './SectionFormatPanel';\r\nimport EditorSidebar from './EditorSidebar';\r\nimport { generateEmailPreview, generateHeaderFooterPreview } from '../utils/common';\r\nimport { EnhancedSectionData } from '../types/editor';\r\n\r\nconst CANVAS_TYPES = {\r\n  HEADER: 'header',\r\n  MAIN: 'main',\r\n  FOOTER: 'footer'\r\n};\r\n\r\ninterface DropPosition {\r\n  id: string | null;\r\n  type: 'before' | 'after' | 'inside' | 'left' | 'right';\r\n  canvasType: string;\r\n}\r\n\r\ninterface EditorCanvasProps {\r\n  sections: EnhancedSectionData[];\r\n  headerSections: EnhancedSectionData[];\r\n  footerSections: EnhancedSectionData[];\r\n  activeId: string | null;\r\n  overSection: string | null;\r\n  selectedSection: string | null;\r\n  onSelectSection: (id: string | null) => void;\r\n  onUpdateSection: (id: string, data: any, canvasType?: string) => void;\r\n  onSplitSection: (id: string, content1: string, content2: string, canvasType?: string) => void;\r\n  onDeleteSection: (id: string, canvasType?: string) => void;\r\n  preview: boolean;\r\n  placeholders: Record<string, any>[];\r\n  isEditingHeaderFooter: boolean;\r\n  relation_table:any[];\r\n  handleSave?: () => Promise<void>;\r\n}\r\n\r\nconst EditorCanvas: React.FC<EditorCanvasProps> = ({\r\n  sections,\r\n  headerSections,\r\n  footerSections,\r\n  activeId,\r\n  selectedSection,\r\n  onSelectSection,\r\n  onUpdateSection,\r\n  onSplitSection,\r\n  onDeleteSection,\r\n  preview,\r\n  placeholders,\r\n  isEditingHeaderFooter,\r\n  handleSave,\r\n  relation_table\r\n}) => {\r\n  // Convert placeholders to the expected format\r\n  const formattedPlaceholders = useMemo(() => {\r\n    return placeholders.map((p: Record<string, any>) => ({\r\n      value: p.value || p.key || '',\r\n      label: p.label || p.name || String(p.value || p.key || '')\r\n    }));\r\n  }, [placeholders]);\r\n\r\n  const { setNodeRef: setMainCanvasRef } = useDroppable({ id: 'main-canvas' });\r\n  const { setNodeRef: setHeaderCanvasRef } = useDroppable({ id: 'header-canvas' });\r\n  const { setNodeRef: setFooterCanvasRef } = useDroppable({ id: 'footer-canvas' });\r\n\r\n  const selectedSectionData = useMemo(() => {\r\n    return [...sections, ...headerSections, ...footerSections].find((section) => section.id === selectedSection);\r\n  }, [sections, selectedSection]);\r\n\r\n  const [dropTarget, setDropTarget] = useState<DropPosition>({ \r\n    id: null, \r\n    type: 'inside',\r\n    canvasType: CANVAS_TYPES.MAIN\r\n  });\r\n  const [isDraggingFromSidebar, setIsDraggingFromSidebar] = useState(false);\r\n  const [isSectionEditing, setIsSectionEditing] = useState(false);\r\n  \r\n  const lastUpdateTimeRef = useRef(0);\r\n  const lastPositionRef = useRef({ x: 0, y: 0 });\r\n  const activeIdRef = useRef<string | null>(null);\r\n  const mainCanvasRef = useRef<HTMLDivElement | null>(null);\r\n  const headerCanvasRef = useRef<HTMLDivElement | null>(null);\r\n  const footerCanvasRef = useRef<HTMLDivElement | null>(null);\r\n  \r\n  const DEBOUNCE_MS = 200;\r\n  const MIN_MOUSE_MOVE = 15;\r\n  const POSITION_HYSTERESIS = 0.1;\r\n\r\n  const getTargetSections = (canvasType: string) => {\r\n    switch (canvasType) {\r\n      case CANVAS_TYPES.HEADER:\r\n        return headerSections;\r\n      case CANVAS_TYPES.FOOTER:\r\n        return footerSections;\r\n      default:\r\n        return sections;\r\n    }\r\n  };\r\n\r\n  useEffect(() => {\r\n    activeIdRef.current = activeId;\r\n    \r\n    if (activeId && String(activeId).includes('sidebar-')) {\r\n      setIsDraggingFromSidebar(true);\r\n      \r\n      if (sections?.length > 0) {\r\n        updateDropTarget(sections[0].id, 'before', CANVAS_TYPES.MAIN);\r\n      } else if (headerSections?.length > 0 && isEditingHeaderFooter) {\r\n        updateDropTarget(headerSections[0].id, 'before', CANVAS_TYPES.HEADER);\r\n      } else if (footerSections?.length > 0 && isEditingHeaderFooter) {\r\n        updateDropTarget(footerSections[0].id, 'before', CANVAS_TYPES.FOOTER);\r\n      } else {\r\n        updateDropTarget(null, 'inside', CANVAS_TYPES.MAIN);\r\n      }\r\n    } else if (!activeId) {\r\n      setIsDraggingFromSidebar(false);\r\n      setDropTarget({ id: null, type: 'inside', canvasType: CANVAS_TYPES.MAIN });\r\n    }\r\n  }, [activeId, sections, headerSections, footerSections, isEditingHeaderFooter]);\r\n\r\n  const updateDropTarget = (id: string | null, type: DropPosition['type'], canvasType: string) => {\r\n    const now = Date.now();\r\n    if (now - lastUpdateTimeRef.current < DEBOUNCE_MS) return;\r\n    \r\n    if (dropTarget.id !== id || dropTarget.type !== type || dropTarget.canvasType !== canvasType) {\r\n      lastUpdateTimeRef.current = now;\r\n      setDropTarget({ id, type, canvasType });\r\n    }\r\n  };\r\n\r\n  const handleMouseMove = (e: React.MouseEvent, canvasType: string) => {\r\n    if (!activeIdRef.current) return;\r\n    if (canvasType !== CANVAS_TYPES.MAIN && !isEditingHeaderFooter) return;\r\n    \r\n    const dx = e.clientX - lastPositionRef.current.x;\r\n    const dy = e.clientY - lastPositionRef.current.y;\r\n    const distance = Math.sqrt(dx * dx + dy * dy);\r\n    \r\n    if (distance < MIN_MOUSE_MOVE) return;\r\n    \r\n    lastPositionRef.current = { x: e.clientX, y: e.clientY };\r\n    \r\n    const elementsUnderCursor = document.elementsFromPoint(e.clientX, e.clientY);\r\n    const sectionElement = elementsUnderCursor.find(el => \r\n      el.hasAttribute('data-section-id')\r\n    );\r\n    \r\n    const targetSections = getTargetSections(canvasType);\r\n    \r\n    if (!sectionElement) {\r\n      if (targetSections.length === 0) {\r\n        updateDropTarget(null, 'inside', canvasType);\r\n      } else if (isDraggingFromSidebar) {\r\n        updateDropTarget(targetSections[targetSections.length - 1].id, 'after', canvasType);\r\n      }\r\n      return;\r\n    }\r\n    \r\n    const sectionId = sectionElement.getAttribute('data-section-id');\r\n    if (!sectionId) return;\r\n    \r\n    const sectionCanvasType = sectionElement.hasAttribute('data-canvas-type') \r\n      ? sectionElement.getAttribute('data-canvas-type') as string\r\n      : canvasType;\r\n    \r\n    const rect = sectionElement.getBoundingClientRect();\r\n    const relativeY = e.clientY - rect.top;\r\n    const relativeX = e.clientX - rect.left;\r\n    const sectionHeight = rect.height;\r\n    const sectionWidth = rect.width;\r\n    \r\n    const canvasSections = getTargetSections(sectionCanvasType);\r\n    const section = canvasSections.find(s => s.id === sectionId);\r\n    \r\n    const isSplitGroup = sectionId.startsWith('split-group-');\r\n    \r\n    if (isSplitGroup || (section && section.isSplitPair)) {\r\n      if (relativeX < sectionWidth * (0.5 - POSITION_HYSTERESIS)) {\r\n        updateDropTarget(sectionId, 'left', sectionCanvasType);\r\n      } else if (relativeX > sectionWidth * (0.5 + POSITION_HYSTERESIS)) {\r\n        updateDropTarget(sectionId, 'right', sectionCanvasType);\r\n      } else {\r\n        updateDropTarget(sectionId, 'inside', sectionCanvasType);\r\n      }\r\n    } else {\r\n      let position: DropPosition['type'] = dropTarget.type;\r\n      if (relativeY < sectionHeight * (0.3 - POSITION_HYSTERESIS)) {\r\n        position = 'before';\r\n      } else if (relativeY > sectionHeight * (0.7 + POSITION_HYSTERESIS)) {\r\n        position = 'after';\r\n      } else {\r\n        position = 'inside';\r\n      }\r\n      updateDropTarget(sectionId, position, sectionCanvasType);\r\n    }\r\n  };\r\n\r\n  const handleMouseEnter = (e: React.MouseEvent, canvasType: string) => {\r\n    if (!activeIdRef.current || !isDraggingFromSidebar) return;\r\n    if (canvasType !== CANVAS_TYPES.MAIN && !isEditingHeaderFooter) return;\r\n    \r\n    const targetSections = getTargetSections(canvasType);\r\n    \r\n    if (targetSections.length > 0) {\r\n      updateDropTarget(targetSections[0].id, 'before', canvasType);\r\n    } else {\r\n      updateDropTarget(null, 'inside', canvasType);\r\n    }\r\n    \r\n    lastPositionRef.current = { x: e.clientX, y: e.clientY };\r\n  };\r\n\r\n  const renderSectionsForCanvas = (canvasSections: EnhancedSectionData[], canvasType: string) => {\r\n    const result: React.ReactNode[] = [];\r\n    const processedGroups = new Set<string>();\r\n    let i = 0;\r\n    \r\n    const renderDropIndicator = (key: string, isHorizontal = false) => (\r\n      <Box\r\n        key={key}\r\n        sx={{\r\n          [isHorizontal ? 'width' : 'height']: '50px',\r\n          border: '2px dashed',\r\n          borderColor: 'primary.main',\r\n          borderRadius: 1,\r\n          display: 'flex',\r\n          alignItems: 'center',\r\n          justifyContent: 'center',\r\n          bgcolor: 'rgba(25, 118, 210, 0.04)',\r\n          [isHorizontal ? 'mx' : 'mb']: 2,\r\n          opacity: 0,\r\n          animation: 'fadeIn 0.3s ease-in-out forwards',\r\n          '@keyframes fadeIn': {\r\n            '0%': { opacity: 0, transform: isHorizontal ? 'translateX(-10px)' : 'translateY(-10px)' },\r\n            '100%': { opacity: 1, transform: 'translate(0)' },\r\n          },\r\n        }}\r\n      >\r\n        <Typography type='s2' color='primary' weight='medium'>\r\n          Drop here\r\n        </Typography>\r\n      </Box>\r\n    );\r\n\r\n    if (isDraggingFromSidebar && \r\n        canvasSections?.length > 0 && \r\n        dropTarget.type === 'before' && \r\n        dropTarget.id === canvasSections[0].id &&\r\n        dropTarget.canvasType === canvasType) {\r\n      result.push(renderDropIndicator(`drop-before-first-${canvasType}`));\r\n    }\r\n    \r\n    while (i < canvasSections?.length) {\r\n      const section = canvasSections[i];\r\n      const sectionId = section.id;\r\n      \r\n      if (dropTarget.id === sectionId && \r\n          dropTarget.type === 'before' && \r\n          dropTarget.canvasType === canvasType && \r\n          !(isDraggingFromSidebar && i === 0)) {\r\n        result.push(renderDropIndicator(`drop-before-${sectionId}-${canvasType}`));\r\n      }\r\n      \r\n      if (!section.isSplitPair) {\r\n        result.push(\r\n          <Box \r\n            key={section.id} \r\n            data-section-id={section.id} \r\n            data-canvas-type={canvasType}\r\n          >\r\n            <EditorSection\r\n              section={section}\r\n              isSelected={selectedSection === section.id}\r\n              isDragging={activeId === section.id}\r\n              isOver={dropTarget.id === section.id && dropTarget.type === 'inside' && dropTarget.canvasType === canvasType}\r\n              onSelect={() => onSelectSection(section.id)}\r\n              onUpdate={(content, extra) => {\r\n                onUpdateSection(section.id, { content, ...extra }, canvasType); \r\n                onSelectSection(null);\r\n              }}\r\n              onSplit={(content1, content2) => onSplitSection(section.id, content1, content2, canvasType)}\r\n              onDelete={() => onDeleteSection(section.id, canvasType)}\r\n              placeholders={formattedPlaceholders}\r\n              setIsSectionEditing={setIsSectionEditing}\r\n            />\r\n          </Box>\r\n        );\r\n        i++;\r\n      } else {\r\n        const splitGroupId = section.splitGroupId;\r\n        if (splitGroupId && processedGroups.has(splitGroupId)) {\r\n          i++;\r\n          continue;\r\n        }\r\n        \r\n        const splitSections = canvasSections.filter(s => s.splitGroupId === splitGroupId);\r\n        if (splitSections.length > 0) {\r\n          if (splitGroupId) processedGroups.add(splitGroupId);\r\n          \r\n          const splitRow = (\r\n            <Box \r\n              key={`split-row-${splitGroupId}`} \r\n              sx={{ \r\n                display: 'flex', \r\n                gap: 2, \r\n                mb: 2, \r\n                bgcolor: 'rgba(0, 0, 0, 0.02)', \r\n                p: 1, \r\n                borderRadius: 1 \r\n              }} \r\n              data-section-id={`split-group-${splitGroupId}`}\r\n              data-canvas-type={canvasType}\r\n            >\r\n              {splitSections.map((splitSection, index) => (\r\n                <React.Fragment key={splitSection.id}>\r\n                  {dropTarget.id === splitSection.id && \r\n                   dropTarget.type === 'left' && \r\n                   dropTarget.canvasType === canvasType && (\r\n                    renderDropIndicator(`drop-left-${splitSection.id}-${canvasType}`, true)\r\n                  )}\r\n                  <Box\r\n                    sx={{\r\n                      width: splitSection.splitWidth ? `${splitSection.splitWidth}%` : `${100 / splitSections.length}%`,\r\n                      transition: 'width 0.3s ease-in-out',\r\n                    }}\r\n                    data-section-id={splitSection.id}\r\n                    data-canvas-type={canvasType}\r\n                  >\r\n                    <EditorSection\r\n                      section={splitSection}\r\n                      isSelected={selectedSection === splitSection.id}\r\n                      isDragging={activeId === splitSection.id}\r\n                      isOver={dropTarget.id === splitSection.id && dropTarget.type === 'inside' && dropTarget.canvasType === canvasType}\r\n                      onSelect={() => onSelectSection(splitSection.id)}\r\n                      onUpdate={(content, extra) => {\r\n                        onUpdateSection(splitSection.id, { content, ...extra }, canvasType); \r\n                        onSelectSection(null);\r\n                      }}\r\n                      onSplit={(content1, content2) => onSplitSection(splitSection.id, content1, content2, canvasType)}\r\n                      onDelete={() => onDeleteSection(splitSection.id, canvasType)}\r\n                      placeholders={formattedPlaceholders}\r\n                      setIsSectionEditing={setIsSectionEditing}\r\n                    />\r\n                  </Box>\r\n                  {dropTarget.id === splitSection.id && \r\n                   dropTarget.type === 'right' && \r\n                   dropTarget.canvasType === canvasType && (\r\n                    renderDropIndicator(`drop-right-${splitSection.id}-${canvasType}`, true)\r\n                  )}\r\n                </React.Fragment>\r\n              ))}\r\n            </Box>\r\n          );\r\n          result.push(splitRow);\r\n          i += splitSections.length;\r\n        } else {\r\n          i++;\r\n        }\r\n      }\r\n      \r\n      if (dropTarget.id === sectionId && \r\n          dropTarget.type === 'after' && \r\n          dropTarget.canvasType === canvasType) {\r\n        result.push(renderDropIndicator(`drop-after-${sectionId}-${canvasType}`));\r\n      }\r\n    }\r\n    \r\n    if ((canvasSections?.length === 0 && activeId && dropTarget.canvasType === canvasType) || \r\n        (canvasSections?.length === 0 && isDraggingFromSidebar && dropTarget.canvasType === canvasType)) {\r\n      result.push(renderDropIndicator(`drop-empty-canvas-${canvasType}`));\r\n    }\r\n    \r\n    return result;\r\n  };\r\n\r\n  const renderedMainSections = useMemo(() => \r\n    renderSectionsForCanvas(sections, CANVAS_TYPES.MAIN), \r\n    [sections, dropTarget, activeId, isDraggingFromSidebar, selectedSection]\r\n  );\r\n  \r\n  const renderedHeaderSections = useMemo(() => \r\n    renderSectionsForCanvas(headerSections, CANVAS_TYPES.HEADER),\r\n    [headerSections, dropTarget, activeId, isDraggingFromSidebar, selectedSection, isEditingHeaderFooter]\r\n  );\r\n  \r\n  const renderedFooterSections = useMemo(() => \r\n    renderSectionsForCanvas(footerSections, CANVAS_TYPES.FOOTER),\r\n    [footerSections, dropTarget, activeId, isDraggingFromSidebar, selectedSection, isEditingHeaderFooter]\r\n  );\r\n\r\n  const renderPreview = () => {\r\n    // const allSections = [...headerSections, ...sections, ...footerSections];\r\n    return <Box dangerouslySetInnerHTML={{ __html: generateEmailPreview(sections, headerSections, footerSections) }} />;\r\n  };\r\n\r\n  const renderCanvas = (\r\n    title: string, \r\n    canvasType: string, \r\n    renderedSections: React.ReactNode[], \r\n    setCanvasRef: (node: HTMLElement | null) => void,\r\n    ref: React.MutableRefObject<HTMLDivElement | null>,\r\n    visible: boolean = true\r\n  ) => {\r\n    if (!visible) return null;\r\n    \r\n    return (\r\n      <Box sx={{ mb: 3 }}>\r\n        {CANVAS_TYPES.MAIN === canvasType && visible && headerSections.length > 0 && (\r\n          <>\r\n            {/* <Accordion\r\n              sx= {{\r\n                    boxShadow: 'none !important',\r\n                    \".MuiAccordionSummary-root\": {\r\n                      backgroundColor: '#fafafa !important',\r\n                      border: `0 !important`,\r\n                      p: 0,\r\n                      pb: 1,\r\n                      // mb: 1,\r\n                      m:0,\r\n                      minHeight: 'unset'\r\n                    }\r\n                }}\r\n            >\r\n              <AccordionSummary\r\n                expandIcon={<ExpandMoreIcon />}\r\n                aria-controls=\"panel1-content\"\r\n                id=\"panel1-header\"\r\n              > */}\r\n                <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'}>Header</Typography>\r\n              {/* </AccordionSummary> */}\r\n              <Paper sx={{ mb: 1, boxShadow: 'none', opacity: 0.5 }} dangerouslySetInnerHTML={{ __html: generateHeaderFooterPreview(headerSections) }} />\r\n            {/* </Accordion> */}\r\n          </>\r\n        )}\r\n        <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'} sx={{ mb: 1 }}>{title}</Typography>\r\n        <Paper\r\n          ref={(node) => {\r\n            setCanvasRef(node);\r\n            ref.current = node;\r\n          }}\r\n          elevation={0}\r\n          sx={{\r\n            p: 4,\r\n            border: '1px dashed',\r\n            borderColor: isDraggingFromSidebar && dropTarget.canvasType === canvasType \r\n              ? 'primary.main' \r\n              : 'primary.light',\r\n            borderRadius: 1,\r\n            bgcolor: 'background.paper',\r\n            position: 'relative',\r\n            minHeight: title === 'Header' || title === 'Footer' ? '100px' : '200px',\r\n            transition: 'border-color 0.3s ease, background-color 0.3s ease',\r\n            '&:hover': {\r\n              bgcolor: isDraggingFromSidebar && dropTarget.canvasType === canvasType \r\n                ? 'rgba(25, 118, 210, 0.04)' \r\n                : 'background.paper',\r\n            },\r\n            pointerEvents: (canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter \r\n              ? 'none' \r\n              : 'auto',\r\n            opacity: (canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter \r\n              ? 0.5 \r\n              : 1,\r\n          }}\r\n          onClick={() => {\r\n            if ((canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter) return;\r\n            onSelectSection(null);\r\n          }}\r\n          onMouseMove={(e) => handleMouseMove(e, canvasType)}\r\n          onMouseEnter={(e) => handleMouseEnter(e, canvasType)}\r\n        >\r\n          <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>\r\n            {renderedSections}\r\n            {getTargetSections(canvasType)?.length === 0 && \r\n             !activeId && \r\n             !isDraggingFromSidebar && (\r\n              <Box sx={{ borderRadius: 1, p: 2, textAlign: 'center', color: 'text.secondary' }}>\r\n                <Typography type='s2' color='theme.secondary.600' weight='medium'>\r\n                  Drag Sections from side panel to start building the {title.toLowerCase()}\r\n                </Typography>\r\n              </Box>\r\n            )}\r\n          </Box>\r\n        </Paper>\r\n        {CANVAS_TYPES.MAIN === canvasType && visible && footerSections.length > 0 && (\r\n          <>\r\n            {/* <Accordion\r\n            sx= {{\r\n                  boxShadow: 'none !important',\r\n                  \".MuiAccordionSummary-root\": {\r\n                    backgroundColor: '#fafafa !important',\r\n                    border: `0 !important`,\r\n                    p: 0,\r\n                    pb: 1,\r\n                    // mb: 1,\r\n                    m:0,\r\n                    minHeight: 'unset'\r\n                  }\r\n              }}\r\n          >\r\n            <AccordionSummary\r\n              expandIcon={<ExpandMoreIcon />}\r\n              aria-controls=\"panel1-content\"\r\n              id=\"panel1-header\"\r\n            > */}\r\n              <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'} sx={{ mt: 1 }}>Footer</Typography>\r\n            {/* </AccordionSummary> */}\r\n              <Paper sx={{ mb: 1, boxShadow: 'none', opacity: 0.5 }} dangerouslySetInnerHTML={{ __html: generateHeaderFooterPreview(footerSections) }} />\r\n            {/* </Accordion> */}\r\n          </>\r\n          )}\r\n      </Box>\r\n    );\r\n  };\r\n\r\n  return (\r\n    <Box sx={{ display: 'flex', flex: 1, overflow: 'hidden' }}>\r\n      <Box sx={{ flex: 1, overflow: 'auto', height: 'calc(100vh - 104px)' }}>\r\n        <Container maxWidth=\"lg\" sx={{ py: 4 }}>\r\n          {preview ? (\r\n            renderPreview()\r\n          ) : (\r\n            <>\r\n              {renderCanvas(\r\n                'Header', \r\n                CANVAS_TYPES.HEADER, \r\n                renderedHeaderSections, \r\n                setHeaderCanvasRef, \r\n                headerCanvasRef,\r\n                isEditingHeaderFooter\r\n              )}\r\n              {renderCanvas(\r\n                'Content', \r\n                CANVAS_TYPES.MAIN, \r\n                renderedMainSections, \r\n                setMainCanvasRef, \r\n                mainCanvasRef,\r\n                !isEditingHeaderFooter\r\n              )}\r\n              {renderCanvas(\r\n                'Footer', \r\n                CANVAS_TYPES.FOOTER, \r\n                renderedFooterSections, \r\n                setFooterCanvasRef, \r\n                footerCanvasRef,\r\n                isEditingHeaderFooter\r\n              )}\r\n            </>\r\n          )}\r\n        </Container>\r\n      </Box>\r\n      <Box\r\n        sx={{\r\n          width: 400,\r\n          flexShrink: 0,\r\n          position: 'sticky',\r\n          top: 0,\r\n          alignSelf: 'flex-start',\r\n          height: 'calc(100vh - 104px)',\r\n          overflowY: 'auto',\r\n          borderLeft: '1px solid',\r\n          borderColor: 'divider',\r\n          bgcolor: 'background.paper',\r\n          zIndex: 1,\r\n        }}\r\n      >\r\n        {(selectedSection && !selectedSectionData?.is_edited_from_source && !isSectionEditing) ? (\r\n          <SectionFormatPanel\r\n            section={selectedSectionData}\r\n            onClose={() => onSelectSection(null)}\r\n            onUpdate={(data) => {\r\n              if (selectedSection) {\r\n                const canvasType = headerSections.some(s => s.id === selectedSection)\r\n                  ? CANVAS_TYPES.HEADER\r\n                  : footerSections.some(s => s.id === selectedSection)\r\n                    ? CANVAS_TYPES.FOOTER\r\n                    : CANVAS_TYPES.MAIN;\r\n                onUpdateSection(selectedSection, data, canvasType);\r\n              }\r\n            }}\r\n            placeholders={placeholders}\r\n            handleSave={handleSave}\r\n            relation_table={relation_table}\r\n          />\r\n        ) : (\r\n          <EditorSidebar />\r\n        )}\r\n      </Box>\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport default EditorCanvas;"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/template-editor/components/EditorCanvas.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\n/* eslint-disable react-hooks/exhaustive-deps */\n/* eslint-disable unused-imports/no-unused-vars */\nimport React, { useState, useEffect, useRef, useMemo } from 'react';\nimport { useDroppable } from '@dnd-kit/core';\nimport EditorSection from './EditorSection';\nimport { Box, Container, Paper } from '@mui/material';\nimport Typography from '../../../components/typography/typography';\nimport SectionFormatPanel from './SectionFormatPanel';\nimport EditorSidebar from './EditorSidebar';\nimport { generateEmailPreview, generateHeaderFooterPreview } from '../utils/common';\nimport { EnhancedSectionData } from '../types/editor';\n\nconst CANVAS_TYPES = {\n  HEADER: 'header',\n  MAIN: 'main',\n  FOOTER: 'footer'\n};\n\ninterface DropPosition {\n  id: string | null;\n  type: 'before' | 'after' | 'inside' | 'left' | 'right';\n  canvasType: string;\n}\n\ninterface EditorCanvasProps {\n  sections: EnhancedSectionData[];\n  headerSections: EnhancedSectionData[];\n  footerSections: EnhancedSectionData[];\n  activeId: string | null;\n  overSection: string | null;\n  selectedSection: string | null;\n  onSelectSection: (id: string | null) => void;\n  onUpdateSection: (id: string, data: any, canvasType?: string) => void;\n  onSplitSection: (id: string, content1: string, content2: string, canvasType?: string) => void;\n  onDeleteSection: (id: string, canvasType?: string) => void;\n  preview: boolean;\n  placeholders: Record<string, any>[];\n  isEditingHeaderFooter: boolean;\n  relation_table:any[];\n  handleSave?: () => Promise<void>;\n}\n\nconst EditorCanvas: React.FC<EditorCanvasProps> = ({\n  sections,\n  headerSections,\n  footerSections,\n  activeId,\n  selectedSection,\n  onSelectSection,\n  onUpdateSection,\n  onSplitSection,\n  onDeleteSection,\n  preview,\n  placeholders,\n  isEditingHeaderFooter,\n  handleSave,\n  relation_table\n}) => {\n  // Convert placeholders to the expected format\n  const formattedPlaceholders = useMemo(() => {\n    return placeholders.map((p: Record<string, any>) => ({\n      value: p.value || p.key || '',\n      label: p.label || p.name || String(p.value || p.key || '')\n    }));\n  }, [placeholders]);\n\n  const { setNodeRef: setMainCanvasRef } = useDroppable({ id: 'main-canvas' });\n  const { setNodeRef: setHeaderCanvasRef } = useDroppable({ id: 'header-canvas' });\n  const { setNodeRef: setFooterCanvasRef } = useDroppable({ id: 'footer-canvas' });\n\n  const selectedSectionData = useMemo(() => {\n    return [...sections, ...headerSections, ...footerSections].find((section) => section.id === selectedSection);\n  }, [sections, selectedSection]);\n\n  const [dropTarget, setDropTarget] = useState<DropPosition>({ \n    id: null, \n    type: 'inside',\n    canvasType: CANVAS_TYPES.MAIN\n  });\n  const [isDraggingFromSidebar, setIsDraggingFromSidebar] = useState(false);\n  const [isSectionEditing, setIsSectionEditing] = useState(false);\n  \n  const lastUpdateTimeRef = useRef(0);\n  const lastPositionRef = useRef({ x: 0, y: 0 });\n  const activeIdRef = useRef<string | null>(null);\n  const mainCanvasRef = useRef<HTMLDivElement | null>(null);\n  const headerCanvasRef = useRef<HTMLDivElement | null>(null);\n  const footerCanvasRef = useRef<HTMLDivElement | null>(null);\n  \n  const DEBOUNCE_MS = 200;\n  const MIN_MOUSE_MOVE = 15;\n  const POSITION_HYSTERESIS = 0.1;\n\n  const getTargetSections = (canvasType: string) => {\n    switch (canvasType) {\n      case CANVAS_TYPES.HEADER:\n        return headerSections;\n      case CANVAS_TYPES.FOOTER:\n        return footerSections;\n      default:\n        return sections;\n    }\n  };\n\n  useEffect(() => {\n    activeIdRef.current = activeId;\n    \n    if (activeId && String(activeId).includes('sidebar-')) {\n      setIsDraggingFromSidebar(true);\n      \n      if (sections?.length > 0) {\n        updateDropTarget(sections[0].id, 'before', CANVAS_TYPES.MAIN);\n      } else if (headerSections?.length > 0 && isEditingHeaderFooter) {\n        updateDropTarget(headerSections[0].id, 'before', CANVAS_TYPES.HEADER);\n      } else if (footerSections?.length > 0 && isEditingHeaderFooter) {\n        updateDropTarget(footerSections[0].id, 'before', CANVAS_TYPES.FOOTER);\n      } else {\n        updateDropTarget(null, 'inside', CANVAS_TYPES.MAIN);\n      }\n    } else if (!activeId) {\n      setIsDraggingFromSidebar(false);\n      setDropTarget({ id: null, type: 'inside', canvasType: CANVAS_TYPES.MAIN });\n    }\n  }, [activeId, sections, headerSections, footerSections, isEditingHeaderFooter]);\n\n  const updateDropTarget = (id: string | null, type: DropPosition['type'], canvasType: string) => {\n    const now = Date.now();\n    if (now - lastUpdateTimeRef.current < DEBOUNCE_MS) return;\n    \n    if (dropTarget.id !== id || dropTarget.type !== type || dropTarget.canvasType !== canvasType) {\n      lastUpdateTimeRef.current = now;\n      setDropTarget({ id, type, canvasType });\n    }\n  };\n\n  const handleMouseMove = (e: React.MouseEvent, canvasType: string) => {\n    if (!activeIdRef.current) return;\n    if (canvasType !== CANVAS_TYPES.MAIN && !isEditingHeaderFooter) return;\n    \n    const dx = e.clientX - lastPositionRef.current.x;\n    const dy = e.clientY - lastPositionRef.current.y;\n    const distance = Math.sqrt(dx * dx + dy * dy);\n    \n    if (distance < MIN_MOUSE_MOVE) return;\n    \n    lastPositionRef.current = { x: e.clientX, y: e.clientY };\n    \n    const elementsUnderCursor = document.elementsFromPoint(e.clientX, e.clientY);\n    const sectionElement = elementsUnderCursor.find(el => \n      el.hasAttribute('data-section-id')\n    );\n    \n    const targetSections = getTargetSections(canvasType);\n    \n    if (!sectionElement) {\n      if (targetSections.length === 0) {\n        updateDropTarget(null, 'inside', canvasType);\n      } else if (isDraggingFromSidebar) {\n        updateDropTarget(targetSections[targetSections.length - 1].id, 'after', canvasType);\n      }\n      return;\n    }\n    \n    const sectionId = sectionElement.getAttribute('data-section-id');\n    if (!sectionId) return;\n    \n    const sectionCanvasType = sectionElement.hasAttribute('data-canvas-type') \n      ? sectionElement.getAttribute('data-canvas-type') as string\n      : canvasType;\n    \n    const rect = sectionElement.getBoundingClientRect();\n    const relativeY = e.clientY - rect.top;\n    const relativeX = e.clientX - rect.left;\n    const sectionHeight = rect.height;\n    const sectionWidth = rect.width;\n    \n    const canvasSections = getTargetSections(sectionCanvasType);\n    const section = canvasSections.find(s => s.id === sectionId);\n    \n    const isSplitGroup = sectionId.startsWith('split-group-');\n    \n    if (isSplitGroup || (section && section.isSplitPair)) {\n      if (relativeX < sectionWidth * (0.5 - POSITION_HYSTERESIS)) {\n        updateDropTarget(sectionId, 'left', sectionCanvasType);\n      } else if (relativeX > sectionWidth * (0.5 + POSITION_HYSTERESIS)) {\n        updateDropTarget(sectionId, 'right', sectionCanvasType);\n      } else {\n        updateDropTarget(sectionId, 'inside', sectionCanvasType);\n      }\n    } else {\n      let position: DropPosition['type'] = dropTarget.type;\n      if (relativeY < sectionHeight * (0.3 - POSITION_HYSTERESIS)) {\n        position = 'before';\n      } else if (relativeY > sectionHeight * (0.7 + POSITION_HYSTERESIS)) {\n        position = 'after';\n      } else {\n        position = 'inside';\n      }\n      updateDropTarget(sectionId, position, sectionCanvasType);\n    }\n  };\n\n  const handleMouseEnter = (e: React.MouseEvent, canvasType: string) => {\n    if (!activeIdRef.current || !isDraggingFromSidebar) return;\n    if (canvasType !== CANVAS_TYPES.MAIN && !isEditingHeaderFooter) return;\n    \n    const targetSections = getTargetSections(canvasType);\n    \n    if (targetSections.length > 0) {\n      updateDropTarget(targetSections[0].id, 'before', canvasType);\n    } else {\n      updateDropTarget(null, 'inside', canvasType);\n    }\n    \n    lastPositionRef.current = { x: e.clientX, y: e.clientY };\n  };\n\n  const renderSectionsForCanvas = (canvasSections: EnhancedSectionData[], canvasType: string) => {\n    const result: React.ReactNode[] = [];\n    const processedGroups = new Set<string>();\n    let i = 0;\n    \n    const renderDropIndicator = (key: string, isHorizontal = false) => (\n      <Box\n        key={key}\n        sx={{\n          [isHorizontal ? 'width' : 'height']: '50px',\n          border: '2px dashed',\n          borderColor: 'primary.main',\n          borderRadius: 1,\n          display: 'flex',\n          alignItems: 'center',\n          justifyContent: 'center',\n          bgcolor: 'rgba(25, 118, 210, 0.04)',\n          [isHorizontal ? 'mx' : 'mb']: 2,\n          opacity: 0,\n          animation: 'fadeIn 0.3s ease-in-out forwards',\n          '@keyframes fadeIn': {\n            '0%': { opacity: 0, transform: isHorizontal ? 'translateX(-10px)' : 'translateY(-10px)' },\n            '100%': { opacity: 1, transform: 'translate(0)' },\n          },\n        }}\n      >\n        <Typography type='s2' color='primary' weight='medium'>\n          Drop here\n        </Typography>\n      </Box>\n    );\n\n    if (isDraggingFromSidebar && \n        canvasSections?.length > 0 && \n        dropTarget.type === 'before' && \n        dropTarget.id === canvasSections[0].id &&\n        dropTarget.canvasType === canvasType) {\n      result.push(renderDropIndicator(`drop-before-first-${canvasType}`));\n    }\n    \n    while (i < canvasSections?.length) {\n      const section = canvasSections[i];\n      const sectionId = section.id;\n      \n      if (dropTarget.id === sectionId && \n          dropTarget.type === 'before' && \n          dropTarget.canvasType === canvasType && \n          !(isDraggingFromSidebar && i === 0)) {\n        result.push(renderDropIndicator(`drop-before-${sectionId}-${canvasType}`));\n      }\n      \n      if (!section.isSplitPair) {\n        result.push(\n          <Box \n            key={section.id} \n            data-section-id={section.id} \n            data-canvas-type={canvasType}\n          >\n            <EditorSection\n              section={section}\n              isSelected={selectedSection === section.id}\n              isDragging={activeId === section.id}\n              isOver={dropTarget.id === section.id && dropTarget.type === 'inside' && dropTarget.canvasType === canvasType}\n              onSelect={() => onSelectSection(section.id)}\n              onUpdate={(content, extra) => {\n                onUpdateSection(section.id, { content, ...extra }, canvasType); \n                onSelectSection(null);\n              }}\n              onSplit={(content1, content2) => onSplitSection(section.id, content1, content2, canvasType)}\n              onDelete={() => onDeleteSection(section.id, canvasType)}\n              placeholders={formattedPlaceholders}\n              setIsSectionEditing={setIsSectionEditing}\n            />\n          </Box>\n        );\n        i++;\n      } else {\n        const splitGroupId = section.splitGroupId;\n        if (splitGroupId && processedGroups.has(splitGroupId)) {\n          i++;\n          continue;\n        }\n        \n        const splitSections = canvasSections.filter(s => s.splitGroupId === splitGroupId);\n        if (splitSections.length > 0) {\n          if (splitGroupId) processedGroups.add(splitGroupId);\n          \n          const splitRow = (\n            <Box \n              key={`split-row-${splitGroupId}`} \n              sx={{ \n                display: 'flex', \n                gap: 2, \n                mb: 2, \n                bgcolor: 'rgba(0, 0, 0, 0.02)', \n                p: 1, \n                borderRadius: 1 \n              }} \n              data-section-id={`split-group-${splitGroupId}`}\n              data-canvas-type={canvasType}\n            >\n              {splitSections.map((splitSection, index) => (\n                <React.Fragment key={splitSection.id}>\n                  {dropTarget.id === splitSection.id && \n                   dropTarget.type === 'left' && \n                   dropTarget.canvasType === canvasType && (\n                    renderDropIndicator(`drop-left-${splitSection.id}-${canvasType}`, true)\n                  )}\n                  <Box\n                    sx={{\n                      width: splitSection.splitWidth ? `${splitSection.splitWidth}%` : `${100 / splitSections.length}%`,\n                      transition: 'width 0.3s ease-in-out',\n                    }}\n                    data-section-id={splitSection.id}\n                    data-canvas-type={canvasType}\n                  >\n                    <EditorSection\n                      section={splitSection}\n                      isSelected={selectedSection === splitSection.id}\n                      isDragging={activeId === splitSection.id}\n                      isOver={dropTarget.id === splitSection.id && dropTarget.type === 'inside' && dropTarget.canvasType === canvasType}\n                      onSelect={() => onSelectSection(splitSection.id)}\n                      onUpdate={(content, extra) => {\n                        onUpdateSection(splitSection.id, { content, ...extra }, canvasType); \n                        onSelectSection(null);\n                      }}\n                      onSplit={(content1, content2) => onSplitSection(splitSection.id, content1, content2, canvasType)}\n                      onDelete={() => onDeleteSection(splitSection.id, canvasType)}\n                      placeholders={formattedPlaceholders}\n                      setIsSectionEditing={setIsSectionEditing}\n                    />\n                  </Box>\n                  {dropTarget.id === splitSection.id && \n                   dropTarget.type === 'right' && \n                   dropTarget.canvasType === canvasType && (\n                    renderDropIndicator(`drop-right-${splitSection.id}-${canvasType}`, true)\n                  )}\n                </React.Fragment>\n              ))}\n            </Box>\n          );\n          result.push(splitRow);\n          i += splitSections.length;\n        } else {\n          i++;\n        }\n      }\n      \n      if (dropTarget.id === sectionId && \n          dropTarget.type === 'after' && \n          dropTarget.canvasType === canvasType) {\n        result.push(renderDropIndicator(`drop-after-${sectionId}-${canvasType}`));\n      }\n    }\n    \n    if ((canvasSections?.length === 0 && activeId && dropTarget.canvasType === canvasType) || \n        (canvasSections?.length === 0 && isDraggingFromSidebar && dropTarget.canvasType === canvasType)) {\n      result.push(renderDropIndicator(`drop-empty-canvas-${canvasType}`));\n    }\n    \n    return result;\n  };\n\n  const renderedMainSections = useMemo(() => \n    renderSectionsForCanvas(sections, CANVAS_TYPES.MAIN), \n    [sections, dropTarget, activeId, isDraggingFromSidebar, selectedSection]\n  );\n  \n  const renderedHeaderSections = useMemo(() => \n    renderSectionsForCanvas(headerSections, CANVAS_TYPES.HEADER),\n    [headerSections, dropTarget, activeId, isDraggingFromSidebar, selectedSection, isEditingHeaderFooter]\n  );\n  \n  const renderedFooterSections = useMemo(() => \n    renderSectionsForCanvas(footerSections, CANVAS_TYPES.FOOTER),\n    [footerSections, dropTarget, activeId, isDraggingFromSidebar, selectedSection, isEditingHeaderFooter]\n  );\n\n  const renderPreview = () => {\n    // const allSections = [...headerSections, ...sections, ...footerSections];\n    return <Box dangerouslySetInnerHTML={{ __html: generateEmailPreview(sections, headerSections, footerSections) }} />;\n  };\n\n  const renderCanvas = (\n    title: string, \n    canvasType: string, \n    renderedSections: React.ReactNode[], \n    setCanvasRef: (node: HTMLElement | null) => void,\n    ref: React.MutableRefObject<HTMLDivElement | null>,\n    visible: boolean = true\n  ) => {\n    if (!visible) return null;\n    \n    return (\n      <Box sx={{ mb: 3 }}>\n        {CANVAS_TYPES.MAIN === canvasType && visible && headerSections.length > 0 && (\n          <>\n            {/* <Accordion\n              sx= {{\n                    boxShadow: 'none !important',\n                    \".MuiAccordionSummary-root\": {\n                      backgroundColor: '#fafafa !important',\n                      border: `0 !important`,\n                      p: 0,\n                      pb: 1,\n                      // mb: 1,\n                      m:0,\n                      minHeight: 'unset'\n                    }\n                }}\n            >\n              <AccordionSummary\n                expandIcon={<ExpandMoreIcon />}\n                aria-controls=\"panel1-content\"\n                id=\"panel1-header\"\n              > */}\n                <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'}>Header</Typography>\n              {/* </AccordionSummary> */}\n              <Paper sx={{ mb: 1, boxShadow: 'none', opacity: 0.5 }} dangerouslySetInnerHTML={{ __html: generateHeaderFooterPreview(headerSections) }} />\n            {/* </Accordion> */}\n          </>\n        )}\n        <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'} sx={{ mb: 1 }}>{title}</Typography>\n        <Paper\n          ref={(node) => {\n            setCanvasRef(node);\n            ref.current = node;\n          }}\n          elevation={0}\n          sx={{\n            p: 4,\n            border: '1px dashed',\n            borderColor: isDraggingFromSidebar && dropTarget.canvasType === canvasType \n              ? 'primary.main' \n              : 'primary.light',\n            borderRadius: 1,\n            bgcolor: 'background.paper',\n            position: 'relative',\n            minHeight: title === 'Header' || title === 'Footer' ? '100px' : '200px',\n            transition: 'border-color 0.3s ease, background-color 0.3s ease',\n            '&:hover': {\n              bgcolor: isDraggingFromSidebar && dropTarget.canvasType === canvasType \n                ? 'rgba(25, 118, 210, 0.04)' \n                : 'background.paper',\n            },\n            pointerEvents: (canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter \n              ? 'none' \n              : 'auto',\n            opacity: (canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter \n              ? 0.5 \n              : 1,\n          }}\n          onClick={() => {\n            if ((canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter) return;\n            onSelectSection(null);\n          }}\n          onMouseMove={(e) => handleMouseMove(e, canvasType)}\n          onMouseEnter={(e) => handleMouseEnter(e, canvasType)}\n        >\n          <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>\n            {renderedSections}\n            {getTargetSections(canvasType)?.length === 0 && \n             !activeId && \n             !isDraggingFromSidebar && (\n              <Box sx={{ borderRadius: 1, p: 2, textAlign: 'center', color: 'text.secondary' }}>\n                <Typography type='s2' color='theme.secondary.600' weight='medium'>\n                  Drag Sections from side panel to start building the {title.toLowerCase()}\n                </Typography>\n              </Box>\n            )}\n          </Box>\n        </Paper>\n        {CANVAS_TYPES.MAIN === canvasType && visible && footerSections.length > 0 && (\n          <>\n            {/* <Accordion\n            sx= {{\n                  boxShadow: 'none !important',\n                  \".MuiAccordionSummary-root\": {\n                    backgroundColor: '#fafafa !important',\n                    border: `0 !important`,\n                    p: 0,\n                    pb: 1,\n                    // mb: 1,\n                    m:0,\n                    minHeight: 'unset'\n                  }\n              }}\n          >\n            <AccordionSummary\n              expandIcon={<ExpandMoreIcon />}\n              aria-controls=\"panel1-content\"\n              id=\"panel1-header\"\n            > */}\n              <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'} sx={{ mt: 1 }}>Footer</Typography>\n            {/* </AccordionSummary> */}\n              <Paper sx={{ mb: 1, boxShadow: 'none', opacity: 0.5 }} dangerouslySetInnerHTML={{ __html: generateHeaderFooterPreview(footerSections) }} />\n            {/* </Accordion> */}\n          </>\n          )}\n      </Box>\n    );\n  };\n\n  return (\n    <Box sx={{ display: 'flex', flex: 1, overflow: 'hidden' }}>\n      <Box sx={{ flex: 1, overflow: 'auto', height: 'calc(100vh - 104px)' }}>\n        <Container maxWidth=\"lg\" sx={{ py: 4 }}>\n          {preview ? (\n            renderPreview()\n          ) : (\n            <>\n              {renderCanvas(\n                'Header', \n                CANVAS_TYPES.HEADER, \n                renderedHeaderSections, \n                setHeaderCanvasRef, \n                headerCanvasRef,\n                isEditingHeaderFooter\n              )}\n              {renderCanvas(\n                'Content', \n                CANVAS_TYPES.MAIN, \n                renderedMainSections, \n                setMainCanvasRef, \n                mainCanvasRef,\n                !isEditingHeaderFooter\n              )}\n              {renderCanvas(\n                'Footer', \n                CANVAS_TYPES.FOOTER, \n                renderedFooterSections, \n                setFooterCanvasRef, \n                footerCanvasRef,\n                isEditingHeaderFooter\n              )}\n            </>\n          )}\n        </Container>\n      </Box>\n      <Box\n        sx={{\n          width: 400,\n          flexShrink: 0,\n          position: 'sticky',\n          top: 0,\n          alignSelf: 'flex-start',\n          height: 'calc(100vh - 104px)',\n          overflowY: 'auto',\n          borderLeft: '1px solid',\n          borderColor: 'divider',\n          bgcolor: 'background.paper',\n          zIndex: 1,\n        }}\n      >\n        {(selectedSection && !selectedSectionData?.is_edited_from_source && !isSectionEditing) ? (\n          <SectionFormatPanel\n            section={selectedSectionData}\n            onClose={() => onSelectSection(null)}\n            onUpdate={(data) => {\n              if (selectedSection) {\n                const canvasType = headerSections.some(s => s.id === selectedSection)\n                  ? CANVAS_TYPES.HEADER\n                  : footerSections.some(s => s.id === selectedSection)\n                    ? CANVAS_TYPES.FOOTER\n                    : CANVAS_TYPES.MAIN;\n                onUpdateSection(selectedSection, data, canvasType);\n              }\n            }}\n            placeholders={placeholders}\n            handleSave={handleSave}\n            relation_table={relation_table}\n          />\n        ) : (\n          <EditorSidebar />\n        )}\n      </Box>\n    </Box>\n  );\n};\n\nexport default EditorCanvas;"],"names":["React"],"mappings":"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"}

package/dist/views/template-editor/components/EditorCanvas/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/components/EditorCanvas.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\r\n/* eslint-disable react-hooks/exhaustive-deps */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React, { useState, useEffect, useRef, useMemo } from 'react';\r\nimport { useDroppable } from '@dnd-kit/core';\r\nimport EditorSection from './EditorSection';\r\nimport { Box, Container, Paper } from '@mui/material';\r\nimport Typography from '../../../components/typography/typography';\r\nimport SectionFormatPanel from './SectionFormatPanel';\r\nimport EditorSidebar from './EditorSidebar';\r\nimport { generateEmailPreview, generateHeaderFooterPreview } from '../utils/common';\r\nimport { EnhancedSectionData } from '../types/editor';\r\n\r\nconst CANVAS_TYPES = {\r\n  HEADER: 'header',\r\n  MAIN: 'main',\r\n  FOOTER: 'footer'\r\n};\r\n\r\ninterface DropPosition {\r\n  id: string | null;\r\n  type: 'before' | 'after' | 'inside' | 'left' | 'right';\r\n  canvasType: string;\r\n}\r\n\r\ninterface EditorCanvasProps {\r\n  sections: EnhancedSectionData[];\r\n  headerSections: EnhancedSectionData[];\r\n  footerSections: EnhancedSectionData[];\r\n  activeId: string | null;\r\n  overSection: string | null;\r\n  selectedSection: string | null;\r\n  onSelectSection: (id: string | null) => void;\r\n  onUpdateSection: (id: string, data: any, canvasType?: string) => void;\r\n  onSplitSection: (id: string, content1: string, content2: string, canvasType?: string) => void;\r\n  onDeleteSection: (id: string, canvasType?: string) => void;\r\n  preview: boolean;\r\n  placeholders: Record<string, any>[];\r\n  isEditingHeaderFooter: boolean;\r\n  relation_table:any[];\r\n  handleSave?: () => Promise<void>;\r\n}\r\n\r\nconst EditorCanvas: React.FC<EditorCanvasProps> = ({\r\n  sections,\r\n  headerSections,\r\n  footerSections,\r\n  activeId,\r\n  selectedSection,\r\n  onSelectSection,\r\n  onUpdateSection,\r\n  onSplitSection,\r\n  onDeleteSection,\r\n  preview,\r\n  placeholders,\r\n  isEditingHeaderFooter,\r\n  handleSave,\r\n  relation_table\r\n}) => {\r\n  // Convert placeholders to the expected format\r\n  const formattedPlaceholders = useMemo(() => {\r\n    return placeholders.map((p: Record<string, any>) => ({\r\n      value: p.value || p.key || '',\r\n      label: p.label || p.name || String(p.value || p.key || '')\r\n    }));\r\n  }, [placeholders]);\r\n\r\n  const { setNodeRef: setMainCanvasRef } = useDroppable({ id: 'main-canvas' });\r\n  const { setNodeRef: setHeaderCanvasRef } = useDroppable({ id: 'header-canvas' });\r\n  const { setNodeRef: setFooterCanvasRef } = useDroppable({ id: 'footer-canvas' });\r\n\r\n  const selectedSectionData = useMemo(() => {\r\n    return [...sections, ...headerSections, ...footerSections].find((section) => section.id === selectedSection);\r\n  }, [sections, selectedSection]);\r\n\r\n  const [dropTarget, setDropTarget] = useState<DropPosition>({ \r\n    id: null, \r\n    type: 'inside',\r\n    canvasType: CANVAS_TYPES.MAIN\r\n  });\r\n  const [isDraggingFromSidebar, setIsDraggingFromSidebar] = useState(false);\r\n  const [isSectionEditing, setIsSectionEditing] = useState(false);\r\n  \r\n  const lastUpdateTimeRef = useRef(0);\r\n  const lastPositionRef = useRef({ x: 0, y: 0 });\r\n  const activeIdRef = useRef<string | null>(null);\r\n  const mainCanvasRef = useRef<HTMLDivElement | null>(null);\r\n  const headerCanvasRef = useRef<HTMLDivElement | null>(null);\r\n  const footerCanvasRef = useRef<HTMLDivElement | null>(null);\r\n  \r\n  const DEBOUNCE_MS = 200;\r\n  const MIN_MOUSE_MOVE = 15;\r\n  const POSITION_HYSTERESIS = 0.1;\r\n\r\n  const getTargetSections = (canvasType: string) => {\r\n    switch (canvasType) {\r\n      case CANVAS_TYPES.HEADER:\r\n        return headerSections;\r\n      case CANVAS_TYPES.FOOTER:\r\n        return footerSections;\r\n      default:\r\n        return sections;\r\n    }\r\n  };\r\n\r\n  useEffect(() => {\r\n    activeIdRef.current = activeId;\r\n    \r\n    if (activeId && String(activeId).includes('sidebar-')) {\r\n      setIsDraggingFromSidebar(true);\r\n      \r\n      if (sections?.length > 0) {\r\n        updateDropTarget(sections[0].id, 'before', CANVAS_TYPES.MAIN);\r\n      } else if (headerSections?.length > 0 && isEditingHeaderFooter) {\r\n        updateDropTarget(headerSections[0].id, 'before', CANVAS_TYPES.HEADER);\r\n      } else if (footerSections?.length > 0 && isEditingHeaderFooter) {\r\n        updateDropTarget(footerSections[0].id, 'before', CANVAS_TYPES.FOOTER);\r\n      } else {\r\n        updateDropTarget(null, 'inside', CANVAS_TYPES.MAIN);\r\n      }\r\n    } else if (!activeId) {\r\n      setIsDraggingFromSidebar(false);\r\n      setDropTarget({ id: null, type: 'inside', canvasType: CANVAS_TYPES.MAIN });\r\n    }\r\n  }, [activeId, sections, headerSections, footerSections, isEditingHeaderFooter]);\r\n\r\n  const updateDropTarget = (id: string | null, type: DropPosition['type'], canvasType: string) => {\r\n    const now = Date.now();\r\n    if (now - lastUpdateTimeRef.current < DEBOUNCE_MS) return;\r\n    \r\n    if (dropTarget.id !== id || dropTarget.type !== type || dropTarget.canvasType !== canvasType) {\r\n      lastUpdateTimeRef.current = now;\r\n      setDropTarget({ id, type, canvasType });\r\n    }\r\n  };\r\n\r\n  const handleMouseMove = (e: React.MouseEvent, canvasType: string) => {\r\n    if (!activeIdRef.current) return;\r\n    if (canvasType !== CANVAS_TYPES.MAIN && !isEditingHeaderFooter) return;\r\n    \r\n    const dx = e.clientX - lastPositionRef.current.x;\r\n    const dy = e.clientY - lastPositionRef.current.y;\r\n    const distance = Math.sqrt(dx * dx + dy * dy);\r\n    \r\n    if (distance < MIN_MOUSE_MOVE) return;\r\n    \r\n    lastPositionRef.current = { x: e.clientX, y: e.clientY };\r\n    \r\n    const elementsUnderCursor = document.elementsFromPoint(e.clientX, e.clientY);\r\n    const sectionElement = elementsUnderCursor.find(el => \r\n      el.hasAttribute('data-section-id')\r\n    );\r\n    \r\n    const targetSections = getTargetSections(canvasType);\r\n    \r\n    if (!sectionElement) {\r\n      if (targetSections.length === 0) {\r\n        updateDropTarget(null, 'inside', canvasType);\r\n      } else if (isDraggingFromSidebar) {\r\n        updateDropTarget(targetSections[targetSections.length - 1].id, 'after', canvasType);\r\n      }\r\n      return;\r\n    }\r\n    \r\n    const sectionId = sectionElement.getAttribute('data-section-id');\r\n    if (!sectionId) return;\r\n    \r\n    const sectionCanvasType = sectionElement.hasAttribute('data-canvas-type') \r\n      ? sectionElement.getAttribute('data-canvas-type') as string\r\n      : canvasType;\r\n    \r\n    const rect = sectionElement.getBoundingClientRect();\r\n    const relativeY = e.clientY - rect.top;\r\n    const relativeX = e.clientX - rect.left;\r\n    const sectionHeight = rect.height;\r\n    const sectionWidth = rect.width;\r\n    \r\n    const canvasSections = getTargetSections(sectionCanvasType);\r\n    const section = canvasSections.find(s => s.id === sectionId);\r\n    \r\n    const isSplitGroup = sectionId.startsWith('split-group-');\r\n    \r\n    if (isSplitGroup || (section && section.isSplitPair)) {\r\n      if (relativeX < sectionWidth * (0.5 - POSITION_HYSTERESIS)) {\r\n        updateDropTarget(sectionId, 'left', sectionCanvasType);\r\n      } else if (relativeX > sectionWidth * (0.5 + POSITION_HYSTERESIS)) {\r\n        updateDropTarget(sectionId, 'right', sectionCanvasType);\r\n      } else {\r\n        updateDropTarget(sectionId, 'inside', sectionCanvasType);\r\n      }\r\n    } else {\r\n      let position: DropPosition['type'] = dropTarget.type;\r\n      if (relativeY < sectionHeight * (0.3 - POSITION_HYSTERESIS)) {\r\n        position = 'before';\r\n      } else if (relativeY > sectionHeight * (0.7 + POSITION_HYSTERESIS)) {\r\n        position = 'after';\r\n      } else {\r\n        position = 'inside';\r\n      }\r\n      updateDropTarget(sectionId, position, sectionCanvasType);\r\n    }\r\n  };\r\n\r\n  const handleMouseEnter = (e: React.MouseEvent, canvasType: string) => {\r\n    if (!activeIdRef.current || !isDraggingFromSidebar) return;\r\n    if (canvasType !== CANVAS_TYPES.MAIN && !isEditingHeaderFooter) return;\r\n    \r\n    const targetSections = getTargetSections(canvasType);\r\n    \r\n    if (targetSections.length > 0) {\r\n      updateDropTarget(targetSections[0].id, 'before', canvasType);\r\n    } else {\r\n      updateDropTarget(null, 'inside', canvasType);\r\n    }\r\n    \r\n    lastPositionRef.current = { x: e.clientX, y: e.clientY };\r\n  };\r\n\r\n  const renderSectionsForCanvas = (canvasSections: EnhancedSectionData[], canvasType: string) => {\r\n    const result: React.ReactNode[] = [];\r\n    const processedGroups = new Set<string>();\r\n    let i = 0;\r\n    \r\n    const renderDropIndicator = (key: string, isHorizontal = false) => (\r\n      <Box\r\n        key={key}\r\n        sx={{\r\n          [isHorizontal ? 'width' : 'height']: '50px',\r\n          border: '2px dashed',\r\n          borderColor: 'primary.main',\r\n          borderRadius: 1,\r\n          display: 'flex',\r\n          alignItems: 'center',\r\n          justifyContent: 'center',\r\n          bgcolor: 'rgba(25, 118, 210, 0.04)',\r\n          [isHorizontal ? 'mx' : 'mb']: 2,\r\n          opacity: 0,\r\n          animation: 'fadeIn 0.3s ease-in-out forwards',\r\n          '@keyframes fadeIn': {\r\n            '0%': { opacity: 0, transform: isHorizontal ? 'translateX(-10px)' : 'translateY(-10px)' },\r\n            '100%': { opacity: 1, transform: 'translate(0)' },\r\n          },\r\n        }}\r\n      >\r\n        <Typography type='s2' color='primary' weight='medium'>\r\n          Drop here\r\n        </Typography>\r\n      </Box>\r\n    );\r\n\r\n    if (isDraggingFromSidebar && \r\n        canvasSections?.length > 0 && \r\n        dropTarget.type === 'before' && \r\n        dropTarget.id === canvasSections[0].id &&\r\n        dropTarget.canvasType === canvasType) {\r\n      result.push(renderDropIndicator(`drop-before-first-${canvasType}`));\r\n    }\r\n    \r\n    while (i < canvasSections?.length) {\r\n      const section = canvasSections[i];\r\n      const sectionId = section.id;\r\n      \r\n      if (dropTarget.id === sectionId && \r\n          dropTarget.type === 'before' && \r\n          dropTarget.canvasType === canvasType && \r\n          !(isDraggingFromSidebar && i === 0)) {\r\n        result.push(renderDropIndicator(`drop-before-${sectionId}-${canvasType}`));\r\n      }\r\n      \r\n      if (!section.isSplitPair) {\r\n        result.push(\r\n          <Box \r\n            key={section.id} \r\n            data-section-id={section.id} \r\n            data-canvas-type={canvasType}\r\n          >\r\n            <EditorSection\r\n              section={section}\r\n              isSelected={selectedSection === section.id}\r\n              isDragging={activeId === section.id}\r\n              isOver={dropTarget.id === section.id && dropTarget.type === 'inside' && dropTarget.canvasType === canvasType}\r\n              onSelect={() => onSelectSection(section.id)}\r\n              onUpdate={(content, extra) => {\r\n                onUpdateSection(section.id, { content, ...extra }, canvasType); \r\n                onSelectSection(null);\r\n              }}\r\n              onSplit={(content1, content2) => onSplitSection(section.id, content1, content2, canvasType)}\r\n              onDelete={() => onDeleteSection(section.id, canvasType)}\r\n              placeholders={formattedPlaceholders}\r\n              setIsSectionEditing={setIsSectionEditing}\r\n            />\r\n          </Box>\r\n        );\r\n        i++;\r\n      } else {\r\n        const splitGroupId = section.splitGroupId;\r\n        if (splitGroupId && processedGroups.has(splitGroupId)) {\r\n          i++;\r\n          continue;\r\n        }\r\n        \r\n        const splitSections = canvasSections.filter(s => s.splitGroupId === splitGroupId);\r\n        if (splitSections.length > 0) {\r\n          if (splitGroupId) processedGroups.add(splitGroupId);\r\n          \r\n          const splitRow = (\r\n            <Box \r\n              key={`split-row-${splitGroupId}`} \r\n              sx={{ \r\n                display: 'flex', \r\n                gap: 2, \r\n                mb: 2, \r\n                bgcolor: 'rgba(0, 0, 0, 0.02)', \r\n                p: 1, \r\n                borderRadius: 1 \r\n              }} \r\n              data-section-id={`split-group-${splitGroupId}`}\r\n              data-canvas-type={canvasType}\r\n            >\r\n              {splitSections.map((splitSection, index) => (\r\n                <React.Fragment key={splitSection.id}>\r\n                  {dropTarget.id === splitSection.id && \r\n                   dropTarget.type === 'left' && \r\n                   dropTarget.canvasType === canvasType && (\r\n                    renderDropIndicator(`drop-left-${splitSection.id}-${canvasType}`, true)\r\n                  )}\r\n                  <Box\r\n                    sx={{\r\n                      width: splitSection.splitWidth ? `${splitSection.splitWidth}%` : `${100 / splitSections.length}%`,\r\n                      transition: 'width 0.3s ease-in-out',\r\n                    }}\r\n                    data-section-id={splitSection.id}\r\n                    data-canvas-type={canvasType}\r\n                  >\r\n                    <EditorSection\r\n                      section={splitSection}\r\n                      isSelected={selectedSection === splitSection.id}\r\n                      isDragging={activeId === splitSection.id}\r\n                      isOver={dropTarget.id === splitSection.id && dropTarget.type === 'inside' && dropTarget.canvasType === canvasType}\r\n                      onSelect={() => onSelectSection(splitSection.id)}\r\n                      onUpdate={(content, extra) => {\r\n                        onUpdateSection(splitSection.id, { content, ...extra }, canvasType); \r\n                        onSelectSection(null);\r\n                      }}\r\n                      onSplit={(content1, content2) => onSplitSection(splitSection.id, content1, content2, canvasType)}\r\n                      onDelete={() => onDeleteSection(splitSection.id, canvasType)}\r\n                      placeholders={formattedPlaceholders}\r\n                      setIsSectionEditing={setIsSectionEditing}\r\n                    />\r\n                  </Box>\r\n                  {dropTarget.id === splitSection.id && \r\n                   dropTarget.type === 'right' && \r\n                   dropTarget.canvasType === canvasType && (\r\n                    renderDropIndicator(`drop-right-${splitSection.id}-${canvasType}`, true)\r\n                  )}\r\n                </React.Fragment>\r\n              ))}\r\n            </Box>\r\n          );\r\n          result.push(splitRow);\r\n          i += splitSections.length;\r\n        } else {\r\n          i++;\r\n        }\r\n      }\r\n      \r\n      if (dropTarget.id === sectionId && \r\n          dropTarget.type === 'after' && \r\n          dropTarget.canvasType === canvasType) {\r\n        result.push(renderDropIndicator(`drop-after-${sectionId}-${canvasType}`));\r\n      }\r\n    }\r\n    \r\n    if ((canvasSections?.length === 0 && activeId && dropTarget.canvasType === canvasType) || \r\n        (canvasSections?.length === 0 && isDraggingFromSidebar && dropTarget.canvasType === canvasType)) {\r\n      result.push(renderDropIndicator(`drop-empty-canvas-${canvasType}`));\r\n    }\r\n    \r\n    return result;\r\n  };\r\n\r\n  const renderedMainSections = useMemo(() => \r\n    renderSectionsForCanvas(sections, CANVAS_TYPES.MAIN), \r\n    [sections, dropTarget, activeId, isDraggingFromSidebar, selectedSection]\r\n  );\r\n  \r\n  const renderedHeaderSections = useMemo(() => \r\n    renderSectionsForCanvas(headerSections, CANVAS_TYPES.HEADER),\r\n    [headerSections, dropTarget, activeId, isDraggingFromSidebar, selectedSection, isEditingHeaderFooter]\r\n  );\r\n  \r\n  const renderedFooterSections = useMemo(() => \r\n    renderSectionsForCanvas(footerSections, CANVAS_TYPES.FOOTER),\r\n    [footerSections, dropTarget, activeId, isDraggingFromSidebar, selectedSection, isEditingHeaderFooter]\r\n  );\r\n\r\n  const renderPreview = () => {\r\n    // const allSections = [...headerSections, ...sections, ...footerSections];\r\n    return <Box dangerouslySetInnerHTML={{ __html: generateEmailPreview(sections, headerSections, footerSections) }} />;\r\n  };\r\n\r\n  const renderCanvas = (\r\n    title: string, \r\n    canvasType: string, \r\n    renderedSections: React.ReactNode[], \r\n    setCanvasRef: (node: HTMLElement | null) => void,\r\n    ref: React.MutableRefObject<HTMLDivElement | null>,\r\n    visible: boolean = true\r\n  ) => {\r\n    if (!visible) return null;\r\n    \r\n    return (\r\n      <Box sx={{ mb: 3 }}>\r\n        {CANVAS_TYPES.MAIN === canvasType && visible && headerSections.length > 0 && (\r\n          <>\r\n            {/* <Accordion\r\n              sx= {{\r\n                    boxShadow: 'none !important',\r\n                    \".MuiAccordionSummary-root\": {\r\n                      backgroundColor: '#fafafa !important',\r\n                      border: `0 !important`,\r\n                      p: 0,\r\n                      pb: 1,\r\n                      // mb: 1,\r\n                      m:0,\r\n                      minHeight: 'unset'\r\n                    }\r\n                }}\r\n            >\r\n              <AccordionSummary\r\n                expandIcon={<ExpandMoreIcon />}\r\n                aria-controls=\"panel1-content\"\r\n                id=\"panel1-header\"\r\n              > */}\r\n                <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'}>Header</Typography>\r\n              {/* </AccordionSummary> */}\r\n              <Paper sx={{ mb: 1, boxShadow: 'none', opacity: 0.5 }} dangerouslySetInnerHTML={{ __html: generateHeaderFooterPreview(headerSections) }} />\r\n            {/* </Accordion> */}\r\n          </>\r\n        )}\r\n        <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'} sx={{ mb: 1 }}>{title}</Typography>\r\n        <Paper\r\n          ref={(node) => {\r\n            setCanvasRef(node);\r\n            ref.current = node;\r\n          }}\r\n          elevation={0}\r\n          sx={{\r\n            p: 4,\r\n            border: '1px dashed',\r\n            borderColor: isDraggingFromSidebar && dropTarget.canvasType === canvasType \r\n              ? 'primary.main' \r\n              : 'primary.light',\r\n            borderRadius: 1,\r\n            bgcolor: 'background.paper',\r\n            position: 'relative',\r\n            minHeight: title === 'Header' || title === 'Footer' ? '100px' : '200px',\r\n            transition: 'border-color 0.3s ease, background-color 0.3s ease',\r\n            '&:hover': {\r\n              bgcolor: isDraggingFromSidebar && dropTarget.canvasType === canvasType \r\n                ? 'rgba(25, 118, 210, 0.04)' \r\n                : 'background.paper',\r\n            },\r\n            pointerEvents: (canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter \r\n              ? 'none' \r\n              : 'auto',\r\n            opacity: (canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter \r\n              ? 0.5 \r\n              : 1,\r\n          }}\r\n          onClick={() => {\r\n            if ((canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter) return;\r\n            onSelectSection(null);\r\n          }}\r\n          onMouseMove={(e) => handleMouseMove(e, canvasType)}\r\n          onMouseEnter={(e) => handleMouseEnter(e, canvasType)}\r\n        >\r\n          <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>\r\n            {renderedSections}\r\n            {getTargetSections(canvasType)?.length === 0 && \r\n             !activeId && \r\n             !isDraggingFromSidebar && (\r\n              <Box sx={{ borderRadius: 1, p: 2, textAlign: 'center', color: 'text.secondary' }}>\r\n                <Typography type='s2' color='theme.secondary.600' weight='medium'>\r\n                  Drag Sections from side panel to start building the {title.toLowerCase()}\r\n                </Typography>\r\n              </Box>\r\n            )}\r\n          </Box>\r\n        </Paper>\r\n        {CANVAS_TYPES.MAIN === canvasType && visible && footerSections.length > 0 && (\r\n          <>\r\n            {/* <Accordion\r\n            sx= {{\r\n                  boxShadow: 'none !important',\r\n                  \".MuiAccordionSummary-root\": {\r\n                    backgroundColor: '#fafafa !important',\r\n                    border: `0 !important`,\r\n                    p: 0,\r\n                    pb: 1,\r\n                    // mb: 1,\r\n                    m:0,\r\n                    minHeight: 'unset'\r\n                  }\r\n              }}\r\n          >\r\n            <AccordionSummary\r\n              expandIcon={<ExpandMoreIcon />}\r\n              aria-controls=\"panel1-content\"\r\n              id=\"panel1-header\"\r\n            > */}\r\n              <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'} sx={{ mt: 1 }}>Footer</Typography>\r\n            {/* </AccordionSummary> */}\r\n              <Paper sx={{ mb: 1, boxShadow: 'none', opacity: 0.5 }} dangerouslySetInnerHTML={{ __html: generateHeaderFooterPreview(footerSections) }} />\r\n            {/* </Accordion> */}\r\n          </>\r\n          )}\r\n      </Box>\r\n    );\r\n  };\r\n\r\n  return (\r\n    <Box sx={{ display: 'flex', flex: 1, overflow: 'hidden' }}>\r\n      <Box sx={{ flex: 1, overflow: 'auto', height: 'calc(100vh - 104px)' }}>\r\n        <Container maxWidth=\"lg\" sx={{ py: 4 }}>\r\n          {preview ? (\r\n            renderPreview()\r\n          ) : (\r\n            <>\r\n              {renderCanvas(\r\n                'Header', \r\n                CANVAS_TYPES.HEADER, \r\n                renderedHeaderSections, \r\n                setHeaderCanvasRef, \r\n                headerCanvasRef,\r\n                isEditingHeaderFooter\r\n              )}\r\n              {renderCanvas(\r\n                'Content', \r\n                CANVAS_TYPES.MAIN, \r\n                renderedMainSections, \r\n                setMainCanvasRef, \r\n                mainCanvasRef,\r\n                !isEditingHeaderFooter\r\n              )}\r\n              {renderCanvas(\r\n                'Footer', \r\n                CANVAS_TYPES.FOOTER, \r\n                renderedFooterSections, \r\n                setFooterCanvasRef, \r\n                footerCanvasRef,\r\n                isEditingHeaderFooter\r\n              )}\r\n            </>\r\n          )}\r\n        </Container>\r\n      </Box>\r\n      <Box\r\n        sx={{\r\n          width: 400,\r\n          flexShrink: 0,\r\n          position: 'sticky',\r\n          top: 0,\r\n          alignSelf: 'flex-start',\r\n          height: 'calc(100vh - 104px)',\r\n          overflowY: 'auto',\r\n          borderLeft: '1px solid',\r\n          borderColor: 'divider',\r\n          bgcolor: 'background.paper',\r\n          zIndex: 1,\r\n        }}\r\n      >\r\n        {(selectedSection && !selectedSectionData?.is_edited_from_source && !isSectionEditing) ? (\r\n          <SectionFormatPanel\r\n            section={selectedSectionData}\r\n            onClose={() => onSelectSection(null)}\r\n            onUpdate={(data) => {\r\n              if (selectedSection) {\r\n                const canvasType = headerSections.some(s => s.id === selectedSection)\r\n                  ? CANVAS_TYPES.HEADER\r\n                  : footerSections.some(s => s.id === selectedSection)\r\n                    ? CANVAS_TYPES.FOOTER\r\n                    : CANVAS_TYPES.MAIN;\r\n                onUpdateSection(selectedSection, data, canvasType);\r\n              }\r\n            }}\r\n            placeholders={placeholders}\r\n            handleSave={handleSave}\r\n            relation_table={relation_table}\r\n          />\r\n        ) : (\r\n          <EditorSidebar />\r\n        )}\r\n      </Box>\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport default EditorCanvas;"],"names":["CANVAS_TYPES","sections","headerSections","footerSections","activeId","selectedSection","onSelectSection","onUpdateSection","onSplitSection","onDeleteSection","preview","placeholders","isEditingHeaderFooter","handleSave","relation_table","formattedPlaceholders","useMemo","map","p","value","key","label","name","String","setNodeRef","setMainCanvasRef","useDroppable","id","setHeaderCanvasRef","setFooterCanvasRef","selectedSectionData","find","section","dropTarget","setDropTarget","useState","type","canvasType","isDraggingFromSidebar","setIsDraggingFromSidebar","isSectionEditing","setIsSectionEditing","lastUpdateTimeRef","useRef","lastPositionRef","x","y","activeIdRef","mainCanvasRef","headerCanvasRef","footerCanvasRef","getTargetSections","useEffect","current","includes","length","updateDropTarget","now","Date","renderSectionsForCanvas","canvasSections","result","processedGroups","Set","i","renderDropIndicator","isHorizontal","jsx","Box","sx","border","borderColor","borderRadius","display","alignItems","justifyContent","bgcolor","opacity","animation","transform","children","Typography","color","weight","push","sectionId","isSplitPair","splitGroupId","has","splitSections","filter","s","add","splitRow","gap","mb","splitSection","index","jsxs","React","Fragment","width","splitWidth","transition","EditorSection","isSelected","isDragging","isOver","onSelect","onUpdate","content","extra","onSplit","content1","content2","onDelete","renderedMainSections","renderedHeaderSections","renderedFooterSections","renderCanvas","title","renderedSections","setCanvasRef","ref","visible","Paper","boxShadow","dangerouslySetInnerHTML","__html","generateHeaderFooterPreview","node","elevation","position","minHeight","pointerEvents","onClick","onMouseMove","e","dx","clientX","dy","clientY","Math","sqrt","sectionElement","document","elementsFromPoint","el","hasAttribute","targetSections","getAttribute","sectionCanvasType","rect","getBoundingClientRect","relativeY","top","relativeX","left","sectionHeight","height","sectionWidth","startsWith","handleMouseMove","onMouseEnter","handleMouseEnter","flexDirection","_a","textAlign","toLowerCase","mt","flex","overflow","Container","maxWidth","py","generateEmailPreview","flexShrink","alignSelf","overflowY","borderLeft","zIndex","is_edited_from_source","EditorSidebar","SectionFormatPanel","onClose","data","some"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/components/EditorCanvas.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\n/* eslint-disable react-hooks/exhaustive-deps */\n/* eslint-disable unused-imports/no-unused-vars */\nimport React, { useState, useEffect, useRef, useMemo } from 'react';\nimport { useDroppable } from '@dnd-kit/core';\nimport EditorSection from './EditorSection';\nimport { Box, Container, Paper } from '@mui/material';\nimport Typography from '../../../components/typography/typography';\nimport SectionFormatPanel from './SectionFormatPanel';\nimport EditorSidebar from './EditorSidebar';\nimport { generateEmailPreview, generateHeaderFooterPreview } from '../utils/common';\nimport { EnhancedSectionData } from '../types/editor';\n\nconst CANVAS_TYPES = {\n  HEADER: 'header',\n  MAIN: 'main',\n  FOOTER: 'footer'\n};\n\ninterface DropPosition {\n  id: string | null;\n  type: 'before' | 'after' | 'inside' | 'left' | 'right';\n  canvasType: string;\n}\n\ninterface EditorCanvasProps {\n  sections: EnhancedSectionData[];\n  headerSections: EnhancedSectionData[];\n  footerSections: EnhancedSectionData[];\n  activeId: string | null;\n  overSection: string | null;\n  selectedSection: string | null;\n  onSelectSection: (id: string | null) => void;\n  onUpdateSection: (id: string, data: any, canvasType?: string) => void;\n  onSplitSection: (id: string, content1: string, content2: string, canvasType?: string) => void;\n  onDeleteSection: (id: string, canvasType?: string) => void;\n  preview: boolean;\n  placeholders: Record<string, any>[];\n  isEditingHeaderFooter: boolean;\n  relation_table:any[];\n  handleSave?: () => Promise<void>;\n}\n\nconst EditorCanvas: React.FC<EditorCanvasProps> = ({\n  sections,\n  headerSections,\n  footerSections,\n  activeId,\n  selectedSection,\n  onSelectSection,\n  onUpdateSection,\n  onSplitSection,\n  onDeleteSection,\n  preview,\n  placeholders,\n  isEditingHeaderFooter,\n  handleSave,\n  relation_table\n}) => {\n  // Convert placeholders to the expected format\n  const formattedPlaceholders = useMemo(() => {\n    return placeholders.map((p: Record<string, any>) => ({\n      value: p.value || p.key || '',\n      label: p.label || p.name || String(p.value || p.key || '')\n    }));\n  }, [placeholders]);\n\n  const { setNodeRef: setMainCanvasRef } = useDroppable({ id: 'main-canvas' });\n  const { setNodeRef: setHeaderCanvasRef } = useDroppable({ id: 'header-canvas' });\n  const { setNodeRef: setFooterCanvasRef } = useDroppable({ id: 'footer-canvas' });\n\n  const selectedSectionData = useMemo(() => {\n    return [...sections, ...headerSections, ...footerSections].find((section) => section.id === selectedSection);\n  }, [sections, selectedSection]);\n\n  const [dropTarget, setDropTarget] = useState<DropPosition>({ \n    id: null, \n    type: 'inside',\n    canvasType: CANVAS_TYPES.MAIN\n  });\n  const [isDraggingFromSidebar, setIsDraggingFromSidebar] = useState(false);\n  const [isSectionEditing, setIsSectionEditing] = useState(false);\n  \n  const lastUpdateTimeRef = useRef(0);\n  const lastPositionRef = useRef({ x: 0, y: 0 });\n  const activeIdRef = useRef<string | null>(null);\n  const mainCanvasRef = useRef<HTMLDivElement | null>(null);\n  const headerCanvasRef = useRef<HTMLDivElement | null>(null);\n  const footerCanvasRef = useRef<HTMLDivElement | null>(null);\n  \n  const DEBOUNCE_MS = 200;\n  const MIN_MOUSE_MOVE = 15;\n  const POSITION_HYSTERESIS = 0.1;\n\n  const getTargetSections = (canvasType: string) => {\n    switch (canvasType) {\n      case CANVAS_TYPES.HEADER:\n        return headerSections;\n      case CANVAS_TYPES.FOOTER:\n        return footerSections;\n      default:\n        return sections;\n    }\n  };\n\n  useEffect(() => {\n    activeIdRef.current = activeId;\n    \n    if (activeId && String(activeId).includes('sidebar-')) {\n      setIsDraggingFromSidebar(true);\n      \n      if (sections?.length > 0) {\n        updateDropTarget(sections[0].id, 'before', CANVAS_TYPES.MAIN);\n      } else if (headerSections?.length > 0 && isEditingHeaderFooter) {\n        updateDropTarget(headerSections[0].id, 'before', CANVAS_TYPES.HEADER);\n      } else if (footerSections?.length > 0 && isEditingHeaderFooter) {\n        updateDropTarget(footerSections[0].id, 'before', CANVAS_TYPES.FOOTER);\n      } else {\n        updateDropTarget(null, 'inside', CANVAS_TYPES.MAIN);\n      }\n    } else if (!activeId) {\n      setIsDraggingFromSidebar(false);\n      setDropTarget({ id: null, type: 'inside', canvasType: CANVAS_TYPES.MAIN });\n    }\n  }, [activeId, sections, headerSections, footerSections, isEditingHeaderFooter]);\n\n  const updateDropTarget = (id: string | null, type: DropPosition['type'], canvasType: string) => {\n    const now = Date.now();\n    if (now - lastUpdateTimeRef.current < DEBOUNCE_MS) return;\n    \n    if (dropTarget.id !== id || dropTarget.type !== type || dropTarget.canvasType !== canvasType) {\n      lastUpdateTimeRef.current = now;\n      setDropTarget({ id, type, canvasType });\n    }\n  };\n\n  const handleMouseMove = (e: React.MouseEvent, canvasType: string) => {\n    if (!activeIdRef.current) return;\n    if (canvasType !== CANVAS_TYPES.MAIN && !isEditingHeaderFooter) return;\n    \n    const dx = e.clientX - lastPositionRef.current.x;\n    const dy = e.clientY - lastPositionRef.current.y;\n    const distance = Math.sqrt(dx * dx + dy * dy);\n    \n    if (distance < MIN_MOUSE_MOVE) return;\n    \n    lastPositionRef.current = { x: e.clientX, y: e.clientY };\n    \n    const elementsUnderCursor = document.elementsFromPoint(e.clientX, e.clientY);\n    const sectionElement = elementsUnderCursor.find(el => \n      el.hasAttribute('data-section-id')\n    );\n    \n    const targetSections = getTargetSections(canvasType);\n    \n    if (!sectionElement) {\n      if (targetSections.length === 0) {\n        updateDropTarget(null, 'inside', canvasType);\n      } else if (isDraggingFromSidebar) {\n        updateDropTarget(targetSections[targetSections.length - 1].id, 'after', canvasType);\n      }\n      return;\n    }\n    \n    const sectionId = sectionElement.getAttribute('data-section-id');\n    if (!sectionId) return;\n    \n    const sectionCanvasType = sectionElement.hasAttribute('data-canvas-type') \n      ? sectionElement.getAttribute('data-canvas-type') as string\n      : canvasType;\n    \n    const rect = sectionElement.getBoundingClientRect();\n    const relativeY = e.clientY - rect.top;\n    const relativeX = e.clientX - rect.left;\n    const sectionHeight = rect.height;\n    const sectionWidth = rect.width;\n    \n    const canvasSections = getTargetSections(sectionCanvasType);\n    const section = canvasSections.find(s => s.id === sectionId);\n    \n    const isSplitGroup = sectionId.startsWith('split-group-');\n    \n    if (isSplitGroup || (section && section.isSplitPair)) {\n      if (relativeX < sectionWidth * (0.5 - POSITION_HYSTERESIS)) {\n        updateDropTarget(sectionId, 'left', sectionCanvasType);\n      } else if (relativeX > sectionWidth * (0.5 + POSITION_HYSTERESIS)) {\n        updateDropTarget(sectionId, 'right', sectionCanvasType);\n      } else {\n        updateDropTarget(sectionId, 'inside', sectionCanvasType);\n      }\n    } else {\n      let position: DropPosition['type'] = dropTarget.type;\n      if (relativeY < sectionHeight * (0.3 - POSITION_HYSTERESIS)) {\n        position = 'before';\n      } else if (relativeY > sectionHeight * (0.7 + POSITION_HYSTERESIS)) {\n        position = 'after';\n      } else {\n        position = 'inside';\n      }\n      updateDropTarget(sectionId, position, sectionCanvasType);\n    }\n  };\n\n  const handleMouseEnter = (e: React.MouseEvent, canvasType: string) => {\n    if (!activeIdRef.current || !isDraggingFromSidebar) return;\n    if (canvasType !== CANVAS_TYPES.MAIN && !isEditingHeaderFooter) return;\n    \n    const targetSections = getTargetSections(canvasType);\n    \n    if (targetSections.length > 0) {\n      updateDropTarget(targetSections[0].id, 'before', canvasType);\n    } else {\n      updateDropTarget(null, 'inside', canvasType);\n    }\n    \n    lastPositionRef.current = { x: e.clientX, y: e.clientY };\n  };\n\n  const renderSectionsForCanvas = (canvasSections: EnhancedSectionData[], canvasType: string) => {\n    const result: React.ReactNode[] = [];\n    const processedGroups = new Set<string>();\n    let i = 0;\n    \n    const renderDropIndicator = (key: string, isHorizontal = false) => (\n      <Box\n        key={key}\n        sx={{\n          [isHorizontal ? 'width' : 'height']: '50px',\n          border: '2px dashed',\n          borderColor: 'primary.main',\n          borderRadius: 1,\n          display: 'flex',\n          alignItems: 'center',\n          justifyContent: 'center',\n          bgcolor: 'rgba(25, 118, 210, 0.04)',\n          [isHorizontal ? 'mx' : 'mb']: 2,\n          opacity: 0,\n          animation: 'fadeIn 0.3s ease-in-out forwards',\n          '@keyframes fadeIn': {\n            '0%': { opacity: 0, transform: isHorizontal ? 'translateX(-10px)' : 'translateY(-10px)' },\n            '100%': { opacity: 1, transform: 'translate(0)' },\n          },\n        }}\n      >\n        <Typography type='s2' color='primary' weight='medium'>\n          Drop here\n        </Typography>\n      </Box>\n    );\n\n    if (isDraggingFromSidebar && \n        canvasSections?.length > 0 && \n        dropTarget.type === 'before' && \n        dropTarget.id === canvasSections[0].id &&\n        dropTarget.canvasType === canvasType) {\n      result.push(renderDropIndicator(`drop-before-first-${canvasType}`));\n    }\n    \n    while (i < canvasSections?.length) {\n      const section = canvasSections[i];\n      const sectionId = section.id;\n      \n      if (dropTarget.id === sectionId && \n          dropTarget.type === 'before' && \n          dropTarget.canvasType === canvasType && \n          !(isDraggingFromSidebar && i === 0)) {\n        result.push(renderDropIndicator(`drop-before-${sectionId}-${canvasType}`));\n      }\n      \n      if (!section.isSplitPair) {\n        result.push(\n          <Box \n            key={section.id} \n            data-section-id={section.id} \n            data-canvas-type={canvasType}\n          >\n            <EditorSection\n              section={section}\n              isSelected={selectedSection === section.id}\n              isDragging={activeId === section.id}\n              isOver={dropTarget.id === section.id && dropTarget.type === 'inside' && dropTarget.canvasType === canvasType}\n              onSelect={() => onSelectSection(section.id)}\n              onUpdate={(content, extra) => {\n                onUpdateSection(section.id, { content, ...extra }, canvasType); \n                onSelectSection(null);\n              }}\n              onSplit={(content1, content2) => onSplitSection(section.id, content1, content2, canvasType)}\n              onDelete={() => onDeleteSection(section.id, canvasType)}\n              placeholders={formattedPlaceholders}\n              setIsSectionEditing={setIsSectionEditing}\n            />\n          </Box>\n        );\n        i++;\n      } else {\n        const splitGroupId = section.splitGroupId;\n        if (splitGroupId && processedGroups.has(splitGroupId)) {\n          i++;\n          continue;\n        }\n        \n        const splitSections = canvasSections.filter(s => s.splitGroupId === splitGroupId);\n        if (splitSections.length > 0) {\n          if (splitGroupId) processedGroups.add(splitGroupId);\n          \n          const splitRow = (\n            <Box \n              key={`split-row-${splitGroupId}`} \n              sx={{ \n                display: 'flex', \n                gap: 2, \n                mb: 2, \n                bgcolor: 'rgba(0, 0, 0, 0.02)', \n                p: 1, \n                borderRadius: 1 \n              }} \n              data-section-id={`split-group-${splitGroupId}`}\n              data-canvas-type={canvasType}\n            >\n              {splitSections.map((splitSection, index) => (\n                <React.Fragment key={splitSection.id}>\n                  {dropTarget.id === splitSection.id && \n                   dropTarget.type === 'left' && \n                   dropTarget.canvasType === canvasType && (\n                    renderDropIndicator(`drop-left-${splitSection.id}-${canvasType}`, true)\n                  )}\n                  <Box\n                    sx={{\n                      width: splitSection.splitWidth ? `${splitSection.splitWidth}%` : `${100 / splitSections.length}%`,\n                      transition: 'width 0.3s ease-in-out',\n                    }}\n                    data-section-id={splitSection.id}\n                    data-canvas-type={canvasType}\n                  >\n                    <EditorSection\n                      section={splitSection}\n                      isSelected={selectedSection === splitSection.id}\n                      isDragging={activeId === splitSection.id}\n                      isOver={dropTarget.id === splitSection.id && dropTarget.type === 'inside' && dropTarget.canvasType === canvasType}\n                      onSelect={() => onSelectSection(splitSection.id)}\n                      onUpdate={(content, extra) => {\n                        onUpdateSection(splitSection.id, { content, ...extra }, canvasType); \n                        onSelectSection(null);\n                      }}\n                      onSplit={(content1, content2) => onSplitSection(splitSection.id, content1, content2, canvasType)}\n                      onDelete={() => onDeleteSection(splitSection.id, canvasType)}\n                      placeholders={formattedPlaceholders}\n                      setIsSectionEditing={setIsSectionEditing}\n                    />\n                  </Box>\n                  {dropTarget.id === splitSection.id && \n                   dropTarget.type === 'right' && \n                   dropTarget.canvasType === canvasType && (\n                    renderDropIndicator(`drop-right-${splitSection.id}-${canvasType}`, true)\n                  )}\n                </React.Fragment>\n              ))}\n            </Box>\n          );\n          result.push(splitRow);\n          i += splitSections.length;\n        } else {\n          i++;\n        }\n      }\n      \n      if (dropTarget.id === sectionId && \n          dropTarget.type === 'after' && \n          dropTarget.canvasType === canvasType) {\n        result.push(renderDropIndicator(`drop-after-${sectionId}-${canvasType}`));\n      }\n    }\n    \n    if ((canvasSections?.length === 0 && activeId && dropTarget.canvasType === canvasType) || \n        (canvasSections?.length === 0 && isDraggingFromSidebar && dropTarget.canvasType === canvasType)) {\n      result.push(renderDropIndicator(`drop-empty-canvas-${canvasType}`));\n    }\n    \n    return result;\n  };\n\n  const renderedMainSections = useMemo(() => \n    renderSectionsForCanvas(sections, CANVAS_TYPES.MAIN), \n    [sections, dropTarget, activeId, isDraggingFromSidebar, selectedSection]\n  );\n  \n  const renderedHeaderSections = useMemo(() => \n    renderSectionsForCanvas(headerSections, CANVAS_TYPES.HEADER),\n    [headerSections, dropTarget, activeId, isDraggingFromSidebar, selectedSection, isEditingHeaderFooter]\n  );\n  \n  const renderedFooterSections = useMemo(() => \n    renderSectionsForCanvas(footerSections, CANVAS_TYPES.FOOTER),\n    [footerSections, dropTarget, activeId, isDraggingFromSidebar, selectedSection, isEditingHeaderFooter]\n  );\n\n  const renderPreview = () => {\n    // const allSections = [...headerSections, ...sections, ...footerSections];\n    return <Box dangerouslySetInnerHTML={{ __html: generateEmailPreview(sections, headerSections, footerSections) }} />;\n  };\n\n  const renderCanvas = (\n    title: string, \n    canvasType: string, \n    renderedSections: React.ReactNode[], \n    setCanvasRef: (node: HTMLElement | null) => void,\n    ref: React.MutableRefObject<HTMLDivElement | null>,\n    visible: boolean = true\n  ) => {\n    if (!visible) return null;\n    \n    return (\n      <Box sx={{ mb: 3 }}>\n        {CANVAS_TYPES.MAIN === canvasType && visible && headerSections.length > 0 && (\n          <>\n            {/* <Accordion\n              sx= {{\n                    boxShadow: 'none !important',\n                    \".MuiAccordionSummary-root\": {\n                      backgroundColor: '#fafafa !important',\n                      border: `0 !important`,\n                      p: 0,\n                      pb: 1,\n                      // mb: 1,\n                      m:0,\n                      minHeight: 'unset'\n                    }\n                }}\n            >\n              <AccordionSummary\n                expandIcon={<ExpandMoreIcon />}\n                aria-controls=\"panel1-content\"\n                id=\"panel1-header\"\n              > */}\n                <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'}>Header</Typography>\n              {/* </AccordionSummary> */}\n              <Paper sx={{ mb: 1, boxShadow: 'none', opacity: 0.5 }} dangerouslySetInnerHTML={{ __html: generateHeaderFooterPreview(headerSections) }} />\n            {/* </Accordion> */}\n          </>\n        )}\n        <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'} sx={{ mb: 1 }}>{title}</Typography>\n        <Paper\n          ref={(node) => {\n            setCanvasRef(node);\n            ref.current = node;\n          }}\n          elevation={0}\n          sx={{\n            p: 4,\n            border: '1px dashed',\n            borderColor: isDraggingFromSidebar && dropTarget.canvasType === canvasType \n              ? 'primary.main' \n              : 'primary.light',\n            borderRadius: 1,\n            bgcolor: 'background.paper',\n            position: 'relative',\n            minHeight: title === 'Header' || title === 'Footer' ? '100px' : '200px',\n            transition: 'border-color 0.3s ease, background-color 0.3s ease',\n            '&:hover': {\n              bgcolor: isDraggingFromSidebar && dropTarget.canvasType === canvasType \n                ? 'rgba(25, 118, 210, 0.04)' \n                : 'background.paper',\n            },\n            pointerEvents: (canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter \n              ? 'none' \n              : 'auto',\n            opacity: (canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter \n              ? 0.5 \n              : 1,\n          }}\n          onClick={() => {\n            if ((canvasType === CANVAS_TYPES.HEADER || canvasType === CANVAS_TYPES.FOOTER) && !isEditingHeaderFooter) return;\n            onSelectSection(null);\n          }}\n          onMouseMove={(e) => handleMouseMove(e, canvasType)}\n          onMouseEnter={(e) => handleMouseEnter(e, canvasType)}\n        >\n          <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>\n            {renderedSections}\n            {getTargetSections(canvasType)?.length === 0 && \n             !activeId && \n             !isDraggingFromSidebar && (\n              <Box sx={{ borderRadius: 1, p: 2, textAlign: 'center', color: 'text.secondary' }}>\n                <Typography type='s2' color='theme.secondary.600' weight='medium'>\n                  Drag Sections from side panel to start building the {title.toLowerCase()}\n                </Typography>\n              </Box>\n            )}\n          </Box>\n        </Paper>\n        {CANVAS_TYPES.MAIN === canvasType && visible && footerSections.length > 0 && (\n          <>\n            {/* <Accordion\n            sx= {{\n                  boxShadow: 'none !important',\n                  \".MuiAccordionSummary-root\": {\n                    backgroundColor: '#fafafa !important',\n                    border: `0 !important`,\n                    p: 0,\n                    pb: 1,\n                    // mb: 1,\n                    m:0,\n                    minHeight: 'unset'\n                  }\n              }}\n          >\n            <AccordionSummary\n              expandIcon={<ExpandMoreIcon />}\n              aria-controls=\"panel1-content\"\n              id=\"panel1-header\"\n            > */}\n              <Typography type=\"h4\" weight='bold' color={'theme.secondary.800'} sx={{ mt: 1 }}>Footer</Typography>\n            {/* </AccordionSummary> */}\n              <Paper sx={{ mb: 1, boxShadow: 'none', opacity: 0.5 }} dangerouslySetInnerHTML={{ __html: generateHeaderFooterPreview(footerSections) }} />\n            {/* </Accordion> */}\n          </>\n          )}\n      </Box>\n    );\n  };\n\n  return (\n    <Box sx={{ display: 'flex', flex: 1, overflow: 'hidden' }}>\n      <Box sx={{ flex: 1, overflow: 'auto', height: 'calc(100vh - 104px)' }}>\n        <Container maxWidth=\"lg\" sx={{ py: 4 }}>\n          {preview ? (\n            renderPreview()\n          ) : (\n            <>\n              {renderCanvas(\n                'Header', \n                CANVAS_TYPES.HEADER, \n                renderedHeaderSections, \n                setHeaderCanvasRef, \n                headerCanvasRef,\n                isEditingHeaderFooter\n              )}\n              {renderCanvas(\n                'Content', \n                CANVAS_TYPES.MAIN, \n                renderedMainSections, \n                setMainCanvasRef, \n                mainCanvasRef,\n                !isEditingHeaderFooter\n              )}\n              {renderCanvas(\n                'Footer', \n                CANVAS_TYPES.FOOTER, \n                renderedFooterSections, \n                setFooterCanvasRef, \n                footerCanvasRef,\n                isEditingHeaderFooter\n              )}\n            </>\n          )}\n        </Container>\n      </Box>\n      <Box\n        sx={{\n          width: 400,\n          flexShrink: 0,\n          position: 'sticky',\n          top: 0,\n          alignSelf: 'flex-start',\n          height: 'calc(100vh - 104px)',\n          overflowY: 'auto',\n          borderLeft: '1px solid',\n          borderColor: 'divider',\n          bgcolor: 'background.paper',\n          zIndex: 1,\n        }}\n      >\n        {(selectedSection && !selectedSectionData?.is_edited_from_source && !isSectionEditing) ? (\n          <SectionFormatPanel\n            section={selectedSectionData}\n            onClose={() => onSelectSection(null)}\n            onUpdate={(data) => {\n              if (selectedSection) {\n                const canvasType = headerSections.some(s => s.id === selectedSection)\n                  ? CANVAS_TYPES.HEADER\n                  : footerSections.some(s => s.id === selectedSection)\n                    ? CANVAS_TYPES.FOOTER\n                    : CANVAS_TYPES.MAIN;\n                onUpdateSection(selectedSection, data, canvasType);\n              }\n            }}\n            placeholders={placeholders}\n            handleSave={handleSave}\n            relation_table={relation_table}\n          />\n        ) : (\n          <EditorSidebar />\n        )}\n      </Box>\n    </Box>\n  );\n};\n\nexport default EditorCanvas;"],"names":["CANVAS_TYPES","sections","headerSections","footerSections","activeId","selectedSection","onSelectSection","onUpdateSection","onSplitSection","onDeleteSection","preview","placeholders","isEditingHeaderFooter","handleSave","relation_table","formattedPlaceholders","useMemo","map","p","value","key","label","name","String","setNodeRef","setMainCanvasRef","useDroppable","id","setHeaderCanvasRef","setFooterCanvasRef","selectedSectionData","find","section","dropTarget","setDropTarget","useState","type","canvasType","isDraggingFromSidebar","setIsDraggingFromSidebar","isSectionEditing","setIsSectionEditing","lastUpdateTimeRef","useRef","lastPositionRef","x","y","activeIdRef","mainCanvasRef","headerCanvasRef","footerCanvasRef","getTargetSections","useEffect","current","includes","length","updateDropTarget","now","Date","renderSectionsForCanvas","canvasSections","result","processedGroups","Set","i","renderDropIndicator","isHorizontal","jsx","Box","sx","border","borderColor","borderRadius","display","alignItems","justifyContent","bgcolor","opacity","animation","transform","children","Typography","color","weight","push","sectionId","isSplitPair","splitGroupId","has","splitSections","filter","s","add","splitRow","gap","mb","splitSection","index","jsxs","React","Fragment","width","splitWidth","transition","EditorSection","isSelected","isDragging","isOver","onSelect","onUpdate","content","extra","onSplit","content1","content2","onDelete","renderedMainSections","renderedHeaderSections","renderedFooterSections","renderCanvas","title","renderedSections","setCanvasRef","ref","visible","Paper","boxShadow","dangerouslySetInnerHTML","__html","generateHeaderFooterPreview","node","elevation","position","minHeight","pointerEvents","onClick","onMouseMove","e","dx","clientX","dy","clientY","Math","sqrt","sectionElement","document","elementsFromPoint","el","hasAttribute","targetSections","getAttribute","sectionCanvasType","rect","getBoundingClientRect","relativeY","top","relativeX","left","sectionHeight","height","sectionWidth","startsWith","handleMouseMove","onMouseEnter","handleMouseEnter","flexDirection","_a","textAlign","toLowerCase","mt","flex","overflow","Container","maxWidth","py","generateEmailPreview","flexShrink","alignSelf","overflowY","borderLeft","zIndex","is_edited_from_source","EditorSidebar","SectionFormatPanel","onClose","data","some"],"mappings":"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"}

package/dist/views/template-editor/components/EditorHeader/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/template-editor/components/EditorHeader.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React from 'react';\r\nimport { \r\n  AppBar,\r\n  Toolbar,\r\n  Box,\r\n  Link,\r\n  Stack,\r\n} from '@mui/material';\r\nimport Button from '../../../components/button/button';\r\nimport Typography from '../../../components/typography/typography';\r\nimport { Edit, Eye, EyeOff } from '../../../components/icons';\r\nimport { Link as RouterLink } from 'react-router-dom';\r\nimport { templateRoutes } from '../utils/common';\r\nimport { EnhancedSectionData } from '../types/editor';\r\n\r\ninterface EditorHeaderProps {\r\n  onSave: () => void;\r\n  onPreview: () => void;\r\n  preview: boolean;\r\n  sections: EnhancedSectionData[];\r\n  isEditingHeaderFooter: boolean;\r\n  setIsEditingHeaderFooter: (value: boolean) => void;\r\n  onSaveHeaderFooter: (value: boolean) => void;\r\n  modulePath: string;\r\n  type: string;\r\n  mode: 'add' | 'edit';\r\n  templateData: Record<string, any> | null;\r\n}\r\n\r\nconst EditorHeader: React.FC<EditorHeaderProps> = ({ \r\n  onSave, \r\n  onPreview, \r\n  preview, \r\n  sections, \r\n  isEditingHeaderFooter, \r\n  setIsEditingHeaderFooter, \r\n  onSaveHeaderFooter, \r\n  modulePath, \r\n  type,\r\n  mode = 'add',\r\n  templateData\r\n}) => {\r\n  const ROUTES = templateRoutes(modulePath, type);\r\n  return (\r\n    <AppBar \r\n      position=\"static\" \r\n      color=\"default\" \r\n      elevation={0} \r\n      sx={{ \r\n        borderColor: 'divider',\r\n        bgcolor: 'background.paper'\r\n      }}\r\n    >\r\n      <Toolbar variant=\"dense\" sx={{ justifyContent: 'space-between' ,p:3 }}>\r\n        <Box sx={{ display: 'flex', alignItems: 'center', gap: 1}}>\r\n          <Link\r\n            component={RouterLink}\r\n            to={ROUTES.LIST}\r\n            underline=\"hover\" \r\n            color=\"text.secondary\" \r\n            sx={{ fontSize: '0.875rem' }}\r\n          >\r\n            <Typography type=\"s5\" color='theme.secondary.800'>{type === 'email' ? 'Emails' : 'PDF'}</Typography>\r\n          </Link>\r\n          <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>/</Typography>\r\n          <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>\r\n            { mode == 'add' ? 'Add New' : 'Edit' } Template\r\n          </Typography>\r\n          {templateData && templateData?.name &&\r\n            <>\r\n              <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>/</Typography>\r\n              <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>\r\n                {templateData?.name}\r\n              </Typography>\r\n            </>\r\n          }\r\n        </Box>\r\n        \r\n        <Stack direction=\"row\" spacing={1}>\r\n          {isEditingHeaderFooter ?\r\n            (\r\n              <>\r\n                <Button\r\n                  onClick={() => setIsEditingHeaderFooter(false)}\r\n                  size=\"small\"\r\n                  variant='outlined'\r\n                  sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\r\n                >\r\n                  Cancel Editing\r\n                </Button>\r\n                <Button \r\n                  variant=\"contained\" \r\n                  onClick={() => onSaveHeaderFooter(true)}\r\n                  size=\"small\"\r\n                  sx={{ boxShadow: 'none' }}\r\n                >\r\n                  Save Changes\r\n                </Button>\r\n              </>\r\n            )\r\n          : (\r\n            <>\r\n              <Button\r\n                onClick={() => setIsEditingHeaderFooter(true)}\r\n                size=\"small\"\r\n                variant='outlined'\r\n                sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\r\n                startIcon={<Edit fontSize='small'/>}\r\n                disabled={preview}\r\n              >\r\n                Edit Header/Footer\r\n              </Button>\r\n              <Button\r\n                onClick={onPreview}\r\n                size=\"small\"\r\n                variant='outlined'\r\n                sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\r\n                startIcon={preview ? <EyeOff fontSize='small'/> : <Eye fontSize='small'/>}\r\n                disabled={!sections?.length}\r\n              >\r\n                Preview\r\n              </Button>\r\n              <Button \r\n                variant=\"contained\" \r\n                onClick={onSave}\r\n                size=\"small\"\r\n                sx={{ boxShadow: 'none' }}\r\n                disabled={!sections?.length}\r\n              >\r\n                Save\r\n              </Button>\r\n            </>\r\n          )}\r\n        </Stack>\r\n      </Toolbar>\r\n    </AppBar>\r\n  );\r\n};\r\n\r\nexport default EditorHeader;"],"names":["RouterLink"],"mappings":"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"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/template-editor/components/EditorHeader.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\n/* eslint-disable unused-imports/no-unused-vars */\nimport React from 'react';\nimport { \n  AppBar,\n  Toolbar,\n  Box,\n  Link,\n  Stack,\n} from '@mui/material';\nimport Button from '../../../components/button/button';\nimport Typography from '../../../components/typography/typography';\nimport { Edit, Eye, EyeOff } from '../../../components/icons';\nimport { Link as RouterLink } from 'react-router-dom';\nimport { templateRoutes } from '../utils/common';\nimport { EnhancedSectionData } from '../types/editor';\n\ninterface EditorHeaderProps {\n  onSave: () => void;\n  onPreview: () => void;\n  preview: boolean;\n  sections: EnhancedSectionData[];\n  isEditingHeaderFooter: boolean;\n  setIsEditingHeaderFooter: (value: boolean) => void;\n  onSaveHeaderFooter: (value: boolean) => void;\n  modulePath: string;\n  type: string;\n  mode: 'add' | 'edit';\n  templateData: Record<string, any> | null;\n}\n\nconst EditorHeader: React.FC<EditorHeaderProps> = ({ \n  onSave, \n  onPreview, \n  preview, \n  sections, \n  isEditingHeaderFooter, \n  setIsEditingHeaderFooter, \n  onSaveHeaderFooter, \n  modulePath, \n  type,\n  mode = 'add',\n  templateData\n}) => {\n  const ROUTES = templateRoutes(modulePath, type);\n  return (\n    <AppBar \n      position=\"static\" \n      color=\"default\" \n      elevation={0} \n      sx={{ \n        borderColor: 'divider',\n        bgcolor: 'background.paper'\n      }}\n    >\n      <Toolbar variant=\"dense\" sx={{ justifyContent: 'space-between' ,p:3 }}>\n        <Box sx={{ display: 'flex', alignItems: 'center', gap: 1}}>\n          <Link\n            component={RouterLink}\n            to={ROUTES.LIST}\n            underline=\"hover\" \n            color=\"text.secondary\" \n            sx={{ fontSize: '0.875rem' }}\n          >\n            <Typography type=\"s5\" color='theme.secondary.800'>{type === 'email' ? 'Emails' : 'PDF'}</Typography>\n          </Link>\n          <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>/</Typography>\n          <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>\n            { mode == 'add' ? 'Add New' : 'Edit' } Template\n          </Typography>\n          {templateData && templateData?.name &&\n            <>\n              <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>/</Typography>\n              <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>\n                {templateData?.name}\n              </Typography>\n            </>\n          }\n        </Box>\n        \n        <Stack direction=\"row\" spacing={1}>\n          {isEditingHeaderFooter ?\n            (\n              <>\n                <Button\n                  onClick={() => setIsEditingHeaderFooter(false)}\n                  size=\"small\"\n                  variant='outlined'\n                  sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\n                >\n                  Cancel Editing\n                </Button>\n                <Button \n                  variant=\"contained\" \n                  onClick={() => onSaveHeaderFooter(true)}\n                  size=\"small\"\n                  sx={{ boxShadow: 'none' }}\n                >\n                  Save Changes\n                </Button>\n              </>\n            )\n          : (\n            <>\n              <Button\n                onClick={() => setIsEditingHeaderFooter(true)}\n                size=\"small\"\n                variant='outlined'\n                sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\n                startIcon={<Edit fontSize='small'/>}\n                disabled={preview}\n              >\n                Edit Header/Footer\n              </Button>\n              <Button\n                onClick={onPreview}\n                size=\"small\"\n                variant='outlined'\n                sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\n                startIcon={preview ? <EyeOff fontSize='small'/> : <Eye fontSize='small'/>}\n                disabled={!sections?.length}\n              >\n                Preview\n              </Button>\n              <Button \n                variant=\"contained\" \n                onClick={onSave}\n                size=\"small\"\n                sx={{ boxShadow: 'none' }}\n                disabled={!sections?.length}\n              >\n                Save\n              </Button>\n            </>\n          )}\n        </Stack>\n      </Toolbar>\n    </AppBar>\n  );\n};\n\nexport default EditorHeader;"],"names":["RouterLink"],"mappings":"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"}

package/dist/views/template-editor/components/EditorHeader/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/components/EditorHeader.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React from 'react';\r\nimport { \r\n  AppBar,\r\n  Toolbar,\r\n  Box,\r\n  Link,\r\n  Stack,\r\n} from '@mui/material';\r\nimport Button from '../../../components/button/button';\r\nimport Typography from '../../../components/typography/typography';\r\nimport { Edit, Eye, EyeOff } from '../../../components/icons';\r\nimport { Link as RouterLink } from 'react-router-dom';\r\nimport { templateRoutes } from '../utils/common';\r\nimport { EnhancedSectionData } from '../types/editor';\r\n\r\ninterface EditorHeaderProps {\r\n  onSave: () => void;\r\n  onPreview: () => void;\r\n  preview: boolean;\r\n  sections: EnhancedSectionData[];\r\n  isEditingHeaderFooter: boolean;\r\n  setIsEditingHeaderFooter: (value: boolean) => void;\r\n  onSaveHeaderFooter: (value: boolean) => void;\r\n  modulePath: string;\r\n  type: string;\r\n  mode: 'add' | 'edit';\r\n  templateData: Record<string, any> | null;\r\n}\r\n\r\nconst EditorHeader: React.FC<EditorHeaderProps> = ({ \r\n  onSave, \r\n  onPreview, \r\n  preview, \r\n  sections, \r\n  isEditingHeaderFooter, \r\n  setIsEditingHeaderFooter, \r\n  onSaveHeaderFooter, \r\n  modulePath, \r\n  type,\r\n  mode = 'add',\r\n  templateData\r\n}) => {\r\n  const ROUTES = templateRoutes(modulePath, type);\r\n  return (\r\n    <AppBar \r\n      position=\"static\" \r\n      color=\"default\" \r\n      elevation={0} \r\n      sx={{ \r\n        borderColor: 'divider',\r\n        bgcolor: 'background.paper'\r\n      }}\r\n    >\r\n      <Toolbar variant=\"dense\" sx={{ justifyContent: 'space-between' ,p:3 }}>\r\n        <Box sx={{ display: 'flex', alignItems: 'center', gap: 1}}>\r\n          <Link\r\n            component={RouterLink}\r\n            to={ROUTES.LIST}\r\n            underline=\"hover\" \r\n            color=\"text.secondary\" \r\n            sx={{ fontSize: '0.875rem' }}\r\n          >\r\n            <Typography type=\"s5\" color='theme.secondary.800'>{type === 'email' ? 'Emails' : 'PDF'}</Typography>\r\n          </Link>\r\n          <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>/</Typography>\r\n          <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>\r\n            { mode == 'add' ? 'Add New' : 'Edit' } Template\r\n          </Typography>\r\n          {templateData && templateData?.name &&\r\n            <>\r\n              <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>/</Typography>\r\n              <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>\r\n                {templateData?.name}\r\n              </Typography>\r\n            </>\r\n          }\r\n        </Box>\r\n        \r\n        <Stack direction=\"row\" spacing={1}>\r\n          {isEditingHeaderFooter ?\r\n            (\r\n              <>\r\n                <Button\r\n                  onClick={() => setIsEditingHeaderFooter(false)}\r\n                  size=\"small\"\r\n                  variant='outlined'\r\n                  sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\r\n                >\r\n                  Cancel Editing\r\n                </Button>\r\n                <Button \r\n                  variant=\"contained\" \r\n                  onClick={() => onSaveHeaderFooter(true)}\r\n                  size=\"small\"\r\n                  sx={{ boxShadow: 'none' }}\r\n                >\r\n                  Save Changes\r\n                </Button>\r\n              </>\r\n            )\r\n          : (\r\n            <>\r\n              <Button\r\n                onClick={() => setIsEditingHeaderFooter(true)}\r\n                size=\"small\"\r\n                variant='outlined'\r\n                sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\r\n                startIcon={<Edit fontSize='small'/>}\r\n                disabled={preview}\r\n              >\r\n                Edit Header/Footer\r\n              </Button>\r\n              <Button\r\n                onClick={onPreview}\r\n                size=\"small\"\r\n                variant='outlined'\r\n                sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\r\n                startIcon={preview ? <EyeOff fontSize='small'/> : <Eye fontSize='small'/>}\r\n                disabled={!sections?.length}\r\n              >\r\n                Preview\r\n              </Button>\r\n              <Button \r\n                variant=\"contained\" \r\n                onClick={onSave}\r\n                size=\"small\"\r\n                sx={{ boxShadow: 'none' }}\r\n                disabled={!sections?.length}\r\n              >\r\n                Save\r\n              </Button>\r\n            </>\r\n          )}\r\n        </Stack>\r\n      </Toolbar>\r\n    </AppBar>\r\n  );\r\n};\r\n\r\nexport default EditorHeader;"],"names":["onSave","onPreview","preview","sections","isEditingHeaderFooter","setIsEditingHeaderFooter","onSaveHeaderFooter","modulePath","type","mode","templateData","ROUTES","templateRoutes","jsx","AppBar","position","color","elevation","sx","borderColor","bgcolor","children","jsxs","Toolbar","variant","justifyContent","p","Box","display","alignItems","gap","Link","component","RouterLink","to","LIST","underline","fontSize","Typography","weight","name","Fragment","Stack","direction","spacing","Button","onClick","size","theme","palette","secondary","boxShadow","startIcon","Edit","disabled","EyeOff","Eye","length"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/components/EditorHeader.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\n/* eslint-disable unused-imports/no-unused-vars */\nimport React from 'react';\nimport { \n  AppBar,\n  Toolbar,\n  Box,\n  Link,\n  Stack,\n} from '@mui/material';\nimport Button from '../../../components/button/button';\nimport Typography from '../../../components/typography/typography';\nimport { Edit, Eye, EyeOff } from '../../../components/icons';\nimport { Link as RouterLink } from 'react-router-dom';\nimport { templateRoutes } from '../utils/common';\nimport { EnhancedSectionData } from '../types/editor';\n\ninterface EditorHeaderProps {\n  onSave: () => void;\n  onPreview: () => void;\n  preview: boolean;\n  sections: EnhancedSectionData[];\n  isEditingHeaderFooter: boolean;\n  setIsEditingHeaderFooter: (value: boolean) => void;\n  onSaveHeaderFooter: (value: boolean) => void;\n  modulePath: string;\n  type: string;\n  mode: 'add' | 'edit';\n  templateData: Record<string, any> | null;\n}\n\nconst EditorHeader: React.FC<EditorHeaderProps> = ({ \n  onSave, \n  onPreview, \n  preview, \n  sections, \n  isEditingHeaderFooter, \n  setIsEditingHeaderFooter, \n  onSaveHeaderFooter, \n  modulePath, \n  type,\n  mode = 'add',\n  templateData\n}) => {\n  const ROUTES = templateRoutes(modulePath, type);\n  return (\n    <AppBar \n      position=\"static\" \n      color=\"default\" \n      elevation={0} \n      sx={{ \n        borderColor: 'divider',\n        bgcolor: 'background.paper'\n      }}\n    >\n      <Toolbar variant=\"dense\" sx={{ justifyContent: 'space-between' ,p:3 }}>\n        <Box sx={{ display: 'flex', alignItems: 'center', gap: 1}}>\n          <Link\n            component={RouterLink}\n            to={ROUTES.LIST}\n            underline=\"hover\" \n            color=\"text.secondary\" \n            sx={{ fontSize: '0.875rem' }}\n          >\n            <Typography type=\"s5\" color='theme.secondary.800'>{type === 'email' ? 'Emails' : 'PDF'}</Typography>\n          </Link>\n          <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>/</Typography>\n          <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>\n            { mode == 'add' ? 'Add New' : 'Edit' } Template\n          </Typography>\n          {templateData && templateData?.name &&\n            <>\n              <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>/</Typography>\n              <Typography type=\"s5\" weight='medium' color='theme.secondary.1000'>\n                {templateData?.name}\n              </Typography>\n            </>\n          }\n        </Box>\n        \n        <Stack direction=\"row\" spacing={1}>\n          {isEditingHeaderFooter ?\n            (\n              <>\n                <Button\n                  onClick={() => setIsEditingHeaderFooter(false)}\n                  size=\"small\"\n                  variant='outlined'\n                  sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\n                >\n                  Cancel Editing\n                </Button>\n                <Button \n                  variant=\"contained\" \n                  onClick={() => onSaveHeaderFooter(true)}\n                  size=\"small\"\n                  sx={{ boxShadow: 'none' }}\n                >\n                  Save Changes\n                </Button>\n              </>\n            )\n          : (\n            <>\n              <Button\n                onClick={() => setIsEditingHeaderFooter(true)}\n                size=\"small\"\n                variant='outlined'\n                sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\n                startIcon={<Edit fontSize='small'/>}\n                disabled={preview}\n              >\n                Edit Header/Footer\n              </Button>\n              <Button\n                onClick={onPreview}\n                size=\"small\"\n                variant='outlined'\n                sx={(theme) => ({ color: `${theme.palette.theme.secondary[1000]} !important` })}\n                startIcon={preview ? <EyeOff fontSize='small'/> : <Eye fontSize='small'/>}\n                disabled={!sections?.length}\n              >\n                Preview\n              </Button>\n              <Button \n                variant=\"contained\" \n                onClick={onSave}\n                size=\"small\"\n                sx={{ boxShadow: 'none' }}\n                disabled={!sections?.length}\n              >\n                Save\n              </Button>\n            </>\n          )}\n        </Stack>\n      </Toolbar>\n    </AppBar>\n  );\n};\n\nexport default EditorHeader;"],"names":["onSave","onPreview","preview","sections","isEditingHeaderFooter","setIsEditingHeaderFooter","onSaveHeaderFooter","modulePath","type","mode","templateData","ROUTES","templateRoutes","jsx","AppBar","position","color","elevation","sx","borderColor","bgcolor","children","jsxs","Toolbar","variant","justifyContent","p","Box","display","alignItems","gap","Link","component","RouterLink","to","LIST","underline","fontSize","Typography","weight","name","Fragment","Stack","direction","spacing","Button","onClick","size","theme","palette","secondary","boxShadow","startIcon","Edit","disabled","EyeOff","Eye","length"],"mappings":"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"}

package/dist/views/template-editor/components/EditorSection/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/template-editor/components/EditorSection.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React, { useRef, useState, lazy, Suspense, useCallback, useMemo } from 'react';\r\nimport { useDraggable, useDroppable } from '@dnd-kit/core';\r\nimport {\r\n\tBox,\r\n\tPaper,\r\n\tMenuItem,\r\n\tFormControl,\r\n\tIconButton,\r\n\tFade,\r\n\tFormControlLabel,\r\n\tSkeleton\r\n} from '@mui/material';\r\nimport DragIndicatorIcon from '@mui/icons-material/DragIndicator';\r\nimport SplitIcon from '@mui/icons-material/CallSplit';\r\nimport { SectionData } from '../types/editor';\r\nimport { Edit, Save, Trash } from '../../../components/icons';\r\nimport Select from '../../../components/select/select';\r\nimport Typography from '../../../components/typography/typography';\r\nimport EditSectionModal from '../edit-section-modal/edit-section-modal';\r\nimport Checkbox from '../../../components/checkbox/checkbox';\r\nimport Chip from '../../../components/chip/chip';\r\nimport Close from '@mui/icons-material/Close';\r\nimport { useCKEditorStyleExtractor } from '../utils/style-extractor';\r\n\r\nconst CustomEditor = lazy(() => import('../../../components/editor/custom-editor'));\r\n\r\ninterface EditorSectionProps {\r\n\tsection: SectionData;\r\n\tisSelected: boolean;\r\n\tisDragging: boolean;\r\n\tisOver: boolean;\r\n\tonSelect: () => void;\r\n\tonUpdate: (content: string, options?: any) => void;\r\n\tonSplit: (content1: string, content2: string) => void;\r\n\tonDelete: () => void;\r\n\tplaceholders: Array<{ value: string; label: string }>;\r\n\tsetIsSectionEditing:(value: boolean)=> void;\r\n}\r\n\r\nconst editableSections = ['text', 'text-block', 'heading', 'heading-1', 'heading-2', 'heading-3', 'heading-4'];\r\n\r\nconst EditorSection: React.FC<EditorSectionProps> = React.memo(({\r\n\tsection,\r\n\tisSelected,\r\n\tisDragging,\r\n\tisOver,\r\n\tonSelect,\r\n\tonUpdate,\r\n\tonSplit,\r\n\tonDelete,\r\n\tplaceholders,\r\n\tsetIsSectionEditing\r\n}) => {\r\n\tconst { extractStyles, getSingleStyles } = useCKEditorStyleExtractor();\r\n\r\n\tconst {\r\n\t\tattributes,\r\n\t\tlisteners,\r\n\t\tsetNodeRef: setDraggableRef,\r\n\t\ttransform\r\n\t} = useDraggable({ id: section.id });\r\n\r\n\tconst { setNodeRef: setDroppableRef } = useDroppable({ id: section.id });\r\n\tconst [isEditing, setIsEditing] = useState(false);\r\n\tconst [isHovered, setIsHovered] = useState(false);\r\n\tconst [isOpenEditSectionModal, setIsOpenEditSectionModal] = useState(false);\r\n\tconst [isEditedFromSource, setIsEditedFromSource] = useState(Boolean(section?.is_edited_from_source));\r\n\tconst editorRef = useRef<any>(null);\r\n\tconst mouseHoverTimeoutRef = useRef<number | null>(null);\r\n\r\n\t// Memoize style calculation\r\n\tconst style = useMemo(() => {\r\n\t\treturn transform\r\n\t\t\t? {\r\n\t\t\t\t\ttransform: `translate3d(${transform.x}px, ${transform.y}px, 0)`,\r\n\t\t\t\t\ttransition: 'none'\r\n\t\t\t\t}\r\n\t\t\t: { transition: 'all 0.2s ease' };\r\n\t}, [transform]);\r\n\r\n\t// Memoize sx prop for Paper to prevent re-creation\r\n\tconst paperSx = useMemo(() => ({\r\n\t\tposition: 'relative',\r\n\t\tborder: '1px dashed',\r\n\t\tborderColor: isSelected ? 'primary.main' : isOver ? 'primary.main' : 'grey.400',\r\n\t\tborderRadius: 1,\r\n\t\tbgcolor: 'white',\r\n\t\topacity: isDragging ? 0.7 : 1,\r\n\t\tboxShadow: 'none',\r\n\t\ttransition: 'all 0.2s ease',\r\n\t\t'&:hover': {\r\n\t\t\tboxShadow: 'none'\r\n\t\t},\r\n\t\t...(isOver && { borderColor: 'primary.main', boxShadow: 'none' })\r\n\t}), [isSelected, isOver, isDragging]);\r\n\r\n\t// Memoize merged ref to prevent re-creation\r\n\tconst mergedRef = useCallback((node: HTMLElement | null) => {\r\n\t\tsetDraggableRef(node);\r\n\t\tsetDroppableRef(node);\r\n\t}, [setDraggableRef, setDroppableRef]);\r\n\r\n\t// Memoize event handlers\r\n\tconst handleDblClick = useCallback(() => {\r\n\t\tif (editableSections.includes(section.type)) {\r\n\t\t\thandleEditing();\r\n\t\t}\r\n\t}, [section.type]);\r\n\r\n\tconst handleEditing = useCallback(() => {\r\n\t\tif (section?.isSplitPair) {\r\n\t\t\tsetIsOpenEditSectionModal(true);\r\n\t\t} else {\r\n\t\t\tsetIsEditing(true);\r\n\t\t\tsetIsSectionEditing(true);\r\n\t\t}\r\n\t}, [section?.isSplitPair]);\r\n\r\n\tconst handleEditorReady = useCallback((editor: any) => {\r\n\t\teditorRef.current = editor;\r\n\t}, []);\r\n\r\n\tconst handleSave = useCallback((e) => {\r\n\t\te.stopPropagation();\r\n\t\tif (editorRef.current) {\r\n\t\t\tconst content = editorRef.current.getData();\r\n\t\t\tconst styles = extractStyles(section.content, {\r\n\t\t\t\tincludeTagStyles: true,\r\n\t\t\t\tincludeInlineStyles: true,\r\n\t\t\t\tmergeNestedStyles: true,\r\n\t\t\t\tfilterEmptyStyles: true\r\n\t\t\t});\r\n\t\t\tconst single = getSingleStyles(styles);\r\n\t\t\t// Merge styles safely\r\n\t\t\tconst mergedStyles = {\r\n\t\t\t\t...(section.attributes?.styles || {}),\r\n\t\t\t\t...single\r\n\t\t\t};\r\n\t\r\n\t\t\t// Merge attributes, giving priority to new props\r\n\t\t\tconst mergedAttributes = {\r\n\t\t\t\t...(section.attributes || {}),\r\n\t\t\t\tstyles: mergedStyles,\r\n\t\t\t};\r\n\t\t\tonUpdate(content, { is_edited_from_source: isEditedFromSource, attributes: mergedAttributes });\r\n\t\t}\r\n\t\tsetIsEditing(false);\r\n\t\tsetIsSectionEditing(false)\r\n\t\tsetIsOpenEditSectionModal(false);\r\n\t}, [onUpdate, isEditedFromSource]);\r\n\r\n\tconst handleSplit = useCallback(() => {\r\n\t\tconst content = section.content || '';\r\n\t\tconst firstHalf = content;\r\n\t\tconst secondHalf = '';\r\n\t\tonSplit(firstHalf, secondHalf);\r\n\t}, [section.content, onSplit]);\r\n\r\n\tconst handleAddPlaceholder = useCallback((placeholder: string) => {\r\n\t\tif (editorRef.current) {\r\n\t\t\tconst viewFragment = editorRef.current.data.processor.toView(\r\n\t\t\t\t`{{${placeholder}}}`\r\n\t\t\t);\r\n\t\t\tconst modelFragment = editorRef.current.data.toModel(viewFragment);\r\n\t\t\teditorRef.current.model.insertContent(modelFragment);\r\n\t\t}\r\n\t}, []);\r\n\r\n\tconst handleMouseEnter = useCallback(() => {\r\n\t\tif (mouseHoverTimeoutRef.current !== null) {\r\n\t\t\twindow.clearTimeout(mouseHoverTimeoutRef.current);\r\n\t\t}\r\n\t\tmouseHoverTimeoutRef.current = window.setTimeout(() => {\r\n\t\t\tsetIsHovered(true);\r\n\t\t}, 50);\r\n\t}, []);\r\n\r\n\tconst handleMouseLeave = useCallback(() => {\r\n\t\tif (mouseHoverTimeoutRef.current !== null) {\r\n\t\t\twindow.clearTimeout(mouseHoverTimeoutRef.current);\r\n\t\t}\r\n\t\tmouseHoverTimeoutRef.current = window.setTimeout(() => {\r\n\t\t\tsetIsHovered(false);\r\n\t\t}, 50);\r\n\t}, []);\r\n\r\n\tconst handleClick = useCallback((e) => {\r\n\t\te.stopPropagation();\r\n\t\tonSelect();\r\n\t}, [onSelect]);\r\n\r\n\tconst handleDeleteClick = useCallback((e) => {\r\n\t\te.stopPropagation();\r\n\t\tonDelete();\r\n\t}, [onDelete]);\r\n\r\n\tconst handleCancelEdit = useCallback(() => {\r\n\t\tsetIsEditing(false);\r\n\t\tsetIsSectionEditing(false)\r\n\t}, []);\r\n\r\n\tconst handleCheckboxChange = useCallback((e) => {\r\n\t\tsetIsEditedFromSource(e.target.checked);\r\n\t}, []);\r\n\r\n\tconst handleSelectChange = useCallback((e) => {\r\n\t\tif (e.target.value) {\r\n\t\t\thandleAddPlaceholder(e.target.value as string);\r\n\t\t\te.target.value = '';\r\n\t\t}\r\n\t}, [handleAddPlaceholder]);\r\n\r\n\t// Cleanup function for hover timeout\r\n\tReact.useEffect(() => {\r\n\t\treturn () => {\r\n\t\t\tif (mouseHoverTimeoutRef.current !== null) {\r\n\t\t\t\twindow.clearTimeout(mouseHoverTimeoutRef.current);\r\n\t\t\t}\r\n\t\t};\r\n\t}, []);\r\n\r\n\t// Memoize content rendering to prevent unnecessary re-renders\r\n\tconst contentRenderer = useMemo(() => {\r\n\t\tif (isEditing) {\r\n\t\t\treturn (\r\n\t\t\t\t<Suspense fallback={<Skeleton />}>\r\n\t\t\t\t\t<CustomEditor \r\n\t\t\t\t\t\teditorRef={editorRef}\r\n\t\t\t\t\t\thandleEditorReady={handleEditorReady} \r\n\t\t\t\t\t\tdata={section.content}\r\n\t\t\t\t\t\tonError={(error) => console.error('Editor error:', error)}\r\n\t\t\t\t\t/>\r\n\t\t\t\t</Suspense>\r\n\t\t\t);\r\n\t\t}\r\n\t\t\r\n\t\treturn (\r\n\t\t\t<Box\r\n\t\t\t\tdangerouslySetInnerHTML={{ __html: section.content }}\r\n\t\t\t\tsx={{\r\n\t\t\t\t\tposition: 'relative',\r\n\t\t\t\t\tpy: section.type === 'divider' ? 1 : 0,\r\n\t\t\t\t\tlineHeight: 1.6,\r\n\t\t\t\t\t'& p': { margin: 0 }\r\n\t\t\t\t}}\r\n\t\t\t/>\r\n\t\t);\r\n\t}, [isEditing, section.content, section.type, handleEditorReady]);\r\n\r\n\t// Memoize placeholder options\r\n\tconst placeholderOptions = useMemo(() => \r\n\t\tplaceholders.map((option) => (\r\n\t\t\t<MenuItem key={option.value} value={option.value}>\r\n\t\t\t\t<Typography type='s4' color='theme.secondary.1000'>{option.label}</Typography>\r\n\t\t\t</MenuItem>\r\n\t\t))\r\n\t, [placeholders]);\r\n\r\n\treturn (\r\n\t\t<Paper\r\n\t\t\tref={mergedRef}\r\n\t\t\tstyle={style}\r\n\t\t\televation={isHovered || isSelected ? 3 : 1}\r\n\t\t\tsx={paperSx}\r\n\t\t\tonClick={handleClick}\r\n\t\t\tonDoubleClick={handleDblClick}\r\n\t\t\tonMouseEnter={handleMouseEnter}\r\n\t\t\tonMouseLeave={handleMouseLeave}>\r\n\t\t\t{isOver && !isDragging && (\r\n\t\t\t\t<Box\r\n\t\t\t\t\tsx={{\r\n\t\t\t\t\t\tposition: 'absolute',\r\n\t\t\t\t\t\ttop: 0,\r\n\t\t\t\t\t\tleft: 0,\r\n\t\t\t\t\t\tright: 0,\r\n\t\t\t\t\t\tbottom: 0,\r\n\t\t\t\t\t\tborder: '2px dashed',\r\n\t\t\t\t\t\tborderColor: 'primary.main',\r\n\t\t\t\t\t\tborderRadius: 1,\r\n\t\t\t\t\t\tbgcolor: 'rgba(25, 118, 210, 0.04)',\r\n\t\t\t\t\t\tzIndex: 10,\r\n\t\t\t\t\t\tdisplay: 'flex',\r\n\t\t\t\t\t\talignItems: 'center',\r\n\t\t\t\t\t\tjustifyContent: 'center',\r\n\t\t\t\t\t\tpointerEvents: 'none'\r\n\t\t\t\t\t}}\r\n\t\t\t\t>\r\n\t\t\t\t\t<Typography type='s2' color='primary' weight='medium'>Drop here</Typography>\r\n\t\t\t\t</Box>\r\n\t\t\t)}\r\n\t\t\t<Box\r\n\t\t\t\tsx={{\r\n\t\t\t\t\tbgcolor: 'grey.50',\r\n\t\t\t\t\tp: 1,\r\n\t\t\t\t\tdisplay: 'flex',\r\n\t\t\t\t\talignItems: 'center',\r\n\t\t\t\t\tjustifyContent: 'space-between',\r\n\t\t\t\t\tborderBottom: '1px solid',\r\n\t\t\t\t\tborderColor: 'grey.200'\r\n\t\t\t\t}}>\r\n\t\t\t\t<Box\r\n\t\t\t\t\t{...listeners}\r\n\t\t\t\t\t{...attributes}\r\n\t\t\t\t\tsx={{\r\n\t\t\t\t\t\tdisplay: 'flex',\r\n\t\t\t\t\t\talignItems: 'center',\r\n\t\t\t\t\t\tcursor: 'grab',\r\n\t\t\t\t\t\tpx: 1,\r\n\t\t\t\t\t\tpy: 0.5,\r\n\t\t\t\t\t\tborderRadius: 1,\r\n\t\t\t\t\t\ttransition: 'background-color 0.2s ease',\r\n\t\t\t\t\t\t'&:hover': { bgcolor: 'grey.100' },\r\n\t\t\t\t\t\t'&:active': { cursor: 'grabbing' }\r\n\t\t\t\t\t}}>\r\n\t\t\t\t\t<DragIndicatorIcon\r\n\t\t\t\t\t\tsx={{ color: 'grey.600', fontSize: '1.2rem', mr: 0.5 }}\r\n\t\t\t\t\t/>\r\n\t\t\t\t\t<Typography type='s3' color='theme.secondary.600' weight='medium'>Move</Typography>\r\n\t\t\t\t</Box>\r\n\t\t\t\t<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\r\n\t\t\t\t\t{isEditing ? (\r\n\t\t\t\t\t\t<>\r\n\t\t\t\t\t\t\t<FormControlLabel control={\r\n\t\t\t\t\t\t\t\t<Checkbox \r\n\t\t\t\t\t\t\t\t\tonClick={handleCheckboxChange} \r\n\t\t\t\t\t\t\t\t\tdefaultChecked={isEditedFromSource}/>} \r\n\t\t\t\t\t\t\t\t\tlabel={<Typography type='s2' color='theme.secondary.1000'>Edited from source</Typography>} />\r\n\t\t\t\t\t\t\t<FormControl size='small' sx={{ minWidth: 160 }}>\r\n\t\t\t\t\t\t\t\t<Select\r\n\t\t\t\t\t\t\t\t\tdisplayEmpty\r\n\t\t\t\t\t\t\t\t\tvalue=''\r\n\t\t\t\t\t\t\t\t\tsize='small'\r\n\t\t\t\t\t\t\t\t\trenderValue={() => 'Add placeholder...'}\r\n\t\t\t\t\t\t\t\t\tsx={{\r\n\t\t\t\t\t\t\t\t\t\tbgcolor: 'white',\r\n\t\t\t\t\t\t\t\t\t\tborderRadius: 1,\r\n\t\t\t\t\t\t\t\t\t\t'& .MuiSelect-select': { py: 0.75 }\r\n\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t\tonChange={handleSelectChange}>\r\n\t\t\t\t\t\t\t\t\t{placeholderOptions}\r\n\t\t\t\t\t\t\t\t</Select>\r\n\t\t\t\t\t\t\t</FormControl>\r\n\t\t\t\t\t\t\t<Box>\r\n\t\t\t\t\t\t\t\t<IconButton size='small' onClick={handleSave}>\r\n\t\t\t\t\t\t\t\t\t<Save fontSize='small' color='inherit' />\r\n\t\t\t\t\t\t\t\t</IconButton>\r\n\t\t\t\t\t\t\t\t<IconButton size='small' onClick={handleCancelEdit} color='error'>\r\n\t\t\t\t\t\t\t\t\t<Close fontSize='small' color='inherit' />\r\n\t\t\t\t\t\t\t\t</IconButton>\r\n\t\t\t\t\t\t\t</Box>\r\n\t\t\t\t\t\t</>\r\n\t\t\t\t\t) : (\r\n\t\t\t\t\t\t<Fade in={isHovered || isSelected} timeout={200}>\r\n\t\t\t\t\t\t\t<Box sx={{ display: 'flex', gap: 0.5 }}>\r\n\t\t\t\t\t\t\t\t{section?.is_edited_from_source && (\r\n\t\t\t\t\t\t\t\t\t<Chip\r\n\t\t\t\t\t\t\t\t\t\tlabel=\"Edited From Source\"\r\n\t\t\t\t\t\t\t\t\t\tsize=\"small\"\r\n\t\t\t\t\t\t\t\t\t\tsx={(theme) => ({ \r\n\t\t\t\t\t\t\t\t\t\t\ttextTransform: 'capitalize', \r\n\t\t\t\t\t\t\t\t\t\t\tbackgroundColor: theme.palette.theme?.tertiary1?.[200], \r\n\t\t\t\t\t\t\t\t\t\t\tcolor: theme.palette.theme?.tertiary1?.[900]\r\n\t\t\t\t\t\t\t\t\t\t})}\r\n\t\t\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t{editableSections.includes(section.type) &&\r\n\t\t\t\t\t\t\t\t\t<IconButton\r\n\t\t\t\t\t\t\t\t\t\tsize='small'\r\n\t\t\t\t\t\t\t\t\t\tonClick={handleEditing}\r\n\t\t\t\t\t\t\t\t\t\tsx={{\r\n\t\t\t\t\t\t\t\t\t\t\tbgcolor: 'grey.100',\r\n\t\t\t\t\t\t\t\t\t\t\t'&:hover': { bgcolor: 'grey.200' }\r\n\t\t\t\t\t\t\t\t\t\t}}>\r\n\t\t\t\t\t\t\t\t\t\t<Edit fontSize='small' sx={{ color: 'theme.secondary.1000' }} />\r\n\t\t\t\t\t\t\t\t\t</IconButton>\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t<IconButton\r\n\t\t\t\t\t\t\t\t\tsize='small'\r\n\t\t\t\t\t\t\t\t\tonClick={handleSplit}\r\n\t\t\t\t\t\t\t\t\tsx={{\r\n\t\t\t\t\t\t\t\t\t\tbgcolor: 'grey.100',\r\n\t\t\t\t\t\t\t\t\t\t'&:hover': { bgcolor: 'grey.200' },\r\n\t\t\t\t\t\t\t\t\t\topacity: section?.splitWidth === 25 ? 0.5 : 1\r\n\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t\tdisabled={section?.splitWidth === 25}\r\n\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<SplitIcon fontSize='small' color='primary' />\r\n\t\t\t\t\t\t\t\t</IconButton>\r\n\t\t\t\t\t\t\t\t<IconButton\r\n\t\t\t\t\t\t\t\t\tsize='small'\r\n\t\t\t\t\t\t\t\t\tonClick={handleDeleteClick}\r\n\t\t\t\t\t\t\t\t\tsx={{\r\n\t\t\t\t\t\t\t\t\t\tbgcolor: 'grey.100',\r\n\t\t\t\t\t\t\t\t\t\t'&:hover': { bgcolor: 'grey.200' }\r\n\t\t\t\t\t\t\t\t\t}}>\r\n\t\t\t\t\t\t\t\t\t<Trash fontSize='small' sx={{ color: 'theme.error.500' }} />\r\n\t\t\t\t\t\t\t\t</IconButton>\r\n\t\t\t\t\t\t\t</Box>\r\n\t\t\t\t\t\t</Fade>\r\n\t\t\t\t\t)}\r\n\t\t\t\t</Box>\r\n\t\t\t</Box>\r\n\t\t\t<Box sx={{ p: 3, bgcolor: 'white' }}>\r\n\t\t\t\t<style>\r\n           {`\r\n             .ck.ck-toolbar.ck-toolbar_floating {\r\n               display: none;\r\n             }\r\n             .ck.ck-toolbar.ck-toolbar_floating.visible {\r\n               display: flex;\r\n             }\r\n\t\t\t\t\t\ta {\r\n\t\t\t\t\t\t\tcolor: #007bff !important;\r\n\t\t\t\t\t\t\ttext-decoration: none !important;\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t\ta:hover {\r\n\t\t\t\t\t\t\ttext-decoration: underline;\r\n\t\t\t\t\t\t}\r\n           `}\r\n         </style>\r\n\t\t\t\t{contentRenderer}\r\n\t\t\t</Box>\r\n\t\t\t{isOpenEditSectionModal && <EditSectionModal\r\n\t\t\t\tisOpen={isOpenEditSectionModal}\r\n\t\t\t\tsetIsOpen={setIsOpenEditSectionModal}\r\n\t\t\t\tplaceholders={placeholders}\r\n\t\t\t\thandleSave={handleSave}\r\n\t\t\t\thandleAddPlaceholder={handleAddPlaceholder}\r\n\t\t\t\thandleEditorReady={handleEditorReady}\r\n\t\t\t\tsection={section}\r\n\t\t\t/>}\r\n\t\t</Paper>\r\n\t);\r\n});\r\n\r\nEditorSection.displayName = 'EditorSection';\r\n\r\nexport default EditorSection;"],"names":["React","DragIndicatorIcon","Close","SplitIcon"],"mappings":"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"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/template-editor/components/EditorSection.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\n/* eslint-disable unused-imports/no-unused-vars */\nimport React, { useRef, useState, lazy, Suspense, useCallback, useMemo } from 'react';\nimport { useDraggable, useDroppable } from '@dnd-kit/core';\nimport {\n\tBox,\n\tPaper,\n\tMenuItem,\n\tFormControl,\n\tIconButton,\n\tFade,\n\tFormControlLabel,\n\tSkeleton\n} from '@mui/material';\nimport DragIndicatorIcon from '@mui/icons-material/DragIndicator';\nimport SplitIcon from '@mui/icons-material/CallSplit';\nimport { SectionData } from '../types/editor';\nimport { Edit, Save, Trash } from '../../../components/icons';\nimport Select from '../../../components/select/select';\nimport Typography from '../../../components/typography/typography';\nimport EditSectionModal from '../edit-section-modal/edit-section-modal';\nimport Checkbox from '../../../components/checkbox/checkbox';\nimport Chip from '../../../components/chip/chip';\nimport Close from '@mui/icons-material/Close';\nimport { useCKEditorStyleExtractor } from '../utils/style-extractor';\n\nconst CustomEditor = lazy(() => import('../../../components/editor/custom-editor'));\n\ninterface EditorSectionProps {\n\tsection: SectionData;\n\tisSelected: boolean;\n\tisDragging: boolean;\n\tisOver: boolean;\n\tonSelect: () => void;\n\tonUpdate: (content: string, options?: any) => void;\n\tonSplit: (content1: string, content2: string) => void;\n\tonDelete: () => void;\n\tplaceholders: Array<{ value: string; label: string }>;\n\tsetIsSectionEditing:(value: boolean)=> void;\n}\n\nconst editableSections = ['text', 'text-block', 'heading', 'heading-1', 'heading-2', 'heading-3', 'heading-4'];\n\nconst EditorSection: React.FC<EditorSectionProps> = React.memo(({\n\tsection,\n\tisSelected,\n\tisDragging,\n\tisOver,\n\tonSelect,\n\tonUpdate,\n\tonSplit,\n\tonDelete,\n\tplaceholders,\n\tsetIsSectionEditing\n}) => {\n\tconst { extractStyles, getSingleStyles } = useCKEditorStyleExtractor();\n\n\tconst {\n\t\tattributes,\n\t\tlisteners,\n\t\tsetNodeRef: setDraggableRef,\n\t\ttransform\n\t} = useDraggable({ id: section.id });\n\n\tconst { setNodeRef: setDroppableRef } = useDroppable({ id: section.id });\n\tconst [isEditing, setIsEditing] = useState(false);\n\tconst [isHovered, setIsHovered] = useState(false);\n\tconst [isOpenEditSectionModal, setIsOpenEditSectionModal] = useState(false);\n\tconst [isEditedFromSource, setIsEditedFromSource] = useState(Boolean(section?.is_edited_from_source));\n\tconst editorRef = useRef<any>(null);\n\tconst mouseHoverTimeoutRef = useRef<number | null>(null);\n\n\t// Memoize style calculation\n\tconst style = useMemo(() => {\n\t\treturn transform\n\t\t\t? {\n\t\t\t\t\ttransform: `translate3d(${transform.x}px, ${transform.y}px, 0)`,\n\t\t\t\t\ttransition: 'none'\n\t\t\t\t}\n\t\t\t: { transition: 'all 0.2s ease' };\n\t}, [transform]);\n\n\t// Memoize sx prop for Paper to prevent re-creation\n\tconst paperSx = useMemo(() => ({\n\t\tposition: 'relative',\n\t\tborder: '1px dashed',\n\t\tborderColor: isSelected ? 'primary.main' : isOver ? 'primary.main' : 'grey.400',\n\t\tborderRadius: 1,\n\t\tbgcolor: 'white',\n\t\topacity: isDragging ? 0.7 : 1,\n\t\tboxShadow: 'none',\n\t\ttransition: 'all 0.2s ease',\n\t\t'&:hover': {\n\t\t\tboxShadow: 'none'\n\t\t},\n\t\t...(isOver && { borderColor: 'primary.main', boxShadow: 'none' })\n\t}), [isSelected, isOver, isDragging]);\n\n\t// Memoize merged ref to prevent re-creation\n\tconst mergedRef = useCallback((node: HTMLElement | null) => {\n\t\tsetDraggableRef(node);\n\t\tsetDroppableRef(node);\n\t}, [setDraggableRef, setDroppableRef]);\n\n\t// Memoize event handlers\n\tconst handleDblClick = useCallback(() => {\n\t\tif (editableSections.includes(section.type)) {\n\t\t\thandleEditing();\n\t\t}\n\t}, [section.type]);\n\n\tconst handleEditing = useCallback(() => {\n\t\tif (section?.isSplitPair) {\n\t\t\tsetIsOpenEditSectionModal(true);\n\t\t} else {\n\t\t\tsetIsEditing(true);\n\t\t\tsetIsSectionEditing(true);\n\t\t}\n\t}, [section?.isSplitPair]);\n\n\tconst handleEditorReady = useCallback((editor: any) => {\n\t\teditorRef.current = editor;\n\t}, []);\n\n\tconst handleSave = useCallback((e) => {\n\t\te.stopPropagation();\n\t\tif (editorRef.current) {\n\t\t\tconst content = editorRef.current.getData();\n\t\t\tconst styles = extractStyles(section.content, {\n\t\t\t\tincludeTagStyles: true,\n\t\t\t\tincludeInlineStyles: true,\n\t\t\t\tmergeNestedStyles: true,\n\t\t\t\tfilterEmptyStyles: true\n\t\t\t});\n\t\t\tconst single = getSingleStyles(styles);\n\t\t\t// Merge styles safely\n\t\t\tconst mergedStyles = {\n\t\t\t\t...(section.attributes?.styles || {}),\n\t\t\t\t...single\n\t\t\t};\n\t\n\t\t\t// Merge attributes, giving priority to new props\n\t\t\tconst mergedAttributes = {\n\t\t\t\t...(section.attributes || {}),\n\t\t\t\tstyles: mergedStyles,\n\t\t\t};\n\t\t\tonUpdate(content, { is_edited_from_source: isEditedFromSource, attributes: mergedAttributes });\n\t\t}\n\t\tsetIsEditing(false);\n\t\tsetIsSectionEditing(false)\n\t\tsetIsOpenEditSectionModal(false);\n\t}, [onUpdate, isEditedFromSource]);\n\n\tconst handleSplit = useCallback(() => {\n\t\tconst content = section.content || '';\n\t\tconst firstHalf = content;\n\t\tconst secondHalf = '';\n\t\tonSplit(firstHalf, secondHalf);\n\t}, [section.content, onSplit]);\n\n\tconst handleAddPlaceholder = useCallback((placeholder: string) => {\n\t\tif (editorRef.current) {\n\t\t\tconst viewFragment = editorRef.current.data.processor.toView(\n\t\t\t\t`{{${placeholder}}}`\n\t\t\t);\n\t\t\tconst modelFragment = editorRef.current.data.toModel(viewFragment);\n\t\t\teditorRef.current.model.insertContent(modelFragment);\n\t\t}\n\t}, []);\n\n\tconst handleMouseEnter = useCallback(() => {\n\t\tif (mouseHoverTimeoutRef.current !== null) {\n\t\t\twindow.clearTimeout(mouseHoverTimeoutRef.current);\n\t\t}\n\t\tmouseHoverTimeoutRef.current = window.setTimeout(() => {\n\t\t\tsetIsHovered(true);\n\t\t}, 50);\n\t}, []);\n\n\tconst handleMouseLeave = useCallback(() => {\n\t\tif (mouseHoverTimeoutRef.current !== null) {\n\t\t\twindow.clearTimeout(mouseHoverTimeoutRef.current);\n\t\t}\n\t\tmouseHoverTimeoutRef.current = window.setTimeout(() => {\n\t\t\tsetIsHovered(false);\n\t\t}, 50);\n\t}, []);\n\n\tconst handleClick = useCallback((e) => {\n\t\te.stopPropagation();\n\t\tonSelect();\n\t}, [onSelect]);\n\n\tconst handleDeleteClick = useCallback((e) => {\n\t\te.stopPropagation();\n\t\tonDelete();\n\t}, [onDelete]);\n\n\tconst handleCancelEdit = useCallback(() => {\n\t\tsetIsEditing(false);\n\t\tsetIsSectionEditing(false)\n\t}, []);\n\n\tconst handleCheckboxChange = useCallback((e) => {\n\t\tsetIsEditedFromSource(e.target.checked);\n\t}, []);\n\n\tconst handleSelectChange = useCallback((e) => {\n\t\tif (e.target.value) {\n\t\t\thandleAddPlaceholder(e.target.value as string);\n\t\t\te.target.value = '';\n\t\t}\n\t}, [handleAddPlaceholder]);\n\n\t// Cleanup function for hover timeout\n\tReact.useEffect(() => {\n\t\treturn () => {\n\t\t\tif (mouseHoverTimeoutRef.current !== null) {\n\t\t\t\twindow.clearTimeout(mouseHoverTimeoutRef.current);\n\t\t\t}\n\t\t};\n\t}, []);\n\n\t// Memoize content rendering to prevent unnecessary re-renders\n\tconst contentRenderer = useMemo(() => {\n\t\tif (isEditing) {\n\t\t\treturn (\n\t\t\t\t<Suspense fallback={<Skeleton />}>\n\t\t\t\t\t<CustomEditor \n\t\t\t\t\t\teditorRef={editorRef}\n\t\t\t\t\t\thandleEditorReady={handleEditorReady} \n\t\t\t\t\t\tdata={section.content}\n\t\t\t\t\t\tonError={(error) => console.error('Editor error:', error)}\n\t\t\t\t\t/>\n\t\t\t\t</Suspense>\n\t\t\t);\n\t\t}\n\t\t\n\t\treturn (\n\t\t\t<Box\n\t\t\t\tdangerouslySetInnerHTML={{ __html: section.content }}\n\t\t\t\tsx={{\n\t\t\t\t\tposition: 'relative',\n\t\t\t\t\tpy: section.type === 'divider' ? 1 : 0,\n\t\t\t\t\tlineHeight: 1.6,\n\t\t\t\t\t'& p': { margin: 0 }\n\t\t\t\t}}\n\t\t\t/>\n\t\t);\n\t}, [isEditing, section.content, section.type, handleEditorReady]);\n\n\t// Memoize placeholder options\n\tconst placeholderOptions = useMemo(() => \n\t\tplaceholders.map((option) => (\n\t\t\t<MenuItem key={option.value} value={option.value}>\n\t\t\t\t<Typography type='s4' color='theme.secondary.1000'>{option.label}</Typography>\n\t\t\t</MenuItem>\n\t\t))\n\t, [placeholders]);\n\n\treturn (\n\t\t<Paper\n\t\t\tref={mergedRef}\n\t\t\tstyle={style}\n\t\t\televation={isHovered || isSelected ? 3 : 1}\n\t\t\tsx={paperSx}\n\t\t\tonClick={handleClick}\n\t\t\tonDoubleClick={handleDblClick}\n\t\t\tonMouseEnter={handleMouseEnter}\n\t\t\tonMouseLeave={handleMouseLeave}>\n\t\t\t{isOver && !isDragging && (\n\t\t\t\t<Box\n\t\t\t\t\tsx={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\tright: 0,\n\t\t\t\t\t\tbottom: 0,\n\t\t\t\t\t\tborder: '2px dashed',\n\t\t\t\t\t\tborderColor: 'primary.main',\n\t\t\t\t\t\tborderRadius: 1,\n\t\t\t\t\t\tbgcolor: 'rgba(25, 118, 210, 0.04)',\n\t\t\t\t\t\tzIndex: 10,\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tpointerEvents: 'none'\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Typography type='s2' color='primary' weight='medium'>Drop here</Typography>\n\t\t\t\t</Box>\n\t\t\t)}\n\t\t\t<Box\n\t\t\t\tsx={{\n\t\t\t\t\tbgcolor: 'grey.50',\n\t\t\t\t\tp: 1,\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\talignItems: 'center',\n\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\tborderBottom: '1px solid',\n\t\t\t\t\tborderColor: 'grey.200'\n\t\t\t\t}}>\n\t\t\t\t<Box\n\t\t\t\t\t{...listeners}\n\t\t\t\t\t{...attributes}\n\t\t\t\t\tsx={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tcursor: 'grab',\n\t\t\t\t\t\tpx: 1,\n\t\t\t\t\t\tpy: 0.5,\n\t\t\t\t\t\tborderRadius: 1,\n\t\t\t\t\t\ttransition: 'background-color 0.2s ease',\n\t\t\t\t\t\t'&:hover': { bgcolor: 'grey.100' },\n\t\t\t\t\t\t'&:active': { cursor: 'grabbing' }\n\t\t\t\t\t}}>\n\t\t\t\t\t<DragIndicatorIcon\n\t\t\t\t\t\tsx={{ color: 'grey.600', fontSize: '1.2rem', mr: 0.5 }}\n\t\t\t\t\t/>\n\t\t\t\t\t<Typography type='s3' color='theme.secondary.600' weight='medium'>Move</Typography>\n\t\t\t\t</Box>\n\t\t\t\t<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n\t\t\t\t\t{isEditing ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<FormControlLabel control={\n\t\t\t\t\t\t\t\t<Checkbox \n\t\t\t\t\t\t\t\t\tonClick={handleCheckboxChange} \n\t\t\t\t\t\t\t\t\tdefaultChecked={isEditedFromSource}/>} \n\t\t\t\t\t\t\t\t\tlabel={<Typography type='s2' color='theme.secondary.1000'>Edited from source</Typography>} />\n\t\t\t\t\t\t\t<FormControl size='small' sx={{ minWidth: 160 }}>\n\t\t\t\t\t\t\t\t<Select\n\t\t\t\t\t\t\t\t\tdisplayEmpty\n\t\t\t\t\t\t\t\t\tvalue=''\n\t\t\t\t\t\t\t\t\tsize='small'\n\t\t\t\t\t\t\t\t\trenderValue={() => 'Add placeholder...'}\n\t\t\t\t\t\t\t\t\tsx={{\n\t\t\t\t\t\t\t\t\t\tbgcolor: 'white',\n\t\t\t\t\t\t\t\t\t\tborderRadius: 1,\n\t\t\t\t\t\t\t\t\t\t'& .MuiSelect-select': { py: 0.75 }\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonChange={handleSelectChange}>\n\t\t\t\t\t\t\t\t\t{placeholderOptions}\n\t\t\t\t\t\t\t\t</Select>\n\t\t\t\t\t\t\t</FormControl>\n\t\t\t\t\t\t\t<Box>\n\t\t\t\t\t\t\t\t<IconButton size='small' onClick={handleSave}>\n\t\t\t\t\t\t\t\t\t<Save fontSize='small' color='inherit' />\n\t\t\t\t\t\t\t\t</IconButton>\n\t\t\t\t\t\t\t\t<IconButton size='small' onClick={handleCancelEdit} color='error'>\n\t\t\t\t\t\t\t\t\t<Close fontSize='small' color='inherit' />\n\t\t\t\t\t\t\t\t</IconButton>\n\t\t\t\t\t\t\t</Box>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<Fade in={isHovered || isSelected} timeout={200}>\n\t\t\t\t\t\t\t<Box sx={{ display: 'flex', gap: 0.5 }}>\n\t\t\t\t\t\t\t\t{section?.is_edited_from_source && (\n\t\t\t\t\t\t\t\t\t<Chip\n\t\t\t\t\t\t\t\t\t\tlabel=\"Edited From Source\"\n\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\tsx={(theme) => ({ \n\t\t\t\t\t\t\t\t\t\t\ttextTransform: 'capitalize', \n\t\t\t\t\t\t\t\t\t\t\tbackgroundColor: theme.palette.theme?.tertiary1?.[200], \n\t\t\t\t\t\t\t\t\t\t\tcolor: theme.palette.theme?.tertiary1?.[900]\n\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{editableSections.includes(section.type) &&\n\t\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\t\tsize='small'\n\t\t\t\t\t\t\t\t\t\tonClick={handleEditing}\n\t\t\t\t\t\t\t\t\t\tsx={{\n\t\t\t\t\t\t\t\t\t\t\tbgcolor: 'grey.100',\n\t\t\t\t\t\t\t\t\t\t\t'&:hover': { bgcolor: 'grey.200' }\n\t\t\t\t\t\t\t\t\t\t}}>\n\t\t\t\t\t\t\t\t\t\t<Edit fontSize='small' sx={{ color: 'theme.secondary.1000' }} />\n\t\t\t\t\t\t\t\t\t</IconButton>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tsize='small'\n\t\t\t\t\t\t\t\t\tonClick={handleSplit}\n\t\t\t\t\t\t\t\t\tsx={{\n\t\t\t\t\t\t\t\t\t\tbgcolor: 'grey.100',\n\t\t\t\t\t\t\t\t\t\t'&:hover': { bgcolor: 'grey.200' },\n\t\t\t\t\t\t\t\t\t\topacity: section?.splitWidth === 25 ? 0.5 : 1\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tdisabled={section?.splitWidth === 25}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<SplitIcon fontSize='small' color='primary' />\n\t\t\t\t\t\t\t\t</IconButton>\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tsize='small'\n\t\t\t\t\t\t\t\t\tonClick={handleDeleteClick}\n\t\t\t\t\t\t\t\t\tsx={{\n\t\t\t\t\t\t\t\t\t\tbgcolor: 'grey.100',\n\t\t\t\t\t\t\t\t\t\t'&:hover': { bgcolor: 'grey.200' }\n\t\t\t\t\t\t\t\t\t}}>\n\t\t\t\t\t\t\t\t\t<Trash fontSize='small' sx={{ color: 'theme.error.500' }} />\n\t\t\t\t\t\t\t\t</IconButton>\n\t\t\t\t\t\t\t</Box>\n\t\t\t\t\t\t</Fade>\n\t\t\t\t\t)}\n\t\t\t\t</Box>\n\t\t\t</Box>\n\t\t\t<Box sx={{ p: 3, bgcolor: 'white' }}>\n\t\t\t\t<style>\n           {`\n             .ck.ck-toolbar.ck-toolbar_floating {\n               display: none;\n             }\n             .ck.ck-toolbar.ck-toolbar_floating.visible {\n               display: flex;\n             }\n\t\t\t\t\t\ta {\n\t\t\t\t\t\t\tcolor: #007bff !important;\n\t\t\t\t\t\t\ttext-decoration: none !important;\n\t\t\t\t\t\t}\n\t\t\t\t\t\ta:hover {\n\t\t\t\t\t\t\ttext-decoration: underline;\n\t\t\t\t\t\t}\n           `}\n         </style>\n\t\t\t\t{contentRenderer}\n\t\t\t</Box>\n\t\t\t{isOpenEditSectionModal && <EditSectionModal\n\t\t\t\tisOpen={isOpenEditSectionModal}\n\t\t\t\tsetIsOpen={setIsOpenEditSectionModal}\n\t\t\t\tplaceholders={placeholders}\n\t\t\t\thandleSave={handleSave}\n\t\t\t\thandleAddPlaceholder={handleAddPlaceholder}\n\t\t\t\thandleEditorReady={handleEditorReady}\n\t\t\t\tsection={section}\n\t\t\t/>}\n\t\t</Paper>\n\t);\n});\n\nEditorSection.displayName = 'EditorSection';\n\nexport default EditorSection;"],"names":["React","DragIndicatorIcon","Close","SplitIcon"],"mappings":"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"}