@erpsquad/common 1.8.40 → 1.8.41

package/dist/views/form-builder/form-fields/index.js

@@ -1,24 +1,24 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("@mui/material"),i=require("../../../components/form-control/form-builder/form-builder-element/text/index.js"),r=require("../../../components/form-control/form-builder/form-builder-element/checkbox/index.js"),n=require("../../../components/form-control/form-builder/form-builder-element/table/index.js"),o=require("../../../components/form-control/form-builder/form-builder-element/dynamic-element-hoc/index.js"),a=require("../../../components/form-control/form-builder/form-builder-element/radio-button/index.js"),u=require("../../../components/form-control/form-builder/form-builder-element/toggle-button/index.js"),d=require("../../../components/form-control/form-builder/form-builder-element/info/index.js"),s=require("../../../components/form-control/form-builder/form-builder-element/media/index.js"),m=require("../../../components/form-control/form-builder/form-builder-element/time/index.js"),c=require("../../../components/form-control/form-builder/form-builder-element/date/index.js"),f=require("../../../components/form-control/form-builder/form-builder-element/select/index.js"),p=require("../../../components/form-control/form-builder/form-builder-element/phone/index.js");const _=t.memo(({field:_,index:x,gridItemSize:b,activeMember:y,control:j,t:v,element:h,images:g,elementJSON:q,remove:S,move:w,handleElementSelection:E,setElementSwap:M,handleDuplicateElement:V,setSelectedHoc:I,setActiveMember:N})=>{const k=t.useMemo(()=>({activeIndex:y===x,removeElement:S,index:x,onClick:E,swap:w,elementSwap:()=>M(!0),handleDuplicate:V,setElementHoc:()=>{I(""),N(void 0)}}),[y,x,S,E,w,M,V,I,N]),F=t.useMemo(()=>({key:_.id,position:x,placeholder:v(_.placeholder||""),label:v(_.label),formControl:j,name:"message",fieldArrayName:"members",required:_.is_required,formType:"builder",typeOfField:_.type,disabled:!0}),[_.id,_.placeholder,_.label,_.is_required,_.type,x,v,j]),O=t.useCallback(()=>{const{field_type:t}=_;switch(t){case h.text.field_type:/* @__PURE__ */
-return e.jsx(i.default,{...F,type:t,defaultValue:_.default_value,is_multiline:_.is_multiline,min:_.min_length,max:_.max_length});case h.email.field_type:/* @__PURE__ */
-return e.jsx(i.default,{...F,type:t,defaultValue:_.default_value,endIcon:/* @__PURE__ */e.jsx("img",{src:g.sms,alt:"email"})});case h.number.field_type:/* @__PURE__ */
-return e.jsx(i.default,{...F,type:t,defaultValue:_.default_value,min:_.min_length,max:_.max_length,float_step:_.float_step});case h.phone.field_type:/* @__PURE__ */
-return e.jsx(p.default,{...F,type:t,default_value:_.default_value});case h.select.field_type:/* @__PURE__ */
-return e.jsx(f.default,{...F,options:_.options,defaultValue:_.default_value,is_multiselect:_.is_multiselect});case h.date.field_type:/* @__PURE__ */
-return e.jsx(c.default,{...F,defaultValue:_.default_value,is_future_dates_allowed:_.is_future_dates_allowed,is_past_dates_allowed:_.is_past_dates_allowed,disable:!0});case h.time.field_type:/* @__PURE__ */
-return e.jsx(m.default,{...F,option:_.option});case h.url.field_type:/* @__PURE__ */
-return e.jsx(i.default,{...F,type:t,defaultValue:_.default_value,endIcon:/* @__PURE__ */e.jsx("img",{src:g.url,alt:"url"})});case h.currency.field_type:/* @__PURE__ */
-return e.jsx(i.default,{...F,type:t,defaultValue:_.default_value,endIcon:/* @__PURE__ */e.jsx("img",{src:g.dollar,alt:"currency"})});case h.file.field_type:case h.image.field_type:/* @__PURE__ */
-return e.jsx(s.default,{...F,type:t,max_size:_.max_size});case h.geoLocation.field_type:/* @__PURE__ */
-return e.jsx(i.default,{...F,type:t,defaultValue:_.default_value,endIcon:/* @__PURE__ */e.jsx("img",{src:g.location,alt:"location"})});case h.relation.field_type:/* @__PURE__ */
-return e.jsx(i.default,{...F,type:t,defaultValue:_.default_value,is_multiline:_.is_multiline,min:_.min_length,max:_.max_length,label:/* @__PURE__ */e.jsxs("span",{className:"formSection--Relation","data-position":x,"data-name":`members.${x}.message`,children:[v(_.label),
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("../../../components/form-control/form-builder/form-builder-element/text/index.js"),i=require("../../../components/form-control/form-builder/form-builder-element/checkbox/index.js"),r=require("../../../components/form-control/form-builder/form-builder-element/table/index.js"),n=require("../../../components/form-control/form-builder/form-builder-element/dynamic-element-hoc/index.js"),o=require("../../../components/form-control/form-builder/form-builder-element/radio-button/index.js"),a=require("../../../components/form-control/form-builder/form-builder-element/toggle-button/index.js"),d=require("../../../components/form-control/form-builder/form-builder-element/info/index.js"),u=require("../../../components/form-control/form-builder/form-builder-element/media/index.js"),s=require("../../../components/form-control/form-builder/form-builder-element/time/index.js"),m=require("../../../components/form-control/form-builder/form-builder-element/date/index.js"),c=require("../../../components/form-control/form-builder/form-builder-element/select/index.js"),f=require("../../../components/form-control/form-builder/form-builder-element/phone/index.js"),p=require("../../../node_modules/@mui/material/Grid/Grid/index.js");const _=t.memo(({field:_,index:x,gridItemSize:b,activeMember:y,control:j,t:v,element:h,images:g,elementJSON:q,remove:S,move:w,handleElementSelection:E,setElementSwap:M,handleDuplicateElement:V,setSelectedHoc:I,setActiveMember:N})=>{const k=t.useMemo(()=>({activeIndex:y===x,removeElement:S,index:x,onClick:E,swap:w,elementSwap:()=>M(!0),handleDuplicate:V,setElementHoc:()=>{I(""),N(void 0)}}),[y,x,S,E,w,M,V,I,N]),F=t.useMemo(()=>({key:_.id,position:x,placeholder:v(_.placeholder||""),label:v(_.label),formControl:j,name:"message",fieldArrayName:"members",required:_.is_required,formType:"builder",typeOfField:_.type,disabled:!0}),[_.id,_.placeholder,_.label,_.is_required,_.type,x,v,j]),O=t.useCallback(()=>{const{field_type:t}=_;switch(t){case h.text.field_type:/* @__PURE__ */
+return e.jsx(l.default,{...F,type:t,defaultValue:_.default_value,is_multiline:_.is_multiline,min:_.min_length,max:_.max_length});case h.email.field_type:/* @__PURE__ */
+return e.jsx(l.default,{...F,type:t,defaultValue:_.default_value,endIcon:/* @__PURE__ */e.jsx("img",{src:g.sms,alt:"email"})});case h.number.field_type:/* @__PURE__ */
+return e.jsx(l.default,{...F,type:t,defaultValue:_.default_value,min:_.min_length,max:_.max_length,float_step:_.float_step});case h.phone.field_type:/* @__PURE__ */
+return e.jsx(f.default,{...F,type:t,default_value:_.default_value});case h.select.field_type:/* @__PURE__ */
+return e.jsx(c.default,{...F,options:_.options,defaultValue:_.default_value,is_multiselect:_.is_multiselect});case h.date.field_type:/* @__PURE__ */
+return e.jsx(m.default,{...F,defaultValue:_.default_value,is_future_dates_allowed:_.is_future_dates_allowed,is_past_dates_allowed:_.is_past_dates_allowed,disable:!0});case h.time.field_type:/* @__PURE__ */
+return e.jsx(s.default,{...F,option:_.option});case h.url.field_type:/* @__PURE__ */
+return e.jsx(l.default,{...F,type:t,defaultValue:_.default_value,endIcon:/* @__PURE__ */e.jsx("img",{src:g.url,alt:"url"})});case h.currency.field_type:/* @__PURE__ */
+return e.jsx(l.default,{...F,type:t,defaultValue:_.default_value,endIcon:/* @__PURE__ */e.jsx("img",{src:g.dollar,alt:"currency"})});case h.file.field_type:case h.image.field_type:/* @__PURE__ */
+return e.jsx(u.default,{...F,type:t,max_size:_.max_size});case h.geoLocation.field_type:/* @__PURE__ */
+return e.jsx(l.default,{...F,type:t,defaultValue:_.default_value,endIcon:/* @__PURE__ */e.jsx("img",{src:g.location,alt:"location"})});case h.relation.field_type:/* @__PURE__ */
+return e.jsx(l.default,{...F,type:t,defaultValue:_.default_value,is_multiline:_.is_multiline,min:_.min_length,max:_.max_length,label:/* @__PURE__ */e.jsxs("span",{className:"formSection--Relation","data-position":x,"data-name":`members.${x}.message`,children:[v(_.label),
 /* @__PURE__ */e.jsx("img",{src:g.relation,alt:"relation"})]})});case h.info.field_type:/* @__PURE__ */
 return e.jsx(d.default,{...F,defaultValue:_.default_value});case h.toggleButton.field_type:/* @__PURE__ */
-return e.jsx(u.default,{...F,title:v(_.title||""),titlePosition:null==q?void 0:q.title_position});case h.radioButton.field_type:/* @__PURE__ */
-return e.jsx(a.default,{...F,options:_.options,display:_.display,titlePosition:null==q?void 0:q.title_position});case h.tagsInput.field_type:/* @__PURE__ */
-return e.jsx(i.default,{...F,type:t,defaultValue:_.default_value,is_multiline:_.is_multiline,min:_.min_length,max:_.max_length});case h.checkbox.field_type:/* @__PURE__ */
-return e.jsx(r.default,{...F,title:v(_.title||""),titlePosition:_.title_position});case h.table.field_type:/* @__PURE__ */
-return e.jsx(n.default,{...F,columns:_.table_columns||(null==q?void 0:q.table_columns)||[]});default:return null}},[_,F,h,g,q,v,x]);/* @__PURE__ */
-return e.jsx(l.Grid,{item:!0,xs:b,children:/* @__PURE__ */e.jsx(o.default,{...k,element:_.field_type,children:O()})})});_.displayName="FormField";const x=t.memo(({sectionMembers:l,members:i,activeMember:r,control:n,t:o,element:a,images:u,elementJSON:d,remove:s,move:m,handleElementSelection:c,setElementSwap:f,handleDuplicateElement:p,setSelectedHoc:x,setActiveMember:b})=>{const y=t.useCallback(e=>e.is_fullwidth||"table"===e.field_type?12:e.custom_width?e.custom_width:6,[]),j=t.useMemo(()=>l.map(t=>{const l=i.findIndex(e=>e===t),j=y(t);/* @__PURE__ */
-return e.jsx(_,{field:t,index:l,gridItemSize:j,activeMember:r,control:n,t:o,element:a,images:u,elementJSON:d,remove:s,move:m,handleElementSelection:c,setElementSwap:f,handleDuplicateElement:p,setSelectedHoc:x,setActiveMember:b},`${t.id}-${l}`)}),[l,i,r,n,o,a,u,d,s,m,c,f,p,x,b,y,null==d?void 0:d.field_type]);/* @__PURE__ */
+return e.jsx(a.default,{...F,title:v(_.title||""),titlePosition:null==q?void 0:q.title_position});case h.radioButton.field_type:/* @__PURE__ */
+return e.jsx(o.default,{...F,options:_.options,display:_.display,titlePosition:null==q?void 0:q.title_position});case h.tagsInput.field_type:/* @__PURE__ */
+return e.jsx(l.default,{...F,type:t,defaultValue:_.default_value,is_multiline:_.is_multiline,min:_.min_length,max:_.max_length});case h.checkbox.field_type:/* @__PURE__ */
+return e.jsx(i.default,{...F,title:v(_.title||""),titlePosition:_.title_position});case h.table.field_type:/* @__PURE__ */
+return e.jsx(r.default,{...F,columns:_.table_columns||(null==q?void 0:q.table_columns)||[]});default:return null}},[_,F,h,g,q,v,x]);/* @__PURE__ */
+return e.jsx(p.default,{item:!0,xs:b,children:/* @__PURE__ */e.jsx(n.default,{...k,element:_.field_type,children:O()})})});_.displayName="FormField";const x=t.memo(({sectionMembers:l,members:i,activeMember:r,control:n,t:o,element:a,images:d,elementJSON:u,remove:s,move:m,handleElementSelection:c,setElementSwap:f,handleDuplicateElement:p,setSelectedHoc:x,setActiveMember:b})=>{const y=t.useCallback(e=>e.is_fullwidth||"table"===e.field_type?12:e.custom_width?e.custom_width:6,[]),j=t.useMemo(()=>l.map(t=>{const l=i.findIndex(e=>e===t),j=y(t);/* @__PURE__ */
+return e.jsx(_,{field:t,index:l,gridItemSize:j,activeMember:r,control:n,t:o,element:a,images:d,elementJSON:u,remove:s,move:m,handleElementSelection:c,setElementSwap:f,handleDuplicateElement:p,setSelectedHoc:x,setActiveMember:b},`${t.id}-${l}`)}),[l,i,r,n,o,a,d,u,s,m,c,f,p,x,b,y,null==u?void 0:u.field_type]);/* @__PURE__ */
 return e.jsx(e.Fragment,{children:j})});x.displayName="FormFields",exports.default=x;
 //# sourceMappingURL=index.js.map

package/dist/views/form-builder/form-fields/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/views/form-builder/form-fields.tsx"],"sourcesContent":["// React imports\r\nimport React, { memo, useMemo, useCallback } from 'react';\r\n\r\n// Material UI imports\r\nimport { Grid } from '@mui/material';\r\n\r\n// ERP Common imports - Form builder elements\r\nimport DynamicInput from '@/components/form-control/form-builder/form-builder-element/text';\r\nimport DynamicCheckBox from '@/components/form-control/form-builder/form-builder-element/checkbox';\r\nimport DynamicTable from '@/components/form-control/form-builder/form-builder-element/table';\r\nimport DynamicElementHOC from '@/components/form-control/form-builder/form-builder-element/dynamic-element-hoc';\r\nimport DynamicRadioButton from '@/components/form-control/form-builder/form-builder-element/radio-button';\r\nimport DynamicToggleButton from '@/components/form-control/form-builder/form-builder-element/toggle-button';\r\nimport DynamicInfo from '@/components/form-control/form-builder/form-builder-element/info';\r\nimport DynamicMedia from '@/components/form-control/form-builder/form-builder-element/media';\r\nimport DynamicTime from '@/components/form-control/form-builder/form-builder-element/time';\r\nimport DynamicDate from '@/components/form-control/form-builder/form-builder-element/date';\r\nimport DynamicSelect from '@/components/form-control/form-builder/form-builder-element/select';\r\nimport DynamicPhone from '@/components/form-control/form-builder/form-builder-element/phone';\r\n\r\n// Types\r\ninterface IField {\r\n  id: string;\r\n  field_type: string;\r\n  placeholder?: string;\r\n  label: string;\r\n  default_value?: any;\r\n  is_multiline?: boolean;\r\n  is_required?: boolean;\r\n  min_length?: number;\r\n  max_length?: number;\r\n  is_fullwidth?: boolean;\r\n  custom_width?: number;\r\n  options?: any[];\r\n  is_multiselect?: boolean;\r\n  is_future_dates_allowed?: boolean;\r\n  is_past_dates_allowed?: boolean;\r\n  option?: any;\r\n  max_size?: number;\r\n  title?: string;\r\n  display?: string;\r\n  title_position?: string;\r\n  table_columns?: any[];\r\n  float_step?: number;\r\n  type: string;\r\n}\r\n\r\ninterface FormFieldsProps {\r\n  sectionMembers: IField[];\r\n  // Add other required props with proper types\r\n  members: IField[];\r\n  activeMember?: number;\r\n  control: any;\r\n  t: (key: string) => string;\r\n  element: any;\r\n  images: any;\r\n  elementJSON?: any;\r\n  remove: (index: number) => void;\r\n  move: (from: number, to: number) => void;\r\n  handleElementSelection: (e: any) => void;\r\n  setElementSwap: (value: boolean) => void;\r\n  handleDuplicateElement: (index: number) => void;\r\n  setSelectedHoc: (value: string) => void;\r\n  setActiveMember: (value: number | undefined) => void;\r\n}\r\n\r\n// Field type mapping for better maintainability\r\nconst FIELD_TYPE_MAP = {\r\n  TEXT: 'text',\r\n  EMAIL: 'email',\r\n  NUMBER: 'number',\r\n  PHONE: 'phone',\r\n  SELECT: 'select',\r\n  DATE: 'date',\r\n  TIME: 'time',\r\n  URL: 'url',\r\n  CURRENCY: 'currency',\r\n  FILE: 'file',\r\n  IMAGE: 'image',\r\n  GEO_LOCATION: 'geoLocation',\r\n  RELATION: 'relation',\r\n  INFO: 'info',\r\n  TOGGLE_BUTTON: 'toggleButton',\r\n  RADIO_BUTTON: 'radioButton',\r\n  TAGS_INPUT: 'tagsInput',\r\n  CHECKBOX: 'checkbox',\r\n  TABLE: 'table'\r\n} as const;\r\n\r\n// Memoized individual field component\r\nconst FormField = memo<{\r\n  field: IField;\r\n  index: number;\r\n  gridItemSize: number;\r\n  activeMember?: number;\r\n  control: any;\r\n  t: (key: string) => string;\r\n  element: any;\r\n  images: any;\r\n  elementJSON?: any;\r\n  remove: (index: number) => void;\r\n  move: (from: number, to: number) => void;\r\n  handleElementSelection: (e: any) => void;\r\n  setElementSwap: (value: boolean) => void;\r\n  handleDuplicateElement: (index: number) => void;\r\n  setSelectedHoc: (value: string) => void;\r\n  setActiveMember: (value: number | undefined) => void;\r\n}>(({\r\n  field,\r\n  index,\r\n  gridItemSize,\r\n  activeMember,\r\n  control,\r\n  t,\r\n  element,\r\n  images,\r\n  elementJSON,\r\n  remove,\r\n  move,\r\n  handleElementSelection,\r\n  setElementSwap,\r\n  handleDuplicateElement,\r\n  setSelectedHoc,\r\n  setActiveMember\r\n}) => {\r\n  // Common HOC props - memoized to prevent unnecessary re-renders\r\n  const hocProps = useMemo(() => ({\r\n    activeIndex: activeMember === index,\r\n    removeElement: remove,\r\n    index,\r\n    onClick: handleElementSelection,\r\n    swap: move,\r\n    elementSwap: () => setElementSwap(true),\r\n    handleDuplicate: handleDuplicateElement,\r\n    setElementHoc: () => {\r\n      setSelectedHoc(\"\");\r\n      setActiveMember(undefined);\r\n    }\r\n  }), [\r\n    activeMember, \r\n    index, \r\n    remove, \r\n    handleElementSelection, \r\n    move, \r\n    setElementSwap, \r\n    handleDuplicateElement, \r\n    setSelectedHoc, \r\n    setActiveMember\r\n  ]);\r\n\r\n  // Common field props - memoized to prevent unnecessary re-renders\r\n  const commonFieldProps = useMemo(() => ({\r\n    key: field.id,\r\n    position: index,\r\n    placeholder: t(field.placeholder || ''),\r\n    label: t(field.label),\r\n    formControl: control,\r\n    name: \"message\",\r\n    fieldArrayName: \"members\",\r\n    required: field.is_required,\r\n    formType: \"builder\" as const,\r\n    typeOfField: field.type,\r\n    disabled: true\r\n  }), [field.id, field.placeholder, field.label, field.is_required, field.type, index, t, control]);\r\n\r\n  // Render field based on type\r\n  const renderFieldContent = useCallback(() => {\r\n    const { field_type } = field;\r\n\r\n    switch (field_type) {\r\n      case element.text.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            is_multiline={field.is_multiline}\r\n            min={field.min_length}\r\n            max={field.max_length}\r\n          />\r\n        );\r\n\r\n      case element.email.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            endIcon={<img src={images.sms} alt=\"email\" />}\r\n          />\r\n        );\r\n\r\n      case element.number.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            min={field.min_length}\r\n            max={field.max_length}\r\n            float_step={field.float_step}\r\n          />\r\n        );\r\n\r\n      case element.phone.field_type:\r\n        return (\r\n          <DynamicPhone\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            default_value={field.default_value}\r\n          />\r\n        );\r\n\r\n      case element.select.field_type:\r\n        return (\r\n          <DynamicSelect\r\n            {...commonFieldProps}\r\n            options={field.options}\r\n            defaultValue={field.default_value}\r\n            is_multiselect={field.is_multiselect}\r\n          />\r\n        );\r\n\r\n      case element.date.field_type:\r\n        return (\r\n          <DynamicDate\r\n            {...commonFieldProps}\r\n            defaultValue={field.default_value}\r\n            is_future_dates_allowed={field.is_future_dates_allowed}\r\n            is_past_dates_allowed={field.is_past_dates_allowed}\r\n            disable={true}\r\n          />\r\n        );\r\n\r\n      case element.time.field_type:\r\n        return (\r\n          <DynamicTime\r\n            {...commonFieldProps}\r\n            option={field.option}\r\n          />\r\n        );\r\n\r\n      case element.url.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            endIcon={<img src={images.url} alt=\"url\" />}\r\n          />\r\n        );\r\n\r\n      case element.currency.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            endIcon={<img src={images.dollar} alt=\"currency\" />}\r\n          />\r\n        );\r\n\r\n      case element.file.field_type:\r\n      case element.image.field_type:\r\n        return (\r\n          <DynamicMedia\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            max_size={field.max_size}\r\n          />\r\n        );\r\n\r\n      case element.geoLocation.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            endIcon={<img src={images.location} alt=\"location\" />}\r\n          />\r\n        );\r\n\r\n      case element.relation.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            is_multiline={field.is_multiline}\r\n            min={field.min_length}\r\n            max={field.max_length}\r\n            label={\r\n              <span\r\n                className=\"formSection--Relation\"\r\n                data-position={index}\r\n                data-name={`members.${index}.message`}\r\n              >\r\n                {t(field.label)}\r\n                <img src={images.relation} alt=\"relation\" />\r\n              </span>\r\n            }\r\n          />\r\n        );\r\n\r\n      case element.info.field_type:\r\n        return (\r\n          <DynamicInfo\r\n            {...commonFieldProps}\r\n            defaultValue={field.default_value}\r\n          />\r\n        );\r\n\r\n      case element.toggleButton.field_type:\r\n        return (\r\n          <DynamicToggleButton\r\n            {...commonFieldProps}\r\n            title={t(field.title || '')}\r\n            titlePosition={elementJSON?.title_position}\r\n          />\r\n        );\r\n\r\n      case element.radioButton.field_type:\r\n        return (\r\n          <DynamicRadioButton\r\n            {...commonFieldProps}\r\n            options={field.options}\r\n            display={field.display}\r\n            titlePosition={elementJSON?.title_position}\r\n          />\r\n        );\r\n\r\n      case element.tagsInput.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            is_multiline={field.is_multiline}\r\n            min={field.min_length}\r\n            max={field.max_length}\r\n          />\r\n        );\r\n\r\n      case element.checkbox.field_type:\r\n        return (\r\n          <DynamicCheckBox\r\n            {...commonFieldProps}\r\n            title={t(field.title || '')}\r\n            titlePosition={field.title_position}\r\n          />\r\n        );\r\n\r\n      case element.table.field_type:\r\n        return (\r\n          <DynamicTable\r\n            {...commonFieldProps}\r\n            columns={field.table_columns || elementJSON?.table_columns || []}\r\n          />\r\n        );\r\n\r\n      default:\r\n        console.warn(`Unknown field type: ${field_type}`);\r\n        return null;\r\n    }\r\n  }, [field, commonFieldProps, element, images, elementJSON, t, index]);\r\n\r\n  return (\r\n    <Grid item xs={gridItemSize}>\r\n      <DynamicElementHOC\r\n        {...hocProps}\r\n        element={field.field_type}\r\n      >\r\n        {renderFieldContent()}\r\n      </DynamicElementHOC>\r\n    </Grid>\r\n  );\r\n});\r\n\r\nFormField.displayName = 'FormField';\r\n\r\n// Main component\r\nconst FormFields: React.FC<FormFieldsProps> = memo(({\r\n  sectionMembers,\r\n  members,\r\n  activeMember,\r\n  control,\r\n  t,\r\n  element,\r\n  images,\r\n  elementJSON,\r\n  remove,\r\n  move,\r\n  handleElementSelection,\r\n  setElementSwap,\r\n  handleDuplicateElement,\r\n  setSelectedHoc,\r\n  setActiveMember\r\n}) => {\r\n  // Memoize grid item size calculation\r\n  const calculateGridSize = useCallback((field: IField): number => {\r\n    if (field.is_fullwidth || field.field_type === \"table\") return 12;\r\n    if (field.custom_width) return field.custom_width;\r\n    return 6;\r\n  }, []);\r\n\r\n  // Memoize the rendered fields\r\n  const renderedFields = useMemo(() => {\r\n    return sectionMembers.map((field: IField) => {\r\n      const index = members.findIndex(member => member === field);\r\n      const gridItemSize = calculateGridSize(field);\r\n\r\n      return (\r\n        <FormField\r\n          key={`${field.id}-${index}`} // Better key for React reconciliation\r\n          field={field}\r\n          index={index}\r\n          gridItemSize={gridItemSize}\r\n          activeMember={activeMember}\r\n          control={control}\r\n          t={t}\r\n          element={element}\r\n          images={images}\r\n          elementJSON={elementJSON}\r\n          remove={remove}\r\n          move={move}\r\n          handleElementSelection={handleElementSelection}\r\n          setElementSwap={setElementSwap}\r\n          handleDuplicateElement={handleDuplicateElement}\r\n          setSelectedHoc={setSelectedHoc}\r\n          setActiveMember={setActiveMember}\r\n        />\r\n      );\r\n    });\r\n  }, [\r\n    sectionMembers,\r\n    members,\r\n    activeMember,\r\n    control,\r\n    t,\r\n    element,\r\n    images,\r\n    elementJSON,\r\n    remove,\r\n    move,\r\n    handleElementSelection,\r\n    setElementSwap,\r\n    handleDuplicateElement,\r\n    setSelectedHoc,\r\n    setActiveMember,\r\n    calculateGridSize,\r\n    elementJSON?.field_type\r\n  ]);\r\n\r\n  return <>{renderedFields}</>;\r\n});\r\n\r\nFormFields.displayName = 'FormFields';\r\n\r\nexport default FormFields;"],"names":["FormField","memo","field","index","gridItemSize","activeMember","control","t","element","images","elementJSON","remove","move","handleElementSelection","setElementSwap","handleDuplicateElement","setSelectedHoc","setActiveMember","hocProps","useMemo","activeIndex","removeElement","onClick","swap","elementSwap","handleDuplicate","setElementHoc","commonFieldProps","key","id","position","placeholder","label","formControl","name","fieldArrayName","required","is_required","formType","typeOfField","type","disabled","renderFieldContent","useCallback","field_type","text","jsx","DynamicInput","defaultValue","default_value","is_multiline","min","min_length","max","max_length","email","endIcon","src","sms","alt","number","float_step","phone","DynamicPhone","select","DynamicSelect","options","is_multiselect","date","DynamicDate","is_future_dates_allowed","is_past_dates_allowed","disable","time","DynamicTime","option","url","currency","dollar","file","image","DynamicMedia","max_size","geoLocation","location","relation","jsxs","className","children","info","DynamicInfo","toggleButton","DynamicToggleButton","title","titlePosition","title_position","radioButton","DynamicRadioButton","display","tagsInput","checkbox","DynamicCheckBox","table","DynamicTable","columns","table_columns","Grid","item","xs","DynamicElementHOC","displayName","FormFields","sectionMembers","members","calculateGridSize","is_fullwidth","custom_width","renderedFields","map","findIndex","member"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/views/form-builder/form-fields.tsx"],"sourcesContent":["// React imports\r\nimport React, { memo, useMemo, useCallback } from 'react';\r\n\r\n// Material UI imports\r\nimport { Grid } from '@mui/material';\r\n\r\n// ERP Common imports - Form builder elements\r\nimport DynamicInput from '@/components/form-control/form-builder/form-builder-element/text';\r\nimport DynamicCheckBox from '@/components/form-control/form-builder/form-builder-element/checkbox';\r\nimport DynamicTable from '@/components/form-control/form-builder/form-builder-element/table';\r\nimport DynamicElementHOC from '@/components/form-control/form-builder/form-builder-element/dynamic-element-hoc';\r\nimport DynamicRadioButton from '@/components/form-control/form-builder/form-builder-element/radio-button';\r\nimport DynamicToggleButton from '@/components/form-control/form-builder/form-builder-element/toggle-button';\r\nimport DynamicInfo from '@/components/form-control/form-builder/form-builder-element/info';\r\nimport DynamicMedia from '@/components/form-control/form-builder/form-builder-element/media';\r\nimport DynamicTime from '@/components/form-control/form-builder/form-builder-element/time';\r\nimport DynamicDate from '@/components/form-control/form-builder/form-builder-element/date';\r\nimport DynamicSelect from '@/components/form-control/form-builder/form-builder-element/select';\r\nimport DynamicPhone from '@/components/form-control/form-builder/form-builder-element/phone';\r\n\r\n// Types\r\ninterface IField {\r\n  id: string;\r\n  field_type: string;\r\n  placeholder?: string;\r\n  label: string;\r\n  default_value?: any;\r\n  is_multiline?: boolean;\r\n  is_required?: boolean;\r\n  min_length?: number;\r\n  max_length?: number;\r\n  is_fullwidth?: boolean;\r\n  custom_width?: number;\r\n  options?: any[];\r\n  is_multiselect?: boolean;\r\n  is_future_dates_allowed?: boolean;\r\n  is_past_dates_allowed?: boolean;\r\n  option?: any;\r\n  max_size?: number;\r\n  title?: string;\r\n  display?: string;\r\n  title_position?: string;\r\n  table_columns?: any[];\r\n  float_step?: number;\r\n  type: string;\r\n}\r\n\r\ninterface FormFieldsProps {\r\n  sectionMembers: IField[];\r\n  // Add other required props with proper types\r\n  members: IField[];\r\n  activeMember?: number;\r\n  control: any;\r\n  t: (key: string) => string;\r\n  element: any;\r\n  images: any;\r\n  elementJSON?: any;\r\n  remove: (index: number) => void;\r\n  move: (from: number, to: number) => void;\r\n  handleElementSelection: (e: any) => void;\r\n  setElementSwap: (value: boolean) => void;\r\n  handleDuplicateElement: (index: number) => void;\r\n  setSelectedHoc: (value: string) => void;\r\n  setActiveMember: (value: number | undefined) => void;\r\n}\r\n\r\n// Field type mapping for better maintainability\r\nconst FIELD_TYPE_MAP = {\r\n  TEXT: 'text',\r\n  EMAIL: 'email',\r\n  NUMBER: 'number',\r\n  PHONE: 'phone',\r\n  SELECT: 'select',\r\n  DATE: 'date',\r\n  TIME: 'time',\r\n  URL: 'url',\r\n  CURRENCY: 'currency',\r\n  FILE: 'file',\r\n  IMAGE: 'image',\r\n  GEO_LOCATION: 'geoLocation',\r\n  RELATION: 'relation',\r\n  INFO: 'info',\r\n  TOGGLE_BUTTON: 'toggleButton',\r\n  RADIO_BUTTON: 'radioButton',\r\n  TAGS_INPUT: 'tagsInput',\r\n  CHECKBOX: 'checkbox',\r\n  TABLE: 'table'\r\n} as const;\r\n\r\n// Memoized individual field component\r\nconst FormField = memo<{\r\n  field: IField;\r\n  index: number;\r\n  gridItemSize: number;\r\n  activeMember?: number;\r\n  control: any;\r\n  t: (key: string) => string;\r\n  element: any;\r\n  images: any;\r\n  elementJSON?: any;\r\n  remove: (index: number) => void;\r\n  move: (from: number, to: number) => void;\r\n  handleElementSelection: (e: any) => void;\r\n  setElementSwap: (value: boolean) => void;\r\n  handleDuplicateElement: (index: number) => void;\r\n  setSelectedHoc: (value: string) => void;\r\n  setActiveMember: (value: number | undefined) => void;\r\n}>(({\r\n  field,\r\n  index,\r\n  gridItemSize,\r\n  activeMember,\r\n  control,\r\n  t,\r\n  element,\r\n  images,\r\n  elementJSON,\r\n  remove,\r\n  move,\r\n  handleElementSelection,\r\n  setElementSwap,\r\n  handleDuplicateElement,\r\n  setSelectedHoc,\r\n  setActiveMember\r\n}) => {\r\n  // Common HOC props - memoized to prevent unnecessary re-renders\r\n  const hocProps = useMemo(() => ({\r\n    activeIndex: activeMember === index,\r\n    removeElement: remove,\r\n    index,\r\n    onClick: handleElementSelection,\r\n    swap: move,\r\n    elementSwap: () => setElementSwap(true),\r\n    handleDuplicate: handleDuplicateElement,\r\n    setElementHoc: () => {\r\n      setSelectedHoc(\"\");\r\n      setActiveMember(undefined);\r\n    }\r\n  }), [\r\n    activeMember, \r\n    index, \r\n    remove, \r\n    handleElementSelection, \r\n    move, \r\n    setElementSwap, \r\n    handleDuplicateElement, \r\n    setSelectedHoc, \r\n    setActiveMember\r\n  ]);\r\n\r\n  // Common field props - memoized to prevent unnecessary re-renders\r\n  const commonFieldProps = useMemo(() => ({\r\n    key: field.id,\r\n    position: index,\r\n    placeholder: t(field.placeholder || ''),\r\n    label: t(field.label),\r\n    formControl: control,\r\n    name: \"message\",\r\n    fieldArrayName: \"members\",\r\n    required: field.is_required,\r\n    formType: \"builder\" as const,\r\n    typeOfField: field.type,\r\n    disabled: true\r\n  }), [field.id, field.placeholder, field.label, field.is_required, field.type, index, t, control]);\r\n\r\n  // Render field based on type\r\n  const renderFieldContent = useCallback(() => {\r\n    const { field_type } = field;\r\n\r\n    switch (field_type) {\r\n      case element.text.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            is_multiline={field.is_multiline}\r\n            min={field.min_length}\r\n            max={field.max_length}\r\n          />\r\n        );\r\n\r\n      case element.email.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            endIcon={<img src={images.sms} alt=\"email\" />}\r\n          />\r\n        );\r\n\r\n      case element.number.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            min={field.min_length}\r\n            max={field.max_length}\r\n            float_step={field.float_step}\r\n          />\r\n        );\r\n\r\n      case element.phone.field_type:\r\n        return (\r\n          <DynamicPhone\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            default_value={field.default_value}\r\n          />\r\n        );\r\n\r\n      case element.select.field_type:\r\n        return (\r\n          <DynamicSelect\r\n            {...commonFieldProps}\r\n            options={field.options}\r\n            defaultValue={field.default_value}\r\n            is_multiselect={field.is_multiselect}\r\n          />\r\n        );\r\n\r\n      case element.date.field_type:\r\n        return (\r\n          <DynamicDate\r\n            {...commonFieldProps}\r\n            defaultValue={field.default_value}\r\n            is_future_dates_allowed={field.is_future_dates_allowed}\r\n            is_past_dates_allowed={field.is_past_dates_allowed}\r\n            disable={true}\r\n          />\r\n        );\r\n\r\n      case element.time.field_type:\r\n        return (\r\n          <DynamicTime\r\n            {...commonFieldProps}\r\n            option={field.option}\r\n          />\r\n        );\r\n\r\n      case element.url.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            endIcon={<img src={images.url} alt=\"url\" />}\r\n          />\r\n        );\r\n\r\n      case element.currency.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            endIcon={<img src={images.dollar} alt=\"currency\" />}\r\n          />\r\n        );\r\n\r\n      case element.file.field_type:\r\n      case element.image.field_type:\r\n        return (\r\n          <DynamicMedia\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            max_size={field.max_size}\r\n          />\r\n        );\r\n\r\n      case element.geoLocation.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            endIcon={<img src={images.location} alt=\"location\" />}\r\n          />\r\n        );\r\n\r\n      case element.relation.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            is_multiline={field.is_multiline}\r\n            min={field.min_length}\r\n            max={field.max_length}\r\n            label={\r\n              <span\r\n                className=\"formSection--Relation\"\r\n                data-position={index}\r\n                data-name={`members.${index}.message`}\r\n              >\r\n                {t(field.label)}\r\n                <img src={images.relation} alt=\"relation\" />\r\n              </span>\r\n            }\r\n          />\r\n        );\r\n\r\n      case element.info.field_type:\r\n        return (\r\n          <DynamicInfo\r\n            {...commonFieldProps}\r\n            defaultValue={field.default_value}\r\n          />\r\n        );\r\n\r\n      case element.toggleButton.field_type:\r\n        return (\r\n          <DynamicToggleButton\r\n            {...commonFieldProps}\r\n            title={t(field.title || '')}\r\n            titlePosition={elementJSON?.title_position}\r\n          />\r\n        );\r\n\r\n      case element.radioButton.field_type:\r\n        return (\r\n          <DynamicRadioButton\r\n            {...commonFieldProps}\r\n            options={field.options}\r\n            display={field.display}\r\n            titlePosition={elementJSON?.title_position}\r\n          />\r\n        );\r\n\r\n      case element.tagsInput.field_type:\r\n        return (\r\n          <DynamicInput\r\n            {...commonFieldProps}\r\n            type={field_type}\r\n            defaultValue={field.default_value}\r\n            is_multiline={field.is_multiline}\r\n            min={field.min_length}\r\n            max={field.max_length}\r\n          />\r\n        );\r\n\r\n      case element.checkbox.field_type:\r\n        return (\r\n          <DynamicCheckBox\r\n            {...commonFieldProps}\r\n            title={t(field.title || '')}\r\n            titlePosition={field.title_position}\r\n          />\r\n        );\r\n\r\n      case element.table.field_type:\r\n        return (\r\n          <DynamicTable\r\n            {...commonFieldProps}\r\n            columns={field.table_columns || elementJSON?.table_columns || []}\r\n          />\r\n        );\r\n\r\n      default:\r\n        console.warn(`Unknown field type: ${field_type}`);\r\n        return null;\r\n    }\r\n  }, [field, commonFieldProps, element, images, elementJSON, t, index]);\r\n\r\n  return (\r\n    <Grid item xs={gridItemSize}>\r\n      <DynamicElementHOC\r\n        {...hocProps}\r\n        element={field.field_type}\r\n      >\r\n        {renderFieldContent()}\r\n      </DynamicElementHOC>\r\n    </Grid>\r\n  );\r\n});\r\n\r\nFormField.displayName = 'FormField';\r\n\r\n// Main component\r\nconst FormFields: React.FC<FormFieldsProps> = memo(({\r\n  sectionMembers,\r\n  members,\r\n  activeMember,\r\n  control,\r\n  t,\r\n  element,\r\n  images,\r\n  elementJSON,\r\n  remove,\r\n  move,\r\n  handleElementSelection,\r\n  setElementSwap,\r\n  handleDuplicateElement,\r\n  setSelectedHoc,\r\n  setActiveMember\r\n}) => {\r\n  // Memoize grid item size calculation\r\n  const calculateGridSize = useCallback((field: IField): number => {\r\n    if (field.is_fullwidth || field.field_type === \"table\") return 12;\r\n    if (field.custom_width) return field.custom_width;\r\n    return 6;\r\n  }, []);\r\n\r\n  // Memoize the rendered fields\r\n  const renderedFields = useMemo(() => {\r\n    return sectionMembers.map((field: IField) => {\r\n      const index = members.findIndex(member => member === field);\r\n      const gridItemSize = calculateGridSize(field);\r\n\r\n      return (\r\n        <FormField\r\n          key={`${field.id}-${index}`} // Better key for React reconciliation\r\n          field={field}\r\n          index={index}\r\n          gridItemSize={gridItemSize}\r\n          activeMember={activeMember}\r\n          control={control}\r\n          t={t}\r\n          element={element}\r\n          images={images}\r\n          elementJSON={elementJSON}\r\n          remove={remove}\r\n          move={move}\r\n          handleElementSelection={handleElementSelection}\r\n          setElementSwap={setElementSwap}\r\n          handleDuplicateElement={handleDuplicateElement}\r\n          setSelectedHoc={setSelectedHoc}\r\n          setActiveMember={setActiveMember}\r\n        />\r\n      );\r\n    });\r\n  }, [\r\n    sectionMembers,\r\n    members,\r\n    activeMember,\r\n    control,\r\n    t,\r\n    element,\r\n    images,\r\n    elementJSON,\r\n    remove,\r\n    move,\r\n    handleElementSelection,\r\n    setElementSwap,\r\n    handleDuplicateElement,\r\n    setSelectedHoc,\r\n    setActiveMember,\r\n    calculateGridSize,\r\n    elementJSON?.field_type\r\n  ]);\r\n\r\n  return <>{renderedFields}</>;\r\n});\r\n\r\nFormFields.displayName = 'FormFields';\r\n\r\nexport default FormFields;"],"names":["FormField","memo","field","index","gridItemSize","activeMember","control","t","element","images","elementJSON","remove","move","handleElementSelection","setElementSwap","handleDuplicateElement","setSelectedHoc","setActiveMember","hocProps","useMemo","activeIndex","removeElement","onClick","swap","elementSwap","handleDuplicate","setElementHoc","commonFieldProps","key","id","position","placeholder","label","formControl","name","fieldArrayName","required","is_required","formType","typeOfField","type","disabled","renderFieldContent","useCallback","field_type","text","jsx","DynamicInput","defaultValue","default_value","is_multiline","min","min_length","max","max_length","email","endIcon","src","sms","alt","number","float_step","phone","DynamicPhone","select","DynamicSelect","options","is_multiselect","date","DynamicDate","is_future_dates_allowed","is_past_dates_allowed","disable","time","DynamicTime","option","url","currency","dollar","file","image","DynamicMedia","max_size","geoLocation","location","relation","jsxs","className","children","info","DynamicInfo","toggleButton","DynamicToggleButton","title","titlePosition","title_position","radioButton","DynamicRadioButton","display","tagsInput","checkbox","DynamicCheckBox","table","DynamicTable","columns","table_columns","Grid","item","xs","DynamicElementHOC","displayName","FormFields","sectionMembers","members","calculateGridSize","is_fullwidth","custom_width","renderedFields","map","findIndex","member"],"mappings":"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"}

package/dist/views/template-editor/add-template/add-template/index.esm.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
-import { Box } from "@mui/material";
 import SectionFlowEditor from "../../components/SectionFlowEditor/index.esm.js";
 /* empty css                             */
+import Box from "../../../../node_modules/@mui/material/Box/Box/index.esm.js";
 const AddTemplate = ({ modulePath, module, type }) => {
   return /* @__PURE__ */ jsx(Box, { sx: { minHeight: "100vh", bgcolor: "grey.50" }, children: /* @__PURE__ */ jsx(SectionFlowEditor, { modulePath, module, type }) });
 };

package/dist/views/template-editor/add-template/add-template/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@mui/material"),t=;/* empty css                                        */,/* empty css                          */exports.default=({modulePath:i,module:o,type:s})=>/* @__PURE__ */e.jsx(r.Box,{sx:{minHeight:"100vh",bgcolor:"grey.50"},children:/* @__PURE__ */e.jsx(t.default,{modulePath:i,module:o,type:s})});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=;/* empty css                                        */;/* empty css                          */var t=;/* empty css                                                    */exports.default=({modulePath:o,module:d,type:i})=>/* @__PURE__ */e.jsx(t.default,{sx:{minHeight:"100vh",bgcolor:"grey.50"},children:/* @__PURE__ */e.jsx(r.default,{modulePath:o,module:d,type:i})});
 //# sourceMappingURL=index.js.map

package/dist/views/template-editor/add-template/add-template/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/add-template/add-template.tsx"],"sourcesContent":["/* eslint-disable unused-imports/no-unused-vars */\r\nimport { Box } from '@mui/material';\r\nimport SectionFlowEditor from '../components/SectionFlowEditor';\r\nimport './add-template.scss';\r\nimport { ITemplateFormProps } from '../utils/types';\r\n\r\nconst AddTemplate: React.FC<ITemplateFormProps> = ({ modulePath, module, type}) => {\r\n  return (\r\n    <Box sx={{ minHeight: '100vh', bgcolor: 'grey.50' }}>\r\n      <SectionFlowEditor modulePath={modulePath} module={module} type={type}/>\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport default AddTemplate;"],"names":["modulePath","module","type","jsx","Box","sx","minHeight","bgcolor","children","SectionFlowEditor"],"mappings":"oPAMkD,EAAGA,aAAYC,OAAAA,EAAQC,yBAErEC,EAAAA,IAACC,EAAAA,IAAA,CAAIC,GAAI,CAAEC,UAAW,QAASC,QAAS,WACtCC,wBAAAL,EAAAA,IAACM,UAAA,CAAkBT,aAAwBC,OAAAA,EAAgBC"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/add-template/add-template.tsx"],"sourcesContent":["/* eslint-disable unused-imports/no-unused-vars */\r\nimport { Box } from '@mui/material';\r\nimport SectionFlowEditor from '../components/SectionFlowEditor';\r\nimport './add-template.scss';\r\nimport { ITemplateFormProps } from '../utils/types';\r\n\r\nconst AddTemplate: React.FC<ITemplateFormProps> = ({ modulePath, module, type}) => {\r\n  return (\r\n    <Box sx={{ minHeight: '100vh', bgcolor: 'grey.50' }}>\r\n      <SectionFlowEditor modulePath={modulePath} module={module} type={type}/>\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport default AddTemplate;"],"names":["modulePath","module","type","jsx","Box","sx","minHeight","bgcolor","children","SectionFlowEditor"],"mappings":"kSAMkD,EAAGA,aAAYC,OAAAA,EAAQC,yBAErEC,EAAAA,IAACC,EAAAA,QAAA,CAAIC,GAAI,CAAEC,UAAW,QAASC,QAAS,WACtCC,wBAAAL,EAAAA,IAACM,UAAA,CAAkBT,aAAwBC,OAAAA,EAAgBC"}

package/dist/views/template-editor/company-selection-modal/company-selection-modal/index.esm.js

@@ -4,11 +4,16 @@ import Modal from "../../../../components/modal/modal/index.esm.js";
 import { Typography } from "../../../../components/typography/typography/index.esm.js";
 import Button from "../../../../components/button/button/index.esm.js";
 import Select from "../../../../components/select/select/index.esm.js";
-import { DialogTitle, IconButton, DialogContent, MenuItem, DialogActions, Box } from "@mui/material";
-import CloseIcon from "@mui/icons-material/Close";
+import default_1 from "../../../../node_modules/@mui/icons-material/Close/index.esm.js";
 /* empty css                                        */
 import { enqueueSnackbar } from "../../../../node_modules/notistack/notistack.esm/index.esm.js";
 import { useNavigate } from "react-router-dom";
+import DialogTitle from "../../../../node_modules/@mui/material/DialogTitle/DialogTitle/index.esm.js";
+import IconButton from "../../../../node_modules/@mui/material/IconButton/IconButton/index.esm.js";
+import DialogContent from "../../../../node_modules/@mui/material/DialogContent/DialogContent/index.esm.js";
+import MenuItem from "../../../../node_modules/@mui/material/MenuItem/MenuItem/index.esm.js";
+import DialogActions from "../../../../node_modules/@mui/material/DialogActions/DialogActions/index.esm.js";
+import Box from "../../../../node_modules/@mui/material/Box/Box/index.esm.js";
 const CompanySelectionModal = ({
   isOpen,
   setIsOpen,
@@ -43,7 +48,7 @@ const CompanySelectionModal = ({
       children: [
         /* @__PURE__ */ jsxs(DialogTitle, { className: "companySelectionModal--DialogTitle", children: [
           /* @__PURE__ */ jsx(Typography, { type: "s3", color: "inherit", weight: "medium", children: "Select Company" }),
-          /* @__PURE__ */ jsx(IconButton, { onClick: handleModalClose, children: /* @__PURE__ */ jsx(CloseIcon, { fontSize: "small" }) })
+          /* @__PURE__ */ jsx(IconButton, { onClick: handleModalClose, children: /* @__PURE__ */ jsx(default_1, { fontSize: "small" }) })
         ] }),
         /* @__PURE__ */ jsx(DialogContent, { className: "companySelectionModal--DialogContents", children: /* @__PURE__ */ jsx(
           Select,

package/dist/views/template-editor/company-selection-modal/company-selection-modal/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/template-editor/company-selection-modal/company-selection-modal.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React from 'react';\r\n\r\nimport Modal from '../../../components/modal/modal';\r\nimport Typography from '../../../components/typography/typography';\r\nimport Button from '../../../components/button/button';\r\nimport Select from '../../../components/select/select';\r\n\r\nimport {\r\n\tBox,\r\n\tDialogActions,\r\n\tDialogContent,\r\n\tDialogProps,\r\n\tDialogTitle,\r\n\tIconButton,\r\n\tMenuItem\r\n} from '@mui/material';\r\nimport Close from '@mui/icons-material/Close';\r\n\r\nimport './company-selection-modal.scss';\r\nimport { IEmail } from '../utils/types';\r\nimport { enqueueSnackbar } from 'notistack';\r\nimport { useNavigate } from 'react-router-dom';\r\n\r\ninterface CompanySelectionModalProps {\r\n\tisOpen: boolean;\r\n\tsetIsOpen: (value: IEmail | null) => void;\r\n\tmodalProps?: DialogProps;\r\n\temail: IEmail;\r\n\tcompanies: Record<string, any>[];\r\n\ttemplateRoutes: Record<string, any>\r\n}\r\n\r\nconst CompanySelectionModal: React.FC<CompanySelectionModalProps> = ({\r\n\tisOpen,\r\n\tsetIsOpen,\r\n\tmodalProps,\r\n\tcompanies,\r\n\temail,\r\n\ttemplateRoutes\r\n}) => {\r\n\r\n\tconst navigate = useNavigate();\r\n\tconst [selectedCompany, setSelectedCompany] = React.useState<number>(0);\r\n\r\n\tconst handleModalClose = () => {\r\n\t\tsetIsOpen(null);\r\n\t};\r\n\r\n\tconst handleContinue = () => {\r\n\t\tif(!selectedCompany) {\r\n\t\t\tenqueueSnackbar('Please select a company', { variant: 'error' });\r\n\t\t\treturn;\r\n\t\t} else if(!email) {\r\n\t\t\tenqueueSnackbar('Something went wrong for a subject', { variant: 'error' });\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tnavigate(templateRoutes.ADD_TEMPLATE(email._id), { state: { company_id: selectedCompany }})\r\n\t}\r\n\r\n\treturn (\r\n\t\t<Modal\r\n\t\t\topen={isOpen}\r\n\t\t\tonClose={handleModalClose}\r\n\t\t\tmaxWidth='xs'\r\n\t\t\tfullWidth\r\n\t\t\t{...modalProps}>\r\n\t\t\t<DialogTitle className='companySelectionModal--DialogTitle'>\r\n\t\t\t\t<Typography type='s3' color='inherit' weight='medium'>\r\n\t\t\t\t\tSelect Company\r\n\t\t\t\t</Typography>\r\n\t\t\t\t<IconButton onClick={handleModalClose}>\r\n\t\t\t\t\t<Close fontSize='small' />\r\n\t\t\t\t</IconButton>\r\n\t\t\t</DialogTitle>\r\n\t\t\t<DialogContent className='companySelectionModal--DialogContents'>\r\n\t\t\t\t<Select\r\n\t\t\t\t\tdisplayEmpty\r\n\t\t\t\t\tvalue={selectedCompany}\r\n\t\t\t\t\tsize='small'\r\n\t\t\t\t\trenderValue={(value) => value ? companies.find((option) => option.value === value)?.label : 'Select Company'}\r\n\t\t\t\t\tfullWidth\r\n\t\t\t\t\tsx={{\r\n\t\t\t\t\t\tbgcolor: 'white',\r\n\t\t\t\t\t\tborderRadius: 1,\r\n\t\t\t\t\t\t'& .MuiSelect-select': { py: 0.75 }\r\n\t\t\t\t\t}}\r\n\t\t\t\t\tonChange={(e) => {\r\n\t\t\t\t\t\tif (e.target.value) {\r\n\t\t\t\t\t\t\tsetSelectedCompany(e.target.value as number);\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}}>\r\n\t\t\t\t\t{companies.map((option) => (\r\n\t\t\t\t\t\t<MenuItem key={option.value} value={option.value}>\r\n\t\t\t\t\t\t\t<Typography type='s4' color='theme.secondary.1000'>{option.label}</Typography>\r\n\t\t\t\t\t\t</MenuItem>\r\n\t\t\t\t\t))}\r\n\t\t\t\t</Select>\r\n\t\t\t</DialogContent>\r\n\t\t\t<DialogActions className='companySelectionModal--DialogAction'>\r\n\t\t\t\t<Box display='flex' gap={1.5}>\r\n\t\t\t\t\t<Button className='companySelectionModal--DialogAction--WhiteBtn' onClick={handleModalClose}>Cancel</Button>\r\n\t\t\t\t\t<Button onClick={() => handleContinue()} disabled={!selectedCompany}>Continue</Button>\r\n\t\t\t\t</Box>\r\n\t\t\t</DialogActions>\r\n\t\t</Modal>\r\n\t);\r\n};\r\n\r\nexport default CompanySelectionModal;\r\n"],"names":["React","Close"],"mappings":";;;;;;;;;;;AAkCA,MAAM,wBAA8D,CAAC;AAAA,EACpE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,MAAM;AAEL,QAAM,WAAW,YAAA;AACjB,QAAM,CAAC,iBAAiB,kBAAkB,IAAIA,eAAM,SAAiB,CAAC;AAEtE,QAAM,mBAAmB,MAAM;AAC9B,cAAU,IAAI;AAAA,EACf;AAEA,QAAM,iBAAiB,MAAM;AAC5B,QAAG,CAAC,iBAAiB;AACpB,sBAAgB,2BAA2B,EAAE,SAAS,QAAA,CAAS;AAC/D;AAAA,IACD,WAAU,CAAC,OAAO;AACjB,sBAAgB,sCAAsC,EAAE,SAAS,QAAA,CAAS;AAC1E;AAAA,IACD;AAEA,aAAS,eAAe,aAAa,MAAM,GAAG,GAAG,EAAE,OAAO,EAAE,YAAY,gBAAA,GAAkB;AAAA,EAC3F;AAEA,SACC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAS;AAAA,MACT,WAAS;AAAA,MACR,GAAG;AAAA,MACJ,UAAA;AAAA,QAAA,qBAAC,aAAA,EAAY,WAAU,sCACtB,UAAA;AAAA,UAAA,oBAAC,cAAW,MAAK,MAAK,OAAM,WAAU,QAAO,UAAS,UAAA,iBAAA,CAEtD;AAAA,UACA,oBAAC,cAAW,SAAS,kBACpB,8BAACC,WAAA,EAAM,UAAS,SAAQ,EAAA,CACzB;AAAA,QAAA,GACD;AAAA,QACA,oBAAC,eAAA,EAAc,WAAU,yCACxB,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACA,cAAY;AAAA,YACZ,OAAO;AAAA,YACP,MAAK;AAAA,YACL,aAAa,CAAC;;AAAU,8BAAQ,eAAU,KAAK,CAAC,WAAW,OAAO,UAAU,KAAK,MAAjD,mBAAoD,QAAQ;AAAA;AAAA,YAC5F,WAAS;AAAA,YACT,IAAI;AAAA,cACH,SAAS;AAAA,cACT,cAAc;AAAA,cACd,uBAAuB,EAAE,IAAI,KAAA;AAAA,YAAK;AAAA,YAEnC,UAAU,CAAC,MAAM;AAChB,kBAAI,EAAE,OAAO,OAAO;AACnB,mCAAmB,EAAE,OAAO,KAAe;AAAA,cAC5C;AAAA,YACD;AAAA,YACC,UAAA,UAAU,IAAI,CAAC,+BACd,UAAA,EAA4B,OAAO,OAAO,OAC1C,UAAA,oBAAC,cAAW,MAAK,MAAK,OAAM,wBAAwB,UAAA,OAAO,OAAM,KADnD,OAAO,KAEtB,CACA;AAAA,UAAA;AAAA,QAAA,GAEH;AAAA,QACA,oBAAC,iBAAc,WAAU,uCACxB,+BAAC,KAAA,EAAI,SAAQ,QAAO,KAAK,KACxB,UAAA;AAAA,UAAA,oBAAC,QAAA,EAAO,WAAU,iDAAgD,SAAS,kBAAkB,UAAA,UAAM;AAAA,UACnG,oBAAC,UAAO,SAAS,MAAM,kBAAkB,UAAU,CAAC,iBAAiB,UAAA,WAAA,CAAQ;AAAA,QAAA,EAAA,CAC9E,EAAA,CACD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGH;"}
+{"version":3,"file":"index.esm.js","sources":["../../../../../src/views/template-editor/company-selection-modal/company-selection-modal.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React from 'react';\r\n\r\nimport Modal from '../../../components/modal/modal';\r\nimport Typography from '../../../components/typography/typography';\r\nimport Button from '../../../components/button/button';\r\nimport Select from '../../../components/select/select';\r\n\r\nimport {\r\n\tBox,\r\n\tDialogActions,\r\n\tDialogContent,\r\n\tDialogProps,\r\n\tDialogTitle,\r\n\tIconButton,\r\n\tMenuItem\r\n} from '@mui/material';\r\nimport Close from '@mui/icons-material/Close';\r\n\r\nimport './company-selection-modal.scss';\r\nimport { IEmail } from '../utils/types';\r\nimport { enqueueSnackbar } from 'notistack';\r\nimport { useNavigate } from 'react-router-dom';\r\n\r\ninterface CompanySelectionModalProps {\r\n\tisOpen: boolean;\r\n\tsetIsOpen: (value: IEmail | null) => void;\r\n\tmodalProps?: DialogProps;\r\n\temail: IEmail;\r\n\tcompanies: Record<string, any>[];\r\n\ttemplateRoutes: Record<string, any>\r\n}\r\n\r\nconst CompanySelectionModal: React.FC<CompanySelectionModalProps> = ({\r\n\tisOpen,\r\n\tsetIsOpen,\r\n\tmodalProps,\r\n\tcompanies,\r\n\temail,\r\n\ttemplateRoutes\r\n}) => {\r\n\r\n\tconst navigate = useNavigate();\r\n\tconst [selectedCompany, setSelectedCompany] = React.useState<number>(0);\r\n\r\n\tconst handleModalClose = () => {\r\n\t\tsetIsOpen(null);\r\n\t};\r\n\r\n\tconst handleContinue = () => {\r\n\t\tif(!selectedCompany) {\r\n\t\t\tenqueueSnackbar('Please select a company', { variant: 'error' });\r\n\t\t\treturn;\r\n\t\t} else if(!email) {\r\n\t\t\tenqueueSnackbar('Something went wrong for a subject', { variant: 'error' });\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tnavigate(templateRoutes.ADD_TEMPLATE(email._id), { state: { company_id: selectedCompany }})\r\n\t}\r\n\r\n\treturn (\r\n\t\t<Modal\r\n\t\t\topen={isOpen}\r\n\t\t\tonClose={handleModalClose}\r\n\t\t\tmaxWidth='xs'\r\n\t\t\tfullWidth\r\n\t\t\t{...modalProps}>\r\n\t\t\t<DialogTitle className='companySelectionModal--DialogTitle'>\r\n\t\t\t\t<Typography type='s3' color='inherit' weight='medium'>\r\n\t\t\t\t\tSelect Company\r\n\t\t\t\t</Typography>\r\n\t\t\t\t<IconButton onClick={handleModalClose}>\r\n\t\t\t\t\t<Close fontSize='small' />\r\n\t\t\t\t</IconButton>\r\n\t\t\t</DialogTitle>\r\n\t\t\t<DialogContent className='companySelectionModal--DialogContents'>\r\n\t\t\t\t<Select\r\n\t\t\t\t\tdisplayEmpty\r\n\t\t\t\t\tvalue={selectedCompany}\r\n\t\t\t\t\tsize='small'\r\n\t\t\t\t\trenderValue={(value) => value ? companies.find((option) => option.value === value)?.label : 'Select Company'}\r\n\t\t\t\t\tfullWidth\r\n\t\t\t\t\tsx={{\r\n\t\t\t\t\t\tbgcolor: 'white',\r\n\t\t\t\t\t\tborderRadius: 1,\r\n\t\t\t\t\t\t'& .MuiSelect-select': { py: 0.75 }\r\n\t\t\t\t\t}}\r\n\t\t\t\t\tonChange={(e) => {\r\n\t\t\t\t\t\tif (e.target.value) {\r\n\t\t\t\t\t\t\tsetSelectedCompany(e.target.value as number);\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}}>\r\n\t\t\t\t\t{companies.map((option) => (\r\n\t\t\t\t\t\t<MenuItem key={option.value} value={option.value}>\r\n\t\t\t\t\t\t\t<Typography type='s4' color='theme.secondary.1000'>{option.label}</Typography>\r\n\t\t\t\t\t\t</MenuItem>\r\n\t\t\t\t\t))}\r\n\t\t\t\t</Select>\r\n\t\t\t</DialogContent>\r\n\t\t\t<DialogActions className='companySelectionModal--DialogAction'>\r\n\t\t\t\t<Box display='flex' gap={1.5}>\r\n\t\t\t\t\t<Button className='companySelectionModal--DialogAction--WhiteBtn' onClick={handleModalClose}>Cancel</Button>\r\n\t\t\t\t\t<Button onClick={() => handleContinue()} disabled={!selectedCompany}>Continue</Button>\r\n\t\t\t\t</Box>\r\n\t\t\t</DialogActions>\r\n\t\t</Modal>\r\n\t);\r\n};\r\n\r\nexport default CompanySelectionModal;\r\n"],"names":["React","Close"],"mappings":";;;;;;;;;;;;;;;;AAkCA,MAAM,wBAA8D,CAAC;AAAA,EACpE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,MAAM;AAEL,QAAM,WAAW,YAAA;AACjB,QAAM,CAAC,iBAAiB,kBAAkB,IAAIA,eAAM,SAAiB,CAAC;AAEtE,QAAM,mBAAmB,MAAM;AAC9B,cAAU,IAAI;AAAA,EACf;AAEA,QAAM,iBAAiB,MAAM;AAC5B,QAAG,CAAC,iBAAiB;AACpB,sBAAgB,2BAA2B,EAAE,SAAS,QAAA,CAAS;AAC/D;AAAA,IACD,WAAU,CAAC,OAAO;AACjB,sBAAgB,sCAAsC,EAAE,SAAS,QAAA,CAAS;AAC1E;AAAA,IACD;AAEA,aAAS,eAAe,aAAa,MAAM,GAAG,GAAG,EAAE,OAAO,EAAE,YAAY,gBAAA,GAAkB;AAAA,EAC3F;AAEA,SACC;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAS;AAAA,MACT,WAAS;AAAA,MACR,GAAG;AAAA,MACJ,UAAA;AAAA,QAAA,qBAAC,aAAA,EAAY,WAAU,sCACtB,UAAA;AAAA,UAAA,oBAAC,cAAW,MAAK,MAAK,OAAM,WAAU,QAAO,UAAS,UAAA,iBAAA,CAEtD;AAAA,UACA,oBAAC,cAAW,SAAS,kBACpB,8BAACC,WAAA,EAAM,UAAS,SAAQ,EAAA,CACzB;AAAA,QAAA,GACD;AAAA,QACA,oBAAC,eAAA,EAAc,WAAU,yCACxB,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACA,cAAY;AAAA,YACZ,OAAO;AAAA,YACP,MAAK;AAAA,YACL,aAAa,CAAC;;AAAU,8BAAQ,eAAU,KAAK,CAAC,WAAW,OAAO,UAAU,KAAK,MAAjD,mBAAoD,QAAQ;AAAA;AAAA,YAC5F,WAAS;AAAA,YACT,IAAI;AAAA,cACH,SAAS;AAAA,cACT,cAAc;AAAA,cACd,uBAAuB,EAAE,IAAI,KAAA;AAAA,YAAK;AAAA,YAEnC,UAAU,CAAC,MAAM;AAChB,kBAAI,EAAE,OAAO,OAAO;AACnB,mCAAmB,EAAE,OAAO,KAAe;AAAA,cAC5C;AAAA,YACD;AAAA,YACC,UAAA,UAAU,IAAI,CAAC,+BACd,UAAA,EAA4B,OAAO,OAAO,OAC1C,UAAA,oBAAC,cAAW,MAAK,MAAK,OAAM,wBAAwB,UAAA,OAAO,OAAM,KADnD,OAAO,KAEtB,CACA;AAAA,UAAA;AAAA,QAAA,GAEH;AAAA,QACA,oBAAC,iBAAc,WAAU,uCACxB,+BAAC,KAAA,EAAI,SAAQ,QAAO,KAAK,KACxB,UAAA;AAAA,UAAA,oBAAC,QAAA,EAAO,WAAU,iDAAgD,SAAS,kBAAkB,UAAA,UAAM;AAAA,UACnG,oBAAC,UAAO,SAAS,MAAM,kBAAkB,UAAU,CAAC,iBAAiB,UAAA,WAAA,CAAQ;AAAA,QAAA,EAAA,CAC9E,EAAA,CACD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGH;"}

package/dist/views/template-editor/company-selection-modal/company-selection-modal/index.js

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("react"),l=,/* empty css                                        */t=,/* empty css                                                  */n=,/* empty css                                          */o=,/* empty css                                          */i=require("@mui/material"),r=require("@mui/icons-material/Close");;/* empty css                                     */var s=,/* empty css                                                      */c=require("react-router-dom");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=/* @__PURE__ */u(a),m=/* @__PURE__ */u(r);exports.default=({isOpen:a,setIsOpen:r,modalProps:u,companies:p,email:x,templateRoutes:h})=>{const y=c.useNavigate(),[j,g]=d.default.useState(0),f=()=>{r(null)};/* @__PURE__ */
-return e.jsxs(l.default,{open:a,onClose:f,maxWidth:"xs",fullWidth:!0,...u,children:[
-/* @__PURE__ */e.jsxs(i.DialogTitle,{className:"companySelectionModal--DialogTitle",children:[
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),a=,/* empty css                                        */t=,/* empty css                                                  */i=,/* empty css                                          */n=,/* empty css                                          */o=;/* empty css                                                        */;/* empty css                                     */var r=,/* empty css                                                      */s=require("react-router-dom"),u=,/* empty css                                                                    */d=,/* empty css                                                                  */c=,/* empty css                                                                        */m=,/* empty css                                                              */p=,/* empty css                                                                        */x=;/* empty css                                                    */function j(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=/* @__PURE__ */j(l);exports.default=({isOpen:l,setIsOpen:j,modalProps:y,companies:f,email:g,templateRoutes:q})=>{const v=s.useNavigate(),[C,_]=h.default.useState(0),b=()=>{j(null)};/* @__PURE__ */
+return e.jsxs(a.default,{open:l,onClose:b,maxWidth:"xs",fullWidth:!0,...y,children:[
+/* @__PURE__ */e.jsxs(u.default,{className:"companySelectionModal--DialogTitle",children:[
 /* @__PURE__ */e.jsx(t.Typography,{type:"s3",color:"inherit",weight:"medium",children:"Select Company"}),
-/* @__PURE__ */e.jsx(i.IconButton,{onClick:f,children:/* @__PURE__ */e.jsx(m.default,{fontSize:"small"})})]}),
-/* @__PURE__ */e.jsx(i.DialogContent,{className:"companySelectionModal--DialogContents",children:/* @__PURE__ */e.jsx(o.default,{displayEmpty:!0,value:j,size:"small",renderValue:e=>{var a;return e?null==(a=p.find(a=>a.value===e))?void 0:a.label:"Select Company"},fullWidth:!0,sx:{bgcolor:"white",borderRadius:1,"& .MuiSelect-select":{py:.75}},onChange:e=>{e.target.value&&g(e.target.value)},children:p.map(a=>/* @__PURE__ */e.jsx(i.MenuItem,{value:a.value,children:/* @__PURE__ */e.jsx(t.Typography,{type:"s4",color:"theme.secondary.1000",children:a.label})},a.value))})}),
-/* @__PURE__ */e.jsx(i.DialogActions,{className:"companySelectionModal--DialogAction",children:/* @__PURE__ */e.jsxs(i.Box,{display:"flex",gap:1.5,children:[
-/* @__PURE__ */e.jsx(n.default,{className:"companySelectionModal--DialogAction--WhiteBtn",onClick:f,children:"Cancel"}),
-/* @__PURE__ */e.jsx(n.default,{onClick:()=>{j?x?y(h.ADD_TEMPLATE(x._id),{state:{company_id:j}}):s.enqueueSnackbar("Something went wrong for a subject",{variant:"error"}):s.enqueueSnackbar("Please select a company",{variant:"error"})},disabled:!j,children:"Continue"})]})})]})};
+/* @__PURE__ */e.jsx(d.default,{onClick:b,children:/* @__PURE__ */e.jsx(o.default,{fontSize:"small"})})]}),
+/* @__PURE__ */e.jsx(c.default,{className:"companySelectionModal--DialogContents",children:/* @__PURE__ */e.jsx(n.default,{displayEmpty:!0,value:C,size:"small",renderValue:e=>{var l;return e?null==(l=f.find(l=>l.value===e))?void 0:l.label:"Select Company"},fullWidth:!0,sx:{bgcolor:"white",borderRadius:1,"& .MuiSelect-select":{py:.75}},onChange:e=>{e.target.value&&_(e.target.value)},children:f.map(l=>/* @__PURE__ */e.jsx(m.default,{value:l.value,children:/* @__PURE__ */e.jsx(t.Typography,{type:"s4",color:"theme.secondary.1000",children:l.label})},l.value))})}),
+/* @__PURE__ */e.jsx(p.default,{className:"companySelectionModal--DialogAction",children:/* @__PURE__ */e.jsxs(x.default,{display:"flex",gap:1.5,children:[
+/* @__PURE__ */e.jsx(i.default,{className:"companySelectionModal--DialogAction--WhiteBtn",onClick:b,children:"Cancel"}),
+/* @__PURE__ */e.jsx(i.default,{onClick:()=>{C?g?v(q.ADD_TEMPLATE(g._id),{state:{company_id:C}}):r.enqueueSnackbar("Something went wrong for a subject",{variant:"error"}):r.enqueueSnackbar("Please select a company",{variant:"error"})},disabled:!C,children:"Continue"})]})})]})};
 //# sourceMappingURL=index.js.map

package/dist/views/template-editor/company-selection-modal/company-selection-modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/company-selection-modal/company-selection-modal.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React from 'react';\r\n\r\nimport Modal from '../../../components/modal/modal';\r\nimport Typography from '../../../components/typography/typography';\r\nimport Button from '../../../components/button/button';\r\nimport Select from '../../../components/select/select';\r\n\r\nimport {\r\n\tBox,\r\n\tDialogActions,\r\n\tDialogContent,\r\n\tDialogProps,\r\n\tDialogTitle,\r\n\tIconButton,\r\n\tMenuItem\r\n} from '@mui/material';\r\nimport Close from '@mui/icons-material/Close';\r\n\r\nimport './company-selection-modal.scss';\r\nimport { IEmail } from '../utils/types';\r\nimport { enqueueSnackbar } from 'notistack';\r\nimport { useNavigate } from 'react-router-dom';\r\n\r\ninterface CompanySelectionModalProps {\r\n\tisOpen: boolean;\r\n\tsetIsOpen: (value: IEmail | null) => void;\r\n\tmodalProps?: DialogProps;\r\n\temail: IEmail;\r\n\tcompanies: Record<string, any>[];\r\n\ttemplateRoutes: Record<string, any>\r\n}\r\n\r\nconst CompanySelectionModal: React.FC<CompanySelectionModalProps> = ({\r\n\tisOpen,\r\n\tsetIsOpen,\r\n\tmodalProps,\r\n\tcompanies,\r\n\temail,\r\n\ttemplateRoutes\r\n}) => {\r\n\r\n\tconst navigate = useNavigate();\r\n\tconst [selectedCompany, setSelectedCompany] = React.useState<number>(0);\r\n\r\n\tconst handleModalClose = () => {\r\n\t\tsetIsOpen(null);\r\n\t};\r\n\r\n\tconst handleContinue = () => {\r\n\t\tif(!selectedCompany) {\r\n\t\t\tenqueueSnackbar('Please select a company', { variant: 'error' });\r\n\t\t\treturn;\r\n\t\t} else if(!email) {\r\n\t\t\tenqueueSnackbar('Something went wrong for a subject', { variant: 'error' });\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tnavigate(templateRoutes.ADD_TEMPLATE(email._id), { state: { company_id: selectedCompany }})\r\n\t}\r\n\r\n\treturn (\r\n\t\t<Modal\r\n\t\t\topen={isOpen}\r\n\t\t\tonClose={handleModalClose}\r\n\t\t\tmaxWidth='xs'\r\n\t\t\tfullWidth\r\n\t\t\t{...modalProps}>\r\n\t\t\t<DialogTitle className='companySelectionModal--DialogTitle'>\r\n\t\t\t\t<Typography type='s3' color='inherit' weight='medium'>\r\n\t\t\t\t\tSelect Company\r\n\t\t\t\t</Typography>\r\n\t\t\t\t<IconButton onClick={handleModalClose}>\r\n\t\t\t\t\t<Close fontSize='small' />\r\n\t\t\t\t</IconButton>\r\n\t\t\t</DialogTitle>\r\n\t\t\t<DialogContent className='companySelectionModal--DialogContents'>\r\n\t\t\t\t<Select\r\n\t\t\t\t\tdisplayEmpty\r\n\t\t\t\t\tvalue={selectedCompany}\r\n\t\t\t\t\tsize='small'\r\n\t\t\t\t\trenderValue={(value) => value ? companies.find((option) => option.value === value)?.label : 'Select Company'}\r\n\t\t\t\t\tfullWidth\r\n\t\t\t\t\tsx={{\r\n\t\t\t\t\t\tbgcolor: 'white',\r\n\t\t\t\t\t\tborderRadius: 1,\r\n\t\t\t\t\t\t'& .MuiSelect-select': { py: 0.75 }\r\n\t\t\t\t\t}}\r\n\t\t\t\t\tonChange={(e) => {\r\n\t\t\t\t\t\tif (e.target.value) {\r\n\t\t\t\t\t\t\tsetSelectedCompany(e.target.value as number);\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}}>\r\n\t\t\t\t\t{companies.map((option) => (\r\n\t\t\t\t\t\t<MenuItem key={option.value} value={option.value}>\r\n\t\t\t\t\t\t\t<Typography type='s4' color='theme.secondary.1000'>{option.label}</Typography>\r\n\t\t\t\t\t\t</MenuItem>\r\n\t\t\t\t\t))}\r\n\t\t\t\t</Select>\r\n\t\t\t</DialogContent>\r\n\t\t\t<DialogActions className='companySelectionModal--DialogAction'>\r\n\t\t\t\t<Box display='flex' gap={1.5}>\r\n\t\t\t\t\t<Button className='companySelectionModal--DialogAction--WhiteBtn' onClick={handleModalClose}>Cancel</Button>\r\n\t\t\t\t\t<Button onClick={() => handleContinue()} disabled={!selectedCompany}>Continue</Button>\r\n\t\t\t\t</Box>\r\n\t\t\t</DialogActions>\r\n\t\t</Modal>\r\n\t);\r\n};\r\n\r\nexport default CompanySelectionModal;\r\n"],"names":["isOpen","setIsOpen","modalProps","companies","email","templateRoutes","navigate","useNavigate","selectedCompany","setSelectedCompany","React","useState","handleModalClose","jsxs","Modal","open","onClose","maxWidth","fullWidth","children","DialogTitle","className","jsx","Typography","type","color","weight","IconButton","onClick","Close","fontSize","DialogContent","Select","displayEmpty","value","size","renderValue","_a","find","option","label","sx","bgcolor","borderRadius","py","onChange","e","target","map","MenuItem","DialogActions","Box","display","gap","Button","ADD_TEMPLATE","_id","state","company_id","enqueueSnackbar","variant","disabled"],"mappings":"mtBAkCoE,EACnEA,SACAC,YACAC,aACAC,YACAC,QACAC,qBAGA,MAAMC,EAAWC,EAAAA,eACVC,EAAiBC,GAAsBC,EAAAA,QAAMC,SAAiB,GAE/DC,EAAmB,KACxBX,EAAU;AAeX,OACCY,EAAAA,KAACC,EAAAA,QAAA,CACAC,KAAMf,EACNgB,QAASJ,EACTK,SAAS,KACTC,WAAS,KACLhB,EACJiB,SAAA;iBAAAN,KAACO,EAAAA,YAAA,CAAYC,UAAU,qCACtBF,SAAA;eAAAG,EAAAA,IAACC,EAAAA,YAAWC,KAAK,KAAKC,MAAM,UAAUC,OAAO,SAASP,SAAA;iBAGtDG,IAACK,EAAAA,YAAWC,QAAShB,EACpBO,8BAACU,UAAA,CAAMC,SAAS;eAGlBR,EAAAA,IAACS,EAAAA,cAAA,CAAcV,UAAU,wCACxBF,wBAAAG,EAAAA,IAACU,EAAAA,QAAA,CACAC,cAAY,EACZC,MAAO1B,EACP2B,KAAK,QACLC,YAAcF,UAAU,OAAAA,EAAQ,OAAAG,EAAAlC,EAAUmC,KAAMC,GAAWA,EAAOL,QAAUA,SAA5C,EAAAG,EAAoDG,MAAQ,kBAC5FtB,WAAS,EACTuB,GAAI,CACHC,QAAS,QACTC,aAAc,EACd,sBAAuB,CAAEC,GAAI,MAE9BC,SAAWC,IACNA,EAAEC,OAAOb,OACZzB,EAAmBqC,EAAEC,OAAOb,QAG7Bf,SAAAhB,EAAU6C,IAAKT,wBACdU,EAAAA,SAAA,CAA4Bf,MAAOK,EAAOL,MAC1Cf,wBAAAG,EAAAA,IAACC,EAAAA,YAAWC,KAAK,KAAKC,MAAM,uBAAwBN,SAAAoB,EAAOC,SAD7CD,EAAOL;iBAMzBZ,IAAC4B,EAAAA,eAAc7B,UAAU,sCACxBF,+BAACgC,EAAAA,IAAA,CAAIC,QAAQ,OAAOC,IAAK,IACxBlC,SAAA;eAAAG,MAACgC,EAAAA,QAAA,CAAOjC,UAAU,gDAAgDO,QAAShB,EAAkBO,SAAA;eAC7FG,MAACgC,EAAAA,SAAO1B,QAAS,KArDhBpB,EAGOJ,EAKXE,EAASD,EAAekD,aAAanD,EAAMoD,KAAM,CAAEC,MAAO,CAAEC,WAAYlD,KAJvEmD,EAAAA,gBAAgB,qCAAsC,CAAEC,QAAS,UAHjED,EAAAA,gBAAgB,0BAA2B,CAAEC,QAAS,WAoDXC,UAAWrD,EAAiBW,SAAA"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/company-selection-modal/company-selection-modal.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React from 'react';\r\n\r\nimport Modal from '../../../components/modal/modal';\r\nimport Typography from '../../../components/typography/typography';\r\nimport Button from '../../../components/button/button';\r\nimport Select from '../../../components/select/select';\r\n\r\nimport {\r\n\tBox,\r\n\tDialogActions,\r\n\tDialogContent,\r\n\tDialogProps,\r\n\tDialogTitle,\r\n\tIconButton,\r\n\tMenuItem\r\n} from '@mui/material';\r\nimport Close from '@mui/icons-material/Close';\r\n\r\nimport './company-selection-modal.scss';\r\nimport { IEmail } from '../utils/types';\r\nimport { enqueueSnackbar } from 'notistack';\r\nimport { useNavigate } from 'react-router-dom';\r\n\r\ninterface CompanySelectionModalProps {\r\n\tisOpen: boolean;\r\n\tsetIsOpen: (value: IEmail | null) => void;\r\n\tmodalProps?: DialogProps;\r\n\temail: IEmail;\r\n\tcompanies: Record<string, any>[];\r\n\ttemplateRoutes: Record<string, any>\r\n}\r\n\r\nconst CompanySelectionModal: React.FC<CompanySelectionModalProps> = ({\r\n\tisOpen,\r\n\tsetIsOpen,\r\n\tmodalProps,\r\n\tcompanies,\r\n\temail,\r\n\ttemplateRoutes\r\n}) => {\r\n\r\n\tconst navigate = useNavigate();\r\n\tconst [selectedCompany, setSelectedCompany] = React.useState<number>(0);\r\n\r\n\tconst handleModalClose = () => {\r\n\t\tsetIsOpen(null);\r\n\t};\r\n\r\n\tconst handleContinue = () => {\r\n\t\tif(!selectedCompany) {\r\n\t\t\tenqueueSnackbar('Please select a company', { variant: 'error' });\r\n\t\t\treturn;\r\n\t\t} else if(!email) {\r\n\t\t\tenqueueSnackbar('Something went wrong for a subject', { variant: 'error' });\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tnavigate(templateRoutes.ADD_TEMPLATE(email._id), { state: { company_id: selectedCompany }})\r\n\t}\r\n\r\n\treturn (\r\n\t\t<Modal\r\n\t\t\topen={isOpen}\r\n\t\t\tonClose={handleModalClose}\r\n\t\t\tmaxWidth='xs'\r\n\t\t\tfullWidth\r\n\t\t\t{...modalProps}>\r\n\t\t\t<DialogTitle className='companySelectionModal--DialogTitle'>\r\n\t\t\t\t<Typography type='s3' color='inherit' weight='medium'>\r\n\t\t\t\t\tSelect Company\r\n\t\t\t\t</Typography>\r\n\t\t\t\t<IconButton onClick={handleModalClose}>\r\n\t\t\t\t\t<Close fontSize='small' />\r\n\t\t\t\t</IconButton>\r\n\t\t\t</DialogTitle>\r\n\t\t\t<DialogContent className='companySelectionModal--DialogContents'>\r\n\t\t\t\t<Select\r\n\t\t\t\t\tdisplayEmpty\r\n\t\t\t\t\tvalue={selectedCompany}\r\n\t\t\t\t\tsize='small'\r\n\t\t\t\t\trenderValue={(value) => value ? companies.find((option) => option.value === value)?.label : 'Select Company'}\r\n\t\t\t\t\tfullWidth\r\n\t\t\t\t\tsx={{\r\n\t\t\t\t\t\tbgcolor: 'white',\r\n\t\t\t\t\t\tborderRadius: 1,\r\n\t\t\t\t\t\t'& .MuiSelect-select': { py: 0.75 }\r\n\t\t\t\t\t}}\r\n\t\t\t\t\tonChange={(e) => {\r\n\t\t\t\t\t\tif (e.target.value) {\r\n\t\t\t\t\t\t\tsetSelectedCompany(e.target.value as number);\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}}>\r\n\t\t\t\t\t{companies.map((option) => (\r\n\t\t\t\t\t\t<MenuItem key={option.value} value={option.value}>\r\n\t\t\t\t\t\t\t<Typography type='s4' color='theme.secondary.1000'>{option.label}</Typography>\r\n\t\t\t\t\t\t</MenuItem>\r\n\t\t\t\t\t))}\r\n\t\t\t\t</Select>\r\n\t\t\t</DialogContent>\r\n\t\t\t<DialogActions className='companySelectionModal--DialogAction'>\r\n\t\t\t\t<Box display='flex' gap={1.5}>\r\n\t\t\t\t\t<Button className='companySelectionModal--DialogAction--WhiteBtn' onClick={handleModalClose}>Cancel</Button>\r\n\t\t\t\t\t<Button onClick={() => handleContinue()} disabled={!selectedCompany}>Continue</Button>\r\n\t\t\t\t</Box>\r\n\t\t\t</DialogActions>\r\n\t\t</Modal>\r\n\t);\r\n};\r\n\r\nexport default CompanySelectionModal;\r\n"],"names":["isOpen","setIsOpen","modalProps","companies","email","templateRoutes","navigate","useNavigate","selectedCompany","setSelectedCompany","React","useState","handleModalClose","jsxs","Modal","open","onClose","maxWidth","fullWidth","children","DialogTitle","className","jsx","Typography","type","color","weight","IconButton","onClick","Close","fontSize","DialogContent","Select","displayEmpty","value","size","renderValue","_a","find","option","label","sx","bgcolor","borderRadius","py","onChange","e","target","map","MenuItem","DialogActions","Box","display","gap","Button","ADD_TEMPLATE","_id","state","company_id","enqueueSnackbar","variant","disabled"],"mappings":"krCAkCoE,EACnEA,SACAC,YACAC,aACAC,YACAC,QACAC,qBAGA,MAAMC,EAAWC,EAAAA,eACVC,EAAiBC,GAAsBC,EAAAA,QAAMC,SAAiB,GAE/DC,EAAmB,KACxBX,EAAU;AAeX,OACCY,EAAAA,KAACC,EAAAA,QAAA,CACAC,KAAMf,EACNgB,QAASJ,EACTK,SAAS,KACTC,WAAS,KACLhB,EACJiB,SAAA;iBAAAN,KAACO,EAAAA,QAAA,CAAYC,UAAU,qCACtBF,SAAA;eAAAG,EAAAA,IAACC,EAAAA,YAAWC,KAAK,KAAKC,MAAM,UAAUC,OAAO,SAASP,SAAA;iBAGtDG,IAACK,EAAAA,SAAWC,QAAShB,EACpBO,8BAACU,UAAA,CAAMC,SAAS;eAGlBR,EAAAA,IAACS,EAAAA,QAAA,CAAcV,UAAU,wCACxBF,wBAAAG,EAAAA,IAACU,EAAAA,QAAA,CACAC,cAAY,EACZC,MAAO1B,EACP2B,KAAK,QACLC,YAAcF,UAAU,OAAAA,EAAQ,OAAAG,EAAAlC,EAAUmC,KAAMC,GAAWA,EAAOL,QAAUA,SAA5C,EAAAG,EAAoDG,MAAQ,kBAC5FtB,WAAS,EACTuB,GAAI,CACHC,QAAS,QACTC,aAAc,EACd,sBAAuB,CAAEC,GAAI,MAE9BC,SAAWC,IACNA,EAAEC,OAAOb,OACZzB,EAAmBqC,EAAEC,OAAOb,QAG7Bf,SAAAhB,EAAU6C,IAAKT,wBACdU,EAAAA,QAAA,CAA4Bf,MAAOK,EAAOL,MAC1Cf,wBAAAG,EAAAA,IAACC,EAAAA,YAAWC,KAAK,KAAKC,MAAM,uBAAwBN,SAAAoB,EAAOC,SAD7CD,EAAOL;iBAMzBZ,IAAC4B,EAAAA,SAAc7B,UAAU,sCACxBF,+BAACgC,EAAAA,QAAA,CAAIC,QAAQ,OAAOC,IAAK,IACxBlC,SAAA;eAAAG,MAACgC,EAAAA,QAAA,CAAOjC,UAAU,gDAAgDO,QAAShB,EAAkBO,SAAA;eAC7FG,MAACgC,EAAAA,SAAO1B,QAAS,KArDhBpB,EAGOJ,EAKXE,EAASD,EAAekD,aAAanD,EAAMoD,KAAM,CAAEC,MAAO,CAAEC,WAAYlD,KAJvEmD,EAAAA,gBAAgB,qCAAsC,CAAEC,QAAS,UAHjED,EAAAA,gBAAgB,0BAA2B,CAAEC,QAAS,WAoDXC,UAAWrD,EAAiBW,SAAA"}

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

@@ -2,11 +2,13 @@ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import React__default, { useMemo, useState, useRef, useEffect } from "react";
 import { useDroppable } from "../../../../node_modules/@dnd-kit/core/dist/core.esm/index.esm.js";
 import EditorSection from "../EditorSection/index.esm.js";
-import { Box, Container, Paper } from "@mui/material";
 import { Typography } from "../../../../components/typography/typography/index.esm.js";
 import SectionFormatPanel from "../SectionFormatPanel/index.esm.js";
 import EditorSidebar from "../EditorSidebar/index.esm.js";
 import { generateEmailPreview, generateHeaderFooterPreview } from "../../utils/common/index.esm.js";
+import Box from "../../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import Container from "../../../../node_modules/@mui/material/Container/Container/index.esm.js";
+import Paper from "../../../../node_modules/@mui/material/Paper/Paper/index.esm.js";
 const CANVAS_TYPES = {
   HEADER: "header",
   MAIN: "main",

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 */\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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"}