react-edit-to-html 1.1.7 → 1.1.8

package/README.md

@@ -70,14 +70,7 @@ export default function MyBuilderPage() {
     { label: 'Customer Name', placeholder: '{{customer_name}}', category: 'General', mockValue: 'Sophia Mueller' }
   ];
 
-  const handleBlocksChange = (blocks) => {
-    console.log('Canvas updated:', blocks);
-  };
-
-  const handleExportHtml = (html) => {
-    console.log('Exported HTML markup:', html);
-    // You can send this HTML markup directly to your backend API or save it!
-  };
+  
 
   return (
     <div style={{ height: '100vh', width: '100vw' }}>
@@ -86,10 +79,9 @@ export default function MyBuilderPage() {
         headerSubtitle="Build invoices & export dynamic templates"
         tableSchemas={customTables}
         placeholders={customPlaceholders}
-        templatingLanguage="handlebars"
+        templatingLanguage="csharp"
         loopSyntax="each"
-        onChange={handleBlocksChange}
-        onExport={handleExportHtml}
+        
       />
     </div>
   );

package/dist/index.cjs

@@ -55,7 +55,7 @@ fn fs_main(in : VertexOutput) -> @location(0) vec4<f32> {
     <rect width="100%" height="100%" fill="white" />
     <g>${o}</g>
     <text x="${a/2}" y="67" font-family="monospace" font-size="10" text-anchor="middle" fill="black">${n}</text>
-  </svg>`},vb=(e,t)=>{let n=`11px`,r=`400`;return e===`h1`?(n=`24px`,r=`700`):e===`h2`?(n=`20px`,r=`700`):e===`h3`?(n=`16px`,r=`600`):e===`h4`?(n=`14px`,r=`600`):e===`h5`?(n=`12px`,r=`600`):e===`h6`?(n=`10px`,r=`600`):e===`title`?(n=`28px`,r=`800`):e===`subtitle`?(n=`14px`,r=`300`):e===`caption`&&(n=`9px`,r=`400`),{id:`block-${Math.random().toString(36).substr(2,9)}`,type:e,content:t,style:{fontSize:n,fontWeight:r,color:`#1e293b`,backgroundColor:`transparent`,textAlign:`left`,bold:[`h1`,`h2`,`h3`,`h4`,`h5`,`h6`,`title`].includes(e),italic:!1,underline:!1,strikethrough:!1,width:`100%`,marginBottom:`8px`,padding:`8px`,minHeight:`auto`}}},yb=e=>{let t=new DOMParser().parseFromString(e,`text/html`),n=[],r=Array.from(t.body.children);if(r.length===0){let e=t.body.innerText||t.body.textContent||``;e.trim()&&n.push(vb(`p`,e.trim()))}else{let e=t.querySelectorAll(`style`),i=[];e.forEach(e=>{let t=e.textContent||``,n=/([^{]+)\{([^}]+)\}/g,r;for(;(r=n.exec(t))!==null;){let e=r[1].trim(),t=r[2].trim(),n={};t.split(`;`).forEach(e=>{let t=e.split(`:`);t.length===2&&(n[t[0].trim().toLowerCase()]=t[1].trim())}),i.push({selector:e,styles:n})}});let a=e=>{let t={fontSize:`11px`,fontWeight:`400`,color:`#1e293b`,backgroundColor:`transparent`,textAlign:`left`,bold:!1,italic:!1,underline:!1,strikethrough:!1,width:`100%`,marginBottom:`8px`,padding:`8px`},n=e.style;return n.fontSize&&(t.fontSize=n.fontSize),n.fontWeight&&(t.fontWeight=n.fontWeight),n.color&&(t.color=n.color),n.backgroundColor&&(t.backgroundColor=n.backgroundColor),n.textAlign&&(t.textAlign=n.textAlign),n.padding&&(t.padding=n.padding),n.marginBottom&&(t.marginBottom=n.marginBottom),n.width&&(t.width=n.width),i.forEach(n=>{try{e.matches(n.selector)&&(n.styles[`font-size`]&&(t.fontSize=n.styles[`font-size`]),n.styles[`font-weight`]&&(t.fontWeight=n.styles[`font-weight`]),n.styles.color&&(t.color=n.styles.color),n.styles[`background-color`]&&(t.backgroundColor=n.styles[`background-color`]),n.styles[`text-align`]&&(t.textAlign=n.styles[`text-align`]),n.styles.padding&&(t.padding=n.styles.padding),n.styles[`margin-bottom`]&&(t.marginBottom=n.styles[`margin-bottom`]),n.styles.width&&(t.width=n.styles.width))}catch(e){}}),(t.fontWeight===`bold`||parseInt(t.fontWeight)>=600)&&(t.bold=!0),t};r.forEach(e=>{let t=e;if(t.tagName===`STYLE`)return;let r=t.querySelector(`table, img, h1, h2, h3, h4, h5, h6, p, span, div`)||t,i=r.tagName.toLowerCase(),o=a(r);if(i===`table`){let e=Array.from(r.querySelectorAll(`thead th`));e.length===0&&(e=Array.from(r.querySelectorAll(`tr:first-child th, tr:first-child td`)));let t=e.map(e=>{var t,n;return{columnName:((t=e.textContent)==null?void 0:t.trim())||`Header`,placeholder:`{{item.${((n=e.textContent)==null?void 0:n.trim().toLowerCase().replace(/\s+/g,`_`))||`field`}}}`,enabled:!0}});n.push({id:`block-${Math.random().toString(36).substr(2,9)}`,type:`table`,content:``,style:o,tableInfo:{tableName:`imported_table`,columns:t,loop:!0,isNestable:!1,parentPath:`items`,maxNestingDepth:5,nestingPrefix:` `,showNestingLevel:!1}})}else if(i===`img`)n.push({id:`block-${Math.random().toString(36).substr(2,9)}`,type:`image`,content:``,style:o,imageInfo:{imageType:`logo`,url:r.getAttribute(`src`)||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`}});else if(i===`svg`)n.push({id:`block-${Math.random().toString(36).substr(2,9)}`,type:`image`,content:``,style:o,imageInfo:{imageType:`barcode`,barcodeValue:`SHIP-99201`,barcodePlaceholder:`{{barcode}}`}});else{let e=`p`;[`h1`,`h2`,`h3`,`h4`,`h5`,`h6`].includes(i)?e=i:i===`span`&&(e=`caption`),n.push({id:`block-${Math.random().toString(36).substr(2,9)}`,type:e,content:r.innerHTML||r.textContent||``,style:o})}})}return n},bb=function(){var e=_(function*(e,t){let n=yield t.getDocument({data:new Uint8Array(e)}).promise,r=[],i=Math.min(n.numPages,3);for(let e=1;e<=i;e++){let t=(yield(yield n.getPage(e)).getTextContent()).items.map(e=>({text:e.str,x:e.transform[4],y:e.transform[5],fontSize:e.transform[3]})).filter(e=>e.text.trim()!==``);if(t.length===0)continue;t.sort((e,t)=>Math.abs(e.y-t.y)<6?e.x-t.x:t.y-e.y);let i=[],a=[];if(t.forEach(e=>{if(a.length===0)a.push(e);else{let t=a[a.length-1];if(Math.abs(e.y-t.y)<6)a.push(e);else{let t=a.map(e=>e.text).join(` `),n=a.reduce((e,t)=>e+t.y,0)/a.length,r=Math.max(...a.map(e=>e.fontSize));i.push({y:n,fontSize:r,text:t}),a=[e]}}}),a.length>0){let e=a.map(e=>e.text).join(` `),t=a.reduce((e,t)=>e+t.y,0)/a.length,n=Math.max(...a.map(e=>e.fontSize));i.push({y:t,fontSize:n,text:e})}i.forEach(e=>{let t=`p`,n=e.fontSize>16;n?t=e.fontSize>26?`h1`:e.fontSize>20?`h2`:`h3`:e.fontSize<10&&(t=`caption`);let i=Math.round(e.fontSize*1.15)+`px`;r.push({id:`pdf-block-${Math.random().toString(36).substr(2,9)}`,type:t,content:e.text,style:{fontSize:i,fontWeight:n?`700`:`400`,color:`#1e293b`,backgroundColor:`transparent`,textAlign:`left`,bold:n,italic:!1,underline:!1,strikethrough:!1}})})}return r});return function(t,n){return e.apply(this,arguments)}}();function xb({initialBlocks:e,defaultStyles:t,defaultLogo:n,defaultBanner:r,onChange:i}={}){let[a,o]=(0,l.useState)(e||[]),[s,c]=(0,l.useState)(null);(0,l.useEffect)(()=>{i&&i(a)},[a,i]);let u=()=>a.find(e=>e.id===s)||null,d=(e,t,n)=>{let r={};return e===`title`?r={fontSize:`24px`,fontWeight:`800`}:e===`subtitle`?r={fontSize:`14px`,fontWeight:`700`,color:`#64748b`}:e===`h1`?r={fontSize:`20px`,fontWeight:`800`}:e===`h2`?r={fontSize:`18px`,fontWeight:`700`}:e===`h3`?r={fontSize:`16px`,fontWeight:`600`}:e===`caption`&&(r={fontSize:`10px`,color:`#94a3b8`}),{id:Math.random().toString(36).substring(2,11),type:e,content:t,style:w(w({fontSize:`12px`,fontWeight:`normal`,textAlign:`left`,color:`#1e293b`,backgroundColor:`transparent`,marginBottom:`0px`,padding:`0px`,bold:!1,italic:!1,underline:!1,strikethrough:!1},r),n)}},f=e=>w(w({},e),{},{columns:e.columns?e.columns.map(f):void 0});return{blocks:a,setBlocks:o,selectedBlockId:s,setSelectedBlockId:c,getSelectedBlock:u,createTextBlock:d,createTableBlock:e=>({id:Math.random().toString(36).substring(2,11),type:`table`,content:``,style:w({fontSize:`11px`,fontWeight:`normal`,textAlign:`left`,color:`#334155`,backgroundColor:`transparent`,marginBottom:`0px`,padding:`0px`,bold:!1,italic:!1,underline:!1,strikethrough:!1},(t==null?void 0:t.table)||{}),tableInfo:w(w({},e),{},{columns:e.columns.map(f),mockRows:[]})}),createImageBlock:e=>{let i=`100%`,a=`120px`;return e===`logo`?(i=`120px`,a=`60px`):e===`banner`?(i=`100%`,a=`150px`):e===`barcode`?(i=`200px`,a=`80px`):e===`watermark`&&(i=`300px`,a=`300px`),{id:Math.random().toString(36).substring(2,11),type:`image`,content:``,style:w(w({fontSize:`12px`,fontWeight:`normal`,color:`#000055`,backgroundColor:`transparent`,textAlign:`center`,marginBottom:`0px`,padding:`0px`,width:i,height:a,minHeight:a,bold:!1,italic:!1,underline:!1,strikethrough:!1},(t==null?void 0:t.image)||{}),e===`watermark`?{opacity:`0.2`,position:`absolute`,top:`0`,left:`0`,zIndex:10,height:`100%`}:{}),imageInfo:{imageType:e,url:e===`logo`?n||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`:e===`banner`?r||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`:fb,barcodeValue:e===`barcode`?`SHIP-99201`:void 0,barcodePlaceholder:e===`barcode`?`{{barcode}}`:void 0}}},handleDeleteBlock:e=>{o(t=>t.filter(t=>t.id!==e)),s===e&&c(null)},handleDuplicateBlock:e=>{let t=a.find(t=>t.id===e);if(!t)return;let n=w(w({},t),{},{id:Math.random().toString(36).substring(2,11),style:w({},t.style),tableInfo:t.tableInfo?w(w({},t.tableInfo),{},{columns:t.tableInfo.columns.map(f),mockRows:t.tableInfo.mockRows?[...t.tableInfo.mockRows]:void 0}):void 0,imageInfo:t.imageInfo?w({},t.imageInfo):void 0}),r=a.findIndex(t=>t.id===e);o(e=>{let t=[...e];return t.splice(r+1,0,n),t}),c(n.id)},handleMoveBlockUp:e=>{e!==0&&o(t=>{let n=[...t],r=n[e];return n[e]=n[e-1],n[e-1]=r,n})},handleMoveBlockDown:e=>{e!==a.length-1&&o(t=>{let n=[...t],r=n[e];return n[e]=n[e+1],n[e+1]=r,n})},updateSelectedStyle:(e,t)=>{s&&o(n=>n.map(n=>n.id===s?w(w({},n),{},{style:w(w({},n.style),{},{[e]:t})}):n))},updateSelectedImageInfo:(e,t)=>{s&&o(i=>i.map(i=>{if(i.id===s&&i.type===`image`){let a={};return e===`imageType`&&(a=t===`logo`?{url:n||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`}:t===`banner`?{url:r||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`}:t===`barcode`?{barcodeValue:`SHIP-99201`,barcodePlaceholder:`{{barcode}}`}:{url:fb}),w(w({},i),{},{imageInfo:w(w({},i.imageInfo),{},{[e]:t},a)})}return i}))},handleRemoveTableColumn:(e,t)=>{s&&o(n=>n.map(n=>{if(n.id===s&&n.type===`table`&&n.tableInfo){var r;let i=[...n.tableInfo.columns];if(t!==void 0&&(r=i[e])!=null&&r.columns){let n=i[e].columns.filter((e,n)=>n!==t);i[e]=w(w({},i[e]),{},{columns:n})}else i.splice(e,1);return w(w({},n),{},{tableInfo:w(w({},n.tableInfo),{},{columns:i})})}return n}))},handleAddTableColumn:(e,t,n,r)=>{!s||!e.trim()||o(i=>i.map(i=>{if(i.id===s&&i.type===`table`&&i.tableInfo){let a=[...i.tableInfo.columns];if(r!==void 0&&a[r]){let n=a[r].columns||[];a[r]=w(w({},a[r]),{},{loop:!0,columns:[...n,{columnName:e.trim(),placeholder:t.trim(),enabled:!0}]})}else n?a.push({columnName:e.trim(),placeholder:t.trim(),enabled:!0,loop:!0,columns:[{columnName:`Item Name`,placeholder:`{{item.name}}`,enabled:!0},{columnName:`Price`,placeholder:`{{item.price}}`,enabled:!0}]}):a.push({columnName:e.trim(),placeholder:t.trim(),enabled:!0});return w(w({},i),{},{tableInfo:w(w({},i.tableInfo),{},{columns:a})})}return i}))},handleUpdateTableColumn:(e,t,n,r)=>{s&&o(i=>i.map(i=>{if(i.id===s&&i.type===`table`&&i.tableInfo){var a;let o=[...i.tableInfo.columns];if(r!==void 0&&(a=o[e])!=null&&a.columns){let i=[...o[e].columns];i[r]=w(w({},i[r]),{},{columnName:t.trim(),placeholder:n.trim()}),o[e]=w(w({},o[e]),{},{columns:i})}else o[e]&&(o[e]=w(w({},o[e]),{},{columnName:t.trim(),placeholder:n.trim()}));return w(w({},i),{},{tableInfo:w(w({},i.tableInfo),{},{columns:o})})}return i}))},handleReorderTableColumn:(e,t,n)=>{s&&o(r=>r.map(r=>{if(r.id===s&&r.type===`table`&&r.tableInfo){var i;let a=[...r.tableInfo.columns];if(n!==void 0&&(i=a[e])!=null&&i.columns){let r=[...a[e].columns],i=t===`up`?n-1:n+1;if(i>=0&&i<r.length){let t=r[n];r[n]=r[i],r[i]=t,a[e]=w(w({},a[e]),{},{columns:r})}}else{let n=t===`up`?e-1:e+1;if(n>=0&&n<a.length){let t=a[e];a[e]=a[n],a[n]=t}}return w(w({},r),{},{tableInfo:w(w({},r.tableInfo),{},{columns:a})})}return r}))},handleAddTableRow:e=>{let t=e||s;t&&o(e=>e.map(e=>{if(e.id===t&&e.type===`table`&&e.tableInfo){let t=e.tableInfo.columns||[],n=e.tableInfo.mockRows&&e.tableInfo.mockRows.length>0?e.tableInfo.mockRows:[{}],r={};return t.forEach(e=>{e.columnName&&(r[e.columnName]=e.placeholder||``)}),w(w({},e),{},{tableInfo:w(w({},e.tableInfo),{},{mockRows:[...n,r]})})}return e}))},handleRemoveTableRow:(e,t)=>{let n=t||s;n&&o(t=>t.map(t=>{if(t.id===n&&t.type===`table`&&t.tableInfo){let n=t.tableInfo.mockRows&&t.tableInfo.mockRows.length>0?t.tableInfo.mockRows:[{}];if(n.length<=1)return w(w({},t),{},{tableInfo:w(w({},t.tableInfo),{},{mockRows:[{}]})});let r=n.filter((t,n)=>n!==e);return w(w({},t),{},{tableInfo:w(w({},t.tableInfo),{},{mockRows:r})})}return t}))}}}function Sb(){let[e,t]=(0,l.useState)(.7),[n,r]=(0,l.useState)({x:0,y:0}),[i,a]=(0,l.useState)(!1),[o,s]=(0,l.useState)(!1),[c,u]=(0,l.useState)(1123),d=(0,l.useRef)({x:0,y:0}),f=(0,l.useRef)(null),p=(0,l.useRef)(null);return(0,l.useEffect)(()=>{let e=e=>{let t=document.activeElement,n=t&&(t.tagName===`INPUT`||t.tagName===`TEXTAREA`||t.getAttribute(`contenteditable`)===`true`);e.code===`Space`&&!n&&(s(!0),e.preventDefault())},t=e=>{e.code===`Space`&&s(!1)};return window.addEventListener(`keydown`,e),window.addEventListener(`keyup`,t),()=>{window.removeEventListener(`keydown`,e),window.removeEventListener(`keyup`,t)}},[]),(0,l.useEffect)(()=>{if(!p.current)return;let e=new ResizeObserver(e=>{for(let t of e)u(t.target.scrollHeight)});return e.observe(p.current),()=>e.disconnect()},[]),{zoom:e,setZoom:t,panOffset:n,setPanOffset:r,isPanning:i,setIsPanning:a,spacePressed:o,setSpacePressed:s,canvasHeight:c,setCanvasHeight:u,viewportRef:f,canvasContainerRef:p,handleMouseDown:e=>{o&&(a(!0),d.current={x:e.clientX-n.x,y:e.clientY-n.y})},handleMouseMove:e=>{i&&o&&r({x:e.clientX-d.current.x,y:e.clientY-d.current.y})},handleMouseUp:()=>{a(!1)},handleZoomIn:()=>t(e=>Math.min(e+.1,2)),handleZoomOut:()=>t(e=>Math.max(e-.1,.5)),handleZoomReset:()=>{t(1),r({x:0,y:0})}}}function Cb({tableSchemas:e}={}){let[t,n]=(0,l.useState)(`invoice_items`),[r,i]=(0,l.useState)(`{% for item in invoice.items %}`),[a,o]=(0,l.useState)(`{% endfor %}`),[s,c]=(0,l.useState)(``),[u,d]=(0,l.useState)(``),[f,p]=(0,l.useState)(null),[m,h]=(0,l.useState)([]),[g,_]=(0,l.useState)(!1),[v,y]=(0,l.useState)(``),[b,x]=(0,l.useState)(null),[S,C]=(0,l.useState)(``),[T,E]=(0,l.useState)(null),[D,ee]=(0,l.useState)(null),[O,k]=(0,l.useState)(``),[te,A]=(0,l.useState)([]),ne=e=>({columnName:e.columnName||e.columnNameEn||e.columnNameDe||``,placeholder:e.placeholder||``,enabled:e.enabled!==!1,loop:!!e.loop,columns:Array.isArray(e.columns)?e.columns.map(ne):void 0});(0,l.useEffect)(()=>{e&&e.length>0?h(e.map(e=>w(w({},e),{},{columns:e.columns.map(ne)}))):h([])},[e]);let re=()=>{if(!t.trim())return;let e={tableName:t.trim().replace(/\s+/g,`_`).toLowerCase(),columns:[{columnName:`Description`,placeholder:`{{description}}`,enabled:!0},{columnName:`Qty`,placeholder:`{{quantity}}`,enabled:!0},{columnName:`Total Price`,placeholder:`{{total_price}}`,enabled:!0}],loop:!0,isNestable:!1,parentPath:`items`,maxNestingDepth:5,nestingPrefix:` `,showNestingLevel:!1,loopStartTag:r,loopEndTag:a};h(t=>[...t,e]),n(``)},j=()=>{if(!O.trim())return;let e=O.trim().toLowerCase().replace(/\s+/g,`_`);if(te.some(t=>t.imageType===e)){k(``);return}A(t=>[...t,{label:O.trim(),imageType:e,description:`Placeholder container for ${O.trim()}`}]),k(``)},ie=(e,t,n)=>{h(r=>r.map((r,i)=>{if(i===e){var a;let e=[...r.columns];if(n!==void 0&&(a=e[t])!=null&&a.columns){let r=[...e[t].columns];r[n]=w(w({},r[n]),{},{enabled:r[n].enabled===!1}),e[t]=w(w({},e[t]),{},{columns:r})}else e[t]=w(w({},e[t]),{},{enabled:e[t].enabled===!1});return w(w({},r),{},{columns:e})}return r}))},[ae,oe]=(0,l.useState)(null);return{customTableName:t,setCustomTableName:n,customLoopStart:r,setCustomLoopStart:i,customLoopEnd:a,setCustomLoopEnd:o,newColName:s,setNewColName:c,newColPlaceholder:u,setNewColPlaceholder:d,bubbleCoords:f,setBubbleCoords:p,schemas:m,setSchemas:h,isParsing:g,setIsParsing:_,parseStatusText:v,setParseStatusText:y,parseError:b,setParseError:x,draggedSidebarItem:T,setDraggedSidebarItem:E,dragOverIndex:D,setDragOverIndex:ee,newImgTypeName:O,setNewImgTypeName:k,customImageTypes:te,setCustomImageTypes:A,searchPlaceholder:S,setSearchPlaceholder:C,handleAddCustomTable:re,handleAddCustomImageType:j,toggleSchemaColumn:ie,applySelectionFormat:(e,t=``)=>{if(ae){let e=window.getSelection();e==null||e.removeAllRanges(),e==null||e.addRange(ae)}document.execCommand(e,!1,t),p(null)},setSavedRange:oe}}var wb=(...e)=>e.filter((e,t,n)=>!!e&&e.trim()!==``&&n.indexOf(e)===t).join(` `).trim(),Tb=e=>e.replace(/([a-z0-9])([A-Z])/g,`$1-$2`).toLowerCase(),Eb=e=>e.replace(/^([A-Z])|[\s-_]+(\w)/g,(e,t,n)=>n?n.toUpperCase():t.toLowerCase()),Db=e=>{let t=Eb(e);return t.charAt(0).toUpperCase()+t.slice(1)},Ob={xmlns:`http://www.w3.org/2000/svg`,width:24,height:24,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:2,strokeLinecap:`round`,strokeLinejoin:`round`},kb=e=>{for(let t in e)if(t.startsWith(`aria-`)||t===`role`||t===`title`)return!0;return!1},Ab=(0,l.createContext)({}),jb=()=>(0,l.useContext)(Ab);function Mb(e,t){if(e==null)return{};var n={};for(var r in e)if({}.hasOwnProperty.call(e,r)){if(t.includes(r))continue;n[r]=e[r]}return n}function Nb(e,t){if(e==null)return{};var n,r,i=Mb(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)n=a[r],t.includes(n)||{}.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}var Pb=[`color`,`size`,`strokeWidth`,`absoluteStrokeWidth`,`className`,`children`,`iconNode`],Fb=(0,l.forwardRef)((e,t)=>{var n,r,i;let{color:a,size:o,strokeWidth:s,absoluteStrokeWidth:c,className:u=``,children:d,iconNode:f}=e,p=Nb(e,Pb),{size:m=24,strokeWidth:h=2,absoluteStrokeWidth:g=!1,color:_=`currentColor`,className:v=``}=(n=jb())==null?{}:n,y=(c==null?g:c)?Number(s==null?h:s)*24/Number(o==null?m:o):s==null?h:s;return(0,l.createElement)(`svg`,w(w(w({ref:t},Ob),{},{width:(r=o==null?m:o)==null?Ob.width:r,height:(i=o==null?m:o)==null?Ob.height:i,stroke:a==null?_:a,strokeWidth:y,className:wb(`lucide`,v,u)},!d&&!kb(p)&&{"aria-hidden":`true`}),p),[...f.map(([e,t])=>(0,l.createElement)(e,t)),...Array.isArray(d)?d:[d]])}),Ib=[`className`],Lb=(e,t)=>{let n=(0,l.forwardRef)((n,r)=>{let{className:i}=n,a=Nb(n,Ib);return(0,l.createElement)(Fb,w({ref:r,iconNode:t,className:wb(`lucide-${Tb(Db(e))}`,`lucide-${e}`,i)},a))});return n.displayName=Db(e),n},Rb=Lb(`arrow-down`,[[`path`,{d:`M12 5v14`,key:`s699le`}],[`path`,{d:`m19 12-7 7-7-7`,key:`1idqje`}]]),zb=Lb(`arrow-up`,[[`path`,{d:`m5 12 7-7 7 7`,key:`hav0vg`}],[`path`,{d:`M12 19V5`,key:`x0mq9r`}]]),Bb=Lb(`barcode`,[[`path`,{d:`M3 5v14`,key:`1nt18q`}],[`path`,{d:`M8 5v14`,key:`1ybrkv`}],[`path`,{d:`M12 5v14`,key:`s699le`}],[`path`,{d:`M17 5v14`,key:`ycjyhj`}],[`path`,{d:`M21 5v14`,key:`nzette`}]]),Vb=Lb(`check`,[[`path`,{d:`M20 6 9 17l-5-5`,key:`1gmf2c`}]]),Hb=Lb(`copy`,[[`rect`,{width:`14`,height:`14`,x:`8`,y:`8`,rx:`2`,ry:`2`,key:`17jyea`}],[`path`,{d:`M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2`,key:`zix9uf`}]]),Ub=Lb(`download`,[[`path`,{d:`M12 15V3`,key:`m9g1x1`}],[`path`,{d:`M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4`,key:`ih7n3h`}],[`path`,{d:`m7 10 5 5 5-5`,key:`brsn70`}]]),Wb=Lb(`eye`,[[`path`,{d:`M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0`,key:`1nclc0`}],[`circle`,{cx:`12`,cy:`12`,r:`3`,key:`1v7zrd`}]]),Gb=Lb(`file-text`,[[`path`,{d:`M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z`,key:`1oefj6`}],[`path`,{d:`M14 2v5a1 1 0 0 0 1 1h5`,key:`wfsgrz`}],[`path`,{d:`M10 9H8`,key:`b1mrlr`}],[`path`,{d:`M16 13H8`,key:`t4e002`}],[`path`,{d:`M16 17H8`,key:`z1uh3a`}]]),Kb=Lb(`image`,[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,ry:`2`,key:`1m3agn`}],[`circle`,{cx:`9`,cy:`9`,r:`2`,key:`af1f0g`}],[`path`,{d:`m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21`,key:`1xmnt7`}]]),qb=Lb(`pencil`,[[`path`,{d:`M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z`,key:`1a8usu`}],[`path`,{d:`m15 5 4 4`,key:`1mk7zo`}]]),Jb=Lb(`plus`,[[`path`,{d:`M5 12h14`,key:`1ays0h`}],[`path`,{d:`M12 5v14`,key:`s699le`}]]),Yb=Lb(`printer`,[[`path`,{d:`M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2`,key:`143wyd`}],[`path`,{d:`M6 9V3a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v6`,key:`1itne7`}],[`rect`,{x:`6`,y:`14`,width:`12`,height:`8`,rx:`1`,key:`1ue0tg`}]]),Xb=Lb(`search`,[[`path`,{d:`m21 21-4.34-4.34`,key:`14j7rj`}],[`circle`,{cx:`11`,cy:`11`,r:`8`,key:`4ej97u`}]]),Zb=Lb(`sliders-vertical`,[[`path`,{d:`M10 8h4`,key:`1sr2af`}],[`path`,{d:`M12 21v-9`,key:`17s77i`}],[`path`,{d:`M12 8V3`,key:`13r4qs`}],[`path`,{d:`M17 16h4`,key:`h1uq16`}],[`path`,{d:`M19 12V3`,key:`o1uvq1`}],[`path`,{d:`M19 21v-5`,key:`qua636`}],[`path`,{d:`M3 14h4`,key:`bcjad9`}],[`path`,{d:`M5 10V3`,key:`cb8scm`}],[`path`,{d:`M5 21v-7`,key:`1w1uti`}]]),Qb=Lb(`sparkles`,[[`path`,{d:`M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z`,key:`1s2grr`}],[`path`,{d:`M20 2v4`,key:`1rf3ol`}],[`path`,{d:`M22 4h-4`,key:`gwowj6`}],[`circle`,{cx:`4`,cy:`20`,r:`2`,key:`6kqj1y`}]]),$b=Lb(`square-check-big`,[[`path`,{d:`M21 10.656V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h12.344`,key:`2acyp4`}],[`path`,{d:`m9 11 3 3L22 4`,key:`1pflzl`}]]),ex=Lb(`square`,[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,key:`afitv7`}]]),tx=Lb(`table`,[[`path`,{d:`M12 3v18`,key:`108xh3`}],[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,key:`afitv7`}],[`path`,{d:`M3 9h18`,key:`1pudct`}],[`path`,{d:`M3 15h18`,key:`5xshup`}]]),nx=Lb(`text-align-center`,[[`path`,{d:`M21 5H3`,key:`1fi0y6`}],[`path`,{d:`M17 12H7`,key:`16if0g`}],[`path`,{d:`M19 19H5`,key:`vjpgq2`}]]),rx=Lb(`text-align-end`,[[`path`,{d:`M21 5H3`,key:`1fi0y6`}],[`path`,{d:`M21 12H9`,key:`dn1m92`}],[`path`,{d:`M21 19H7`,key:`4cu937`}]]),ix=Lb(`text-align-justify`,[[`path`,{d:`M3 5h18`,key:`1u36vt`}],[`path`,{d:`M3 12h18`,key:`1i2n21`}],[`path`,{d:`M3 19h18`,key:`awlh7x`}]]),ax=Lb(`text-align-start`,[[`path`,{d:`M21 5H3`,key:`1fi0y6`}],[`path`,{d:`M15 12H3`,key:`6jk70r`}],[`path`,{d:`M17 19H3`,key:`z6ezky`}]]),ox=Lb(`trash-2`,[[`path`,{d:`M10 11v6`,key:`nco0om`}],[`path`,{d:`M14 11v6`,key:`outv1u`}],[`path`,{d:`M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6`,key:`miytrc`}],[`path`,{d:`M3 6h18`,key:`d0wm0j`}],[`path`,{d:`M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2`,key:`e791ji`}]]),sx=Lb(`type`,[[`path`,{d:`M12 4v16`,key:`1654pz`}],[`path`,{d:`M4 7V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2`,key:`e0r10z`}],[`path`,{d:`M9 20h6`,key:`s66wpe`}]]),cx=Lb(`upload`,[[`path`,{d:`M12 3v12`,key:`1x0j5s`}],[`path`,{d:`m17 8-5-5-5 5`,key:`7q97r8`}],[`path`,{d:`M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4`,key:`ih7n3h`}]]),lx=Lb(`x`,[[`path`,{d:`M18 6 6 18`,key:`1bl5f8`}],[`path`,{d:`m6 6 12 12`,key:`d8bk6v`}]]);function ux({headerLogo:e,headerTitle:t,headerSubtitle:n,parseError:r,isParsing:i,parseStatusText:a,showImportHtml:o,showImportPdf:s,showPreview:c,showExport:d,showExportPdf:f=!0,customButtonStyles:p,customButtonClassNames:m,customActionComponents:h,handleHtmlImport:g,handlePdfImport:_,setPreviewOpen:v,handleExport:y,handleExportPdf:b}){let x=(0,l.useRef)(null),S=(0,l.useRef)(null);return(0,u.jsxs)(`header`,{className:`bg-white border-b border-gray-200 px-6 py-4 flex flex-col sm:flex-row items-center justify-between sticky top-0 z-10 shadow-sm gap-4`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-3`,children:[e||(0,u.jsx)(`div`,{className:`h-10 w-10 bg-orange-600 rounded-xl flex items-center justify-center text-white shadow-md shadow-orange-600/20`,children:(0,u.jsx)(Qb,{className:`h-6 w-6`})}),(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h1`,{className:`text-xl font-bold tracking-tight text-slate-800`,children:t}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:n}),r&&(0,u.jsxs)(`span`,{className:`text-[10px] text-red-500 font-bold bg-red-50 px-2 py-0.5 rounded mt-1 inline-block border border-red-100`,children:[`Error: `,r]}),i&&(0,u.jsx)(`span`,{className:`text-[10px] text-orange-600 font-bold bg-orange-50 px-2 py-0.5 rounded mt-1 inline-block border border-orange-100 animate-pulse`,children:a||`Parsing...`})]})]}),(0,u.jsxs)(`div`,{className:`flex flex-wrap items-center gap-3`,children:[(o||s)&&(0,u.jsxs)(`div`,{className:`flex space-x-2 border-r border-gray-200 pr-4`,children:[o&&(0,u.jsxs)(u.Fragment,{children:[h!=null&&h.importHtml?h.importHtml({onClick:()=>{var e;return(e=x.current)==null?void 0:e.click()}}):(0,u.jsxs)(`button`,{onClick:()=>{var e;return(e=x.current)==null?void 0:e.click()},style:p==null?void 0:p.importHtml,className:(m==null?void 0:m.importHtml)||`inline-flex items-center space-x-2 px-3 py-1.5 border border-gray-200 rounded-lg text-xs font-semibold bg-white hover:bg-slate-50 text-slate-700 transition-colors shadow-sm`,title:`Import local HTML file`,children:[(0,u.jsx)(cx,{className:`h-3.5 w-3.5 text-slate-500`}),(0,u.jsx)(`span`,{children:`Import HTML`})]}),(0,u.jsx)(`input`,{type:`file`,ref:x,onChange:g,accept:`.html`,className:`hidden`})]}),s&&(0,u.jsxs)(u.Fragment,{children:[h!=null&&h.importPdf?h.importPdf({onClick:()=>{var e;return(e=S.current)==null?void 0:e.click()}}):(0,u.jsxs)(`button`,{onClick:()=>{var e;return(e=S.current)==null?void 0:e.click()},style:p==null?void 0:p.importPdf,className:(m==null?void 0:m.importPdf)||`inline-flex items-center space-x-2 px-3 py-1.5 border border-gray-200 rounded-lg text-xs font-semibold bg-white hover:bg-slate-50 text-slate-700 transition-colors shadow-sm`,title:`Import PDF layout structure`,children:[(0,u.jsx)(Gb,{className:`h-3.5 w-3.5 text-slate-500`}),(0,u.jsx)(`span`,{children:`Import PDF`})]}),(0,u.jsx)(`input`,{type:`file`,ref:S,onChange:_,accept:`.pdf`,className:`hidden`})]})]}),c&&(h!=null&&h.preview?h.preview({onClick:()=>v(!0)}):(0,u.jsxs)(`button`,{onClick:()=>v(!0),style:p==null?void 0:p.preview,className:(m==null?void 0:m.preview)||`inline-flex items-center space-x-2 px-4 py-2 border border-slate-200 rounded-lg text-sm font-semibold bg-slate-50 text-slate-700 hover:bg-slate-100 transition-colors shadow-sm`,children:[(0,u.jsx)(Wb,{className:`h-4 w-4 text-slate-500`}),(0,u.jsx)(`span`,{children:`Live Preview`})]})),f&&(h!=null&&h.exportPdf?h.exportPdf({onClick:b}):(0,u.jsxs)(`button`,{onClick:b,style:p==null?void 0:p.exportPdf,className:(m==null?void 0:m.exportPdf)||`inline-flex items-center space-x-2 px-4 py-2 bg-indigo-600 hover:bg-indigo-700 text-white rounded-lg text-sm font-semibold transition-colors shadow-sm shadow-indigo-600/10`,children:[(0,u.jsx)(Yb,{className:`h-4 w-4`}),(0,u.jsx)(`span`,{children:`Download PDF`})]})),d&&(h!=null&&h.export?h.export({onClick:y}):(0,u.jsxs)(`button`,{onClick:y,style:p==null?void 0:p.export,className:(m==null?void 0:m.export)||`inline-flex items-center space-x-2 px-4 py-2 bg-orange-600 hover:bg-orange-700 text-white rounded-lg text-sm font-semibold transition-colors shadow-sm shadow-orange-600/10`,children:[(0,u.jsx)(Ub,{className:`h-4 w-4`}),(0,u.jsx)(`span`,{children:`Export Template`})]}))]})]})}function dx({handleSidebarDragStart:e,createTextBlock:t,setBlocks:n,setSelectedBlockId:r,setActiveTab:i,defaultStyles:a}){return(0,u.jsxs)(`div`,{className:`space-y-5`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Typography Elements`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Select standard headings or paragraphs to structure your page layout.`})]}),(0,u.jsx)(`div`,{className:`grid grid-cols-1 gap-3 select-none`,children:[{label:`Document Title`,type:`title`,style:`text-2xl font-extrabold text-slate-900 tracking-tight`},{label:`Document Subtitle`,type:`subtitle`,style:`text-sm font-bold text-slate-500`},{label:`Heading 1`,type:`h1`,style:`text-xl font-extrabold text-slate-850`},{label:`Heading 2`,type:`h2`,style:`text-lg font-bold text-slate-800`},{label:`Heading 3`,type:`h3`,style:`text-md font-semibold text-slate-750`},{label:`Normal Paragraph`,type:`p`,style:`text-xs text-slate-600 leading-relaxed`},{label:`Caption Note`,type:`caption`,style:`text-[10px] text-slate-400 font-mono italic`}].map(o=>(0,u.jsxs)(`div`,{draggable:!0,onDragStart:t=>e(t,o.type),className:`border border-gray-200 rounded-xl p-3 bg-white hover:border-slate-350 transition-all flex flex-col space-y-2 cursor-grab shadow-xs group`,children:[(0,u.jsx)(`span`,{className:`text-[9px] font-bold text-slate-400 uppercase tracking-wide`,children:o.type}),(0,u.jsx)(`div`,{className:`${o.style} truncate pr-4`,children:o.label}),(0,u.jsx)(`button`,{onClick:()=>{let e=t(o.type,o.label,a==null?void 0:a[o.type]);n(t=>[...t,e]),r(e.id),i(`styles`)},className:`w-full py-1 bg-slate-50 hover:bg-slate-200 text-slate-600 rounded-lg text-[9px] font-semibold transition-all text-center border border-gray-150`,children:`Insert at End`})]},o.type))})]})}function fx({schemas:e,toggleSchemaColumn:t,customTableName:n,setCustomTableName:r,customLoopStart:i,setCustomLoopStart:a,customLoopEnd:o,setCustomLoopEnd:s,handleAddCustomTable:c,handleSidebarDragStart:l,setBlocks:d,setSelectedBlockId:f,setActiveTab:p,defaultStyles:m}){return(0,u.jsxs)(`div`,{className:`space-y-6`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Dynamic Tables`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Configure loop table templates and drag onto the canvas.`})]}),(0,u.jsx)(`div`,{className:`space-y-4`,children:e.map((e,n)=>(0,u.jsxs)(`div`,{className:`border border-gray-200 rounded-2xl p-4 bg-white space-y-3 shadow-xs`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2`,children:[(0,u.jsx)(tx,{className:`h-4 w-4 text-slate-650`}),(0,u.jsx)(`h4`,{className:`font-bold text-xs uppercase text-slate-700 tracking-wider`,children:e.tableName})]}),(0,u.jsx)(`span`,{className:`px-1.5 py-0.5 bg-slate-100 text-[8px] font-bold text-slate-600 rounded`,children:`loop = true`})]}),(0,u.jsxs)(`div`,{draggable:!0,onDragStart:t=>l(t,`table`,e),className:`bg-slate-50 border border-slate-200 hover:border-slate-400 rounded-lg p-2.5 flex items-center justify-between cursor-grab`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2`,children:[(0,u.jsx)(`div`,{className:`h-5 w-5 bg-slate-200 rounded flex items-center justify-center`,children:(0,u.jsx)(Jb,{className:`h-3 w-3 text-slate-600`})}),(0,u.jsx)(`span`,{className:`text-xs font-bold text-slate-700`,children:`Drag to Canvas`})]}),(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400 italic`,children:`Drag & Drop`})]}),(0,u.jsxs)(`div`,{className:`space-y-1.5`,children:[(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400 font-bold uppercase tracking-wider block`,children:`Columns:`}),(0,u.jsx)(`div`,{className:`max-h-[180px] overflow-y-auto border border-gray-150 rounded-lg p-2 space-y-1.5 bg-slate-50/50`,children:e.columns.map((e,r)=>{let i=e.loop&&e.columns&&e.columns.length>0;return(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsxs)(`button`,{onClick:()=>t(n,r),className:`flex items-center space-x-2 w-full text-left py-0.5 text-xs text-slate-600 hover:text-slate-800 transition-colors font-medium`,children:[e.enabled===!1?(0,u.jsx)(ex,{className:`h-3.5 w-3.5 text-slate-300 flex-shrink-0`}):(0,u.jsx)($b,{className:`h-3.5 w-3.5 text-slate-700 flex-shrink-0`}),(0,u.jsxs)(`span`,{className:`truncate flex items-center gap-1`,children:[(0,u.jsx)(`span`,{children:e.columnName}),i&&(0,u.jsx)(`span`,{className:`px-1 bg-slate-200 text-slate-600 rounded text-[8px] font-mono`,children:`(sub-table)`})]})]}),i&&e.enabled!==!1&&(0,u.jsxs)(`div`,{className:`ml-4 pl-2.5 border-l-2 border-slate-200 space-y-1 my-1`,children:[(0,u.jsx)(`span`,{className:`text-[8px] text-slate-400 font-bold uppercase tracking-wider block`,children:`Sub Columns:`}),e.columns.map((e,i)=>(0,u.jsxs)(`button`,{onClick:()=>t(n,r,i),className:`flex items-center space-x-2 w-full text-left py-0.5 text-[11px] text-slate-500 hover:text-slate-800 transition-colors`,children:[e.enabled===!1?(0,u.jsx)(ex,{className:`h-3 w-3 text-slate-300 flex-shrink-0`}):(0,u.jsx)($b,{className:`h-3 w-3 text-slate-600 flex-shrink-0`}),(0,u.jsxs)(`span`,{className:`truncate`,children:[e.columnName,` `,(0,u.jsxs)(`span`,{className:`text-[8px] text-slate-400`,children:[`(`,e.placeholder,`)`]})]})]},i))]})]},r)})})]}),(0,u.jsx)(`button`,{onClick:()=>{let t={id:Math.random().toString(36).substring(2,11),type:`table`,content:``,style:w({fontSize:`10px`,fontWeight:`400`,color:`#334155`,backgroundColor:`transparent`,textAlign:`left`,bold:!1,italic:!1,underline:!1,strikethrough:!1,width:`100%`,marginBottom:`12px`,padding:`8px`},m==null?void 0:m.table),tableInfo:w(w({},e),{},{columns:e.columns.map(e=>w({},e))})};d(e=>[...e,t]),f(t.id),p(`styles`)},className:`w-full py-1 bg-slate-50 hover:bg-slate-200 text-slate-600 rounded-lg text-[9px] font-semibold transition-all text-center border border-gray-150`,children:`Insert at End`})]},e.tableName))}),(0,u.jsxs)(`div`,{className:`border border-gray-200 rounded-2xl p-4 bg-slate-50/20 border-dashed space-y-4 mt-6`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2 pb-2 border-b border-gray-150`,children:[(0,u.jsx)(Qb,{className:`h-4 w-4 text-slate-655`}),(0,u.jsx)(`h4`,{className:`font-bold text-xs uppercase text-slate-800 tracking-wider`,children:`Custom Table Builder`})]}),(0,u.jsxs)(`div`,{className:`space-y-3`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-500 uppercase tracking-wider block mb-1`,children:`Table Name`}),(0,u.jsx)(`input`,{type:`text`,value:n,onChange:e=>r(e.target.value),placeholder:`invoice_items`,className:`w-full px-3 py-1.5 border border-gray-200 rounded-lg text-xs focus:outline-none focus:border-slate-500 bg-white`})]}),(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-500 uppercase tracking-wider block mb-1`,children:`Loop Start tag`}),(0,u.jsx)(`input`,{type:`text`,value:i,onChange:e=>a(e.target.value),placeholder:`{% for item in invoice.items %}`,className:`w-full px-3 py-1.5 border border-gray-200 rounded-lg text-xs font-mono focus:outline-none focus:border-slate-500 bg-white text-slate-600 font-bold`})]}),(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-500 uppercase tracking-wider block mb-1`,children:`Loop End tag`}),(0,u.jsx)(`input`,{type:`text`,value:o,onChange:e=>s(e.target.value),placeholder:`{% endfor %}`,className:`w-full px-3 py-1.5 border border-gray-200 rounded-lg text-xs font-mono focus:outline-none focus:border-slate-500 bg-white text-slate-600 font-bold`})]}),(0,u.jsxs)(`button`,{onClick:c,className:`w-full py-2 bg-orange-600 hover:bg-orange-700 text-white rounded-xl text-xs font-bold transition-all shadow-sm flex items-center justify-center space-x-1.5 shadow-orange-600/10`,children:[(0,u.jsx)(Jb,{className:`h-4 w-4`}),(0,u.jsx)(`span`,{children:`Add Custom Loop Table`})]})]})]})]})}function px({customImageTypes:e,newImgTypeName:t,setNewImgTypeName:n,handleAddCustomImageType:r,handleSidebarDragStart:i,createImageBlock:a,setBlocks:o,setSelectedBlockId:s,setActiveTab:c}){let l=[{label:`Brand Logo`,imageType:`logo`,description:`Standard document vector logo`,icon:(0,u.jsx)(Kb,{className:`h-4 w-4 text-slate-550`})},{label:`Campaign Banner`,imageType:`banner`,description:`Wide horizontal graphics banner`,icon:(0,u.jsx)(Kb,{className:`h-4 w-4 text-slate-550`})},{label:`Dynamic Barcode`,imageType:`barcode`,description:`Barcode replaced dynamically`,icon:(0,u.jsx)(Bb,{className:`h-4 w-4 text-slate-550`})},{label:`Watermark`,imageType:`watermark`,description:`Background graphic with low opacity`,icon:(0,u.jsx)(Kb,{className:`h-4 w-4 text-slate-550`})},...e.map(e=>({label:e.label,imageType:e.imageType,description:e.description,icon:(0,u.jsx)(Kb,{className:`h-4 w-4 text-slate-550`})}))];return(0,u.jsxs)(`div`,{className:`space-y-4`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Image & Barcode Elements`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Drag elements onto the canvas, or insert below.`})]}),(0,u.jsx)(`div`,{className:`space-y-3`,children:l.map(e=>(0,u.jsxs)(`div`,{className:`border border-gray-200 rounded-xl p-3 bg-white space-y-3 shadow-xs`,children:[(0,u.jsx)(`div`,{className:`flex items-center justify-between`,children:(0,u.jsxs)(`div`,{className:`flex items-center space-x-2`,children:[e.icon,(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h4`,{className:`font-bold text-xs text-slate-700`,children:e.label}),(0,u.jsx)(`p`,{className:`text-[9px] text-slate-400`,children:e.description})]})]})}),(0,u.jsxs)(`div`,{draggable:!0,onDragStart:t=>i(t,`image`,void 0,e.imageType),className:`bg-slate-50 border border-slate-200 hover:border-slate-450 rounded-lg p-2 flex items-center justify-between cursor-grab transition-all`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2`,children:[(0,u.jsx)(`div`,{className:`h-5 w-5 bg-slate-200 rounded flex items-center justify-center`,children:(0,u.jsx)(Jb,{className:`h-3 w-3 text-slate-750`})}),(0,u.jsx)(`span`,{className:`text-[11px] font-bold text-slate-700`,children:`Drag to Canvas`})]}),(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400 italic`,children:`Drag`})]}),(0,u.jsx)(`button`,{onClick:()=>{let t=a(e.imageType);o(e=>[...e,t]),s(t.id),c(`styles`)},className:`w-full py-1 bg-slate-100 hover:bg-slate-200 text-slate-600 rounded-lg text-[10px] font-semibold transition-all text-center border border-gray-150`,children:`Insert at End`})]},e.imageType))}),(0,u.jsxs)(`div`,{className:`border border-dashed border-gray-200 rounded-xl p-3 space-y-2 bg-slate-50/50 mt-4`,children:[(0,u.jsx)(`span`,{className:`text-[10px] font-bold text-slate-500 uppercase tracking-wider block`,children:`Add Custom Image Type`}),(0,u.jsx)(`input`,{type:`text`,value:t,onChange:e=>n(e.target.value),placeholder:`e.g. Signature`,className:`w-full px-2 py-1 border border-gray-200 rounded text-xs focus:outline-none focus:border-slate-500 bg-white`}),(0,u.jsxs)(`button`,{onClick:r,className:`w-full py-1.5 bg-orange-600 hover:bg-orange-700 text-white rounded-lg text-xs font-bold transition-all flex items-center justify-center space-x-1`,children:[(0,u.jsx)(Jb,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Add Custom Category`})]})]})]})}function mx({placeholders:e,schemas:t,searchPlaceholder:n,setSearchPlaceholder:r,placeholderMockData:i,setPlaceholderMockData:a,selectedBlockId:o,setBlocks:s}){let c=()=>{let r=[];return(e||[]).forEach(e=>{r.push({label:e.label,placeholder:e.placeholder,category:`General`})}),t.forEach(e=>{let t=e.tableName===`package`?`Package Fields`:`Article Fields`;e.columns.forEach(n=>{r.push({label:`${e.tableName.toUpperCase()} - ${n.columnName}`,placeholder:n.placeholder,category:t})})}),r.filter(e=>e.label.toLowerCase().includes(n.toLowerCase())||e.placeholder.toLowerCase().includes(n.toLowerCase()))},l=e=>{if(o){let t=e.replace(/[{}]/g,``),n=` <span contenteditable="false" data-placeholder="${t}" class="inline-flex items-center px-1.5 py-0.5 rounded bg-slate-100 text-slate-700 text-[9px] font-bold mx-0.5 select-none align-middle border border-slate-200 cursor-default relative pr-4 group/chip"><span>{{${t}}}</span><span class="absolute right-0.5 top-1/2 -translate-y-1/2 cursor-pointer text-slate-400 hover:text-red-655 px-0.5 font-bold hover:bg-slate-200/50 rounded text-[9px] leading-none select-none" onmousedown="event.stopPropagation(); event.preventDefault(); const p = this.closest('span[data-placeholder]'); const editable = p.closest('[contenteditable=\\'true\\']'); if(p){ p.remove(); } if(editable){ window.updateContentFromRawDelete('${o}', editable.innerHTML); }">×</span></span>&nbsp;`;s(e=>e.map(e=>e.id===o&&e.type!==`table`?w(w({},e),{},{content:e.content+n}):e))}},d=c();return(0,u.jsxs)(`div`,{className:`space-y-4 flex-1 flex flex-col min-h-0`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Variables Palette`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Click to copy, or drag into text areas. Edit mock values below to visualize content.`})]}),(0,u.jsxs)(`div`,{className:`relative`,children:[(0,u.jsx)(Xb,{className:`absolute left-3 top-2.5 h-4 w-4 text-slate-400`}),(0,u.jsx)(`input`,{type:`text`,value:n,onChange:e=>r(e.target.value),placeholder:`Search variables...`,className:`w-full pl-9 pr-4 py-2 border border-gray-200 rounded-xl text-xs focus:outline-none focus:border-slate-500 transition-colors`})]}),(0,u.jsx)(`div`,{className:`flex-1 overflow-y-auto space-y-2 pr-1`,children:d.length===0?(0,u.jsx)(`div`,{className:`text-xs text-slate-400 italic text-center py-4`,children:`No variables available.`}):d.map((e,t)=>{let n=e.placeholder.replace(/[{}]/g,``);return(0,u.jsxs)(`div`,{className:`w-full border border-gray-200 p-2.5 rounded-xl bg-white shadow-xs space-y-2`,children:[(0,u.jsxs)(`div`,{draggable:!0,onDragStart:e=>{e.dataTransfer.setData(`placeholder`,n),e.dataTransfer.effectAllowed=`copy`},onClick:()=>l(e.placeholder),className:`flex items-center justify-between cursor-grab active:cursor-grabbing hover:bg-slate-50 p-1 rounded`,title:`Drag into text or cells, or click to copy`,children:[(0,u.jsx)(`span`,{className:`text-xs font-semibold text-slate-700 truncate mr-2`,children:e.label}),(0,u.jsx)(`code`,{className:`text-[9px] bg-slate-100 px-1.5 py-0.5 rounded text-slate-800 font-bold shrink-0 border border-slate-200/50`,children:e.placeholder})]}),(0,u.jsxs)(`div`,{className:`flex items-center justify-between gap-1 pt-1.5 border-t border-gray-100`,children:[(0,u.jsx)(`span`,{className:`text-[9px] font-bold text-slate-400 uppercase`,children:`Mock:`}),(0,u.jsx)(`input`,{type:`text`,value:i[n]||``,onChange:e=>{a(t=>w(w({},t),{},{[n]:e.target.value}))},className:`flex-1 max-w-[130px] px-1.5 py-0.5 border border-gray-200 rounded text-[10px] focus:outline-none focus:border-slate-500 bg-white`})]})]},t)})})]})}function hx({selectedBlockId:e,getSelectedBlock:t,updateSelectedStyle:n,updateSelectedImageInfo:r,fontSizesState:i,fontFamiliesState:a,fontWeightsState:o,handleDeleteBlock:s,newColName:c,setNewColName:d,newColPlaceholder:f,setNewColPlaceholder:p,handleAddTableColumn:m,handleRemoveTableColumn:h,handleUpdateTableColumn:g,handleReorderTableColumn:_,handleAddTableRow:v,handleRemoveTableRow:y,setBlocks:b}){var x;let[S,C]=(0,l.useState)(null),[T,E]=(0,l.useState)(``),[D,ee]=(0,l.useState)(``),[O,k]=(0,l.useState)(null),[te,A]=(0,l.useState)(``),[ne,re]=(0,l.useState)(``),j=t();if(!e||!j)return(0,u.jsxs)(`div`,{className:`space-y-5`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Formatting Panel`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Customize the styles of the selected block.`})]}),(0,u.jsxs)(`div`,{className:`border border-dashed border-gray-200 rounded-xl p-6 text-center bg-slate-50/50`,children:[(0,u.jsx)(Zb,{className:`h-8 w-8 text-slate-350 mx-auto mb-2`}),(0,u.jsx)(`span`,{className:`text-xs font-semibold text-slate-500 block`,children:`No block selected`}),(0,u.jsx)(`p`,{className:`text-[10px] text-slate-400 mt-1`,children:`Select any element inside the canvas to configure typography, sizing, colors, or templating loop engines.`})]})]});let ie=j.type===`table`,ae=()=>{c.trim()&&(m(c,f),d(``),p(``))};if(j.type===`image`){let e=j.imageInfo||{imageType:`logo`};return(0,u.jsxs)(`div`,{className:`space-y-5`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Formatting Panel`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Customize the styles of the selected block.`})]}),(0,u.jsxs)(`div`,{className:`space-y-4`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2 pb-3 border-b border-gray-100`,children:[(0,u.jsx)(`div`,{className:`h-6 w-6 bg-slate-100 rounded flex items-center justify-center text-slate-700`,children:(0,u.jsx)(Kb,{className:`h-3.5 w-3.5`})}),(0,u.jsx)(`span`,{className:`text-xs font-bold text-slate-700 capitalize`,children:`Editing Image Element`})]}),(0,u.jsxs)(`div`,{className:`flex items-center justify-between p-3 bg-slate-50 border border-gray-200 rounded-xl select-none`,children:[(0,u.jsxs)(`div`,{className:`space-y-0.5`,children:[(0,u.jsx)(`span`,{className:`text-xs font-bold text-slate-700 block`,children:`Row Alignment`}),(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400`,children:`Display side-by-side`})]}),(0,u.jsx)(`button`,{onClick:()=>{let e=!j.style.sameRow;n(`sameRow`,e),e?(n(`width`,`48%`),b(e=>{let t=e.findIndex(e=>e.id===j.id);return t>0?e.map((e,n)=>n===t-1&&(!e.style.width||e.style.width===`100%`)?w(w({},e),{},{style:w(w({},e.style),{},{width:`48%`})}):e):e})):n(`width`,`100%`)},className:`w-10 h-6 flex items-center rounded-full p-1 transition-colors duration-150 ${j.style.sameRow?`bg-orange-600 justify-end`:`bg-slate-300 justify-start`}`,children:(0,u.jsx)(`span`,{className:`bg-white w-4 h-4 rounded-full shadow-md`})})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Image Category`}),(0,u.jsx)(`div`,{className:`grid grid-cols-4 gap-1 bg-slate-50 p-1 border border-gray-200 rounded-lg`,children:[`logo`,`banner`,`barcode`,`watermark`].map(t=>(0,u.jsx)(`button`,{onClick:()=>r(`imageType`,t),className:`py-1 text-[9px] font-bold rounded capitalize transition-all ${e.imageType===t?`bg-white text-slate-800 shadow-xs border border-gray-200`:`text-slate-500 hover:text-slate-800`}`,children:t},t))})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Alignment (Position)`}),(0,u.jsx)(`div`,{className:`flex items-center space-x-1 border border-gray-200 rounded-lg p-1 bg-slate-50 w-fit`,children:[{value:`left`,icon:(0,u.jsx)(ax,{className:`h-3.5 w-3.5`})},{value:`center`,icon:(0,u.jsx)(nx,{className:`h-3.5 w-3.5`})},{value:`right`,icon:(0,u.jsx)(rx,{className:`h-3.5 w-3.5`})}].map(e=>(0,u.jsx)(`button`,{onClick:()=>n(`textAlign`,e.value),type:`button`,className:`p-1.5 rounded transition-all ${j.style.textAlign===e.value?`bg-white text-slate-800 shadow-xs border border-gray-200`:`text-slate-500 hover:text-slate-800`}`,children:e.icon},e.value))})]}),(0,u.jsxs)(`div`,{className:`space-y-1 pt-1`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider`,children:`Image Width`}),(0,u.jsx)(`span`,{className:`text-[10px] font-mono text-slate-500 font-bold bg-slate-100 px-1.5 py-0.5 rounded`,children:j.style.width||`100%`})]}),(0,u.jsxs)(`div`,{className:`flex items-center space-x-2`,children:[(0,u.jsx)(`input`,{type:`range`,min:`10`,max:`1000`,step:`5`,value:parseInt(j.style.width||`100`),onChange:e=>n(`width`,`${e.target.value}px`),className:`w-full accent-slate-800 h-1 bg-gray-200 rounded-lg appearance-none cursor-pointer`}),(0,u.jsxs)(`span`,{className:`text-[10px] font-mono text-slate-500 w-10 text-right`,children:[parseInt(j.style.width||`100`),`px`]})]})]}),(0,u.jsxs)(`div`,{className:`space-y-1 pt-1 mt-3`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block mb-1`,children:`Object Fit`}),(0,u.jsxs)(`select`,{value:j.style.objectFit||`contain`,onChange:e=>n(`objectFit`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs focus:outline-none focus:border-slate-500 bg-white font-medium`,children:[(0,u.jsx)(`option`,{value:`contain`,children:`Contain`}),(0,u.jsx)(`option`,{value:`cover`,children:`Cover`}),(0,u.jsx)(`option`,{value:`fill`,children:`Fill`}),(0,u.jsx)(`option`,{value:`none`,children:`None`})]})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider`,children:`Image Height`}),(0,u.jsx)(`span`,{className:`text-[10px] font-mono text-slate-500 font-bold bg-slate-100 px-1.5 py-0.5 rounded`,children:j.style.height||j.style.minHeight||`auto`})]}),(0,u.jsx)(`div`,{className:`flex items-center space-x-2`,children:(0,u.jsx)(`input`,{type:`range`,min:`20`,max:`400`,step:`10`,value:parseInt(j.style.height||j.style.minHeight||`100`)||100,onChange:e=>{n(`height`,`${e.target.value}px`),n(`minHeight`,`${e.target.value}px`)},className:`w-full accent-slate-800 h-1 bg-gray-200 rounded-lg appearance-none cursor-pointer`})})]}),e.imageType===`barcode`?(0,u.jsxs)(`div`,{className:`space-y-3 pt-3 border-t border-gray-150`,children:[(0,u.jsx)(`span`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Barcode Configuration`}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-500`,children:`Mock Barcode Value`}),(0,u.jsx)(`input`,{type:`text`,value:e.barcodeValue||``,onChange:e=>r(`barcodeValue`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs font-mono focus:outline-none focus:border-slate-500`})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-500`,children:`Backend Variable`}),(0,u.jsx)(`input`,{type:`text`,value:e.barcodePlaceholder||``,onChange:e=>r(`barcodePlaceholder`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs font-mono focus:outline-none focus:border-slate-500 text-slate-700 font-bold`})]})]}):(0,u.jsxs)(`div`,{className:`space-y-3 pt-3 border-t border-gray-150`,children:[(0,u.jsx)(`span`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Image Asset Upload`}),(0,u.jsxs)(`div`,{className:`flex flex-col items-center p-3 border border-dashed border-gray-200 rounded-lg bg-slate-50/50 hover:bg-slate-50 transition-all cursor-pointer relative`,children:[(0,u.jsx)(cx,{className:`h-5 w-5 text-slate-400 mb-1`}),(0,u.jsx)(`span`,{className:`text-[10px] font-bold text-slate-650`,children:`Choose local image file`}),(0,u.jsx)(`input`,{type:`file`,accept:`image/*`,onChange:e=>{var t;let n=(t=e.target.files)==null?void 0:t[0];if(!n)return;let i=new FileReader;i.onload=e=>{var t;r(`url`,(t=e.target)==null?void 0:t.result)},i.readAsDataURL(n)},className:`absolute inset-0 opacity-0 cursor-pointer`})]})]}),(0,u.jsx)(`div`,{className:`space-y-3 pt-3 border-t border-gray-100`,children:(0,u.jsxs)(`div`,{className:`grid grid-cols-2 gap-3`,children:[(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase block`,children:`Bottom Margin`}),(0,u.jsx)(`input`,{type:`range`,min:`0`,max:`40`,step:`2`,value:parseInt(j.style.marginBottom||`0px`),onChange:e=>n(`marginBottom`,`${e.target.value}px`),className:`w-full accent-slate-800 h-1 bg-gray-200`})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase block`,children:`Padding`}),(0,u.jsx)(`input`,{type:`range`,min:`0`,max:`40`,step:`2`,value:parseInt(j.style.padding||`0px`),onChange:e=>n(`padding`,`${e.target.value}px`),className:`w-full accent-slate-800 h-1 bg-gray-200`})]})]})}),(0,u.jsx)(`div`,{className:`pt-4 border-t border-red-100 flex items-center justify-between`,children:(0,u.jsxs)(`button`,{onClick:()=>s(j.id),className:`w-full py-2 bg-red-50 hover:bg-red-100 border border-red-200 text-red-650 rounded-xl text-xs font-bold transition-all flex items-center justify-center space-x-1 shadow-xs cursor-pointer`,children:[(0,u.jsx)(ox,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Delete Element`})]})})]})]})}return(0,u.jsxs)(`div`,{className:`space-y-5`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Formatting Panel`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Customize the styles of the selected block.`})]}),(0,u.jsxs)(`div`,{className:`space-y-4`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2 pb-3 border-b border-gray-100`,children:[(0,u.jsx)(`div`,{className:`h-6 px-3 bg-slate-100 rounded flex items-center justify-center text-slate-700 font-bold text-[10px] uppercase`,children:j.type}),(0,u.jsxs)(`span`,{className:`text-xs font-bold text-slate-700 capitalize`,children:[`Editing `,j.type===`table`?`Table Block`:`Typography Element`]})]}),(0,u.jsxs)(`div`,{className:`flex items-center justify-between p-3 bg-slate-50 border border-gray-200 rounded-xl select-none`,children:[(0,u.jsxs)(`div`,{className:`space-y-0.5`,children:[(0,u.jsx)(`span`,{className:`text-xs font-bold text-slate-700 block`,children:`Row Alignment`}),(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400`,children:`Display side-by-side`})]}),(0,u.jsx)(`button`,{onClick:()=>{let e=!j.style.sameRow;n(`sameRow`,e),e?(n(`width`,`48%`),b(e=>{let t=e.findIndex(e=>e.id===j.id);return t>0?e.map((e,n)=>n===t-1&&(!e.style.width||e.style.width===`100%`)?w(w({},e),{},{style:w(w({},e.style),{},{width:`48%`})}):e):e})):n(`width`,`100%`)},className:`w-10 h-6 flex items-center rounded-full p-1 transition-colors duration-150 ${j.style.sameRow?`bg-orange-600 justify-end`:`bg-slate-300 justify-start`}`,children:(0,u.jsx)(`span`,{className:`bg-white w-4 h-4 rounded-full shadow-md`})})]}),j.style.sameRow&&(0,u.jsxs)(`div`,{className:`flex items-center justify-between p-3 bg-slate-50 border border-gray-200 rounded-xl select-none`,children:[(0,u.jsxs)(`div`,{className:`space-y-0.5`,children:[(0,u.jsx)(`span`,{className:`text-xs font-bold text-slate-700 block`,children:`Row Direction`}),(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400`,children:`Layout stacked or side-by-side`})]}),(0,u.jsx)(`div`,{className:`grid grid-cols-2 gap-1 bg-slate-100 p-0.5 border border-gray-200 rounded-lg w-[180px]`,children:[`row`,`column`].map(e=>(0,u.jsx)(`button`,{type:`button`,onClick:()=>{n(`flexDirection`,e),b(t=>{let n=t.findIndex(e=>e.id===j.id);if(n===-1)return t;let r=n;for(;r>0&&t[r].style.sameRow;)r--;let i=[r],a=r+1;for(;a<t.length&&t[a].style.sameRow;)i.push(a),a++;return t.map((t,n)=>i.includes(n)?w(w({},t),{},{style:w(w({},t.style),{},{flexDirection:e})}):t)})},className:`px-2 py-1 text-[9px] font-bold rounded capitalize transition-all text-center ${j.style.flexDirection===e||e===`row`&&!j.style.flexDirection?`bg-white text-slate-800 shadow-xs border border-gray-200`:`text-slate-500 hover:text-slate-800`}`,children:e===`row`?`Side-by-side`:`Stacked`},e))})]}),(0,u.jsxs)(`div`,{className:`grid grid-cols-2 gap-3`,children:[(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider`,children:`Font Size`}),(0,u.jsx)(`select`,{value:j.style.fontSize,onChange:e=>n(`fontSize`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs focus:outline-none focus:border-slate-500 bg-white font-medium`,children:i.map(e=>(0,u.jsx)(`option`,{value:e.value,children:e.label},e.value))})]}),!ie&&(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider`,children:`Weight`}),(0,u.jsx)(`select`,{value:j.style.fontWeight,onChange:e=>n(`fontWeight`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs focus:outline-none focus:border-slate-500 bg-white font-medium`,children:o.map(e=>(0,u.jsx)(`option`,{value:e.value,children:e.label},e.value))})]})]}),!ie&&(0,u.jsxs)(`div`,{className:`space-y-1.5`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Font Family`}),(0,u.jsxs)(`select`,{value:j.style.fontFamily||``,onChange:e=>n(`fontFamily`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs focus:outline-none focus:border-slate-500 bg-white font-medium`,children:[(0,u.jsx)(`option`,{value:``,children:`Default Font (Global)`}),a.map(e=>(0,u.jsx)(`option`,{value:e.value,children:e.label},e.value))]})]}),!ie&&(0,u.jsxs)(`div`,{className:`space-y-2`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Alignment & Formatting`}),(0,u.jsxs)(`div`,{className:`flex items-center justify-between gap-1 border border-gray-200 rounded-lg p-1 bg-slate-50`,children:[(0,u.jsx)(`div`,{className:`flex items-center space-x-0.5`,children:[{value:`left`,icon:(0,u.jsx)(ax,{className:`h-3.5 w-3.5`})},{value:`center`,icon:(0,u.jsx)(nx,{className:`h-3.5 w-3.5`})},{value:`right`,icon:(0,u.jsx)(rx,{className:`h-3.5 w-3.5`})},{value:`justify`,icon:(0,u.jsx)(ix,{className:`h-3.5 w-3.5`})}].map(e=>(0,u.jsx)(`button`,{onClick:()=>n(`textAlign`,e.value),className:`p-1.5 rounded transition-all ${j.style.textAlign===e.value?`bg-white text-slate-800 shadow-xs border border-gray-200`:`text-slate-500 hover:text-slate-800`}`,children:e.icon},e.value))}),(0,u.jsx)(`div`,{className:`h-5 w-[1px] bg-slate-200 mx-1`}),(0,u.jsx)(`div`,{className:`flex items-center space-x-0.5`,children:[{key:`bold`,label:`B`,className:`font-bold`},{key:`italic`,label:`I`,className:`italic`},{key:`underline`,label:`U`,className:`underline`},{key:`strikethrough`,label:`S`,className:`line-through`}].map(e=>{let t=j.style[e.key]===!0;return(0,u.jsx)(`button`,{onClick:()=>n(e.key,!t),className:`h-7 w-7 rounded text-xs transition-all ${t?`bg-white text-slate-800 shadow-xs border border-gray-200 font-bold`:`text-slate-500 hover:text-slate-800`}`,children:(0,u.jsx)(`span`,{className:e.className,children:e.label})},e.key)})})]})]}),(0,u.jsxs)(`div`,{className:`space-y-3`,children:[(0,u.jsxs)(`div`,{className:`space-y-1.5`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Text Color`}),(0,u.jsxs)(`div`,{className:`flex flex-wrap gap-1.5`,children:[pb.map(e=>(0,u.jsx)(`button`,{onClick:()=>n(`color`,e),className:`h-5 w-5 rounded-full border border-gray-200 shadow-xs transition-transform ${j.style.color===e?`scale-120 ring-2 ring-slate-800`:`hover:scale-110`}`,style:{backgroundColor:e}},e)),(0,u.jsx)(`input`,{type:`color`,value:j.style.color,onChange:e=>n(`color`,e.target.value),className:`h-5 w-5 rounded-full border border-gray-200 cursor-pointer overflow-hidden p-0`})]})]}),(0,u.jsxs)(`div`,{className:`space-y-1.5`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Background Color`}),(0,u.jsxs)(`div`,{className:`flex flex-wrap gap-1.5`,children:[mb.map(e=>(0,u.jsx)(`button`,{onClick:()=>n(`backgroundColor`,e),className:`h-5 w-5 rounded-full border border-gray-200 shadow-xs transition-transform ${j.style.backgroundColor===e?`scale-120 ring-2 ring-slate-800`:`hover:scale-110`}`,style:{backgroundColor:e===`transparent`?`#ffffff`:e},children:e===`transparent`&&(0,u.jsx)(`span`,{className:`text-[8px] text-slate-400 font-bold block leading-5 text-center`,children:`T`})},e)),(0,u.jsx)(`input`,{type:`color`,value:j.style.backgroundColor===`transparent`?`#ffffff`:j.style.backgroundColor,onChange:e=>n(`backgroundColor`,e.target.value),className:`h-5 w-5 rounded-full border border-gray-200 cursor-pointer overflow-hidden p-0`})]})]})]}),(0,u.jsxs)(`div`,{className:`space-y-3 pt-3 border-t border-gray-100`,children:[(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider`,children:`Block Width`}),(0,u.jsx)(`span`,{className:`text-[10px] font-mono text-slate-500 font-bold bg-slate-100 px-1.5 py-0.5 rounded`,children:j.style.width||`100%`})]}),(0,u.jsx)(`div`,{className:`flex items-center space-x-2`,children:(0,u.jsx)(`input`,{type:`range`,min:`10`,max:`100`,step:`5`,value:parseInt(j.style.width||`100%`),onChange:e=>n(`width`,`${e.target.value}%`),className:`w-full accent-slate-800 h-1 bg-gray-200 rounded-lg appearance-none cursor-pointer`})})]}),(0,u.jsxs)(`div`,{className:`grid grid-cols-2 gap-3`,children:[(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase block`,children:`Bottom Margin`}),(0,u.jsx)(`input`,{type:`range`,min:`0`,max:`40`,step:`2`,value:parseInt(j.style.marginBottom||`0px`),onChange:e=>n(`marginBottom`,`${e.target.value}px`),className:`w-full accent-slate-800 h-1 bg-gray-200 rounded-lg`})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase block`,children:`Padding`}),(0,u.jsx)(`input`,{type:`range`,min:`0`,max:`40`,step:`2`,value:parseInt(j.style.padding||`0px`),onChange:e=>n(`padding`,`${e.target.value}px`),className:`w-full accent-slate-800 h-1 bg-gray-200 rounded-lg`})]})]})]}),ie&&j.tableInfo&&(0,u.jsxs)(u.Fragment,{children:[(0,u.jsxs)(`div`,{className:`space-y-3 pt-3 border-t border-gray-100`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Table Rows`}),(0,u.jsxs)(`span`,{className:`text-[10px] text-slate-400 font-medium`,children:[((x=j.tableInfo.mockRows)==null?void 0:x.length)||1,` row(s) configured`]})]}),(0,u.jsxs)(`button`,{type:`button`,onClick:()=>v&&v(j.id),className:`px-3 py-1.5 bg-orange-600 hover:bg-orange-700 text-white rounded-lg text-xs font-bold transition-all flex items-center space-x-1 shadow-xs`,title:`Add a new row to table`,children:[(0,u.jsx)(Jb,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Add Row`})]})]}),(0,u.jsx)(`div`,{className:`space-y-1.5 max-h-[140px] overflow-y-auto pr-1`,children:(j.tableInfo.mockRows&&j.tableInfo.mockRows.length>0?j.tableInfo.mockRows:[{}]).map((e,t)=>{var n;return(0,u.jsxs)(`div`,{className:`flex items-center justify-between bg-slate-50 border border-gray-200 rounded-lg p-2 text-xs`,children:[(0,u.jsxs)(`span`,{className:`font-semibold text-slate-700`,children:[`Row #`,t+1]}),(0,u.jsx)(`button`,{type:`button`,onClick:()=>y&&y(t,j.id),disabled:(((n=j.tableInfo)==null||(n=n.mockRows)==null?void 0:n.length)||1)<=1,className:`p-1 text-slate-400 hover:text-red-600 hover:bg-red-50 disabled:opacity-30 disabled:hover:bg-transparent rounded transition-colors`,title:`Remove row`,children:(0,u.jsx)(ox,{className:`h-3.5 w-3.5`})})]},t)})})]}),(0,u.jsxs)(`div`,{className:`space-y-3 pt-3 border-t border-gray-100`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Table Columns`}),(0,u.jsx)(`div`,{className:`space-y-2 max-h-[300px] overflow-y-auto pr-1`,children:j.tableInfo.columns.map((e,t)=>{var n,r;let i=e.loop&&e.columns&&e.columns.length>0;return(0,u.jsxs)(`div`,{className:`bg-slate-50 border border-gray-200 rounded-lg p-2 space-y-1.5 text-xs`,children:[S===String(t)?(0,u.jsxs)(`div`,{className:`space-y-1.5 p-1 bg-white border border-orange-300 rounded`,children:[(0,u.jsx)(`div`,{className:`text-[9px] font-bold text-orange-600 uppercase`,children:`Edit Column`}),(0,u.jsx)(`input`,{type:`text`,value:T,onChange:e=>E(e.target.value),placeholder:`Header Name`,className:`w-full px-2 py-0.5 border border-gray-200 rounded text-xs bg-white`}),(0,u.jsx)(`input`,{type:`text`,value:D,onChange:e=>ee(e.target.value),placeholder:`Value (e.g. {{item.sku}})`,className:`w-full px-2 py-0.5 border border-gray-200 rounded text-xs font-mono bg-white`}),(0,u.jsxs)(`div`,{className:`flex justify-end gap-1`,children:[(0,u.jsxs)(`button`,{onClick:()=>{g&&g(t,T,D),C(null)},className:`p-1 px-2 bg-orange-600 text-white hover:bg-orange-700 rounded text-[10px] flex items-center gap-1 font-bold`,children:[(0,u.jsx)(Vb,{className:`h-3 w-3`}),(0,u.jsx)(`span`,{children:`Save`})]}),(0,u.jsxs)(`button`,{onClick:()=>C(null),className:`p-1 px-2 bg-gray-200 text-slate-700 hover:bg-gray-300 rounded text-[10px] flex items-center gap-1`,children:[(0,u.jsx)(lx,{className:`h-3 w-3`}),(0,u.jsx)(`span`,{children:`Cancel`})]})]})]}):(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsxs)(`div`,{className:`truncate mr-2`,children:[(0,u.jsxs)(`span`,{className:`font-bold text-slate-700 block truncate flex items-center gap-1`,children:[(0,u.jsx)(`span`,{children:e.columnName}),i&&(0,u.jsx)(`span`,{className:`px-1 bg-blue-100 text-blue-700 rounded text-[8px] font-mono`,children:`loop (sub-table)`})]}),(0,u.jsx)(`code`,{className:`text-[9px] font-mono text-slate-500 truncate block`,children:e.placeholder})]}),(0,u.jsxs)(`div`,{className:`flex items-center gap-0.5 shrink-0`,children:[(0,u.jsx)(`button`,{onClick:()=>_&&_(t,`up`),disabled:t===0,className:`p-1 text-slate-400 hover:text-slate-700 hover:bg-slate-200 disabled:opacity-30 disabled:hover:bg-transparent rounded transition-colors`,title:`Move Up`,children:(0,u.jsx)(zb,{className:`h-3.5 w-3.5`})}),(0,u.jsx)(`button`,{onClick:()=>_&&_(t,`down`),disabled:t===(((n=j.tableInfo)==null?void 0:n.columns.length)||0)-1,className:`p-1 text-slate-400 hover:text-slate-700 hover:bg-slate-200 disabled:opacity-30 disabled:hover:bg-transparent rounded transition-colors`,title:`Move Down`,children:(0,u.jsx)(Rb,{className:`h-3.5 w-3.5`})}),(0,u.jsx)(`button`,{onClick:()=>{C(String(t)),E(e.columnName),ee(e.placeholder)},className:`p-1 text-slate-400 hover:text-slate-700 hover:bg-slate-200 rounded transition-colors`,title:`Edit column`,children:(0,u.jsx)(qb,{className:`h-3.5 w-3.5`})}),(0,u.jsx)(`button`,{onClick:()=>h(t),className:`p-1 text-slate-400 hover:text-red-600 hover:bg-red-50 rounded transition-colors border border-transparent`,disabled:!j.tableInfo||j.tableInfo.columns.length<=1,title:`Delete column`,children:(0,u.jsx)(ox,{className:`h-3.5 w-3.5`})})]})]}),i&&(0,u.jsxs)(`div`,{className:`ml-2 pl-2 border-l-2 border-blue-200 space-y-1.5 pt-1 mt-1`,children:[(0,u.jsx)(`div`,{className:`flex items-center justify-between`,children:(0,u.jsxs)(`span`,{className:`text-[8px] font-bold text-blue-600 uppercase tracking-wider block`,children:[`Sub-Table Columns (`,((r=e.columns)==null?void 0:r.length)||0,`):`]})}),e.columns.map((n,r)=>{let i=`${t}-${r}`;return S===i?(0,u.jsxs)(`div`,{className:`space-y-1 p-1.5 bg-white border border-blue-300 rounded`,children:[(0,u.jsx)(`div`,{className:`text-[8px] font-bold text-blue-600 uppercase`,children:`Edit Sub-Column`}),(0,u.jsx)(`input`,{type:`text`,value:T,onChange:e=>E(e.target.value),placeholder:`Header Name`,className:`w-full px-2 py-0.5 border border-gray-200 rounded text-[11px] bg-white`}),(0,u.jsx)(`input`,{type:`text`,value:D,onChange:e=>ee(e.target.value),placeholder:`Value`,className:`w-full px-2 py-0.5 border border-gray-200 rounded text-[11px] font-mono bg-white`}),(0,u.jsxs)(`div`,{className:`flex justify-end gap-1 pt-0.5`,children:[(0,u.jsxs)(`button`,{onClick:()=>{g&&g(t,T,D,r),C(null)},className:`p-0.5 px-1.5 bg-blue-600 text-white hover:bg-blue-700 rounded text-[9px] flex items-center gap-1 font-bold`,children:[(0,u.jsx)(Vb,{className:`h-2.5 w-2.5`}),(0,u.jsx)(`span`,{children:`Save`})]}),(0,u.jsxs)(`button`,{onClick:()=>C(null),className:`p-0.5 px-1.5 bg-gray-200 text-slate-700 hover:bg-gray-300 rounded text-[9px] flex items-center gap-1`,children:[(0,u.jsx)(lx,{className:`h-2.5 w-2.5`}),(0,u.jsx)(`span`,{children:`Cancel`})]})]})]},r):(0,u.jsxs)(`div`,{className:`flex items-center justify-between bg-white border border-gray-150 rounded px-2 py-1 text-[11px]`,children:[(0,u.jsxs)(`div`,{className:`truncate mr-1`,children:[(0,u.jsx)(`span`,{className:`font-semibold text-slate-700 block truncate`,children:n.columnName}),(0,u.jsx)(`code`,{className:`text-[8px] font-mono text-slate-400 truncate block`,children:n.placeholder})]}),(0,u.jsxs)(`div`,{className:`flex items-center gap-0.5 shrink-0`,children:[(0,u.jsx)(`button`,{onClick:()=>_&&_(t,`up`,r),disabled:r===0,className:`p-0.5 text-slate-400 hover:text-slate-700 hover:bg-slate-100 disabled:opacity-30 disabled:hover:bg-transparent rounded`,title:`Move Sub-Column Up`,children:(0,u.jsx)(zb,{className:`h-3 w-3`})}),(0,u.jsx)(`button`,{onClick:()=>_&&_(t,`down`,r),disabled:r===e.columns.length-1,className:`p-0.5 text-slate-400 hover:text-slate-700 hover:bg-slate-100 disabled:opacity-30 disabled:hover:bg-transparent rounded`,title:`Move Sub-Column Down`,children:(0,u.jsx)(Rb,{className:`h-3 w-3`})}),(0,u.jsx)(`button`,{onClick:()=>{C(i),E(n.columnName),ee(n.placeholder)},className:`p-0.5 text-slate-400 hover:text-slate-700 hover:bg-slate-100 rounded`,title:`Edit sub-column`,children:(0,u.jsx)(qb,{className:`h-3 w-3`})}),(0,u.jsx)(`button`,{onClick:()=>h(t,r),className:`p-0.5 text-slate-400 hover:text-red-600 hover:bg-red-50 rounded`,title:`Delete sub-column`,children:(0,u.jsx)(ox,{className:`h-3 w-3`})})]})]},r)}),O===t?(0,u.jsxs)(`div`,{className:`bg-white border border-blue-200 rounded p-2 space-y-1.5 mt-1`,children:[(0,u.jsx)(`span`,{className:`text-[9px] font-bold text-blue-600 block`,children:`Add Sub-Column`}),(0,u.jsx)(`input`,{type:`text`,value:te,onChange:e=>A(e.target.value),placeholder:`Header Name (e.g. Price)`,className:`w-full px-2 py-1 border border-gray-200 rounded text-xs bg-white`}),(0,u.jsx)(`input`,{type:`text`,value:ne,onChange:e=>re(e.target.value),placeholder:`Value (e.g. {{item.price}})`,className:`w-full px-2 py-1 border border-gray-200 rounded text-xs font-mono bg-white`}),(0,u.jsxs)(`div`,{className:`flex gap-1 pt-1`,children:[(0,u.jsx)(`button`,{onClick:()=>{te.trim()&&(m(te,ne||`{{item.value}}`,!1,t),A(``),re(``),k(null))},className:`flex-1 py-1 bg-blue-600 hover:bg-blue-700 text-white rounded text-[10px] font-bold`,children:`Add`}),(0,u.jsx)(`button`,{onClick:()=>{k(null),A(``),re(``)},className:`py-1 px-2 bg-gray-100 hover:bg-gray-200 text-slate-600 rounded text-[10px]`,children:`Cancel`})]})]}):(0,u.jsxs)(`button`,{onClick:()=>k(t),className:`w-full py-1 text-[10px] font-bold text-blue-600 hover:bg-blue-50 border border-dashed border-blue-200 rounded flex items-center justify-center space-x-1 transition-colors mt-1`,children:[(0,u.jsx)(Jb,{className:`h-3 w-3`}),(0,u.jsx)(`span`,{children:`Add Sub-Column`})]})]})]},t)})}),(0,u.jsxs)(`div`,{className:`bg-slate-50 border border-gray-200 border-dashed rounded-xl p-3 space-y-3`,children:[(0,u.jsx)(`span`,{className:`text-[9px] font-bold text-slate-500 uppercase tracking-wider block`,children:`Add New Column`}),(0,u.jsx)(`div`,{children:(0,u.jsx)(`input`,{type:`text`,value:c,onChange:e=>d(e.target.value),placeholder:`Header Name`,className:`w-full px-2 py-1 border border-gray-200 rounded text-xs focus:outline-none focus:border-slate-500 bg-white`})}),(0,u.jsx)(`div`,{children:(0,u.jsx)(`input`,{type:`text`,value:f,onChange:e=>p(e.target.value),placeholder:`Value (e.g. {{item.sku}})`,className:`w-full px-2 py-1 border border-gray-200 rounded text-xs font-mono focus:outline-none focus:border-orange-655 bg-white`})}),(0,u.jsxs)(`div`,{className:`flex gap-2`,children:[(0,u.jsxs)(`button`,{onClick:ae,className:`flex-1 py-1.5 bg-orange-600 hover:bg-orange-700 text-white rounded-lg text-xs font-bold transition-all flex items-center justify-center space-x-1`,children:[(0,u.jsx)(Jb,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Column`})]}),(0,u.jsxs)(`button`,{onClick:()=>{c.trim()&&(m(c,f||`{{item.price}}`,!0),d(``),p(``))},className:`flex-1 py-1.5 bg-blue-600 hover:bg-blue-700 text-white rounded-lg text-xs font-bold transition-all flex items-center justify-center space-x-1`,title:`Add column as nested sub-table`,children:[(0,u.jsx)(Jb,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Sub-Table`})]})]})]})]})]}),(0,u.jsx)(`div`,{className:`pt-4 border-t border-red-100 flex items-center justify-between`,children:(0,u.jsxs)(`button`,{onClick:()=>s(j.id),className:`w-full py-2 bg-red-50 hover:bg-red-100 border border-red-200 text-red-650 rounded-xl text-xs font-bold transition-all flex items-center justify-center space-x-1 shadow-xs cursor-pointer`,children:[(0,u.jsx)(ox,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Delete Element`})]})})]})]})}function gx({activeTab:e,setActiveTab:t,setBlocks:n,selectedBlockId:r,setSelectedBlockId:i,getSelectedBlock:a,defaultStyles:o,createTextBlock:s,createImageBlock:c,updateSelectedStyle:l,updateSelectedImageInfo:d,handleDeleteBlock:f,handleRemoveTableColumn:p,handleAddTableColumn:m,handleUpdateTableColumn:h,handleReorderTableColumn:g,handleAddTableRow:_,handleRemoveTableRow:v,schemas:y,toggleSchemaColumn:b,customTableName:x,setCustomTableName:S,customLoopStart:C,setCustomLoopStart:w,customLoopEnd:T,setCustomLoopEnd:E,handleAddCustomTable:D,newColName:ee,setNewColName:O,newColPlaceholder:k,setNewColPlaceholder:te,customImageTypes:A,newImgTypeName:ne,setNewImgTypeName:re,handleAddCustomImageType:j,placeholders:ie,searchPlaceholder:ae,setSearchPlaceholder:oe,placeholderMockData:se,setPlaceholderMockData:ce,handleSidebarDragStart:le,fontSizesState:ue,fontFamiliesState:de,fontWeightsState:fe}){return(0,u.jsxs)(`aside`,{className:`w-full lg:w-[30%] flex flex-col bg-white border-t lg:border-t-0 lg:border-l border-gray-200 overflow-y-auto shrink-0`,children:[(0,u.jsx)(`div`,{className:`grid grid-cols-5 gap-1 border-b border-gray-250 p-2 bg-slate-50`,children:[{value:`text`,icon:(0,u.jsx)(sx,{className:`h-4 w-4`})},{value:`tables`,icon:(0,u.jsx)(tx,{className:`h-4 w-4`})},{value:`images`,icon:(0,u.jsx)(Kb,{className:`h-4 w-4`})},{value:`placeholders`,icon:(0,u.jsx)(Qb,{className:`h-4 w-4`})},{value:`styles`,icon:(0,u.jsx)(Zb,{className:`h-4 w-4`})}].map(n=>(0,u.jsxs)(`button`,{onClick:()=>t(n.value),className:`py-2 px-0.5 flex flex-col items-center justify-center gap-1 font-bold text-[9px] rounded-lg uppercase tracking-wider transition-all duration-150 ${e===n.value?`bg-orange-600 text-white shadow-sm shadow-orange-600/10`:`text-slate-500 hover:text-orange-600 hover:bg-orange-50/50`}`,children:[n.icon,(0,u.jsx)(`span`,{children:n.value})]},n.value))}),(0,u.jsxs)(`div`,{className:`p-4 flex-1 flex flex-col min-h-0 overflow-y-auto`,children:[e===`text`&&(0,u.jsx)(dx,{handleSidebarDragStart:le,createTextBlock:s,setBlocks:n,setSelectedBlockId:i,setActiveTab:t,defaultStyles:o}),e===`tables`&&(0,u.jsx)(fx,{schemas:y,toggleSchemaColumn:b,customTableName:x,setCustomTableName:S,customLoopStart:C,setCustomLoopStart:w,customLoopEnd:T,setCustomLoopEnd:E,handleAddCustomTable:D,handleSidebarDragStart:le,setBlocks:n,setSelectedBlockId:i,setActiveTab:t,defaultStyles:o}),e===`images`&&(0,u.jsx)(px,{customImageTypes:A,newImgTypeName:ne,setNewImgTypeName:re,handleAddCustomImageType:j,handleSidebarDragStart:le,createImageBlock:c,setBlocks:n,setSelectedBlockId:i,setActiveTab:t}),e===`placeholders`&&(0,u.jsx)(mx,{placeholders:ie,schemas:y,searchPlaceholder:ae,setSearchPlaceholder:oe,placeholderMockData:se,setPlaceholderMockData:ce,selectedBlockId:r,setBlocks:n}),e===`styles`&&(0,u.jsx)(hx,{selectedBlockId:r,getSelectedBlock:a,updateSelectedStyle:l,updateSelectedImageInfo:d,fontSizesState:ue,fontFamiliesState:de,fontWeightsState:fe,handleDeleteBlock:f,newColName:ee,setNewColName:O,newColPlaceholder:k,setNewColPlaceholder:te,handleAddTableColumn:m,handleRemoveTableColumn:p,handleUpdateTableColumn:h,handleReorderTableColumn:g,handleAddTableRow:_,handleRemoveTableRow:v,setBlocks:n})]})]})}var _x=[`bold`,`italic`,`underline`,`strikethrough`,`width`],vx=({block:e,onUpdate:t,onSelect:n,onDrop:r})=>{let i=(0,l.useRef)(null);(0,l.useEffect)(()=>{i.current&&i.current.innerHTML!==e.content&&document.activeElement!==i.current&&(i.current.innerHTML=e.content||`<br/>`)},[e.id,e.content]);let a=e.style,{bold:o,italic:s,underline:c,strikethrough:d,width:f}=a,p=w({},Nb(a,_x));o&&(p.fontWeight=`bold`),s&&(p.fontStyle=`italic`);let m=[];return c&&m.push(`underline`),d&&m.push(`line-through`),m.length>0&&(p.textDecoration=m.join(` `)),(0,u.jsx)(`div`,{ref:i,contentEditable:!0,suppressContentEditableWarning:!0,onFocus:n,onInput:e=>t(e.currentTarget.innerHTML),onBlur:e=>t(e.currentTarget.innerHTML),style:p,className:`h-fit w-full break-words outline-none`,onDrop:r,onDragOver:e=>e.preventDefault()})},yx=({blockId:e,colIdx:t,placeholder:n,onUpdate:r,onDrop:i})=>{let a=(0,l.useRef)(null);return(0,l.useEffect)(()=>{a.current&&a.current.innerHTML!==n&&document.activeElement!==a.current&&(a.current.innerHTML=n)},[e,t,n]),(0,u.jsx)(`td`,{ref:a,contentEditable:!0,suppressContentEditableWarning:!0,onInput:e=>r(e.currentTarget.innerText||e.currentTarget.innerHTML),onBlur:e=>r(e.currentTarget.innerText||e.currentTarget.innerHTML),onDrop:i,onDragOver:e=>e.preventDefault(),className:`border border-slate-200 px-2.5 py-2.5 text-slate-500 bg-slate-50/20 font-sans outline-none focus:bg-slate-100/50 transition-colors`})},bx=e=>{let t=[];return e.forEach(e=>{e.style.sameRow&&t.length>0?t[t.length-1].blocks.push(e):t.push({id:e.id,blocks:[e]})}),t};function xx({blocks:e,setBlocks:t,selectedBlockId:n,setSelectedBlockId:r,setActiveTab:i,showMockData:a,placeholderMockData:o,dragOverIndex:s,setDragOverIndex:c,draggedSidebarItem:l,defaultStyles:d,zoom:f,panOffset:p,spacePressed:m,canvasHeight:h,viewportRef:g,canvasContainerRef:_,handleMouseDown:v,handleMouseMove:y,handleMouseUp:b,createTextBlock:x,duplicateBlock:S,reorderBlock:C,handleDeleteBlock:T,handleSidebarDrop:E,handleTableCellDrop:D,updateTableCell:ee,handleTextDrop:O}){let k=(e,t)=>{e.dataTransfer.setData(`blockIndex`,t.toString()),e.dataTransfer.setData(`source`,`canvas`),e.dataTransfer.effectAllowed=`move`},te=(n,r)=>{n.preventDefault(),n.stopPropagation();let i=n.dataTransfer.getData(`source`);if(i===`sidebar`)E(r);else if(i===`canvas`){let i=parseInt(n.dataTransfer.getData(`blockIndex`));if(isNaN(i)||i===r)return;let a=[...e],o=a.splice(i,1)[0],s=i<r?r-1:r;a.splice(s,0,o),t(a)}c(null)};return(0,u.jsx)(`div`,{ref:g,className:`flex-1 overflow-auto p-8 flex justify-center items-start outline-none transition-all ${m?`cursor-grab active:cursor-grabbing`:`cursor-default`}`,onMouseDown:v,onMouseMove:y,onMouseUp:b,onMouseLeave:b,children:(0,u.jsx)(`div`,{style:{transform:`translate(${p.x}px, ${p.y}px) scale(${f})`,transformOrigin:`top center`},className:`transition-transform duration-75 ease-out select-none`,children:(0,u.jsxs)(`div`,{ref:_,style:{height:`${h}px`},className:`w-[794px] min-h-[1123px] bg-white shadow-lg border border-gray-300/80 px-[60px] py-[60px] flex flex-col relative canvas-editor-area`,onDragOver:e=>e.preventDefault(),onDrop:n=>{if(n.preventDefault(),n.stopPropagation(),l)E(e.length);else{let e=n.dataTransfer.getData(`placeholder`);if(e){n.preventDefault();let a=x(`p`,`{{${e}}}`,d==null?void 0:d.p);t(e=>[...e,a]),r(a.id),i(`styles`)}}},children:[e.length===0?(0,u.jsxs)(`div`,{className:`flex-1 border-2 border-dashed border-gray-200 rounded-2xl flex flex-col items-center justify-center p-8 text-center text-slate-400`,children:[(0,u.jsx)(Zb,{className:`h-10 w-10 mb-3 animate-bounce text-slate-350`}),(0,u.jsx)(`span`,{className:`font-bold text-sm text-slate-600 block`,children:`Drag & Drop Editor Canvas`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-400 mt-1 max-w-sm`,children:`Select elements from the sidebar tabs (Text, Tables, Images) and drag them here to assemble your template structure.`})]}):bx(e).map(a=>{var o;let s=a.blocks.length>1;return(0,u.jsx)(`div`,{className:`group/row ${a.blocks.some(e=>e.style.position===`absolute`)?``:`relative`} border border-transparent rounded-lg hover:border-slate-200/60 p-1 mb-2 ${s?((o=a.blocks[0])==null||(o=o.style)==null?void 0:o.flexDirection)===`column`?`flex flex-col gap-2`:`flex flex-row gap-4`:``}`,children:a.blocks.map(a=>{var o,l,d,f;let p=n===a.id,m=w(w({},a.style),gb(a.style.customCss||``));return(0,u.jsxs)(`div`,{draggable:!0,onDragStart:t=>{let n=e.findIndex(e=>e.id===a.id);k(t,n)},onDragOver:t=>{t.preventDefault(),c(e.findIndex(e=>e.id===a.id))},onDrop:t=>{let n=e.findIndex(e=>e.id===a.id);te(t,n)},onClick:e=>{e.stopPropagation(),r(a.id),i(`styles`)},style:{width:s?a.style.width||`48%`:(a.style.position,`100%`),height:a.style.position===`absolute`?a.style.height||`100%`:void 0,position:a.style.position,top:a.style.top,left:a.style.left,zIndex:a.style.zIndex?parseInt(a.style.zIndex):void 0},className:`group/block relative p-0.5 rounded-xl border border-transparent transition-all duration-150 cursor-pointer ${p?`bg-orange-50/20 border-orange-500 shadow-sm ring-2 ring-orange-500/10`:`hover:bg-slate-50/30 hover:border-gray-200`} ${a.style.position===`absolute`?`!absolute !inset-0 !m-auto`:``}`,children:[p&&(0,u.jsxs)(`div`,{className:`absolute -top-3.5 right-3 bg-orange-600 text-white rounded-lg px-2 py-0.5 text-[10px] font-bold flex items-center space-x-1.5 shadow-md z-30 select-none`,children:[(0,u.jsx)(`button`,{onClick:()=>{C(e.findIndex(e=>e.id===a.id),`up`)},className:`hover:text-slate-350`,title:`Move Up`,children:(0,u.jsx)(zb,{className:`h-3 w-3`})}),(0,u.jsx)(`button`,{onClick:()=>{C(e.findIndex(e=>e.id===a.id),`down`)},className:`hover:text-slate-350`,title:`Move Down`,children:(0,u.jsx)(Rb,{className:`h-3 w-3`})}),(0,u.jsx)(`div`,{className:`h-3 w-[1px] bg-slate-700`}),(0,u.jsx)(`button`,{onClick:e=>S(a.id,e),className:`hover:text-slate-350`,title:`Duplicate block`,children:(0,u.jsx)(Hb,{className:`h-3 w-3`})}),(0,u.jsx)(`button`,{onClick:e=>T(a.id,e),className:`hover:text-red-400 text-red-300`,title:`Delete block`,children:(0,u.jsx)(ox,{className:`h-3 w-3`})})]}),a.type===`table`?(0,u.jsx)(`div`,{className:`overflow-x-auto w-full select-none`,children:(0,u.jsxs)(`table`,{style:m,className:`w-full border-collapse`,children:[(0,u.jsx)(`thead`,{children:(0,u.jsx)(`tr`,{children:(o=a.tableInfo)==null?void 0:o.columns.filter(e=>e.enabled!==!1).map((e,t)=>(0,u.jsx)(`th`,{className:`border border-slate-200 px-2.5 py-1 text-slate-700 text-left bg-slate-50 font-sans`,children:e.columnName||``},t))})}),(0,u.jsx)(`tbody`,{children:((l=a.tableInfo)!=null&&l.mockRows&&a.tableInfo.mockRows.length>0?a.tableInfo.mockRows:[{}]).map((e,t)=>{var n;return(0,u.jsx)(`tr`,{className:`bg-slate-50/10 border-b border-slate-100 hover:bg-slate-50/20`,children:(n=a.tableInfo)==null?void 0:n.columns.filter(e=>e.enabled!==!1).map((t,n)=>{let r=e&&typeof e==`object`&&e[t.columnName]||t.placeholder;if(t.loop&&t.columns&&t.columns.length>0){let e=t.columns.filter(e=>e.enabled!==!1);return(0,u.jsx)(`td`,{className:`border border-slate-200 p-2 align-top bg-slate-50/20`,children:(0,u.jsxs)(`div`,{className:`w-full overflow-x-auto space-y-1`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between text-[9px] font-semibold text-slate-500`,children:[(0,u.jsxs)(`span`,{children:[`Sub-table: `,t.columnName]}),(0,u.jsx)(`span`,{className:`px-1.5 py-0.5 bg-slate-200 text-slate-600 rounded text-[8px]`,children:`loop = true`})]}),(0,u.jsxs)(`table`,{className:`w-full border-collapse border border-slate-200 rounded text-xs bg-white`,children:[(0,u.jsx)(`thead`,{children:(0,u.jsx)(`tr`,{children:e.map((e,t)=>(0,u.jsx)(`th`,{className:`border border-slate-200 px-2 py-1 text-slate-700 text-left bg-slate-100/80 font-sans font-semibold text-[10px]`,children:e.columnName},t))})}),(0,u.jsx)(`tbody`,{children:(0,u.jsx)(`tr`,{className:`bg-slate-50/30`,children:e.map((e,t)=>(0,u.jsx)(yx,{blockId:a.id,colIdx:t,placeholder:e.placeholder,onUpdate:e=>ee(a.id,n,e,t),onDrop:e=>D(e,a.id,n,t)},t))})})]})]})},n)}return(0,u.jsx)(yx,{blockId:a.id,colIdx:n,placeholder:r,onUpdate:e=>ee(a.id,n,e),onDrop:e=>D(e,a.id,n)},n)})},t)})})]})}):a.type===`image`?(0,u.jsx)(`div`,{style:{textAlign:m.textAlign||`left`,width:`100%`,marginBottom:m.marginBottom,padding:m.padding,backgroundColor:m.backgroundColor},className:`w-full select-none`,children:(0,u.jsx)(`div`,{style:{width:s?`100%`:a.style.width||`100%`,display:`inline-block`},children:((d=a.imageInfo)==null?void 0:d.imageType)===`barcode`?(0,u.jsx)(`div`,{style:{width:`100%`,height:a.style.height||a.style.minHeight||`70px`},className:`border border-dashed border-slate-200 p-2 bg-slate-50/5 rounded-lg flex items-center justify-center overflow-hidden`,dangerouslySetInnerHTML:{__html:_b(a.imageInfo.barcodeValue||`SHIP-99201`)}}):(0,u.jsx)(`img`,{src:((f=a.imageInfo)==null?void 0:f.url)||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`,style:{width:`100%`,height:`auto`,maxHeight:a.style.height||`300px`,objectFit:a.style.objectFit||`contain`,opacity:a.style.opacity||`1`,display:`block`},alt:`graphic content`})})}):(0,u.jsx)(vx,{block:a,onUpdate:e=>{t(t=>t.map(t=>t.id===a.id?w(w({},t),{},{content:e}):t))},onSelect:()=>r(a.id),onDrop:e=>O(e,a.id)})]},a.id)})},a.id)}),s!==null&&(0,u.jsx)(`div`,{className:`h-[2px] bg-orange-500 rounded my-1 shadow-md animate-pulse`})]})})})}function Sx({showClearCanvas:e,handleClearCanvas:t,customButtonStyles:n,customButtonClassNames:r,zoom:i,setZoom:a,setPanOffset:o}){return(0,u.jsxs)(`div`,{className:`bg-white border-b border-gray-200 px-6 py-3 flex items-center justify-between shadow-xs sticky top-0 z-20`,children:[(0,u.jsx)(`div`,{className:`flex items-center space-x-4`,children:e&&(0,u.jsxs)(`button`,{onClick:t,style:n==null?void 0:n.clearCanvas,className:(r==null?void 0:r.clearCanvas)||`inline-flex items-center space-x-1 px-2.5 py-1 text-xs font-semibold border border-red-200 text-red-650 bg-red-50 hover:bg-red-100 rounded-lg transition-colors`,title:`Clear all canvas elements`,children:[(0,u.jsx)(ox,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Clear Canvas`})]})}),(0,u.jsxs)(`div`,{className:`flex items-center space-x-3 bg-slate-50 border border-gray-200 px-3 py-1 rounded-xl shadow-xs select-none`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-1`,children:[(0,u.jsx)(`button`,{onClick:()=>a(e=>Math.max(e-.1,.5)),className:`h-6 w-6 rounded border border-gray-200 bg-white hover:bg-slate-50 flex items-center justify-center font-bold text-slate-650 hover:text-slate-900 transition-colors text-xs select-none`,title:`Zoom Out`,children:`−`}),(0,u.jsxs)(`div`,{className:`w-12 text-center text-xs font-bold text-slate-700`,children:[Math.round(i*100),`%`]}),(0,u.jsx)(`button`,{onClick:()=>a(e=>Math.min(e+.1,2)),className:`h-6 w-6 rounded border border-gray-200 bg-white hover:bg-slate-50 flex items-center justify-center font-bold text-slate-650 hover:text-slate-900 transition-colors text-xs select-none`,title:`Zoom In`,children:`+`})]}),(0,u.jsx)(`div`,{className:`h-4 w-[1px] bg-gray-200`}),(0,u.jsx)(`input`,{type:`range`,min:`0.5`,max:`2.0`,step:`0.05`,value:i,onChange:e=>a(parseFloat(e.target.value)),className:`w-20 accent-orange-600 h-1 bg-gray-200 rounded-lg appearance-none cursor-pointer`}),(0,u.jsx)(`button`,{onClick:()=>{a(1),o({x:0,y:0})},className:`text-[10px] font-bold text-slate-500 hover:text-slate-800 hover:underline`,children:`Reset`})]})]})}function Cx({previewOpen:e,setPreviewOpen:t,generateExportHtml:n}){return e?(0,u.jsx)(`div`,{className:`fixed inset-0 bg-slate-950/65 backdrop-blur-xs flex items-center justify-center z-50 p-6`,children:(0,u.jsxs)(`div`,{className:`bg-white rounded-2xl w-full max-w-[900px] h-[90%] flex flex-col shadow-2xl overflow-hidden border border-gray-200`,children:[(0,u.jsxs)(`div`,{className:`bg-slate-50 border-b border-gray-200 px-6 py-4 flex items-center justify-between`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsxs)(`h3`,{className:`text-sm font-bold text-slate-800 flex items-center space-x-2`,children:[(0,u.jsx)(Wb,{className:`h-4 w-4 text-slate-655`}),(0,u.jsx)(`span`,{children:`HTML Document Render Output`})]}),(0,u.jsx)(`p`,{className:`text-[10px] text-slate-400 mt-0.5`,children:`Sandboxed iframe preview of final template markup`})]}),(0,u.jsx)(`button`,{onClick:()=>t(!1),className:`p-1.5 bg-slate-100 hover:bg-slate-200 text-slate-500 hover:text-slate-800 rounded-lg transition-colors`,children:(0,u.jsx)(lx,{className:`h-4 w-4`})})]}),(0,u.jsx)(`div`,{className:`flex-1 bg-slate-100 p-6 overflow-hidden`,children:(0,u.jsx)(`iframe`,{title:`HTML Preview Sandbox`,srcDoc:n(!0),className:`w-full h-full bg-white border border-gray-200 rounded-xl shadow-xs`,sandbox:`allow-same-origin`})}),(0,u.jsxs)(`details`,{className:`bg-slate-50 border-t border-gray-200`,children:[(0,u.jsxs)(`summary`,{className:`px-6 py-3 text-xs font-bold text-slate-600 cursor-pointer select-none hover:text-slate-800 flex items-center justify-between`,children:[(0,u.jsx)(`span`,{children:`View Raw Output Markup (HTML)`}),(0,u.jsx)(`span`,{className:`text-[10px] text-slate-400 font-medium font-sans`,children:`Click to expand`})]}),(0,u.jsx)(`div`,{className:`px-6 pb-6 overflow-x-auto max-h-[250px]`,children:(0,u.jsx)(`pre`,{className:`bg-slate-900 text-slate-200 p-4 rounded-lg text-[10px] font-mono whitespace-pre-wrap select-all`,children:n(!1)})})]})]})}):null}function wx({bubbleCoords:e,applySelectionFormat:t}){return e?(0,u.jsxs)(`div`,{className:`fixed bg-slate-900 border border-slate-800 text-white rounded-xl shadow-xl py-1 px-1.5 flex items-center space-x-1.5 z-50 select-none -translate-x-1/2`,style:{left:`${e.x}px`,top:`${e.y}px`},children:[(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`bold`)},className:`h-6 w-6 rounded hover:bg-slate-800 flex items-center justify-center font-bold text-xs text-slate-200 hover:text-white transition-colors`,title:`Bold Selection`,children:`B`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`italic`)},className:`h-6 w-6 rounded hover:bg-slate-800 flex items-center justify-center italic text-xs text-slate-200 hover:text-white transition-colors`,title:`Italic Selection`,children:`I`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`underline`)},className:`h-6 w-6 rounded hover:bg-slate-800 flex items-center justify-center underline text-xs text-slate-200 hover:text-white transition-colors`,title:`Underline Selection`,children:`U`}),(0,u.jsx)(`div`,{className:`h-4 w-[1px] bg-slate-800 mx-1`}),(0,u.jsxs)(`select`,{value:e.format||``,onChange:e=>{e.preventDefault(),e.target.value&&(t(`formatBlock`,e.target.value),e.target.value===`P`&&t(`fontSize`,`3`))},className:`bg-slate-800 text-white text-[10px] rounded px-1 py-0.5 outline-none cursor-pointer border border-slate-700`,children:[(0,u.jsx)(`option`,{value:``,disabled:!0,children:`Format...`}),(0,u.jsx)(`option`,{value:`H1`,children:`Heading 1`}),(0,u.jsx)(`option`,{value:`H2`,children:`Heading 2`}),(0,u.jsx)(`option`,{value:`H3`,children:`Heading 3`}),(0,u.jsx)(`option`,{value:`P`,children:`Paragraph`}),(0,u.jsx)(`option`,{value:`BLOCKQUOTE`,children:`Quote`})]}),(0,u.jsx)(`div`,{className:`h-4 w-[1px] bg-slate-800 mx-1`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`foreColor`,`#3b82f6`)},className:`h-4 w-4 rounded-full bg-blue-500 hover:scale-110 transition-transform cursor-pointer`,title:`Color Blue`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`foreColor`,`#ef4444`)},className:`h-4 w-4 rounded-full bg-red-500 hover:scale-110 transition-transform cursor-pointer`,title:`Color Red`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`foreColor`,`#1e293b`)},className:`h-4 w-4 rounded-full bg-slate-700 hover:scale-110 transition-transform cursor-pointer border border-slate-850`,title:`Color Slate`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`foreColor`,`#22c55e`)},className:`h-4 w-4 rounded-full bg-green-500 hover:scale-110 transition-transform cursor-pointer`,title:`Color Green`}),(0,u.jsx)(`div`,{className:`h-4 w-[1px] bg-slate-800`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`removeFormat`)},className:`hover:bg-slate-800 rounded text-[10px] px-1.5 h-6 flex items-center justify-center text-slate-400 hover:text-white font-semibold transition-colors`,title:`Clear Formatting`,children:`Clear`})]}):null}zu.workerSrc=`https://cdn.jsdelivr.net/npm/pdfjs-dist@6.1.200/build/pdf.worker.min.mjs`;var Tx=e=>{let t=[];return e.forEach(e=>{e.style.sameRow&&t.length>0?t[t.length-1].blocks.push(e):t.push({id:e.id,blocks:[e]})}),t},Ex=e=>e?e.replace(/contenteditable="[^"]*"/g,``).replace(/class="[^"]*"/g,``).replace(/data-placeholder="[^"]*"/g,``).replace(/&nbsp;/g,` `).trim():``;function Dx({tableSchemas:e,placeholders:t,defaultLogo:n,defaultBanner:r,headerTitle:i=`HTML Template Builder`,headerSubtitle:a=`Design and export templates dynamically`,headerLogo:o,typographySizes:s,typographyWeights:c,typographyFonts:d,templatingLanguage:f=`csharp`,loopSyntax:p=`foreach`,onChange:m,onExport:h,onExportPdf:g,initialBlocks:v,defaultStyles:y,showImportHtml:b=!0,showImportPdf:x=!0,showClearCanvas:S=!0,showPreview:C=!0,showExport:T=!0,showExportPdf:E=!0,customButtonStyles:D,customButtonClassNames:O,customActionComponents:k}={}){let{zoom:te,setZoom:A,panOffset:ne,setPanOffset:re,spacePressed:j,canvasHeight:ie,viewportRef:ae,canvasContainerRef:oe,handleMouseDown:se,handleMouseMove:ce,handleMouseUp:le}=Sb(),{customTableName:ue,setCustomTableName:de,customLoopStart:fe,setCustomLoopStart:pe,customLoopEnd:me,setCustomLoopEnd:he,newColName:ge,setNewColName:_e,newColPlaceholder:ve,setNewColPlaceholder:ye,bubbleCoords:be,setBubbleCoords:xe,schemas:Se,isParsing:Ce,setIsParsing:we,parseStatusText:Te,setParseStatusText:M,parseError:N,setParseError:Ee,draggedSidebarItem:P,setDraggedSidebarItem:De,dragOverIndex:Oe,setDragOverIndex:ke,newImgTypeName:Ae,setNewImgTypeName:je,customImageTypes:Me,searchPlaceholder:Ne,setSearchPlaceholder:Pe,handleAddCustomTable:Fe,handleAddCustomImageType:Ie,toggleSchemaColumn:Le,applySelectionFormat:F,setSavedRange:I}=Cb({tableSchemas:e}),{blocks:Re,setBlocks:ze,selectedBlockId:Be,setSelectedBlockId:Ve,getSelectedBlock:He,createTextBlock:L,createTableBlock:Ue,createImageBlock:We,handleDeleteBlock:Ge,handleDuplicateBlock:Ke,handleMoveBlockUp:qe,handleMoveBlockDown:Je,updateSelectedStyle:Ye,updateSelectedImageInfo:Xe,handleRemoveTableColumn:Ze,handleAddTableColumn:R,handleUpdateTableColumn:z,handleReorderTableColumn:Qe,handleAddTableRow:$e,handleRemoveTableRow:et}=xb({initialBlocks:v,defaultStyles:y,defaultLogo:n,defaultBanner:r,onChange:m}),[tt,nt]=(0,l.useState)(`text`),[rt,it]=(0,l.useState)(!1),[at]=(0,l.useState)(!0),[ot]=(0,l.useState)(s||[{label:`8px`,value:`8px`},{label:`9px`,value:`9px`},{label:`10px`,value:`10px`},{label:`11px`,value:`11px`},{label:`12px`,value:`12px`},{label:`14px`,value:`14px`},{label:`16px`,value:`16px`},{label:`18px`,value:`18px`},{label:`20px`,value:`20px`},{label:`24px`,value:`24px`},{label:`28px`,value:`28px`},{label:`32px`,value:`32px`},{label:`36px`,value:`36px`}]),[st]=(0,l.useState)(d||[{label:`Outfit (Default)`,value:`'Outfit', 'Inter', sans-serif`},{label:`Inter`,value:`'Inter', sans-serif`},{label:`Roboto`,value:`'Roboto', sans-serif`},{label:`System Sans`,value:`system-ui, -apple-system, sans-serif`},{label:`Georgia (Serif)`,value:`Georgia, serif`},{label:`Courier New (Mono)`,value:`'Courier New', monospace`}]),[ct]=(0,l.useState)(c||[{label:`Light`,value:`300`},{label:`Regular`,value:`400`},{label:`Medium`,value:`500`},{label:`Semibold`,value:`600`},{label:`Bold`,value:`700`},{label:`Extra Bold`,value:`800`}]),[B]=(0,l.useState)(f),[lt]=(0,l.useState)(p),[ut]=(0,l.useState)(!0),[dt,ft]=(0,l.useState)({});(0,l.useEffect)(()=>{let e=()=>{let e=window.getSelection();if(!e||e.isCollapsed||e.toString().trim()===``){xe(null),I(null);return}let t=document.activeElement;if(!(t&&t.getAttribute(`contenteditable`)===`true`&&(t.closest(`.canvas-editor-area`)||t.closest(`td`)))){xe(null),I(null);return}try{let t=e.getRangeAt(0),n=t.getBoundingClientRect(),r=document.queryCommandValue(`formatBlock`)||``;r=r.toUpperCase(),xe({x:n.left+n.width/2,y:n.top-38,format:r}),I(t)}catch(e){xe(null),I(null)}};return document.addEventListener(`selectionchange`,e),()=>document.removeEventListener(`selectionchange`,e)},[xe]),(0,l.useEffect)(()=>{let e={};(t||[]).forEach(t=>{let n=t.placeholder.replace(/[{}]/g,``);e[n]=t.mockValue||``}),Se.forEach(t=>{t.columns.forEach(t=>{let n=t.placeholder.replace(/[{}]/g,``).replace(/^(\.\.\/|package\.|item\.)/,``);e[n]||(e[n]=t.mockValue||``)})}),ft(e)},[t,Se]),(0,l.useEffect)(()=>{let e=ae.current;if(!e)return;let t=e=>{if(e.ctrlKey){e.preventDefault();let t=e.deltaY<0?1:-1;A(e=>Math.min(2,Math.max(.5,e+t*.05)))}};return e.addEventListener(`wheel`,t,{passive:!1}),()=>e.removeEventListener(`wheel`,t)},[ae,A]),(0,l.useEffect)(()=>{window.updateContentFromRawDelete=(e,t)=>{ze(n=>n.map(n=>n.id===e?w(w({},n),{},{content:t}):n))}},[ze]);let pt=e=>{var t;let n=(t=e.target.files)==null?void 0:t[0];if(!n)return;we(!0),M(`Parsing HTML...`),Ee(null);let r=new FileReader;r.onload=t=>{try{var n;let e=yb((n=t.target)==null?void 0:n.result);e.length>0&&ze(e)}catch(e){console.error(e),Ee(e.message||`Failed to parse HTML`)}finally{we(!1),e.target&&(e.target.value=``)}},r.readAsText(n)},mt=e=>{var t;let n=(t=e.target.files)==null?void 0:t[0];if(!n)return;we(!0),M(`Reading PDF text layers...`),Ee(null);let r=new FileReader;r.onload=_(function*(){try{let e=r.result,t=yield bb(e,ee);t.length>0&&ze(e=>[...e,...t])}catch(e){console.error(e),Ee(e.message||`Failed to read PDF`)}finally{we(!1),e.target&&(e.target.value=``)}}),r.readAsArrayBuffer(n)},ht=e=>{let t=e||`items`;if(B===`handlebars`||B===`mustache`){let e=lt===`foreach`?`foreach`:`each`;return{start:`{{#${e} ${t}}}`,end:`{{/${e}}}`}}return B===`liquid`||B===`scriban`||B===`dotnet`?{start:`{% for ${t.endsWith(`s`)?t.slice(0,-1):`item`} in ${t} %}`,end:`{% endfor %}`}:B===`js`||B===`ts`?{start:`\${${t}.map(${t.endsWith(`s`)?t.slice(0,-1):`item`} => \``,end:"`).join('')}"}:B===`csharp`||B===`razor`?{start:`@foreach (var ${t.endsWith(`s`)?t.slice(0,-1):`item`} in ${t}) {`,end:`}`}:{start:fe.replace(`items`,t),end:me}},gt=(e=!1)=>{let t=`<!DOCTYPE html>
+  </svg>`},vb=(e,t)=>{let n=`11px`,r=`400`;return e===`h1`?(n=`24px`,r=`700`):e===`h2`?(n=`20px`,r=`700`):e===`h3`?(n=`16px`,r=`600`):e===`h4`?(n=`14px`,r=`600`):e===`h5`?(n=`12px`,r=`600`):e===`h6`?(n=`10px`,r=`600`):e===`title`?(n=`28px`,r=`800`):e===`subtitle`?(n=`14px`,r=`300`):e===`caption`&&(n=`9px`,r=`400`),{id:`block-${Math.random().toString(36).substr(2,9)}`,type:e,content:t,style:{fontSize:n,fontWeight:r,color:`#1e293b`,backgroundColor:`transparent`,textAlign:`left`,bold:[`h1`,`h2`,`h3`,`h4`,`h5`,`h6`,`title`].includes(e),italic:!1,underline:!1,strikethrough:!1,width:`100%`,marginBottom:`8px`,padding:`8px`,minHeight:`auto`}}},yb=e=>{let t=new DOMParser().parseFromString(e,`text/html`),n=[],r=Array.from(t.body.children);if(r.length===0){let e=t.body.innerText||t.body.textContent||``;e.trim()&&n.push(vb(`p`,e.trim()))}else{let e=t.querySelectorAll(`style`),i=[];e.forEach(e=>{let t=e.textContent||``,n=/([^{]+)\{([^}]+)\}/g,r;for(;(r=n.exec(t))!==null;){let e=r[1].trim(),t=r[2].trim(),n={};t.split(`;`).forEach(e=>{let t=e.split(`:`);t.length===2&&(n[t[0].trim().toLowerCase()]=t[1].trim())}),i.push({selector:e,styles:n})}});let a=e=>{let t={fontSize:`11px`,fontWeight:`400`,color:`#1e293b`,backgroundColor:`transparent`,textAlign:`left`,bold:!1,italic:!1,underline:!1,strikethrough:!1,width:`100%`,marginBottom:`8px`,padding:`8px`},n=e.style;return n.fontSize&&(t.fontSize=n.fontSize),n.fontWeight&&(t.fontWeight=n.fontWeight),n.color&&(t.color=n.color),n.backgroundColor&&(t.backgroundColor=n.backgroundColor),n.textAlign&&(t.textAlign=n.textAlign),n.padding&&(t.padding=n.padding),n.marginBottom&&(t.marginBottom=n.marginBottom),n.width&&(t.width=n.width),i.forEach(n=>{try{e.matches(n.selector)&&(n.styles[`font-size`]&&(t.fontSize=n.styles[`font-size`]),n.styles[`font-weight`]&&(t.fontWeight=n.styles[`font-weight`]),n.styles.color&&(t.color=n.styles.color),n.styles[`background-color`]&&(t.backgroundColor=n.styles[`background-color`]),n.styles[`text-align`]&&(t.textAlign=n.styles[`text-align`]),n.styles.padding&&(t.padding=n.styles.padding),n.styles[`margin-bottom`]&&(t.marginBottom=n.styles[`margin-bottom`]),n.styles.width&&(t.width=n.styles.width))}catch(e){}}),(t.fontWeight===`bold`||parseInt(t.fontWeight)>=600)&&(t.bold=!0),t};r.forEach(e=>{let t=e;if(t.tagName===`STYLE`)return;let r=t.querySelector(`table, img, h1, h2, h3, h4, h5, h6, p, span, div`)||t,i=r.tagName.toLowerCase(),o=a(r);if(i===`table`){let e=Array.from(r.querySelectorAll(`thead th`));e.length===0&&(e=Array.from(r.querySelectorAll(`tr:first-child th, tr:first-child td`)));let t=e.map(e=>{var t,n;return{columnName:((t=e.textContent)==null?void 0:t.trim())||`Header`,placeholder:`{{item.${((n=e.textContent)==null?void 0:n.trim().toLowerCase().replace(/\s+/g,`_`))||`field`}}}`,enabled:!0}});n.push({id:`block-${Math.random().toString(36).substr(2,9)}`,type:`table`,content:``,style:o,tableInfo:{tableName:`imported_table`,columns:t,loop:!0,isNestable:!1,parentPath:`items`,maxNestingDepth:5,nestingPrefix:` `,showNestingLevel:!1}})}else if(i===`img`)n.push({id:`block-${Math.random().toString(36).substr(2,9)}`,type:`image`,content:``,style:o,imageInfo:{imageType:`logo`,url:r.getAttribute(`src`)||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`}});else if(i===`svg`)n.push({id:`block-${Math.random().toString(36).substr(2,9)}`,type:`image`,content:``,style:o,imageInfo:{imageType:`barcode`,barcodeValue:`SHIP-99201`,barcodePlaceholder:`{{barcode}}`}});else{let e=`p`;[`h1`,`h2`,`h3`,`h4`,`h5`,`h6`].includes(i)?e=i:i===`span`&&(e=`caption`),n.push({id:`block-${Math.random().toString(36).substr(2,9)}`,type:e,content:r.innerHTML||r.textContent||``,style:o})}})}return n},bb=function(){var e=_(function*(e,t){let n=yield t.getDocument({data:new Uint8Array(e)}).promise,r=[],i=Math.min(n.numPages,3);for(let e=1;e<=i;e++){let t=(yield(yield n.getPage(e)).getTextContent()).items.map(e=>({text:e.str,x:e.transform[4],y:e.transform[5],fontSize:e.transform[3]})).filter(e=>e.text.trim()!==``);if(t.length===0)continue;t.sort((e,t)=>Math.abs(e.y-t.y)<6?e.x-t.x:t.y-e.y);let i=[],a=[];if(t.forEach(e=>{if(a.length===0)a.push(e);else{let t=a[a.length-1];if(Math.abs(e.y-t.y)<6)a.push(e);else{let t=a.map(e=>e.text).join(` `),n=a.reduce((e,t)=>e+t.y,0)/a.length,r=Math.max(...a.map(e=>e.fontSize));i.push({y:n,fontSize:r,text:t}),a=[e]}}}),a.length>0){let e=a.map(e=>e.text).join(` `),t=a.reduce((e,t)=>e+t.y,0)/a.length,n=Math.max(...a.map(e=>e.fontSize));i.push({y:t,fontSize:n,text:e})}i.forEach(e=>{let t=`p`,n=e.fontSize>16;n?t=e.fontSize>26?`h1`:e.fontSize>20?`h2`:`h3`:e.fontSize<10&&(t=`caption`);let i=Math.round(e.fontSize*1.15)+`px`;r.push({id:`pdf-block-${Math.random().toString(36).substr(2,9)}`,type:t,content:e.text,style:{fontSize:i,fontWeight:n?`700`:`400`,color:`#1e293b`,backgroundColor:`transparent`,textAlign:`left`,bold:n,italic:!1,underline:!1,strikethrough:!1}})})}return r});return function(t,n){return e.apply(this,arguments)}}();function xb({initialBlocks:e,defaultStyles:t,defaultLogo:n,defaultBanner:r,onChange:i}={}){let[a,o]=(0,l.useState)(e||[]),[s,c]=(0,l.useState)(null);(0,l.useEffect)(()=>{i&&i(a)},[a,i]);let u=()=>a.find(e=>e.id===s)||null,d=(e,t,n)=>{let r={};return e===`title`?r={fontSize:`24px`,fontWeight:`800`}:e===`subtitle`?r={fontSize:`14px`,fontWeight:`700`,color:`#64748b`}:e===`h1`?r={fontSize:`20px`,fontWeight:`800`}:e===`h2`?r={fontSize:`18px`,fontWeight:`700`}:e===`h3`?r={fontSize:`16px`,fontWeight:`600`}:e===`caption`&&(r={fontSize:`10px`,color:`#94a3b8`}),{id:Math.random().toString(36).substring(2,11),type:e,content:t,style:w(w({fontSize:`12px`,fontWeight:`normal`,textAlign:`left`,color:`#1e293b`,backgroundColor:`transparent`,marginBottom:`0px`,padding:`0px`,bold:!1,italic:!1,underline:!1,strikethrough:!1},r),n)}},f=e=>w(w({},e),{},{columns:e.columns?e.columns.map(f):void 0});return{blocks:a,setBlocks:o,selectedBlockId:s,setSelectedBlockId:c,getSelectedBlock:u,createTextBlock:d,createTableBlock:e=>({id:Math.random().toString(36).substring(2,11),type:`table`,content:``,style:w({fontSize:`11px`,fontWeight:`normal`,textAlign:`left`,color:`#334155`,backgroundColor:`transparent`,marginBottom:`0px`,padding:`0px`,bold:!1,italic:!1,underline:!1,strikethrough:!1},(t==null?void 0:t.table)||{}),tableInfo:w(w({},e),{},{columns:e.columns.map(f),mockRows:[]})}),createImageBlock:e=>{let i=`100%`,a=`120px`;return e===`logo`?(i=`120px`,a=`60px`):e===`banner`?(i=`100%`,a=`150px`):e===`barcode`?(i=`200px`,a=`80px`):e===`watermark`&&(i=`300px`,a=`300px`),{id:Math.random().toString(36).substring(2,11),type:`image`,content:``,style:w(w({fontSize:`12px`,fontWeight:`normal`,color:`#000055`,backgroundColor:`transparent`,textAlign:`center`,marginBottom:`0px`,padding:`0px`,width:i,height:a,minHeight:a,bold:!1,italic:!1,underline:!1,strikethrough:!1},(t==null?void 0:t.image)||{}),e===`watermark`?{opacity:`0.2`,position:`absolute`,top:`0`,left:`0`,zIndex:10,height:`100%`}:{}),imageInfo:{imageType:e,url:e===`logo`?n||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`:e===`banner`?r||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`:fb,barcodeValue:e===`barcode`?`SHIP-99201`:void 0,barcodePlaceholder:e===`barcode`?`{{barcode}}`:void 0}}},handleDeleteBlock:e=>{o(t=>t.filter(t=>t.id!==e)),s===e&&c(null)},handleDuplicateBlock:e=>{let t=a.find(t=>t.id===e);if(!t)return;let n=w(w({},t),{},{id:Math.random().toString(36).substring(2,11),style:w({},t.style),tableInfo:t.tableInfo?w(w({},t.tableInfo),{},{columns:t.tableInfo.columns.map(f),mockRows:t.tableInfo.mockRows?[...t.tableInfo.mockRows]:void 0}):void 0,imageInfo:t.imageInfo?w({},t.imageInfo):void 0}),r=a.findIndex(t=>t.id===e);o(e=>{let t=[...e];return t.splice(r+1,0,n),t}),c(n.id)},handleMoveBlockUp:e=>{e!==0&&o(t=>{let n=[...t],r=n[e];return n[e]=n[e-1],n[e-1]=r,n})},handleMoveBlockDown:e=>{e!==a.length-1&&o(t=>{let n=[...t],r=n[e];return n[e]=n[e+1],n[e+1]=r,n})},updateSelectedStyle:(e,t)=>{s&&o(n=>n.map(n=>n.id===s?w(w({},n),{},{style:w(w({},n.style),{},{[e]:t})}):n))},updateSelectedImageInfo:(e,t)=>{s&&o(i=>i.map(i=>{if(i.id===s&&i.type===`image`){let a={};return e===`imageType`&&(a=t===`logo`?{url:n||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`}:t===`banner`?{url:r||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`}:t===`barcode`?{barcodeValue:`SHIP-99201`,barcodePlaceholder:`{{barcode}}`}:{url:fb}),w(w({},i),{},{imageInfo:w(w({},i.imageInfo),{},{[e]:t},a)})}return i}))},handleRemoveTableColumn:(e,t)=>{s&&o(n=>n.map(n=>{if(n.id===s&&n.type===`table`&&n.tableInfo){var r;let i=[...n.tableInfo.columns];if(t!==void 0&&(r=i[e])!=null&&r.columns){let n=i[e].columns.filter((e,n)=>n!==t);i[e]=w(w({},i[e]),{},{columns:n})}else i.splice(e,1);return w(w({},n),{},{tableInfo:w(w({},n.tableInfo),{},{columns:i})})}return n}))},handleAddTableColumn:(e,t,n,r)=>{!s||!e.trim()||o(i=>i.map(i=>{if(i.id===s&&i.type===`table`&&i.tableInfo){let a=[...i.tableInfo.columns];if(r!==void 0&&a[r]){let n=a[r].columns||[];a[r]=w(w({},a[r]),{},{loop:!0,columns:[...n,{columnName:e.trim(),placeholder:t.trim(),enabled:!0}]})}else n?a.push({columnName:e.trim(),placeholder:t.trim(),enabled:!0,loop:!0,columns:[]}):a.push({columnName:e.trim(),placeholder:t.trim(),enabled:!0});return w(w({},i),{},{tableInfo:w(w({},i.tableInfo),{},{columns:a})})}return i}))},handleUpdateTableColumn:(e,t,n,r)=>{s&&o(i=>i.map(i=>{if(i.id===s&&i.type===`table`&&i.tableInfo){var a;let o=[...i.tableInfo.columns];if(r!==void 0&&(a=o[e])!=null&&a.columns){let i=[...o[e].columns];i[r]=w(w({},i[r]),{},{columnName:t.trim(),placeholder:n.trim()}),o[e]=w(w({},o[e]),{},{columns:i})}else o[e]&&(o[e]=w(w({},o[e]),{},{columnName:t.trim(),placeholder:n.trim()}));return w(w({},i),{},{tableInfo:w(w({},i.tableInfo),{},{columns:o})})}return i}))},handleReorderTableColumn:(e,t,n)=>{s&&o(r=>r.map(r=>{if(r.id===s&&r.type===`table`&&r.tableInfo){var i;let a=[...r.tableInfo.columns];if(n!==void 0&&(i=a[e])!=null&&i.columns){let r=[...a[e].columns],i=t===`up`?n-1:n+1;if(i>=0&&i<r.length){let t=r[n];r[n]=r[i],r[i]=t,a[e]=w(w({},a[e]),{},{columns:r})}}else{let n=t===`up`?e-1:e+1;if(n>=0&&n<a.length){let t=a[e];a[e]=a[n],a[n]=t}}return w(w({},r),{},{tableInfo:w(w({},r.tableInfo),{},{columns:a})})}return r}))},handleAddTableRow:e=>{let t=e||s;t&&o(e=>e.map(e=>{if(e.id===t&&e.type===`table`&&e.tableInfo){let t=e.tableInfo.columns||[],n=e.tableInfo.mockRows&&e.tableInfo.mockRows.length>0?e.tableInfo.mockRows:[{}],r={};return t.forEach(e=>{e.columnName&&(r[e.columnName]=e.placeholder||``)}),w(w({},e),{},{tableInfo:w(w({},e.tableInfo),{},{mockRows:[...n,r]})})}return e}))},handleRemoveTableRow:(e,t)=>{let n=t||s;n&&o(t=>t.map(t=>{if(t.id===n&&t.type===`table`&&t.tableInfo){let n=t.tableInfo.mockRows&&t.tableInfo.mockRows.length>0?t.tableInfo.mockRows:[{}];if(n.length<=1)return w(w({},t),{},{tableInfo:w(w({},t.tableInfo),{},{mockRows:[{}]})});let r=n.filter((t,n)=>n!==e);return w(w({},t),{},{tableInfo:w(w({},t.tableInfo),{},{mockRows:r})})}return t}))}}}function Sb(){let[e,t]=(0,l.useState)(.7),[n,r]=(0,l.useState)({x:0,y:0}),[i,a]=(0,l.useState)(!1),[o,s]=(0,l.useState)(!1),[c,u]=(0,l.useState)(1123),d=(0,l.useRef)({x:0,y:0}),f=(0,l.useRef)(null),p=(0,l.useRef)(null);return(0,l.useEffect)(()=>{let e=e=>{let t=document.activeElement,n=t&&(t.tagName===`INPUT`||t.tagName===`TEXTAREA`||t.getAttribute(`contenteditable`)===`true`);e.code===`Space`&&!n&&(s(!0),e.preventDefault())},t=e=>{e.code===`Space`&&s(!1)};return window.addEventListener(`keydown`,e),window.addEventListener(`keyup`,t),()=>{window.removeEventListener(`keydown`,e),window.removeEventListener(`keyup`,t)}},[]),(0,l.useEffect)(()=>{if(!p.current)return;let e=new ResizeObserver(e=>{for(let t of e)u(t.target.scrollHeight)});return e.observe(p.current),()=>e.disconnect()},[]),{zoom:e,setZoom:t,panOffset:n,setPanOffset:r,isPanning:i,setIsPanning:a,spacePressed:o,setSpacePressed:s,canvasHeight:c,setCanvasHeight:u,viewportRef:f,canvasContainerRef:p,handleMouseDown:e=>{o&&(a(!0),d.current={x:e.clientX-n.x,y:e.clientY-n.y})},handleMouseMove:e=>{i&&o&&r({x:e.clientX-d.current.x,y:e.clientY-d.current.y})},handleMouseUp:()=>{a(!1)},handleZoomIn:()=>t(e=>Math.min(e+.1,2)),handleZoomOut:()=>t(e=>Math.max(e-.1,.5)),handleZoomReset:()=>{t(1),r({x:0,y:0})}}}function Cb({tableSchemas:e}={}){let[t,n]=(0,l.useState)(`invoice_items`),[r,i]=(0,l.useState)(`{% for item in invoice.items %}`),[a,o]=(0,l.useState)(`{% endfor %}`),[s,c]=(0,l.useState)(``),[u,d]=(0,l.useState)(``),[f,p]=(0,l.useState)(null),[m,h]=(0,l.useState)([]),[g,_]=(0,l.useState)(!1),[v,y]=(0,l.useState)(``),[b,x]=(0,l.useState)(null),[S,C]=(0,l.useState)(``),[T,E]=(0,l.useState)(null),[D,ee]=(0,l.useState)(null),[O,k]=(0,l.useState)(``),[te,A]=(0,l.useState)([]),ne=e=>({columnName:e.columnName||e.columnNameEn||e.columnNameDe||``,placeholder:e.placeholder||``,enabled:e.enabled!==!1,loop:!!e.loop,columns:Array.isArray(e.columns)?e.columns.map(ne):void 0});(0,l.useEffect)(()=>{e&&e.length>0?h(e.map(e=>w(w({},e),{},{columns:e.columns.map(ne)}))):h([])},[e]);let re=()=>{if(!t.trim())return;let e={tableName:t.trim().replace(/\s+/g,`_`).toLowerCase(),columns:[{columnName:`Description`,placeholder:`{{description}}`,enabled:!0},{columnName:`Qty`,placeholder:`{{quantity}}`,enabled:!0},{columnName:`Total Price`,placeholder:`{{total_price}}`,enabled:!0}],loop:!0,isNestable:!1,parentPath:`items`,maxNestingDepth:5,nestingPrefix:` `,showNestingLevel:!1,loopStartTag:r,loopEndTag:a};h(t=>[...t,e]),n(``)},j=()=>{if(!O.trim())return;let e=O.trim().toLowerCase().replace(/\s+/g,`_`);if(te.some(t=>t.imageType===e)){k(``);return}A(t=>[...t,{label:O.trim(),imageType:e,description:`Placeholder container for ${O.trim()}`}]),k(``)},ie=(e,t,n)=>{h(r=>r.map((r,i)=>{if(i===e){var a;let e=[...r.columns];if(n!==void 0&&(a=e[t])!=null&&a.columns){let r=[...e[t].columns];r[n]=w(w({},r[n]),{},{enabled:r[n].enabled===!1}),e[t]=w(w({},e[t]),{},{columns:r})}else e[t]=w(w({},e[t]),{},{enabled:e[t].enabled===!1});return w(w({},r),{},{columns:e})}return r}))},[ae,oe]=(0,l.useState)(null);return{customTableName:t,setCustomTableName:n,customLoopStart:r,setCustomLoopStart:i,customLoopEnd:a,setCustomLoopEnd:o,newColName:s,setNewColName:c,newColPlaceholder:u,setNewColPlaceholder:d,bubbleCoords:f,setBubbleCoords:p,schemas:m,setSchemas:h,isParsing:g,setIsParsing:_,parseStatusText:v,setParseStatusText:y,parseError:b,setParseError:x,draggedSidebarItem:T,setDraggedSidebarItem:E,dragOverIndex:D,setDragOverIndex:ee,newImgTypeName:O,setNewImgTypeName:k,customImageTypes:te,setCustomImageTypes:A,searchPlaceholder:S,setSearchPlaceholder:C,handleAddCustomTable:re,handleAddCustomImageType:j,toggleSchemaColumn:ie,applySelectionFormat:(e,t=``)=>{if(ae){let e=window.getSelection();e==null||e.removeAllRanges(),e==null||e.addRange(ae)}document.execCommand(e,!1,t),p(null)},setSavedRange:oe}}var wb=(...e)=>e.filter((e,t,n)=>!!e&&e.trim()!==``&&n.indexOf(e)===t).join(` `).trim(),Tb=e=>e.replace(/([a-z0-9])([A-Z])/g,`$1-$2`).toLowerCase(),Eb=e=>e.replace(/^([A-Z])|[\s-_]+(\w)/g,(e,t,n)=>n?n.toUpperCase():t.toLowerCase()),Db=e=>{let t=Eb(e);return t.charAt(0).toUpperCase()+t.slice(1)},Ob={xmlns:`http://www.w3.org/2000/svg`,width:24,height:24,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:2,strokeLinecap:`round`,strokeLinejoin:`round`},kb=e=>{for(let t in e)if(t.startsWith(`aria-`)||t===`role`||t===`title`)return!0;return!1},Ab=(0,l.createContext)({}),jb=()=>(0,l.useContext)(Ab);function Mb(e,t){if(e==null)return{};var n={};for(var r in e)if({}.hasOwnProperty.call(e,r)){if(t.includes(r))continue;n[r]=e[r]}return n}function Nb(e,t){if(e==null)return{};var n,r,i=Mb(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)n=a[r],t.includes(n)||{}.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}var Pb=[`color`,`size`,`strokeWidth`,`absoluteStrokeWidth`,`className`,`children`,`iconNode`],Fb=(0,l.forwardRef)((e,t)=>{var n,r,i;let{color:a,size:o,strokeWidth:s,absoluteStrokeWidth:c,className:u=``,children:d,iconNode:f}=e,p=Nb(e,Pb),{size:m=24,strokeWidth:h=2,absoluteStrokeWidth:g=!1,color:_=`currentColor`,className:v=``}=(n=jb())==null?{}:n,y=(c==null?g:c)?Number(s==null?h:s)*24/Number(o==null?m:o):s==null?h:s;return(0,l.createElement)(`svg`,w(w(w({ref:t},Ob),{},{width:(r=o==null?m:o)==null?Ob.width:r,height:(i=o==null?m:o)==null?Ob.height:i,stroke:a==null?_:a,strokeWidth:y,className:wb(`lucide`,v,u)},!d&&!kb(p)&&{"aria-hidden":`true`}),p),[...f.map(([e,t])=>(0,l.createElement)(e,t)),...Array.isArray(d)?d:[d]])}),Ib=[`className`],Lb=(e,t)=>{let n=(0,l.forwardRef)((n,r)=>{let{className:i}=n,a=Nb(n,Ib);return(0,l.createElement)(Fb,w({ref:r,iconNode:t,className:wb(`lucide-${Tb(Db(e))}`,`lucide-${e}`,i)},a))});return n.displayName=Db(e),n},Rb=Lb(`arrow-down`,[[`path`,{d:`M12 5v14`,key:`s699le`}],[`path`,{d:`m19 12-7 7-7-7`,key:`1idqje`}]]),zb=Lb(`arrow-up`,[[`path`,{d:`m5 12 7-7 7 7`,key:`hav0vg`}],[`path`,{d:`M12 19V5`,key:`x0mq9r`}]]),Bb=Lb(`barcode`,[[`path`,{d:`M3 5v14`,key:`1nt18q`}],[`path`,{d:`M8 5v14`,key:`1ybrkv`}],[`path`,{d:`M12 5v14`,key:`s699le`}],[`path`,{d:`M17 5v14`,key:`ycjyhj`}],[`path`,{d:`M21 5v14`,key:`nzette`}]]),Vb=Lb(`check`,[[`path`,{d:`M20 6 9 17l-5-5`,key:`1gmf2c`}]]),Hb=Lb(`copy`,[[`rect`,{width:`14`,height:`14`,x:`8`,y:`8`,rx:`2`,ry:`2`,key:`17jyea`}],[`path`,{d:`M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2`,key:`zix9uf`}]]),Ub=Lb(`download`,[[`path`,{d:`M12 15V3`,key:`m9g1x1`}],[`path`,{d:`M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4`,key:`ih7n3h`}],[`path`,{d:`m7 10 5 5 5-5`,key:`brsn70`}]]),Wb=Lb(`eye`,[[`path`,{d:`M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0`,key:`1nclc0`}],[`circle`,{cx:`12`,cy:`12`,r:`3`,key:`1v7zrd`}]]),Gb=Lb(`file-text`,[[`path`,{d:`M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z`,key:`1oefj6`}],[`path`,{d:`M14 2v5a1 1 0 0 0 1 1h5`,key:`wfsgrz`}],[`path`,{d:`M10 9H8`,key:`b1mrlr`}],[`path`,{d:`M16 13H8`,key:`t4e002`}],[`path`,{d:`M16 17H8`,key:`z1uh3a`}]]),Kb=Lb(`image`,[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,ry:`2`,key:`1m3agn`}],[`circle`,{cx:`9`,cy:`9`,r:`2`,key:`af1f0g`}],[`path`,{d:`m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21`,key:`1xmnt7`}]]),qb=Lb(`pencil`,[[`path`,{d:`M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z`,key:`1a8usu`}],[`path`,{d:`m15 5 4 4`,key:`1mk7zo`}]]),Jb=Lb(`plus`,[[`path`,{d:`M5 12h14`,key:`1ays0h`}],[`path`,{d:`M12 5v14`,key:`s699le`}]]),Yb=Lb(`printer`,[[`path`,{d:`M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2`,key:`143wyd`}],[`path`,{d:`M6 9V3a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v6`,key:`1itne7`}],[`rect`,{x:`6`,y:`14`,width:`12`,height:`8`,rx:`1`,key:`1ue0tg`}]]),Xb=Lb(`search`,[[`path`,{d:`m21 21-4.34-4.34`,key:`14j7rj`}],[`circle`,{cx:`11`,cy:`11`,r:`8`,key:`4ej97u`}]]),Zb=Lb(`sliders-vertical`,[[`path`,{d:`M10 8h4`,key:`1sr2af`}],[`path`,{d:`M12 21v-9`,key:`17s77i`}],[`path`,{d:`M12 8V3`,key:`13r4qs`}],[`path`,{d:`M17 16h4`,key:`h1uq16`}],[`path`,{d:`M19 12V3`,key:`o1uvq1`}],[`path`,{d:`M19 21v-5`,key:`qua636`}],[`path`,{d:`M3 14h4`,key:`bcjad9`}],[`path`,{d:`M5 10V3`,key:`cb8scm`}],[`path`,{d:`M5 21v-7`,key:`1w1uti`}]]),Qb=Lb(`sparkles`,[[`path`,{d:`M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z`,key:`1s2grr`}],[`path`,{d:`M20 2v4`,key:`1rf3ol`}],[`path`,{d:`M22 4h-4`,key:`gwowj6`}],[`circle`,{cx:`4`,cy:`20`,r:`2`,key:`6kqj1y`}]]),$b=Lb(`square-check-big`,[[`path`,{d:`M21 10.656V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h12.344`,key:`2acyp4`}],[`path`,{d:`m9 11 3 3L22 4`,key:`1pflzl`}]]),ex=Lb(`square`,[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,key:`afitv7`}]]),tx=Lb(`table`,[[`path`,{d:`M12 3v18`,key:`108xh3`}],[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,key:`afitv7`}],[`path`,{d:`M3 9h18`,key:`1pudct`}],[`path`,{d:`M3 15h18`,key:`5xshup`}]]),nx=Lb(`text-align-center`,[[`path`,{d:`M21 5H3`,key:`1fi0y6`}],[`path`,{d:`M17 12H7`,key:`16if0g`}],[`path`,{d:`M19 19H5`,key:`vjpgq2`}]]),rx=Lb(`text-align-end`,[[`path`,{d:`M21 5H3`,key:`1fi0y6`}],[`path`,{d:`M21 12H9`,key:`dn1m92`}],[`path`,{d:`M21 19H7`,key:`4cu937`}]]),ix=Lb(`text-align-justify`,[[`path`,{d:`M3 5h18`,key:`1u36vt`}],[`path`,{d:`M3 12h18`,key:`1i2n21`}],[`path`,{d:`M3 19h18`,key:`awlh7x`}]]),ax=Lb(`text-align-start`,[[`path`,{d:`M21 5H3`,key:`1fi0y6`}],[`path`,{d:`M15 12H3`,key:`6jk70r`}],[`path`,{d:`M17 19H3`,key:`z6ezky`}]]),ox=Lb(`trash-2`,[[`path`,{d:`M10 11v6`,key:`nco0om`}],[`path`,{d:`M14 11v6`,key:`outv1u`}],[`path`,{d:`M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6`,key:`miytrc`}],[`path`,{d:`M3 6h18`,key:`d0wm0j`}],[`path`,{d:`M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2`,key:`e791ji`}]]),sx=Lb(`type`,[[`path`,{d:`M12 4v16`,key:`1654pz`}],[`path`,{d:`M4 7V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2`,key:`e0r10z`}],[`path`,{d:`M9 20h6`,key:`s66wpe`}]]),cx=Lb(`upload`,[[`path`,{d:`M12 3v12`,key:`1x0j5s`}],[`path`,{d:`m17 8-5-5-5 5`,key:`7q97r8`}],[`path`,{d:`M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4`,key:`ih7n3h`}]]),lx=Lb(`x`,[[`path`,{d:`M18 6 6 18`,key:`1bl5f8`}],[`path`,{d:`m6 6 12 12`,key:`d8bk6v`}]]);function ux({headerLogo:e,headerTitle:t,headerSubtitle:n,parseError:r,isParsing:i,parseStatusText:a,showImportHtml:o,showImportPdf:s,showPreview:c,showExport:d,showExportPdf:f=!0,customButtonStyles:p,customButtonClassNames:m,customActionComponents:h,handleHtmlImport:g,handlePdfImport:_,setPreviewOpen:v,handleExport:y,handleExportPdf:b}){let x=(0,l.useRef)(null),S=(0,l.useRef)(null);return(0,u.jsxs)(`header`,{className:`bg-white border-b border-gray-200 px-6 py-4 flex flex-col sm:flex-row items-center justify-between sticky top-0 z-10 shadow-sm gap-4`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-3`,children:[e||(0,u.jsx)(`div`,{className:`h-10 w-10 bg-orange-600 rounded-xl flex items-center justify-center text-white shadow-md shadow-orange-600/20`,children:(0,u.jsx)(Qb,{className:`h-6 w-6`})}),(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h1`,{className:`text-xl font-bold tracking-tight text-slate-800`,children:t}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:n}),r&&(0,u.jsxs)(`span`,{className:`text-[10px] text-red-500 font-bold bg-red-50 px-2 py-0.5 rounded mt-1 inline-block border border-red-100`,children:[`Error: `,r]}),i&&(0,u.jsx)(`span`,{className:`text-[10px] text-orange-600 font-bold bg-orange-50 px-2 py-0.5 rounded mt-1 inline-block border border-orange-100 animate-pulse`,children:a||`Parsing...`})]})]}),(0,u.jsxs)(`div`,{className:`flex flex-wrap items-center gap-3`,children:[(o||s)&&(0,u.jsxs)(`div`,{className:`flex space-x-2 border-r border-gray-200 pr-4`,children:[o&&(0,u.jsxs)(u.Fragment,{children:[h!=null&&h.importHtml?h.importHtml({onClick:()=>{var e;return(e=x.current)==null?void 0:e.click()}}):(0,u.jsxs)(`button`,{onClick:()=>{var e;return(e=x.current)==null?void 0:e.click()},style:p==null?void 0:p.importHtml,className:(m==null?void 0:m.importHtml)||`inline-flex items-center space-x-2 px-3 py-1.5 border border-gray-200 rounded-lg text-xs font-semibold bg-white hover:bg-slate-50 text-slate-700 transition-colors shadow-sm`,title:`Import local HTML file`,children:[(0,u.jsx)(cx,{className:`h-3.5 w-3.5 text-slate-500`}),(0,u.jsx)(`span`,{children:`Import HTML`})]}),(0,u.jsx)(`input`,{type:`file`,ref:x,onChange:g,accept:`.html`,className:`hidden`})]}),s&&(0,u.jsxs)(u.Fragment,{children:[h!=null&&h.importPdf?h.importPdf({onClick:()=>{var e;return(e=S.current)==null?void 0:e.click()}}):(0,u.jsxs)(`button`,{onClick:()=>{var e;return(e=S.current)==null?void 0:e.click()},style:p==null?void 0:p.importPdf,className:(m==null?void 0:m.importPdf)||`inline-flex items-center space-x-2 px-3 py-1.5 border border-gray-200 rounded-lg text-xs font-semibold bg-white hover:bg-slate-50 text-slate-700 transition-colors shadow-sm`,title:`Import PDF layout structure`,children:[(0,u.jsx)(Gb,{className:`h-3.5 w-3.5 text-slate-500`}),(0,u.jsx)(`span`,{children:`Import PDF`})]}),(0,u.jsx)(`input`,{type:`file`,ref:S,onChange:_,accept:`.pdf`,className:`hidden`})]})]}),c&&(h!=null&&h.preview?h.preview({onClick:()=>v(!0)}):(0,u.jsxs)(`button`,{onClick:()=>v(!0),style:p==null?void 0:p.preview,className:(m==null?void 0:m.preview)||`inline-flex items-center space-x-2 px-4 py-2 border border-slate-200 rounded-lg text-sm font-semibold bg-slate-50 text-slate-700 hover:bg-slate-100 transition-colors shadow-sm`,children:[(0,u.jsx)(Wb,{className:`h-4 w-4 text-slate-500`}),(0,u.jsx)(`span`,{children:`Live Preview`})]})),f&&(h!=null&&h.exportPdf?h.exportPdf({onClick:b}):(0,u.jsxs)(`button`,{onClick:b,style:p==null?void 0:p.exportPdf,className:(m==null?void 0:m.exportPdf)||`inline-flex items-center space-x-2 px-4 py-2 bg-indigo-600 hover:bg-indigo-700 text-white rounded-lg text-sm font-semibold transition-colors shadow-sm shadow-indigo-600/10`,children:[(0,u.jsx)(Yb,{className:`h-4 w-4`}),(0,u.jsx)(`span`,{children:`Download PDF`})]})),d&&(h!=null&&h.export?h.export({onClick:y}):(0,u.jsxs)(`button`,{onClick:y,style:p==null?void 0:p.export,className:(m==null?void 0:m.export)||`inline-flex items-center space-x-2 px-4 py-2 bg-orange-600 hover:bg-orange-700 text-white rounded-lg text-sm font-semibold transition-colors shadow-sm shadow-orange-600/10`,children:[(0,u.jsx)(Ub,{className:`h-4 w-4`}),(0,u.jsx)(`span`,{children:`Export Template`})]}))]})]})}function dx({handleSidebarDragStart:e,createTextBlock:t,setBlocks:n,setSelectedBlockId:r,setActiveTab:i,defaultStyles:a}){return(0,u.jsxs)(`div`,{className:`space-y-5`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Typography Elements`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Select standard headings or paragraphs to structure your page layout.`})]}),(0,u.jsx)(`div`,{className:`grid grid-cols-1 gap-3 select-none`,children:[{label:`Document Title`,type:`title`,style:`text-2xl font-extrabold text-slate-900 tracking-tight`},{label:`Document Subtitle`,type:`subtitle`,style:`text-sm font-bold text-slate-500`},{label:`Heading 1`,type:`h1`,style:`text-xl font-extrabold text-slate-850`},{label:`Heading 2`,type:`h2`,style:`text-lg font-bold text-slate-800`},{label:`Heading 3`,type:`h3`,style:`text-md font-semibold text-slate-750`},{label:`Normal Paragraph`,type:`p`,style:`text-xs text-slate-600 leading-relaxed`},{label:`Caption Note`,type:`caption`,style:`text-[10px] text-slate-400 font-mono italic`}].map(o=>(0,u.jsxs)(`div`,{draggable:!0,onDragStart:t=>e(t,o.type),className:`border border-gray-200 rounded-xl p-3 bg-white hover:border-slate-350 transition-all flex flex-col space-y-2 cursor-grab shadow-xs group`,children:[(0,u.jsx)(`span`,{className:`text-[9px] font-bold text-slate-400 uppercase tracking-wide`,children:o.type}),(0,u.jsx)(`div`,{className:`${o.style} truncate pr-4`,children:o.label}),(0,u.jsx)(`button`,{onClick:()=>{let e=t(o.type,o.label,a==null?void 0:a[o.type]);n(t=>[...t,e]),r(e.id),i(`styles`)},className:`w-full py-1 bg-slate-50 hover:bg-slate-200 text-slate-600 rounded-lg text-[9px] font-semibold transition-all text-center border border-gray-150`,children:`Insert at End`})]},o.type))})]})}function fx({schemas:e,toggleSchemaColumn:t,customTableName:n,setCustomTableName:r,customLoopStart:i,setCustomLoopStart:a,customLoopEnd:o,setCustomLoopEnd:s,handleAddCustomTable:c,handleSidebarDragStart:l,setBlocks:d,setSelectedBlockId:f,setActiveTab:p,defaultStyles:m}){return(0,u.jsxs)(`div`,{className:`space-y-6`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Dynamic Tables`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Configure loop table templates and drag onto the canvas.`})]}),(0,u.jsx)(`div`,{className:`space-y-4`,children:e.map((e,n)=>(0,u.jsxs)(`div`,{className:`border border-gray-200 rounded-2xl p-4 bg-white space-y-3 shadow-xs`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2`,children:[(0,u.jsx)(tx,{className:`h-4 w-4 text-slate-650`}),(0,u.jsx)(`h4`,{className:`font-bold text-xs uppercase text-slate-700 tracking-wider`,children:e.tableName})]}),(0,u.jsx)(`span`,{className:`px-1.5 py-0.5 bg-slate-100 text-[8px] font-bold text-slate-600 rounded`,children:`loop = true`})]}),(0,u.jsxs)(`div`,{draggable:!0,onDragStart:t=>l(t,`table`,e),className:`bg-slate-50 border border-slate-200 hover:border-slate-400 rounded-lg p-2.5 flex items-center justify-between cursor-grab`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2`,children:[(0,u.jsx)(`div`,{className:`h-5 w-5 bg-slate-200 rounded flex items-center justify-center`,children:(0,u.jsx)(Jb,{className:`h-3 w-3 text-slate-600`})}),(0,u.jsx)(`span`,{className:`text-xs font-bold text-slate-700`,children:`Drag to Canvas`})]}),(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400 italic`,children:`Drag & Drop`})]}),(0,u.jsxs)(`div`,{className:`space-y-1.5`,children:[(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400 font-bold uppercase tracking-wider block`,children:`Columns:`}),(0,u.jsx)(`div`,{className:`max-h-[180px] overflow-y-auto border border-gray-150 rounded-lg p-2 space-y-1.5 bg-slate-50/50`,children:e.columns.map((e,r)=>{let i=e.loop&&e.columns&&e.columns.length>0;return(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsxs)(`button`,{onClick:()=>t(n,r),className:`flex items-center space-x-2 w-full text-left py-0.5 text-xs text-slate-600 hover:text-slate-800 transition-colors font-medium`,children:[e.enabled===!1?(0,u.jsx)(ex,{className:`h-3.5 w-3.5 text-slate-300 flex-shrink-0`}):(0,u.jsx)($b,{className:`h-3.5 w-3.5 text-slate-700 flex-shrink-0`}),(0,u.jsxs)(`span`,{className:`truncate flex items-center gap-1`,children:[(0,u.jsx)(`span`,{children:e.columnName}),i&&(0,u.jsx)(`span`,{className:`px-1 bg-slate-200 text-slate-600 rounded text-[8px] font-mono`,children:`(sub-table)`})]})]}),i&&e.enabled!==!1&&(0,u.jsxs)(`div`,{className:`ml-4 pl-2.5 border-l-2 border-slate-200 space-y-1 my-1`,children:[(0,u.jsx)(`span`,{className:`text-[8px] text-slate-400 font-bold uppercase tracking-wider block`,children:`Sub Columns:`}),e.columns.map((e,i)=>(0,u.jsxs)(`button`,{onClick:()=>t(n,r,i),className:`flex items-center space-x-2 w-full text-left py-0.5 text-[11px] text-slate-500 hover:text-slate-800 transition-colors`,children:[e.enabled===!1?(0,u.jsx)(ex,{className:`h-3 w-3 text-slate-300 flex-shrink-0`}):(0,u.jsx)($b,{className:`h-3 w-3 text-slate-600 flex-shrink-0`}),(0,u.jsxs)(`span`,{className:`truncate`,children:[e.columnName,` `,(0,u.jsxs)(`span`,{className:`text-[8px] text-slate-400`,children:[`(`,e.placeholder,`)`]})]})]},i))]})]},r)})})]}),(0,u.jsx)(`button`,{onClick:()=>{let t={id:Math.random().toString(36).substring(2,11),type:`table`,content:``,style:w({fontSize:`10px`,fontWeight:`400`,color:`#334155`,backgroundColor:`transparent`,textAlign:`left`,bold:!1,italic:!1,underline:!1,strikethrough:!1,width:`100%`,marginBottom:`12px`,padding:`8px`},m==null?void 0:m.table),tableInfo:w(w({},e),{},{columns:e.columns.map(e=>w({},e))})};d(e=>[...e,t]),f(t.id),p(`styles`)},className:`w-full py-1 bg-slate-50 hover:bg-slate-200 text-slate-600 rounded-lg text-[9px] font-semibold transition-all text-center border border-gray-150`,children:`Insert at End`})]},e.tableName))}),(0,u.jsxs)(`div`,{className:`border border-gray-200 rounded-2xl p-4 bg-slate-50/20 border-dashed space-y-4 mt-6`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2 pb-2 border-b border-gray-150`,children:[(0,u.jsx)(Qb,{className:`h-4 w-4 text-slate-655`}),(0,u.jsx)(`h4`,{className:`font-bold text-xs uppercase text-slate-800 tracking-wider`,children:`Custom Table Builder`})]}),(0,u.jsxs)(`div`,{className:`space-y-3`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-500 uppercase tracking-wider block mb-1`,children:`Table Name`}),(0,u.jsx)(`input`,{type:`text`,value:n,onChange:e=>r(e.target.value),placeholder:`invoice_items`,className:`w-full px-3 py-1.5 border border-gray-200 rounded-lg text-xs focus:outline-none focus:border-slate-500 bg-white`})]}),(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-500 uppercase tracking-wider block mb-1`,children:`Loop Start tag`}),(0,u.jsx)(`input`,{type:`text`,value:i,onChange:e=>a(e.target.value),placeholder:`{% for item in invoice.items %}`,className:`w-full px-3 py-1.5 border border-gray-200 rounded-lg text-xs font-mono focus:outline-none focus:border-slate-500 bg-white text-slate-600 font-bold`})]}),(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-500 uppercase tracking-wider block mb-1`,children:`Loop End tag`}),(0,u.jsx)(`input`,{type:`text`,value:o,onChange:e=>s(e.target.value),placeholder:`{% endfor %}`,className:`w-full px-3 py-1.5 border border-gray-200 rounded-lg text-xs font-mono focus:outline-none focus:border-slate-500 bg-white text-slate-600 font-bold`})]}),(0,u.jsxs)(`button`,{onClick:c,className:`w-full py-2 bg-orange-600 hover:bg-orange-700 text-white rounded-xl text-xs font-bold transition-all shadow-sm flex items-center justify-center space-x-1.5 shadow-orange-600/10`,children:[(0,u.jsx)(Jb,{className:`h-4 w-4`}),(0,u.jsx)(`span`,{children:`Add Custom Loop Table`})]})]})]})]})}function px({customImageTypes:e,newImgTypeName:t,setNewImgTypeName:n,handleAddCustomImageType:r,handleSidebarDragStart:i,createImageBlock:a,setBlocks:o,setSelectedBlockId:s,setActiveTab:c}){let l=[{label:`Brand Logo`,imageType:`logo`,description:`Standard document vector logo`,icon:(0,u.jsx)(Kb,{className:`h-4 w-4 text-slate-550`})},{label:`Campaign Banner`,imageType:`banner`,description:`Wide horizontal graphics banner`,icon:(0,u.jsx)(Kb,{className:`h-4 w-4 text-slate-550`})},{label:`Dynamic Barcode`,imageType:`barcode`,description:`Barcode replaced dynamically`,icon:(0,u.jsx)(Bb,{className:`h-4 w-4 text-slate-550`})},{label:`Watermark`,imageType:`watermark`,description:`Background graphic with low opacity`,icon:(0,u.jsx)(Kb,{className:`h-4 w-4 text-slate-550`})},...e.map(e=>({label:e.label,imageType:e.imageType,description:e.description,icon:(0,u.jsx)(Kb,{className:`h-4 w-4 text-slate-550`})}))];return(0,u.jsxs)(`div`,{className:`space-y-4`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Image & Barcode Elements`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Drag elements onto the canvas, or insert below.`})]}),(0,u.jsx)(`div`,{className:`space-y-3`,children:l.map(e=>(0,u.jsxs)(`div`,{className:`border border-gray-200 rounded-xl p-3 bg-white space-y-3 shadow-xs`,children:[(0,u.jsx)(`div`,{className:`flex items-center justify-between`,children:(0,u.jsxs)(`div`,{className:`flex items-center space-x-2`,children:[e.icon,(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h4`,{className:`font-bold text-xs text-slate-700`,children:e.label}),(0,u.jsx)(`p`,{className:`text-[9px] text-slate-400`,children:e.description})]})]})}),(0,u.jsxs)(`div`,{draggable:!0,onDragStart:t=>i(t,`image`,void 0,e.imageType),className:`bg-slate-50 border border-slate-200 hover:border-slate-450 rounded-lg p-2 flex items-center justify-between cursor-grab transition-all`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2`,children:[(0,u.jsx)(`div`,{className:`h-5 w-5 bg-slate-200 rounded flex items-center justify-center`,children:(0,u.jsx)(Jb,{className:`h-3 w-3 text-slate-750`})}),(0,u.jsx)(`span`,{className:`text-[11px] font-bold text-slate-700`,children:`Drag to Canvas`})]}),(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400 italic`,children:`Drag`})]}),(0,u.jsx)(`button`,{onClick:()=>{let t=a(e.imageType);o(e=>[...e,t]),s(t.id),c(`styles`)},className:`w-full py-1 bg-slate-100 hover:bg-slate-200 text-slate-600 rounded-lg text-[10px] font-semibold transition-all text-center border border-gray-150`,children:`Insert at End`})]},e.imageType))}),(0,u.jsxs)(`div`,{className:`border border-dashed border-gray-200 rounded-xl p-3 space-y-2 bg-slate-50/50 mt-4`,children:[(0,u.jsx)(`span`,{className:`text-[10px] font-bold text-slate-500 uppercase tracking-wider block`,children:`Add Custom Image Type`}),(0,u.jsx)(`input`,{type:`text`,value:t,onChange:e=>n(e.target.value),placeholder:`e.g. Signature`,className:`w-full px-2 py-1 border border-gray-200 rounded text-xs focus:outline-none focus:border-slate-500 bg-white`}),(0,u.jsxs)(`button`,{onClick:r,className:`w-full py-1.5 bg-orange-600 hover:bg-orange-700 text-white rounded-lg text-xs font-bold transition-all flex items-center justify-center space-x-1`,children:[(0,u.jsx)(Jb,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Add Custom Category`})]})]})]})}function mx({placeholders:e,schemas:t,searchPlaceholder:n,setSearchPlaceholder:r,placeholderMockData:i,setPlaceholderMockData:a,selectedBlockId:o,setBlocks:s}){let c=()=>{let t=[];return(e||[]).forEach(e=>{t.push({label:e.label,placeholder:e.placeholder,category:e.category||`General`})}),t.filter(e=>e.label.toLowerCase().includes(n.toLowerCase())||e.placeholder.toLowerCase().includes(n.toLowerCase()))},l=e=>{if(o){let t=`{{${e.replace(/[{}]/g,``)}}}`;s(e=>e.map(e=>e.id===o&&e.type!==`table`?w(w({},e),{},{content:e.content+t}):e))}},d=c();return(0,u.jsxs)(`div`,{className:`space-y-4 flex-1 flex flex-col min-h-0`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Variables Palette`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Click to copy, or drag into text areas. Edit mock values below to visualize content.`})]}),(0,u.jsxs)(`div`,{className:`relative`,children:[(0,u.jsx)(Xb,{className:`absolute left-3 top-2.5 h-4 w-4 text-slate-400`}),(0,u.jsx)(`input`,{type:`text`,value:n,onChange:e=>r(e.target.value),placeholder:`Search variables...`,className:`w-full pl-9 pr-4 py-2 border border-gray-200 rounded-xl text-xs focus:outline-none focus:border-slate-500 transition-colors`})]}),(0,u.jsx)(`div`,{className:`flex-1 overflow-y-auto space-y-2 pr-1`,children:d.length===0?(0,u.jsx)(`div`,{className:`text-xs text-slate-400 italic text-center py-4`,children:`No variables available.`}):d.map((e,t)=>{let n=e.placeholder.replace(/[{}]/g,``);return(0,u.jsxs)(`div`,{className:`w-full border border-gray-200 p-2.5 rounded-xl bg-white shadow-xs space-y-2`,children:[(0,u.jsxs)(`div`,{draggable:!0,onDragStart:e=>{e.dataTransfer.setData(`placeholder`,n),e.dataTransfer.effectAllowed=`copy`},onClick:()=>l(e.placeholder),className:`flex items-center justify-between cursor-grab active:cursor-grabbing hover:bg-slate-50 p-1 rounded`,title:`Drag into text or cells, or click to copy`,children:[(0,u.jsx)(`span`,{className:`text-xs font-semibold text-slate-700 truncate mr-2`,children:e.label}),(0,u.jsx)(`code`,{className:`text-[9px] bg-slate-100 px-1.5 py-0.5 rounded text-slate-800 font-bold shrink-0 border border-slate-200/50`,children:e.placeholder})]}),(0,u.jsxs)(`div`,{className:`flex items-center justify-between gap-1 pt-1.5 border-t border-gray-100`,children:[(0,u.jsx)(`span`,{className:`text-[9px] font-bold text-slate-400 uppercase`,children:`Mock:`}),(0,u.jsx)(`input`,{type:`text`,value:i[n]||``,onChange:e=>{a(t=>w(w({},t),{},{[n]:e.target.value}))},className:`flex-1 max-w-[130px] px-1.5 py-0.5 border border-gray-200 rounded text-[10px] focus:outline-none focus:border-slate-500 bg-white`})]})]},t)})})]})}function hx({selectedBlockId:e,getSelectedBlock:t,updateSelectedStyle:n,updateSelectedImageInfo:r,fontSizesState:i,fontFamiliesState:a,fontWeightsState:o,handleDeleteBlock:s,newColName:c,setNewColName:d,newColPlaceholder:f,setNewColPlaceholder:p,handleAddTableColumn:m,handleRemoveTableColumn:h,handleUpdateTableColumn:g,handleReorderTableColumn:_,handleAddTableRow:v,handleRemoveTableRow:y,setBlocks:b}){var x;let[S,C]=(0,l.useState)(null),[T,E]=(0,l.useState)(``),[D,ee]=(0,l.useState)(``),[O,k]=(0,l.useState)(null),[te,A]=(0,l.useState)(``),[ne,re]=(0,l.useState)(``),j=t();if(!e||!j)return(0,u.jsxs)(`div`,{className:`space-y-5`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Formatting Panel`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Customize the styles of the selected block.`})]}),(0,u.jsxs)(`div`,{className:`border border-dashed border-gray-200 rounded-xl p-6 text-center bg-slate-50/50`,children:[(0,u.jsx)(Zb,{className:`h-8 w-8 text-slate-350 mx-auto mb-2`}),(0,u.jsx)(`span`,{className:`text-xs font-semibold text-slate-500 block`,children:`No block selected`}),(0,u.jsx)(`p`,{className:`text-[10px] text-slate-400 mt-1`,children:`Select any element inside the canvas to configure typography, sizing, colors, or templating loop engines.`})]})]});let ie=j.type===`table`,ae=()=>{c.trim()&&(m(c,f),d(``),p(``))};if(j.type===`image`){let e=j.imageInfo||{imageType:`logo`};return(0,u.jsxs)(`div`,{className:`space-y-5`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Formatting Panel`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Customize the styles of the selected block.`})]}),(0,u.jsxs)(`div`,{className:`space-y-4`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2 pb-3 border-b border-gray-100`,children:[(0,u.jsx)(`div`,{className:`h-6 w-6 bg-slate-100 rounded flex items-center justify-center text-slate-700`,children:(0,u.jsx)(Kb,{className:`h-3.5 w-3.5`})}),(0,u.jsx)(`span`,{className:`text-xs font-bold text-slate-700 capitalize`,children:`Editing Image Element`})]}),(0,u.jsxs)(`div`,{className:`flex items-center justify-between p-3 bg-slate-50 border border-gray-200 rounded-xl select-none`,children:[(0,u.jsxs)(`div`,{className:`space-y-0.5`,children:[(0,u.jsx)(`span`,{className:`text-xs font-bold text-slate-700 block`,children:`Row Alignment`}),(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400`,children:`Display side-by-side`})]}),(0,u.jsx)(`button`,{onClick:()=>{let e=!j.style.sameRow;n(`sameRow`,e),e?(n(`width`,`48%`),b(e=>{let t=e.findIndex(e=>e.id===j.id);return t>0?e.map((e,n)=>n===t-1&&(!e.style.width||e.style.width===`100%`)?w(w({},e),{},{style:w(w({},e.style),{},{width:`48%`})}):e):e})):n(`width`,`100%`)},className:`w-10 h-6 flex items-center rounded-full p-1 transition-colors duration-150 ${j.style.sameRow?`bg-orange-600 justify-end`:`bg-slate-300 justify-start`}`,children:(0,u.jsx)(`span`,{className:`bg-white w-4 h-4 rounded-full shadow-md`})})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Image Category`}),(0,u.jsx)(`div`,{className:`grid grid-cols-4 gap-1 bg-slate-50 p-1 border border-gray-200 rounded-lg`,children:[`logo`,`banner`,`barcode`,`watermark`].map(t=>(0,u.jsx)(`button`,{onClick:()=>r(`imageType`,t),className:`py-1 text-[9px] font-bold rounded capitalize transition-all ${e.imageType===t?`bg-white text-slate-800 shadow-xs border border-gray-200`:`text-slate-500 hover:text-slate-800`}`,children:t},t))})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Alignment (Position)`}),(0,u.jsx)(`div`,{className:`flex items-center space-x-1 border border-gray-200 rounded-lg p-1 bg-slate-50 w-fit`,children:[{value:`left`,icon:(0,u.jsx)(ax,{className:`h-3.5 w-3.5`})},{value:`center`,icon:(0,u.jsx)(nx,{className:`h-3.5 w-3.5`})},{value:`right`,icon:(0,u.jsx)(rx,{className:`h-3.5 w-3.5`})}].map(e=>(0,u.jsx)(`button`,{onClick:()=>n(`textAlign`,e.value),type:`button`,className:`p-1.5 rounded transition-all ${j.style.textAlign===e.value?`bg-white text-slate-800 shadow-xs border border-gray-200`:`text-slate-500 hover:text-slate-800`}`,children:e.icon},e.value))})]}),(0,u.jsxs)(`div`,{className:`space-y-1 pt-1`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider`,children:`Image Width`}),(0,u.jsx)(`span`,{className:`text-[10px] font-mono text-slate-500 font-bold bg-slate-100 px-1.5 py-0.5 rounded`,children:j.style.width||`100%`})]}),(0,u.jsxs)(`div`,{className:`flex items-center space-x-2`,children:[(0,u.jsx)(`input`,{type:`range`,min:`10`,max:`1000`,step:`5`,value:parseInt(j.style.width||`100`),onChange:e=>n(`width`,`${e.target.value}px`),className:`w-full accent-slate-800 h-1 bg-gray-200 rounded-lg appearance-none cursor-pointer`}),(0,u.jsxs)(`span`,{className:`text-[10px] font-mono text-slate-500 w-10 text-right`,children:[parseInt(j.style.width||`100`),`px`]})]})]}),(0,u.jsxs)(`div`,{className:`space-y-1 pt-1 mt-3`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block mb-1`,children:`Object Fit`}),(0,u.jsxs)(`select`,{value:j.style.objectFit||`contain`,onChange:e=>n(`objectFit`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs focus:outline-none focus:border-slate-500 bg-white font-medium`,children:[(0,u.jsx)(`option`,{value:`contain`,children:`Contain`}),(0,u.jsx)(`option`,{value:`cover`,children:`Cover`}),(0,u.jsx)(`option`,{value:`fill`,children:`Fill`}),(0,u.jsx)(`option`,{value:`none`,children:`None`})]})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider`,children:`Image Height`}),(0,u.jsx)(`span`,{className:`text-[10px] font-mono text-slate-500 font-bold bg-slate-100 px-1.5 py-0.5 rounded`,children:j.style.height||j.style.minHeight||`auto`})]}),(0,u.jsx)(`div`,{className:`flex items-center space-x-2`,children:(0,u.jsx)(`input`,{type:`range`,min:`20`,max:`400`,step:`10`,value:parseInt(j.style.height||j.style.minHeight||`100`)||100,onChange:e=>{n(`height`,`${e.target.value}px`),n(`minHeight`,`${e.target.value}px`)},className:`w-full accent-slate-800 h-1 bg-gray-200 rounded-lg appearance-none cursor-pointer`})})]}),e.imageType===`barcode`?(0,u.jsxs)(`div`,{className:`space-y-3 pt-3 border-t border-gray-150`,children:[(0,u.jsx)(`span`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Barcode Configuration`}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-500`,children:`Mock Barcode Value`}),(0,u.jsx)(`input`,{type:`text`,value:e.barcodeValue||``,onChange:e=>r(`barcodeValue`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs font-mono focus:outline-none focus:border-slate-500`})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-500`,children:`Backend Variable`}),(0,u.jsx)(`input`,{type:`text`,value:e.barcodePlaceholder||``,onChange:e=>r(`barcodePlaceholder`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs font-mono focus:outline-none focus:border-slate-500 text-slate-700 font-bold`})]})]}):(0,u.jsxs)(`div`,{className:`space-y-3 pt-3 border-t border-gray-150`,children:[(0,u.jsx)(`span`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Image Asset Upload`}),(0,u.jsxs)(`div`,{className:`flex flex-col items-center p-3 border border-dashed border-gray-200 rounded-lg bg-slate-50/50 hover:bg-slate-50 transition-all cursor-pointer relative`,children:[(0,u.jsx)(cx,{className:`h-5 w-5 text-slate-400 mb-1`}),(0,u.jsx)(`span`,{className:`text-[10px] font-bold text-slate-650`,children:`Choose local image file`}),(0,u.jsx)(`input`,{type:`file`,accept:`image/*`,onChange:e=>{var t;let n=(t=e.target.files)==null?void 0:t[0];if(!n)return;let i=new FileReader;i.onload=e=>{var t;r(`url`,(t=e.target)==null?void 0:t.result)},i.readAsDataURL(n)},className:`absolute inset-0 opacity-0 cursor-pointer`})]})]}),(0,u.jsx)(`div`,{className:`space-y-3 pt-3 border-t border-gray-100`,children:(0,u.jsxs)(`div`,{className:`grid grid-cols-2 gap-3`,children:[(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase block`,children:`Bottom Margin`}),(0,u.jsx)(`input`,{type:`range`,min:`0`,max:`40`,step:`2`,value:parseInt(j.style.marginBottom||`0px`),onChange:e=>n(`marginBottom`,`${e.target.value}px`),className:`w-full accent-slate-800 h-1 bg-gray-200`})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase block`,children:`Padding`}),(0,u.jsx)(`input`,{type:`range`,min:`0`,max:`40`,step:`2`,value:parseInt(j.style.padding||`0px`),onChange:e=>n(`padding`,`${e.target.value}px`),className:`w-full accent-slate-800 h-1 bg-gray-200`})]})]})}),(0,u.jsx)(`div`,{className:`pt-4 border-t border-red-100 flex items-center justify-between`,children:(0,u.jsxs)(`button`,{onClick:()=>s(j.id),className:`w-full py-2 bg-red-50 hover:bg-red-100 border border-red-200 text-red-650 rounded-xl text-xs font-bold transition-all flex items-center justify-center space-x-1 shadow-xs cursor-pointer`,children:[(0,u.jsx)(ox,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Delete Element`})]})})]})]})}return(0,u.jsxs)(`div`,{className:`space-y-5`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`h3`,{className:`text-sm font-bold text-slate-800`,children:`Formatting Panel`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-500`,children:`Customize the styles of the selected block.`})]}),(0,u.jsxs)(`div`,{className:`space-y-4`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-2 pb-3 border-b border-gray-100`,children:[(0,u.jsx)(`div`,{className:`h-6 px-3 bg-slate-100 rounded flex items-center justify-center text-slate-700 font-bold text-[10px] uppercase`,children:j.type}),(0,u.jsxs)(`span`,{className:`text-xs font-bold text-slate-700 capitalize`,children:[`Editing `,j.type===`table`?`Table Block`:`Typography Element`]})]}),(0,u.jsxs)(`div`,{className:`flex items-center justify-between p-3 bg-slate-50 border border-gray-200 rounded-xl select-none`,children:[(0,u.jsxs)(`div`,{className:`space-y-0.5`,children:[(0,u.jsx)(`span`,{className:`text-xs font-bold text-slate-700 block`,children:`Row Alignment`}),(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400`,children:`Display side-by-side`})]}),(0,u.jsx)(`button`,{onClick:()=>{let e=!j.style.sameRow;n(`sameRow`,e),e?(n(`width`,`48%`),b(e=>{let t=e.findIndex(e=>e.id===j.id);return t>0?e.map((e,n)=>n===t-1&&(!e.style.width||e.style.width===`100%`)?w(w({},e),{},{style:w(w({},e.style),{},{width:`48%`})}):e):e})):n(`width`,`100%`)},className:`w-10 h-6 flex items-center rounded-full p-1 transition-colors duration-150 ${j.style.sameRow?`bg-orange-600 justify-end`:`bg-slate-300 justify-start`}`,children:(0,u.jsx)(`span`,{className:`bg-white w-4 h-4 rounded-full shadow-md`})})]}),j.style.sameRow&&(0,u.jsxs)(`div`,{className:`flex items-center justify-between p-3 bg-slate-50 border border-gray-200 rounded-xl select-none`,children:[(0,u.jsxs)(`div`,{className:`space-y-0.5`,children:[(0,u.jsx)(`span`,{className:`text-xs font-bold text-slate-700 block`,children:`Row Direction`}),(0,u.jsx)(`span`,{className:`text-[9px] text-slate-400`,children:`Layout stacked or side-by-side`})]}),(0,u.jsx)(`div`,{className:`grid grid-cols-2 gap-1 bg-slate-100 p-0.5 border border-gray-200 rounded-lg w-[180px]`,children:[`row`,`column`].map(e=>(0,u.jsx)(`button`,{type:`button`,onClick:()=>{n(`flexDirection`,e),b(t=>{let n=t.findIndex(e=>e.id===j.id);if(n===-1)return t;let r=n;for(;r>0&&t[r].style.sameRow;)r--;let i=[r],a=r+1;for(;a<t.length&&t[a].style.sameRow;)i.push(a),a++;return t.map((t,n)=>i.includes(n)?w(w({},t),{},{style:w(w({},t.style),{},{flexDirection:e})}):t)})},className:`px-2 py-1 text-[9px] font-bold rounded capitalize transition-all text-center ${j.style.flexDirection===e||e===`row`&&!j.style.flexDirection?`bg-white text-slate-800 shadow-xs border border-gray-200`:`text-slate-500 hover:text-slate-800`}`,children:e===`row`?`Side-by-side`:`Stacked`},e))})]}),(0,u.jsxs)(`div`,{className:`grid grid-cols-2 gap-3`,children:[(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider`,children:`Font Size`}),(0,u.jsx)(`select`,{value:j.style.fontSize,onChange:e=>n(`fontSize`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs focus:outline-none focus:border-slate-500 bg-white font-medium`,children:i.map(e=>(0,u.jsx)(`option`,{value:e.value,children:e.label},e.value))})]}),!ie&&(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider`,children:`Weight`}),(0,u.jsx)(`select`,{value:j.style.fontWeight,onChange:e=>n(`fontWeight`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs focus:outline-none focus:border-slate-500 bg-white font-medium`,children:o.map(e=>(0,u.jsx)(`option`,{value:e.value,children:e.label},e.value))})]})]}),!ie&&(0,u.jsxs)(`div`,{className:`space-y-1.5`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Font Family`}),(0,u.jsxs)(`select`,{value:j.style.fontFamily||``,onChange:e=>n(`fontFamily`,e.target.value),className:`w-full px-2 py-1.5 border border-gray-200 rounded-lg text-xs focus:outline-none focus:border-slate-500 bg-white font-medium`,children:[(0,u.jsx)(`option`,{value:``,children:`Default Font (Global)`}),a.map(e=>(0,u.jsx)(`option`,{value:e.value,children:e.label},e.value))]})]}),!ie&&(0,u.jsxs)(`div`,{className:`space-y-2`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Alignment & Formatting`}),(0,u.jsxs)(`div`,{className:`flex items-center justify-between gap-1 border border-gray-200 rounded-lg p-1 bg-slate-50`,children:[(0,u.jsx)(`div`,{className:`flex items-center space-x-0.5`,children:[{value:`left`,icon:(0,u.jsx)(ax,{className:`h-3.5 w-3.5`})},{value:`center`,icon:(0,u.jsx)(nx,{className:`h-3.5 w-3.5`})},{value:`right`,icon:(0,u.jsx)(rx,{className:`h-3.5 w-3.5`})},{value:`justify`,icon:(0,u.jsx)(ix,{className:`h-3.5 w-3.5`})}].map(e=>(0,u.jsx)(`button`,{onClick:()=>n(`textAlign`,e.value),className:`p-1.5 rounded transition-all ${j.style.textAlign===e.value?`bg-white text-slate-800 shadow-xs border border-gray-200`:`text-slate-500 hover:text-slate-800`}`,children:e.icon},e.value))}),(0,u.jsx)(`div`,{className:`h-5 w-[1px] bg-slate-200 mx-1`}),(0,u.jsx)(`div`,{className:`flex items-center space-x-0.5`,children:[{key:`bold`,label:`B`,className:`font-bold`},{key:`italic`,label:`I`,className:`italic`},{key:`underline`,label:`U`,className:`underline`},{key:`strikethrough`,label:`S`,className:`line-through`}].map(e=>{let t=j.style[e.key]===!0;return(0,u.jsx)(`button`,{onClick:()=>n(e.key,!t),className:`h-7 w-7 rounded text-xs transition-all ${t?`bg-white text-slate-800 shadow-xs border border-gray-200 font-bold`:`text-slate-500 hover:text-slate-800`}`,children:(0,u.jsx)(`span`,{className:e.className,children:e.label})},e.key)})})]})]}),(0,u.jsxs)(`div`,{className:`space-y-3`,children:[(0,u.jsxs)(`div`,{className:`space-y-1.5`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Text Color`}),(0,u.jsxs)(`div`,{className:`flex flex-wrap gap-1.5`,children:[pb.map(e=>(0,u.jsx)(`button`,{onClick:()=>n(`color`,e),className:`h-5 w-5 rounded-full border border-gray-200 shadow-xs transition-transform ${j.style.color===e?`scale-120 ring-2 ring-slate-800`:`hover:scale-110`}`,style:{backgroundColor:e}},e)),(0,u.jsx)(`input`,{type:`color`,value:j.style.color,onChange:e=>n(`color`,e.target.value),className:`h-5 w-5 rounded-full border border-gray-200 cursor-pointer overflow-hidden p-0`})]})]}),(0,u.jsxs)(`div`,{className:`space-y-1.5`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Background Color`}),(0,u.jsxs)(`div`,{className:`flex flex-wrap gap-1.5`,children:[mb.map(e=>(0,u.jsx)(`button`,{onClick:()=>n(`backgroundColor`,e),className:`h-5 w-5 rounded-full border border-gray-200 shadow-xs transition-transform ${j.style.backgroundColor===e?`scale-120 ring-2 ring-slate-800`:`hover:scale-110`}`,style:{backgroundColor:e===`transparent`?`#ffffff`:e},children:e===`transparent`&&(0,u.jsx)(`span`,{className:`text-[8px] text-slate-400 font-bold block leading-5 text-center`,children:`T`})},e)),(0,u.jsx)(`input`,{type:`color`,value:j.style.backgroundColor===`transparent`?`#ffffff`:j.style.backgroundColor,onChange:e=>n(`backgroundColor`,e.target.value),className:`h-5 w-5 rounded-full border border-gray-200 cursor-pointer overflow-hidden p-0`})]})]})]}),(0,u.jsxs)(`div`,{className:`space-y-3 pt-3 border-t border-gray-100`,children:[(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider`,children:`Block Width`}),(0,u.jsx)(`span`,{className:`text-[10px] font-mono text-slate-500 font-bold bg-slate-100 px-1.5 py-0.5 rounded`,children:j.style.width||`100%`})]}),(0,u.jsx)(`div`,{className:`flex items-center space-x-2`,children:(0,u.jsx)(`input`,{type:`range`,min:`10`,max:`100`,step:`5`,value:parseInt(j.style.width||`100%`),onChange:e=>n(`width`,`${e.target.value}%`),className:`w-full accent-slate-800 h-1 bg-gray-200 rounded-lg appearance-none cursor-pointer`})})]}),(0,u.jsxs)(`div`,{className:`grid grid-cols-2 gap-3`,children:[(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase block`,children:`Bottom Margin`}),(0,u.jsx)(`input`,{type:`range`,min:`0`,max:`40`,step:`2`,value:parseInt(j.style.marginBottom||`0px`),onChange:e=>n(`marginBottom`,`${e.target.value}px`),className:`w-full accent-slate-800 h-1 bg-gray-200 rounded-lg`})]}),(0,u.jsxs)(`div`,{className:`space-y-1`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase block`,children:`Padding`}),(0,u.jsx)(`input`,{type:`range`,min:`0`,max:`40`,step:`2`,value:parseInt(j.style.padding||`0px`),onChange:e=>n(`padding`,`${e.target.value}px`),className:`w-full accent-slate-800 h-1 bg-gray-200 rounded-lg`})]})]})]}),ie&&j.tableInfo&&(0,u.jsxs)(u.Fragment,{children:[(0,u.jsxs)(`div`,{className:`space-y-3 pt-3 border-t border-gray-100`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Table Rows`}),(0,u.jsxs)(`span`,{className:`text-[10px] text-slate-400 font-medium`,children:[((x=j.tableInfo.mockRows)==null?void 0:x.length)||1,` row(s) configured`]})]}),(0,u.jsxs)(`button`,{type:`button`,onClick:()=>v&&v(j.id),className:`px-3 py-1.5 bg-orange-600 hover:bg-orange-700 text-white rounded-lg text-xs font-bold transition-all flex items-center space-x-1 shadow-xs`,title:`Add a new row to table`,children:[(0,u.jsx)(Jb,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Add Row`})]})]}),(0,u.jsx)(`div`,{className:`space-y-1.5 max-h-[140px] overflow-y-auto pr-1`,children:(j.tableInfo.mockRows&&j.tableInfo.mockRows.length>0?j.tableInfo.mockRows:[{}]).map((e,t)=>{var n;return(0,u.jsxs)(`div`,{className:`flex items-center justify-between bg-slate-50 border border-gray-200 rounded-lg p-2 text-xs`,children:[(0,u.jsxs)(`span`,{className:`font-semibold text-slate-700`,children:[`Row #`,t+1]}),(0,u.jsx)(`button`,{type:`button`,onClick:()=>y&&y(t,j.id),disabled:(((n=j.tableInfo)==null||(n=n.mockRows)==null?void 0:n.length)||1)<=1,className:`p-1 text-slate-400 hover:text-red-600 hover:bg-red-50 disabled:opacity-30 disabled:hover:bg-transparent rounded transition-colors`,title:`Remove row`,children:(0,u.jsx)(ox,{className:`h-3.5 w-3.5`})})]},t)})})]}),(0,u.jsxs)(`div`,{className:`space-y-3 pt-3 border-t border-gray-100`,children:[(0,u.jsx)(`label`,{className:`text-[10px] font-bold text-slate-400 uppercase tracking-wider block`,children:`Table Columns`}),(0,u.jsx)(`div`,{className:`space-y-2 max-h-[300px] overflow-y-auto pr-1`,children:j.tableInfo.columns.map((e,t)=>{var n,r;let i=e.loop&&e.columns&&e.columns.length>0;return(0,u.jsxs)(`div`,{className:`bg-slate-50 border border-gray-200 rounded-lg p-2 space-y-1.5 text-xs`,children:[S===String(t)?(0,u.jsxs)(`div`,{className:`space-y-1.5 p-1 bg-white border border-orange-300 rounded`,children:[(0,u.jsx)(`div`,{className:`text-[9px] font-bold text-orange-600 uppercase`,children:`Edit Column`}),(0,u.jsx)(`input`,{type:`text`,value:T,onChange:e=>E(e.target.value),placeholder:`Header Name`,className:`w-full px-2 py-0.5 border border-gray-200 rounded text-xs bg-white`}),(0,u.jsx)(`input`,{type:`text`,value:D,onChange:e=>ee(e.target.value),placeholder:`Value (e.g. {{item.sku}})`,className:`w-full px-2 py-0.5 border border-gray-200 rounded text-xs font-mono bg-white`}),(0,u.jsxs)(`div`,{className:`flex justify-end gap-1`,children:[(0,u.jsxs)(`button`,{onClick:()=>{g&&g(t,T,D),C(null)},className:`p-1 px-2 bg-orange-600 text-white hover:bg-orange-700 rounded text-[10px] flex items-center gap-1 font-bold`,children:[(0,u.jsx)(Vb,{className:`h-3 w-3`}),(0,u.jsx)(`span`,{children:`Save`})]}),(0,u.jsxs)(`button`,{onClick:()=>C(null),className:`p-1 px-2 bg-gray-200 text-slate-700 hover:bg-gray-300 rounded text-[10px] flex items-center gap-1`,children:[(0,u.jsx)(lx,{className:`h-3 w-3`}),(0,u.jsx)(`span`,{children:`Cancel`})]})]})]}):(0,u.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,u.jsxs)(`div`,{className:`truncate mr-2`,children:[(0,u.jsxs)(`span`,{className:`font-bold text-slate-700 block truncate flex items-center gap-1`,children:[(0,u.jsx)(`span`,{children:e.columnName}),i&&(0,u.jsx)(`span`,{className:`px-1 bg-blue-100 text-blue-700 rounded text-[8px] font-mono`,children:`loop (sub-table)`})]}),(0,u.jsx)(`code`,{className:`text-[9px] font-mono text-slate-500 truncate block`,children:e.placeholder})]}),(0,u.jsxs)(`div`,{className:`flex items-center gap-0.5 shrink-0`,children:[(0,u.jsx)(`button`,{onClick:()=>_&&_(t,`up`),disabled:t===0,className:`p-1 text-slate-400 hover:text-slate-700 hover:bg-slate-200 disabled:opacity-30 disabled:hover:bg-transparent rounded transition-colors`,title:`Move Up`,children:(0,u.jsx)(zb,{className:`h-3.5 w-3.5`})}),(0,u.jsx)(`button`,{onClick:()=>_&&_(t,`down`),disabled:t===(((n=j.tableInfo)==null?void 0:n.columns.length)||0)-1,className:`p-1 text-slate-400 hover:text-slate-700 hover:bg-slate-200 disabled:opacity-30 disabled:hover:bg-transparent rounded transition-colors`,title:`Move Down`,children:(0,u.jsx)(Rb,{className:`h-3.5 w-3.5`})}),(0,u.jsx)(`button`,{onClick:()=>{C(String(t)),E(e.columnName),ee(e.placeholder)},className:`p-1 text-slate-400 hover:text-slate-700 hover:bg-slate-200 rounded transition-colors`,title:`Edit column`,children:(0,u.jsx)(qb,{className:`h-3.5 w-3.5`})}),(0,u.jsx)(`button`,{onClick:()=>h(t),className:`p-1 text-slate-400 hover:text-red-600 hover:bg-red-50 rounded transition-colors border border-transparent`,disabled:!j.tableInfo||j.tableInfo.columns.length<=1,title:`Delete column`,children:(0,u.jsx)(ox,{className:`h-3.5 w-3.5`})})]})]}),i&&(0,u.jsxs)(`div`,{className:`ml-2 pl-2 border-l-2 border-blue-200 space-y-1.5 pt-1 mt-1`,children:[(0,u.jsx)(`div`,{className:`flex items-center justify-between`,children:(0,u.jsxs)(`span`,{className:`text-[8px] font-bold text-blue-600 uppercase tracking-wider block`,children:[`Sub-Table Columns (`,((r=e.columns)==null?void 0:r.length)||0,`):`]})}),e.columns.map((n,r)=>{let i=`${t}-${r}`;return S===i?(0,u.jsxs)(`div`,{className:`space-y-1 p-1.5 bg-white border border-blue-300 rounded`,children:[(0,u.jsx)(`div`,{className:`text-[8px] font-bold text-blue-600 uppercase`,children:`Edit Sub-Column`}),(0,u.jsx)(`input`,{type:`text`,value:T,onChange:e=>E(e.target.value),placeholder:`Header Name`,className:`w-full px-2 py-0.5 border border-gray-200 rounded text-[11px] bg-white`}),(0,u.jsx)(`input`,{type:`text`,value:D,onChange:e=>ee(e.target.value),placeholder:`Value`,className:`w-full px-2 py-0.5 border border-gray-200 rounded text-[11px] font-mono bg-white`}),(0,u.jsxs)(`div`,{className:`flex justify-end gap-1 pt-0.5`,children:[(0,u.jsxs)(`button`,{onClick:()=>{g&&g(t,T,D,r),C(null)},className:`p-0.5 px-1.5 bg-blue-600 text-white hover:bg-blue-700 rounded text-[9px] flex items-center gap-1 font-bold`,children:[(0,u.jsx)(Vb,{className:`h-2.5 w-2.5`}),(0,u.jsx)(`span`,{children:`Save`})]}),(0,u.jsxs)(`button`,{onClick:()=>C(null),className:`p-0.5 px-1.5 bg-gray-200 text-slate-700 hover:bg-gray-300 rounded text-[9px] flex items-center gap-1`,children:[(0,u.jsx)(lx,{className:`h-2.5 w-2.5`}),(0,u.jsx)(`span`,{children:`Cancel`})]})]})]},r):(0,u.jsxs)(`div`,{className:`flex items-center justify-between bg-white border border-gray-150 rounded px-2 py-1 text-[11px]`,children:[(0,u.jsxs)(`div`,{className:`truncate mr-1`,children:[(0,u.jsx)(`span`,{className:`font-semibold text-slate-700 block truncate`,children:n.columnName}),(0,u.jsx)(`code`,{className:`text-[8px] font-mono text-slate-400 truncate block`,children:n.placeholder})]}),(0,u.jsxs)(`div`,{className:`flex items-center gap-0.5 shrink-0`,children:[(0,u.jsx)(`button`,{onClick:()=>_&&_(t,`up`,r),disabled:r===0,className:`p-0.5 text-slate-400 hover:text-slate-700 hover:bg-slate-100 disabled:opacity-30 disabled:hover:bg-transparent rounded`,title:`Move Sub-Column Up`,children:(0,u.jsx)(zb,{className:`h-3 w-3`})}),(0,u.jsx)(`button`,{onClick:()=>_&&_(t,`down`,r),disabled:r===e.columns.length-1,className:`p-0.5 text-slate-400 hover:text-slate-700 hover:bg-slate-100 disabled:opacity-30 disabled:hover:bg-transparent rounded`,title:`Move Sub-Column Down`,children:(0,u.jsx)(Rb,{className:`h-3 w-3`})}),(0,u.jsx)(`button`,{onClick:()=>{C(i),E(n.columnName),ee(n.placeholder)},className:`p-0.5 text-slate-400 hover:text-slate-700 hover:bg-slate-100 rounded`,title:`Edit sub-column`,children:(0,u.jsx)(qb,{className:`h-3 w-3`})}),(0,u.jsx)(`button`,{onClick:()=>h(t,r),className:`p-0.5 text-slate-400 hover:text-red-600 hover:bg-red-50 rounded`,title:`Delete sub-column`,children:(0,u.jsx)(ox,{className:`h-3 w-3`})})]})]},r)}),O===t?(0,u.jsxs)(`div`,{className:`bg-white border border-blue-200 rounded p-2 space-y-1.5 mt-1`,children:[(0,u.jsx)(`span`,{className:`text-[9px] font-bold text-blue-600 block`,children:`Add Sub-Column`}),(0,u.jsx)(`input`,{type:`text`,value:te,onChange:e=>A(e.target.value),placeholder:`Header Name (e.g. Price)`,className:`w-full px-2 py-1 border border-gray-200 rounded text-xs bg-white`}),(0,u.jsx)(`input`,{type:`text`,value:ne,onChange:e=>re(e.target.value),placeholder:`Value (e.g. {{item.price}})`,className:`w-full px-2 py-1 border border-gray-200 rounded text-xs font-mono bg-white`}),(0,u.jsxs)(`div`,{className:`flex gap-1 pt-1`,children:[(0,u.jsx)(`button`,{onClick:()=>{te.trim()&&(m(te,ne||`{{item.value}}`,!1,t),A(``),re(``),k(null))},className:`flex-1 py-1 bg-blue-600 hover:bg-blue-700 text-white rounded text-[10px] font-bold`,children:`Add`}),(0,u.jsx)(`button`,{onClick:()=>{k(null),A(``),re(``)},className:`py-1 px-2 bg-gray-100 hover:bg-gray-200 text-slate-600 rounded text-[10px]`,children:`Cancel`})]})]}):(0,u.jsxs)(`button`,{onClick:()=>k(t),className:`w-full py-1 text-[10px] font-bold text-blue-600 hover:bg-blue-50 border border-dashed border-blue-200 rounded flex items-center justify-center space-x-1 transition-colors mt-1`,children:[(0,u.jsx)(Jb,{className:`h-3 w-3`}),(0,u.jsx)(`span`,{children:`Add Sub-Column`})]})]})]},t)})}),(0,u.jsxs)(`div`,{className:`bg-slate-50 border border-gray-200 border-dashed rounded-xl p-3 space-y-3`,children:[(0,u.jsx)(`span`,{className:`text-[9px] font-bold text-slate-500 uppercase tracking-wider block`,children:`Add New Column`}),(0,u.jsx)(`div`,{children:(0,u.jsx)(`input`,{type:`text`,value:c,onChange:e=>d(e.target.value),placeholder:`Header Name`,className:`w-full px-2 py-1 border border-gray-200 rounded text-xs focus:outline-none focus:border-slate-500 bg-white`})}),(0,u.jsx)(`div`,{children:(0,u.jsx)(`input`,{type:`text`,value:f,onChange:e=>p(e.target.value),placeholder:`Value (e.g. {{item.sku}})`,className:`w-full px-2 py-1 border border-gray-200 rounded text-xs font-mono focus:outline-none focus:border-orange-655 bg-white`})}),(0,u.jsxs)(`div`,{className:`flex gap-2`,children:[(0,u.jsxs)(`button`,{onClick:ae,className:`flex-1 py-1.5 bg-orange-600 hover:bg-orange-700 text-white rounded-lg text-xs font-bold transition-all flex items-center justify-center space-x-1`,children:[(0,u.jsx)(Jb,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Column`})]}),(0,u.jsxs)(`button`,{onClick:()=>{c.trim()&&(m(c,f||`{{item.price}}`,!0),d(``),p(``))},className:`flex-1 py-1.5 bg-blue-600 hover:bg-blue-700 text-white rounded-lg text-xs font-bold transition-all flex items-center justify-center space-x-1`,title:`Add column as nested sub-table`,children:[(0,u.jsx)(Jb,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Sub-Table`})]})]})]})]})]}),(0,u.jsx)(`div`,{className:`pt-4 border-t border-red-100 flex items-center justify-between`,children:(0,u.jsxs)(`button`,{onClick:()=>s(j.id),className:`w-full py-2 bg-red-50 hover:bg-red-100 border border-red-200 text-red-650 rounded-xl text-xs font-bold transition-all flex items-center justify-center space-x-1 shadow-xs cursor-pointer`,children:[(0,u.jsx)(ox,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Delete Element`})]})})]})]})}function gx({activeTab:e,setActiveTab:t,setBlocks:n,selectedBlockId:r,setSelectedBlockId:i,getSelectedBlock:a,defaultStyles:o,createTextBlock:s,createImageBlock:c,updateSelectedStyle:l,updateSelectedImageInfo:d,handleDeleteBlock:f,handleRemoveTableColumn:p,handleAddTableColumn:m,handleUpdateTableColumn:h,handleReorderTableColumn:g,handleAddTableRow:_,handleRemoveTableRow:v,schemas:y,toggleSchemaColumn:b,customTableName:x,setCustomTableName:S,customLoopStart:C,setCustomLoopStart:w,customLoopEnd:T,setCustomLoopEnd:E,handleAddCustomTable:D,newColName:ee,setNewColName:O,newColPlaceholder:k,setNewColPlaceholder:te,customImageTypes:A,newImgTypeName:ne,setNewImgTypeName:re,handleAddCustomImageType:j,placeholders:ie,searchPlaceholder:ae,setSearchPlaceholder:oe,placeholderMockData:se,setPlaceholderMockData:ce,handleSidebarDragStart:le,fontSizesState:ue,fontFamiliesState:de,fontWeightsState:fe}){return(0,u.jsxs)(`aside`,{className:`w-full lg:w-[30%] flex flex-col bg-white border-t lg:border-t-0 lg:border-l border-gray-200 overflow-y-auto shrink-0`,children:[(0,u.jsx)(`div`,{className:`grid grid-cols-5 gap-1 border-b border-gray-250 p-2 bg-slate-50`,children:[{value:`text`,icon:(0,u.jsx)(sx,{className:`h-4 w-4`})},{value:`tables`,icon:(0,u.jsx)(tx,{className:`h-4 w-4`})},{value:`images`,icon:(0,u.jsx)(Kb,{className:`h-4 w-4`})},{value:`placeholders`,icon:(0,u.jsx)(Qb,{className:`h-4 w-4`})},{value:`styles`,icon:(0,u.jsx)(Zb,{className:`h-4 w-4`})}].map(n=>(0,u.jsxs)(`button`,{onClick:()=>t(n.value),className:`py-2 px-0.5 flex flex-col items-center justify-center gap-1 font-bold text-[9px] rounded-lg uppercase tracking-wider transition-all duration-150 ${e===n.value?`bg-orange-600 text-white shadow-sm shadow-orange-600/10`:`text-slate-500 hover:text-orange-600 hover:bg-orange-50/50`}`,children:[n.icon,(0,u.jsx)(`span`,{children:n.value})]},n.value))}),(0,u.jsxs)(`div`,{className:`p-4 flex-1 flex flex-col min-h-0 overflow-y-auto`,children:[e===`text`&&(0,u.jsx)(dx,{handleSidebarDragStart:le,createTextBlock:s,setBlocks:n,setSelectedBlockId:i,setActiveTab:t,defaultStyles:o}),e===`tables`&&(0,u.jsx)(fx,{schemas:y,toggleSchemaColumn:b,customTableName:x,setCustomTableName:S,customLoopStart:C,setCustomLoopStart:w,customLoopEnd:T,setCustomLoopEnd:E,handleAddCustomTable:D,handleSidebarDragStart:le,setBlocks:n,setSelectedBlockId:i,setActiveTab:t,defaultStyles:o}),e===`images`&&(0,u.jsx)(px,{customImageTypes:A,newImgTypeName:ne,setNewImgTypeName:re,handleAddCustomImageType:j,handleSidebarDragStart:le,createImageBlock:c,setBlocks:n,setSelectedBlockId:i,setActiveTab:t}),e===`placeholders`&&(0,u.jsx)(mx,{placeholders:ie,schemas:y,searchPlaceholder:ae,setSearchPlaceholder:oe,placeholderMockData:se,setPlaceholderMockData:ce,selectedBlockId:r,setBlocks:n}),e===`styles`&&(0,u.jsx)(hx,{selectedBlockId:r,getSelectedBlock:a,updateSelectedStyle:l,updateSelectedImageInfo:d,fontSizesState:ue,fontFamiliesState:de,fontWeightsState:fe,handleDeleteBlock:f,newColName:ee,setNewColName:O,newColPlaceholder:k,setNewColPlaceholder:te,handleAddTableColumn:m,handleRemoveTableColumn:p,handleUpdateTableColumn:h,handleReorderTableColumn:g,handleAddTableRow:_,handleRemoveTableRow:v,setBlocks:n})]})]})}var _x=[`bold`,`italic`,`underline`,`strikethrough`,`width`],vx=({block:e,onUpdate:t,onSelect:n,onDrop:r})=>{let i=(0,l.useRef)(null);(0,l.useEffect)(()=>{i.current&&i.current.innerHTML!==e.content&&document.activeElement!==i.current&&(i.current.innerHTML=e.content||`<br/>`)},[e.id,e.content]);let a=e.style,{bold:o,italic:s,underline:c,strikethrough:d,width:f}=a,p=w({},Nb(a,_x));o&&(p.fontWeight=`bold`),s&&(p.fontStyle=`italic`);let m=[];return c&&m.push(`underline`),d&&m.push(`line-through`),m.length>0&&(p.textDecoration=m.join(` `)),(0,u.jsx)(`div`,{ref:i,contentEditable:!0,suppressContentEditableWarning:!0,onFocus:n,onInput:e=>t(e.currentTarget.innerHTML),onBlur:e=>t(e.currentTarget.innerHTML),style:p,className:`h-fit w-full break-words outline-none`,onDrop:r,onDragOver:e=>e.preventDefault()})},yx=({blockId:e,colIdx:t,placeholder:n,onUpdate:r,onDrop:i})=>{let a=(0,l.useRef)(null);return(0,l.useEffect)(()=>{a.current&&a.current.innerHTML!==n&&document.activeElement!==a.current&&(a.current.innerHTML=n)},[e,t,n]),(0,u.jsx)(`td`,{ref:a,contentEditable:!0,suppressContentEditableWarning:!0,onInput:e=>r(e.currentTarget.innerText||e.currentTarget.innerHTML),onBlur:e=>r(e.currentTarget.innerText||e.currentTarget.innerHTML),onDrop:i,onDragOver:e=>e.preventDefault(),className:`border border-slate-200 px-2.5 py-2.5 text-slate-500 bg-slate-50/20 font-sans outline-none focus:bg-slate-100/50 transition-colors`})},bx=e=>{let t=[];return e.forEach(e=>{e.style.sameRow&&t.length>0?t[t.length-1].blocks.push(e):t.push({id:e.id,blocks:[e]})}),t};function xx({blocks:e,setBlocks:t,selectedBlockId:n,setSelectedBlockId:r,setActiveTab:i,showMockData:a,placeholderMockData:o,dragOverIndex:s,setDragOverIndex:c,draggedSidebarItem:l,defaultStyles:d,zoom:f,panOffset:p,spacePressed:m,canvasHeight:h,viewportRef:g,canvasContainerRef:_,handleMouseDown:v,handleMouseMove:y,handleMouseUp:b,createTextBlock:x,duplicateBlock:S,reorderBlock:C,handleDeleteBlock:T,handleSidebarDrop:E,handleTableCellDrop:D,updateTableCell:ee,handleTextDrop:O}){let k=(e,t)=>{e.dataTransfer.setData(`blockIndex`,t.toString()),e.dataTransfer.setData(`source`,`canvas`),e.dataTransfer.effectAllowed=`move`},te=(n,r)=>{n.preventDefault(),n.stopPropagation();let i=n.dataTransfer.getData(`source`);if(i===`sidebar`)E(r);else if(i===`canvas`){let i=parseInt(n.dataTransfer.getData(`blockIndex`));if(isNaN(i)||i===r)return;let a=[...e],o=a.splice(i,1)[0],s=i<r?r-1:r;a.splice(s,0,o),t(a)}c(null)};return(0,u.jsx)(`div`,{ref:g,className:`flex-1 overflow-auto p-8 flex justify-center items-start outline-none transition-all ${m?`cursor-grab active:cursor-grabbing`:`cursor-default`}`,onMouseDown:v,onMouseMove:y,onMouseUp:b,onMouseLeave:b,children:(0,u.jsx)(`div`,{style:{transform:`translate(${p.x}px, ${p.y}px) scale(${f})`,transformOrigin:`top center`},className:`transition-transform duration-75 ease-out select-none`,children:(0,u.jsxs)(`div`,{ref:_,style:{height:`${h}px`},className:`w-[794px] min-h-[1123px] bg-white shadow-lg border border-gray-300/80 px-[60px] py-[60px] flex flex-col relative canvas-editor-area`,onDragOver:e=>e.preventDefault(),onDrop:n=>{if(n.preventDefault(),n.stopPropagation(),l)E(e.length);else{let e=n.dataTransfer.getData(`placeholder`);if(e){n.preventDefault();let a=x(`p`,`{{${e}}}`,d==null?void 0:d.p);t(e=>[...e,a]),r(a.id),i(`styles`)}}},children:[e.length===0?(0,u.jsxs)(`div`,{className:`flex-1 border-2 border-dashed border-gray-200 rounded-2xl flex flex-col items-center justify-center p-8 text-center text-slate-400`,children:[(0,u.jsx)(Zb,{className:`h-10 w-10 mb-3 animate-bounce text-slate-350`}),(0,u.jsx)(`span`,{className:`font-bold text-sm text-slate-600 block`,children:`Drag & Drop Editor Canvas`}),(0,u.jsx)(`p`,{className:`text-xs text-slate-400 mt-1 max-w-sm`,children:`Select elements from the sidebar tabs (Text, Tables, Images) and drag them here to assemble your template structure.`})]}):bx(e).map(a=>{var o;let s=a.blocks.length>1;return(0,u.jsx)(`div`,{className:`group/row ${a.blocks.some(e=>e.style.position===`absolute`)?``:`relative`} border border-transparent rounded-lg hover:border-slate-200/60 p-1 mb-2 ${s?((o=a.blocks[0])==null||(o=o.style)==null?void 0:o.flexDirection)===`column`?`flex flex-col gap-2`:`flex flex-row gap-4`:``}`,children:a.blocks.map(a=>{var o,l,d,f;let p=n===a.id,m=w(w({},a.style),gb(a.style.customCss||``));return(0,u.jsxs)(`div`,{draggable:!0,onDragStart:t=>{let n=e.findIndex(e=>e.id===a.id);k(t,n)},onDragOver:t=>{t.preventDefault(),c(e.findIndex(e=>e.id===a.id))},onDrop:t=>{let n=e.findIndex(e=>e.id===a.id);te(t,n)},onClick:e=>{e.stopPropagation(),r(a.id),i(`styles`)},style:{width:s?a.style.width||`48%`:(a.style.position,`100%`),height:a.style.position===`absolute`?a.style.height||`100%`:void 0,position:a.style.position,top:a.style.top,left:a.style.left,zIndex:a.style.zIndex?parseInt(a.style.zIndex):void 0},className:`group/block relative p-0.5 rounded-xl border border-transparent transition-all duration-150 cursor-pointer ${p?`bg-orange-50/20 border-orange-500 shadow-sm ring-2 ring-orange-500/10`:`hover:bg-slate-50/30 hover:border-gray-200`} ${a.style.position===`absolute`?`!absolute !inset-0 !m-auto`:``}`,children:[p&&(0,u.jsxs)(`div`,{className:`absolute -top-3.5 right-3 bg-orange-600 text-white rounded-lg px-2 py-0.5 text-[10px] font-bold flex items-center space-x-1.5 shadow-md z-30 select-none`,children:[(0,u.jsx)(`button`,{onClick:()=>{C(e.findIndex(e=>e.id===a.id),`up`)},className:`hover:text-slate-350`,title:`Move Up`,children:(0,u.jsx)(zb,{className:`h-3 w-3`})}),(0,u.jsx)(`button`,{onClick:()=>{C(e.findIndex(e=>e.id===a.id),`down`)},className:`hover:text-slate-350`,title:`Move Down`,children:(0,u.jsx)(Rb,{className:`h-3 w-3`})}),(0,u.jsx)(`div`,{className:`h-3 w-[1px] bg-slate-700`}),(0,u.jsx)(`button`,{onClick:e=>S(a.id,e),className:`hover:text-slate-350`,title:`Duplicate block`,children:(0,u.jsx)(Hb,{className:`h-3 w-3`})}),(0,u.jsx)(`button`,{onClick:e=>T(a.id,e),className:`hover:text-red-400 text-red-300`,title:`Delete block`,children:(0,u.jsx)(ox,{className:`h-3 w-3`})})]}),a.type===`table`?(0,u.jsx)(`div`,{className:`overflow-x-auto w-full select-none`,children:(0,u.jsxs)(`table`,{style:m,className:`w-full border-collapse`,children:[(0,u.jsx)(`thead`,{children:(0,u.jsx)(`tr`,{children:(o=a.tableInfo)==null?void 0:o.columns.filter(e=>e.enabled!==!1).map((e,t)=>(0,u.jsx)(`th`,{className:`border border-slate-200 px-2.5 py-1 text-slate-700 text-left bg-slate-50 font-sans`,children:e.columnName||``},t))})}),(0,u.jsx)(`tbody`,{children:((l=a.tableInfo)!=null&&l.mockRows&&a.tableInfo.mockRows.length>0?a.tableInfo.mockRows:[{}]).map((e,t)=>{var n;return(0,u.jsx)(`tr`,{className:`bg-slate-50/10 border-b border-slate-100 hover:bg-slate-50/20`,children:(n=a.tableInfo)==null?void 0:n.columns.filter(e=>e.enabled!==!1).map((t,n)=>{let r=e&&typeof e==`object`&&e[t.columnName]||t.placeholder;if(t.loop&&t.columns&&t.columns.length>0){let e=t.columns.filter(e=>e.enabled!==!1);return(0,u.jsx)(`td`,{className:`border border-slate-200 p-2 align-top bg-slate-50/20`,children:(0,u.jsxs)(`div`,{className:`w-full overflow-x-auto space-y-1`,children:[(0,u.jsxs)(`div`,{className:`flex items-center justify-between text-[9px] font-semibold text-slate-500`,children:[(0,u.jsxs)(`span`,{children:[`Sub-table: `,t.columnName]}),(0,u.jsx)(`span`,{className:`px-1.5 py-0.5 bg-slate-200 text-slate-600 rounded text-[8px]`,children:`loop = true`})]}),(0,u.jsxs)(`table`,{className:`w-full border-collapse border border-slate-200 rounded text-xs bg-white`,children:[(0,u.jsx)(`thead`,{children:(0,u.jsx)(`tr`,{children:e.map((e,t)=>(0,u.jsx)(`th`,{className:`border border-slate-200 px-2 py-1 text-slate-700 text-left bg-slate-100/80 font-sans font-semibold text-[10px]`,children:e.columnName},t))})}),(0,u.jsx)(`tbody`,{children:(0,u.jsx)(`tr`,{className:`bg-slate-50/30`,children:e.map((e,t)=>(0,u.jsx)(yx,{blockId:a.id,colIdx:t,placeholder:e.placeholder,onUpdate:e=>ee(a.id,n,e,t),onDrop:e=>D(e,a.id,n,t)},t))})})]})]})},n)}return(0,u.jsx)(yx,{blockId:a.id,colIdx:n,placeholder:r,onUpdate:e=>ee(a.id,n,e),onDrop:e=>D(e,a.id,n)},n)})},t)})})]})}):a.type===`image`?(0,u.jsx)(`div`,{style:{textAlign:m.textAlign||`left`,width:`100%`,marginBottom:m.marginBottom,padding:m.padding,backgroundColor:m.backgroundColor},className:`w-full select-none`,children:(0,u.jsx)(`div`,{style:{width:s?`100%`:a.style.width||`100%`,display:`inline-block`},children:((d=a.imageInfo)==null?void 0:d.imageType)===`barcode`?(0,u.jsx)(`div`,{style:{width:`100%`,height:a.style.height||a.style.minHeight||`70px`},className:`border border-dashed border-slate-200 p-2 bg-slate-50/5 rounded-lg flex items-center justify-center overflow-hidden`,dangerouslySetInnerHTML:{__html:_b(a.imageInfo.barcodeValue||`SHIP-99201`)}}):(0,u.jsx)(`img`,{src:((f=a.imageInfo)==null?void 0:f.url)||`data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgODAwIDQwMCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iI2YxZjVmOSIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9Ijc4MCIgaGVpZ2h0PSIzODAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2RiZTJmNiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtZGFzaGFycmF5PSI2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSInT3V0Zml0JywgJ0ludGVyJywgc2Fucy1zZXJpZiIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9IjYwMCIgZmlsbD0iIzk0YTNiOCIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2VsZWN0IEltYWdlPC90ZXh0Pjwvc3ZnPg==`,style:{width:`100%`,height:`auto`,maxHeight:a.style.height||`300px`,objectFit:a.style.objectFit||`contain`,opacity:a.style.opacity||`1`,display:`block`},alt:`graphic content`})})}):(0,u.jsx)(vx,{block:a,onUpdate:e=>{t(t=>t.map(t=>t.id===a.id?w(w({},t),{},{content:e}):t))},onSelect:()=>r(a.id),onDrop:e=>O(e,a.id)})]},a.id)})},a.id)}),s!==null&&(0,u.jsx)(`div`,{className:`h-[2px] bg-orange-500 rounded my-1 shadow-md animate-pulse`})]})})})}function Sx({showClearCanvas:e,handleClearCanvas:t,customButtonStyles:n,customButtonClassNames:r,zoom:i,setZoom:a,setPanOffset:o}){return(0,u.jsxs)(`div`,{className:`bg-white border-b border-gray-200 px-6 py-3 flex items-center justify-between shadow-xs sticky top-0 z-20`,children:[(0,u.jsx)(`div`,{className:`flex items-center space-x-4`,children:e&&(0,u.jsxs)(`button`,{onClick:t,style:n==null?void 0:n.clearCanvas,className:(r==null?void 0:r.clearCanvas)||`inline-flex items-center space-x-1 px-2.5 py-1 text-xs font-semibold border border-red-200 text-red-650 bg-red-50 hover:bg-red-100 rounded-lg transition-colors`,title:`Clear all canvas elements`,children:[(0,u.jsx)(ox,{className:`h-3.5 w-3.5`}),(0,u.jsx)(`span`,{children:`Clear Canvas`})]})}),(0,u.jsxs)(`div`,{className:`flex items-center space-x-3 bg-slate-50 border border-gray-200 px-3 py-1 rounded-xl shadow-xs select-none`,children:[(0,u.jsxs)(`div`,{className:`flex items-center space-x-1`,children:[(0,u.jsx)(`button`,{onClick:()=>a(e=>Math.max(e-.1,.5)),className:`h-6 w-6 rounded border border-gray-200 bg-white hover:bg-slate-50 flex items-center justify-center font-bold text-slate-650 hover:text-slate-900 transition-colors text-xs select-none`,title:`Zoom Out`,children:`−`}),(0,u.jsxs)(`div`,{className:`w-12 text-center text-xs font-bold text-slate-700`,children:[Math.round(i*100),`%`]}),(0,u.jsx)(`button`,{onClick:()=>a(e=>Math.min(e+.1,2)),className:`h-6 w-6 rounded border border-gray-200 bg-white hover:bg-slate-50 flex items-center justify-center font-bold text-slate-650 hover:text-slate-900 transition-colors text-xs select-none`,title:`Zoom In`,children:`+`})]}),(0,u.jsx)(`div`,{className:`h-4 w-[1px] bg-gray-200`}),(0,u.jsx)(`input`,{type:`range`,min:`0.5`,max:`2.0`,step:`0.05`,value:i,onChange:e=>a(parseFloat(e.target.value)),className:`w-20 accent-orange-600 h-1 bg-gray-200 rounded-lg appearance-none cursor-pointer`}),(0,u.jsx)(`button`,{onClick:()=>{a(1),o({x:0,y:0})},className:`text-[10px] font-bold text-slate-500 hover:text-slate-800 hover:underline`,children:`Reset`})]})]})}function Cx({previewOpen:e,setPreviewOpen:t,generateExportHtml:n}){return e?(0,u.jsx)(`div`,{className:`fixed inset-0 bg-slate-950/65 backdrop-blur-xs flex items-center justify-center z-50 p-6`,children:(0,u.jsxs)(`div`,{className:`bg-white rounded-2xl w-full max-w-[900px] h-[90%] flex flex-col shadow-2xl overflow-hidden border border-gray-200`,children:[(0,u.jsxs)(`div`,{className:`bg-slate-50 border-b border-gray-200 px-6 py-4 flex items-center justify-between`,children:[(0,u.jsxs)(`div`,{children:[(0,u.jsxs)(`h3`,{className:`text-sm font-bold text-slate-800 flex items-center space-x-2`,children:[(0,u.jsx)(Wb,{className:`h-4 w-4 text-slate-655`}),(0,u.jsx)(`span`,{children:`HTML Document Render Output`})]}),(0,u.jsx)(`p`,{className:`text-[10px] text-slate-400 mt-0.5`,children:`Sandboxed iframe preview of final template markup`})]}),(0,u.jsx)(`button`,{onClick:()=>t(!1),className:`p-1.5 bg-slate-100 hover:bg-slate-200 text-slate-500 hover:text-slate-800 rounded-lg transition-colors`,children:(0,u.jsx)(lx,{className:`h-4 w-4`})})]}),(0,u.jsx)(`div`,{className:`flex-1 bg-slate-100 p-6 overflow-hidden`,children:(0,u.jsx)(`iframe`,{title:`HTML Preview Sandbox`,srcDoc:n(!0),className:`w-full h-full bg-white border border-gray-200 rounded-xl shadow-xs`,sandbox:`allow-same-origin`})}),(0,u.jsxs)(`details`,{className:`bg-slate-50 border-t border-gray-200`,children:[(0,u.jsxs)(`summary`,{className:`px-6 py-3 text-xs font-bold text-slate-600 cursor-pointer select-none hover:text-slate-800 flex items-center justify-between`,children:[(0,u.jsx)(`span`,{children:`View Raw Output Markup (HTML)`}),(0,u.jsx)(`span`,{className:`text-[10px] text-slate-400 font-medium font-sans`,children:`Click to expand`})]}),(0,u.jsx)(`div`,{className:`px-6 pb-6 overflow-x-auto max-h-[250px]`,children:(0,u.jsx)(`pre`,{className:`bg-slate-900 text-slate-200 p-4 rounded-lg text-[10px] font-mono whitespace-pre-wrap select-all`,children:n(!1)})})]})]})}):null}function wx({bubbleCoords:e,applySelectionFormat:t}){return e?(0,u.jsxs)(`div`,{className:`fixed bg-slate-900 border border-slate-800 text-white rounded-xl shadow-xl py-1 px-1.5 flex items-center space-x-1.5 z-50 select-none -translate-x-1/2`,style:{left:`${e.x}px`,top:`${e.y}px`},children:[(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`bold`)},className:`h-6 w-6 rounded hover:bg-slate-800 flex items-center justify-center font-bold text-xs text-slate-200 hover:text-white transition-colors`,title:`Bold Selection`,children:`B`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`italic`)},className:`h-6 w-6 rounded hover:bg-slate-800 flex items-center justify-center italic text-xs text-slate-200 hover:text-white transition-colors`,title:`Italic Selection`,children:`I`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`underline`)},className:`h-6 w-6 rounded hover:bg-slate-800 flex items-center justify-center underline text-xs text-slate-200 hover:text-white transition-colors`,title:`Underline Selection`,children:`U`}),(0,u.jsx)(`div`,{className:`h-4 w-[1px] bg-slate-800 mx-1`}),(0,u.jsxs)(`select`,{value:e.format||``,onChange:e=>{e.preventDefault(),e.target.value&&(t(`formatBlock`,e.target.value),e.target.value===`P`&&t(`fontSize`,`3`))},className:`bg-slate-800 text-white text-[10px] rounded px-1 py-0.5 outline-none cursor-pointer border border-slate-700`,children:[(0,u.jsx)(`option`,{value:``,disabled:!0,children:`Format...`}),(0,u.jsx)(`option`,{value:`H1`,children:`Heading 1`}),(0,u.jsx)(`option`,{value:`H2`,children:`Heading 2`}),(0,u.jsx)(`option`,{value:`H3`,children:`Heading 3`}),(0,u.jsx)(`option`,{value:`P`,children:`Paragraph`}),(0,u.jsx)(`option`,{value:`BLOCKQUOTE`,children:`Quote`})]}),(0,u.jsx)(`div`,{className:`h-4 w-[1px] bg-slate-800 mx-1`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`foreColor`,`#3b82f6`)},className:`h-4 w-4 rounded-full bg-blue-500 hover:scale-110 transition-transform cursor-pointer`,title:`Color Blue`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`foreColor`,`#ef4444`)},className:`h-4 w-4 rounded-full bg-red-500 hover:scale-110 transition-transform cursor-pointer`,title:`Color Red`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`foreColor`,`#1e293b`)},className:`h-4 w-4 rounded-full bg-slate-700 hover:scale-110 transition-transform cursor-pointer border border-slate-850`,title:`Color Slate`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`foreColor`,`#22c55e`)},className:`h-4 w-4 rounded-full bg-green-500 hover:scale-110 transition-transform cursor-pointer`,title:`Color Green`}),(0,u.jsx)(`div`,{className:`h-4 w-[1px] bg-slate-800`}),(0,u.jsx)(`button`,{onMouseDown:e=>{e.preventDefault(),t(`removeFormat`)},className:`hover:bg-slate-800 rounded text-[10px] px-1.5 h-6 flex items-center justify-center text-slate-400 hover:text-white font-semibold transition-colors`,title:`Clear Formatting`,children:`Clear`})]}):null}zu.workerSrc=`https://cdn.jsdelivr.net/npm/pdfjs-dist@6.1.200/build/pdf.worker.min.mjs`;var Tx=e=>{let t=[];return e.forEach(e=>{e.style.sameRow&&t.length>0?t[t.length-1].blocks.push(e):t.push({id:e.id,blocks:[e]})}),t},Ex=e=>e?e.replace(/contenteditable="[^"]*"/g,``).replace(/class="[^"]*"/g,``).replace(/data-placeholder="[^"]*"/g,``).replace(/&nbsp;/g,` `).trim():``;function Dx({tableSchemas:e,placeholders:t,defaultLogo:n,defaultBanner:r,headerTitle:i=`HTML Template Builder`,headerSubtitle:a=`Design and export templates dynamically`,headerLogo:o,typographySizes:s,typographyWeights:c,typographyFonts:d,templatingLanguage:f=`csharp`,loopSyntax:p=`foreach`,onChange:m,onExport:h,onExportPdf:g,initialBlocks:v,defaultStyles:y,showImportHtml:b=!0,showImportPdf:x=!0,showClearCanvas:S=!0,showPreview:C=!0,showExport:T=!0,showExportPdf:E=!0,customButtonStyles:D,customButtonClassNames:O,customActionComponents:k}={}){let{zoom:te,setZoom:A,panOffset:ne,setPanOffset:re,spacePressed:j,canvasHeight:ie,viewportRef:ae,canvasContainerRef:oe,handleMouseDown:se,handleMouseMove:ce,handleMouseUp:le}=Sb(),{customTableName:ue,setCustomTableName:de,customLoopStart:fe,setCustomLoopStart:pe,customLoopEnd:me,setCustomLoopEnd:he,newColName:ge,setNewColName:_e,newColPlaceholder:ve,setNewColPlaceholder:ye,bubbleCoords:be,setBubbleCoords:xe,schemas:Se,isParsing:Ce,setIsParsing:we,parseStatusText:Te,setParseStatusText:M,parseError:N,setParseError:Ee,draggedSidebarItem:P,setDraggedSidebarItem:De,dragOverIndex:Oe,setDragOverIndex:ke,newImgTypeName:Ae,setNewImgTypeName:je,customImageTypes:Me,searchPlaceholder:Ne,setSearchPlaceholder:Pe,handleAddCustomTable:Fe,handleAddCustomImageType:Ie,toggleSchemaColumn:Le,applySelectionFormat:F,setSavedRange:I}=Cb({tableSchemas:e}),{blocks:Re,setBlocks:ze,selectedBlockId:Be,setSelectedBlockId:Ve,getSelectedBlock:He,createTextBlock:L,createTableBlock:Ue,createImageBlock:We,handleDeleteBlock:Ge,handleDuplicateBlock:Ke,handleMoveBlockUp:qe,handleMoveBlockDown:Je,updateSelectedStyle:Ye,updateSelectedImageInfo:Xe,handleRemoveTableColumn:Ze,handleAddTableColumn:R,handleUpdateTableColumn:z,handleReorderTableColumn:Qe,handleAddTableRow:$e,handleRemoveTableRow:et}=xb({initialBlocks:v,defaultStyles:y,defaultLogo:n,defaultBanner:r,onChange:m}),[tt,nt]=(0,l.useState)(`text`),[rt,it]=(0,l.useState)(!1),[at]=(0,l.useState)(!0),[ot]=(0,l.useState)(s||[{label:`8px`,value:`8px`},{label:`9px`,value:`9px`},{label:`10px`,value:`10px`},{label:`11px`,value:`11px`},{label:`12px`,value:`12px`},{label:`14px`,value:`14px`},{label:`16px`,value:`16px`},{label:`18px`,value:`18px`},{label:`20px`,value:`20px`},{label:`24px`,value:`24px`},{label:`28px`,value:`28px`},{label:`32px`,value:`32px`},{label:`36px`,value:`36px`}]),[st]=(0,l.useState)(d||[{label:`Outfit (Default)`,value:`'Outfit', 'Inter', sans-serif`},{label:`Inter`,value:`'Inter', sans-serif`},{label:`Roboto`,value:`'Roboto', sans-serif`},{label:`System Sans`,value:`system-ui, -apple-system, sans-serif`},{label:`Georgia (Serif)`,value:`Georgia, serif`},{label:`Courier New (Mono)`,value:`'Courier New', monospace`}]),[ct]=(0,l.useState)(c||[{label:`Light`,value:`300`},{label:`Regular`,value:`400`},{label:`Medium`,value:`500`},{label:`Semibold`,value:`600`},{label:`Bold`,value:`700`},{label:`Extra Bold`,value:`800`}]),[B]=(0,l.useState)(f),[lt]=(0,l.useState)(p),[ut]=(0,l.useState)(!0),[dt,ft]=(0,l.useState)({});(0,l.useEffect)(()=>{let e=()=>{let e=window.getSelection();if(!e||e.isCollapsed||e.toString().trim()===``){xe(null),I(null);return}let t=document.activeElement;if(!(t&&t.getAttribute(`contenteditable`)===`true`&&(t.closest(`.canvas-editor-area`)||t.closest(`td`)))){xe(null),I(null);return}try{let t=e.getRangeAt(0),n=t.getBoundingClientRect(),r=document.queryCommandValue(`formatBlock`)||``;r=r.toUpperCase(),xe({x:n.left+n.width/2,y:n.top-38,format:r}),I(t)}catch(e){xe(null),I(null)}};return document.addEventListener(`selectionchange`,e),()=>document.removeEventListener(`selectionchange`,e)},[xe]),(0,l.useEffect)(()=>{let e={};(t||[]).forEach(t=>{let n=t.placeholder.replace(/[{}]/g,``);e[n]=t.mockValue||``}),Se.forEach(t=>{t.columns.forEach(t=>{let n=t.placeholder.replace(/[{}]/g,``).replace(/^(\.\.\/|package\.|item\.)/,``);e[n]||(e[n]=t.mockValue||``)})}),ft(e)},[t,Se]),(0,l.useEffect)(()=>{let e=ae.current;if(!e)return;let t=e=>{if(e.ctrlKey){e.preventDefault();let t=e.deltaY<0?1:-1;A(e=>Math.min(2,Math.max(.5,e+t*.05)))}};return e.addEventListener(`wheel`,t,{passive:!1}),()=>e.removeEventListener(`wheel`,t)},[ae,A]),(0,l.useEffect)(()=>{window.updateContentFromRawDelete=(e,t)=>{ze(n=>n.map(n=>n.id===e?w(w({},n),{},{content:t}):n))}},[ze]);let pt=e=>{var t;let n=(t=e.target.files)==null?void 0:t[0];if(!n)return;we(!0),M(`Parsing HTML...`),Ee(null);let r=new FileReader;r.onload=t=>{try{var n;let e=yb((n=t.target)==null?void 0:n.result);e.length>0&&ze(e)}catch(e){console.error(e),Ee(e.message||`Failed to parse HTML`)}finally{we(!1),e.target&&(e.target.value=``)}},r.readAsText(n)},mt=e=>{var t;let n=(t=e.target.files)==null?void 0:t[0];if(!n)return;we(!0),M(`Reading PDF text layers...`),Ee(null);let r=new FileReader;r.onload=_(function*(){try{let e=r.result,t=yield bb(e,ee);t.length>0&&ze(e=>[...e,...t])}catch(e){console.error(e),Ee(e.message||`Failed to read PDF`)}finally{we(!1),e.target&&(e.target.value=``)}}),r.readAsArrayBuffer(n)},ht=e=>{let t=e||`items`;if(B===`handlebars`||B===`mustache`){let e=lt===`foreach`?`foreach`:`each`;return{start:`{{#${e} ${t}}}`,end:`{{/${e}}}`}}return B===`liquid`||B===`scriban`||B===`dotnet`?{start:`{% for ${t.endsWith(`s`)?t.slice(0,-1):`item`} in ${t} %}`,end:`{% endfor %}`}:B===`js`||B===`ts`?{start:`\${${t}.map(${t.endsWith(`s`)?t.slice(0,-1):`item`} => \``,end:"`).join('')}"}:B===`csharp`||B===`razor`?{start:`@foreach (var ${t.endsWith(`s`)?t.slice(0,-1):`item`} in ${t}) {`,end:`}`}:{start:fe.replace(`items`,t),end:me}},gt=(e=!1)=>{let t=`<!DOCTYPE html>
 <html>
 <head>
   <meta charset="utf-8">

package/dist/index.js

@@ -17313,15 +17313,7 @@ function Sb({ initialBlocks: e, defaultStyles: t, defaultLogo: n, defaultBanner:
 						placeholder: t.trim(),
 						enabled: !0,
 						loop: !0,
-						columns: [{
-							columnName: "Item Name",
-							placeholder: "{{item.name}}",
-							enabled: !0
-						}, {
-							columnName: "Price",
-							placeholder: "{{item.price}}",
-							enabled: !0
-						}]
+						columns: []
 					}) : a.push({
 						columnName: e.trim(),
 						placeholder: t.trim(),
@@ -18462,27 +18454,18 @@ function mx({ customImageTypes: e, newImgTypeName: t, setNewImgTypeName: n, hand
 //#region src/components/sidebar/PlaceholdersTab.tsx
 function hx({ placeholders: e, schemas: t, searchPlaceholder: n, setSearchPlaceholder: r, placeholderMockData: i, setPlaceholderMockData: a, selectedBlockId: o, setBlocks: s }) {
 	let u = () => {
-		let r = [];
+		let t = [];
 		return (e || []).forEach((e) => {
-			r.push({
+			t.push({
 				label: e.label,
 				placeholder: e.placeholder,
-				category: "General"
-			});
-		}), t.forEach((e) => {
-			let t = e.tableName === "package" ? "Package Fields" : "Article Fields";
-			e.columns.forEach((n) => {
-				r.push({
-					label: `${e.tableName.toUpperCase()} - ${n.columnName}`,
-					placeholder: n.placeholder,
-					category: t
-				});
+				category: e.category || "General"
 			});
-		}), r.filter((e) => e.label.toLowerCase().includes(n.toLowerCase()) || e.placeholder.toLowerCase().includes(n.toLowerCase()));
+		}), t.filter((e) => e.label.toLowerCase().includes(n.toLowerCase()) || e.placeholder.toLowerCase().includes(n.toLowerCase()));
 	}, d = (e) => {
 		if (o) {
-			let t = e.replace(/[{}]/g, ""), n = ` <span contenteditable="false" data-placeholder="${t}" class="inline-flex items-center px-1.5 py-0.5 rounded bg-slate-100 text-slate-700 text-[9px] font-bold mx-0.5 select-none align-middle border border-slate-200 cursor-default relative pr-4 group/chip"><span>{{${t}}}</span><span class="absolute right-0.5 top-1/2 -translate-y-1/2 cursor-pointer text-slate-400 hover:text-red-655 px-0.5 font-bold hover:bg-slate-200/50 rounded text-[9px] leading-none select-none" onmousedown="event.stopPropagation(); event.preventDefault(); const p = this.closest('span[data-placeholder]'); const editable = p.closest('[contenteditable=\\'true\\']'); if(p){ p.remove(); } if(editable){ window.updateContentFromRawDelete('${o}', editable.innerHTML); }">×</span></span>&nbsp;`;
-			s((e) => e.map((e) => e.id === o && e.type !== "table" ? T(T({}, e), {}, { content: e.content + n }) : e));
+			let t = `{{${e.replace(/[{}]/g, "")}}}`;
+			s((e) => e.map((e) => e.id === o && e.type !== "table" ? T(T({}, e), {}, { content: e.content + t }) : e));
 		}
 	}, f = u();
 	return /* @__PURE__ */ l("div", {

package/dist/react-edit-to-html.css

@@ -1,2 +1,2 @@
-*,:before,:after{box-sizing:border-box;border:0 solid #e5e7eb}:before,:after{--tw-content:""}html{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;font-family:Outfit,Inter,sans-serif;line-height:1.5}:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;font-family:Outfit,Inter,sans-serif;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-feature-settings:normal;font-variation-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-feature-settings:inherit;font-variation-settings:inherit;font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button{-webkit-appearance:button;background-color:transparent;background-image:none}[type=button]{-webkit-appearance:button;background-color:transparent;background-image:none}[type=reset]{-webkit-appearance:button;background-color:transparent;background-image:none}[type=submit]{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder{opacity:1;color:#9ca3af}textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::-webkit-input-placeholder{opacity:1;color:#9ca3af}input::-moz-placeholder{opacity:1;color:#9ca3af}input::-ms-input-placeholder{opacity:1;color:#9ca3af}input::placeholder{opacity:1;color:#9ca3af}textarea::-webkit-input-placeholder{opacity:1;color:#9ca3af}textarea::-moz-placeholder{opacity:1;color:#9ca3af}textarea::-ms-input-placeholder{opacity:1;color:#9ca3af}textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}[hidden]{display:none}body{--tw-bg-opacity:1;background-color:rgba(248,250,252,var(--tw-bg-opacity));--tw-text-opacity:1;color:rgba(30,41,59,var(--tw-text-opacity));font-family:Outfit,Inter,sans-serif}*,:before,:after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 transparent;--tw-ring-shadow:0 0 transparent;--tw-shadow:0 0 transparent;--tw-shadow-colored:0 0 transparent;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::-ms-backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 transparent;--tw-ring-shadow:0 0 transparent;--tw-shadow:0 0 transparent;--tw-shadow-colored:0 0 transparent;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 transparent;--tw-ring-shadow:0 0 transparent;--tw-shadow:0 0 transparent;--tw-shadow-colored:0 0 transparent;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.visible{visibility:visible}.collapse{visibility:collapse}.fixed{position:fixed}.\!absolute{position:absolute!important}.absolute{position:absolute}.relative{position:relative}.sticky{position:-webkit-sticky;position:sticky}.\!inset-0{top:0!important;bottom:0!important;left:0!important;right:0!important}.inset-0{top:0;bottom:0;left:0;right:0}.-top-3{top:-.75rem}.-top-3\.5{top:-.875rem}.left-3{left:.75rem}.right-0{right:0}.right-0\.5{right:.125rem}.right-3{right:.75rem}.top-0{top:0}.top-1\/2{top:50%}.top-2{top:.5rem}.top-2\.5{top:.625rem}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-50{z-index:50}.\!m-auto{margin:auto!important}.mx-0{margin-left:0;margin-right:0}.mx-0\.5{margin-left:.125rem;margin-right:.125rem}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-auto{margin-left:auto;margin-right:auto}.my-1{margin-top:.25rem;margin-bottom:.25rem}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.ml-2{margin-left:.5rem}.ml-4{margin-left:1rem}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mt-0{margin-top:0}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.\!block{display:block!important}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.h-1{height:.25rem}.h-10{height:2.5rem}.h-2{height:.5rem}.h-2\.5{height:.625rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-\[2px\]{height:2px}.h-\[90\%\]{height:90%}.h-fit{height:-moz-fit-content;height:fit-content}.h-full{height:100%}.max-h-\[140px\]{max-height:140px}.max-h-\[180px\]{max-height:180px}.max-h-\[250px\]{max-height:250px}.max-h-\[300px\]{max-height:300px}.min-h-0{min-height:0}.min-h-\[1123px\]{min-height:1123px}.min-h-screen{min-height:100vh}.w-10{width:2.5rem}.w-12{width:3rem}.w-2{width:.5rem}.w-2\.5{width:.625rem}.w-20{width:5rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-7{width:1.75rem}.w-8{width:2rem}.w-\[180px\]{width:180px}.w-\[1px\]{width:1px}.w-\[794px\]{width:794px}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.max-w-\[130px\]{max-width:130px}.max-w-\[900px\]{max-width:900px}.max-w-sm{max-width:24rem}.flex-1{flex:1}.flex-shrink-0,.shrink-0{flex-shrink:0}.border-collapse{border-collapse:collapse}.-translate-x-1\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}.animate-bounce{animation:1s infinite bounce}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:2s cubic-bezier(.4,0,.6,1) infinite pulse}.cursor-default{cursor:default}.cursor-grab{cursor:grab}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.select-all{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}.appearance-none{-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0{gap:0}.gap-0\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.space-x-0>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0px * var(--tw-space-x-reverse));margin-left:calc(0px * calc(1 - var(--tw-space-x-reverse)))}.space-x-0\.5>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.125rem * var(--tw-space-x-reverse));margin-left:calc(.125rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-1\.5>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.375rem * var(--tw-space-x-reverse));margin-left:calc(.375rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-3>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.75rem * var(--tw-space-x-reverse));margin-left:calc(.75rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-4>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1rem * var(--tw-space-x-reverse));margin-left:calc(1rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-0>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0px * var(--tw-space-y-reverse))}.space-y-0\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.125rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.125rem * var(--tw-space-y-reverse))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}.space-y-1\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.375rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.375rem * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.space-y-5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.25rem * var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-x-hidden{overflow-x:hidden}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{overflow-wrap:break-word}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-l-2{border-left-width:2px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-dashed{border-style:dashed}.border-blue-200{--tw-border-opacity:1;border-color:rgba(191,219,254,var(--tw-border-opacity))}.border-blue-300{--tw-border-opacity:1;border-color:rgba(147,197,253,var(--tw-border-opacity))}.border-gray-100{--tw-border-opacity:1;border-color:rgba(243,244,246,var(--tw-border-opacity))}.border-gray-200{--tw-border-opacity:1;border-color:rgba(229,231,235,var(--tw-border-opacity))}.border-gray-300\/80{border-color:rgba(209,213,219,.8)}.border-orange-100{--tw-border-opacity:1;border-color:rgba(255,237,213,var(--tw-border-opacity))}.border-orange-300{--tw-border-opacity:1;border-color:rgba(253,186,116,var(--tw-border-opacity))}.border-orange-500{--tw-border-opacity:1;border-color:rgba(249,115,22,var(--tw-border-opacity))}.border-red-100{--tw-border-opacity:1;border-color:rgba(254,226,226,var(--tw-border-opacity))}.border-red-200{--tw-border-opacity:1;border-color:rgba(254,202,202,var(--tw-border-opacity))}.border-slate-100{--tw-border-opacity:1;border-color:rgba(241,245,249,var(--tw-border-opacity))}.border-slate-200{--tw-border-opacity:1;border-color:rgba(226,232,240,var(--tw-border-opacity))}.border-slate-200\/50{border-color:rgba(226,232,240,.5)}.border-slate-700{--tw-border-opacity:1;border-color:rgba(51,65,85,var(--tw-border-opacity))}.border-slate-800{--tw-border-opacity:1;border-color:rgba(30,41,59,var(--tw-border-opacity))}.border-transparent{border-color:transparent}.bg-blue-100{--tw-bg-opacity:1;background-color:rgba(219,234,254,var(--tw-bg-opacity))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgba(59,130,246,var(--tw-bg-opacity))}.bg-blue-600{--tw-bg-opacity:1;background-color:rgba(37,99,235,var(--tw-bg-opacity))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgba(243,244,246,var(--tw-bg-opacity))}.bg-gray-200{--tw-bg-opacity:1;background-color:rgba(229,231,235,var(--tw-bg-opacity))}.bg-green-500{--tw-bg-opacity:1;background-color:rgba(34,197,94,var(--tw-bg-opacity))}.bg-indigo-600{--tw-bg-opacity:1;background-color:rgba(79,70,229,var(--tw-bg-opacity))}.bg-orange-50{--tw-bg-opacity:1;background-color:rgba(255,247,237,var(--tw-bg-opacity))}.bg-orange-50\/20{background-color:rgba(255,247,237,.2)}.bg-orange-500{--tw-bg-opacity:1;background-color:rgba(249,115,22,var(--tw-bg-opacity))}.bg-orange-600{--tw-bg-opacity:1;background-color:rgba(234,88,12,var(--tw-bg-opacity))}.bg-red-50{--tw-bg-opacity:1;background-color:rgba(254,242,242,var(--tw-bg-opacity))}.bg-red-500{--tw-bg-opacity:1;background-color:rgba(239,68,68,var(--tw-bg-opacity))}.bg-slate-100{--tw-bg-opacity:1;background-color:rgba(241,245,249,var(--tw-bg-opacity))}.bg-slate-100\/80{background-color:rgba(241,245,249,.8)}.bg-slate-200{--tw-bg-opacity:1;background-color:rgba(226,232,240,var(--tw-bg-opacity))}.bg-slate-300{--tw-bg-opacity:1;background-color:rgba(203,213,225,var(--tw-bg-opacity))}.bg-slate-50{--tw-bg-opacity:1;background-color:rgba(248,250,252,var(--tw-bg-opacity))}.bg-slate-50\/10{background-color:rgba(248,250,252,.1)}.bg-slate-50\/20{background-color:rgba(248,250,252,.2)}.bg-slate-50\/30{background-color:rgba(248,250,252,.3)}.bg-slate-50\/5{background-color:rgba(248,250,252,.05)}.bg-slate-50\/50{background-color:rgba(248,250,252,.5)}.bg-slate-700{--tw-bg-opacity:1;background-color:rgba(51,65,85,var(--tw-bg-opacity))}.bg-slate-800{--tw-bg-opacity:1;background-color:rgba(30,41,59,var(--tw-bg-opacity))}.bg-slate-900{--tw-bg-opacity:1;background-color:rgba(15,23,42,var(--tw-bg-opacity))}.bg-slate-950\/65{background-color:rgba(2,6,23,.65)}.bg-white{--tw-bg-opacity:1;background-color:rgba(255,255,255,var(--tw-bg-opacity))}.p-0{padding:0}.p-0\.5{padding:.125rem}.p-1{padding:.25rem}.p-1\.5{padding:.375rem}.p-2{padding:.5rem}.p-2\.5{padding:.625rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-0{padding-left:0;padding-right:0}.px-0\.5{padding-left:.125rem;padding-right:.125rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-\[60px\]{padding-left:60px;padding-right:60px}.py-0{padding-top:0;padding-bottom:0}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-\[60px\]{padding-top:60px;padding-bottom:60px}.pb-2{padding-bottom:.5rem}.pb-3{padding-bottom:.75rem}.pb-6{padding-bottom:1.5rem}.pl-2{padding-left:.5rem}.pl-2\.5{padding-left:.625rem}.pl-9{padding-left:2.25rem}.pr-1{padding-right:.25rem}.pr-4{padding-right:1rem}.pt-0{padding-top:0}.pt-0\.5{padding-top:.125rem}.pt-1{padding-top:.25rem}.pt-1\.5{padding-top:.375rem}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.align-top{vertical-align:top}.align-middle{vertical-align:middle}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.font-sans{font-family:Outfit,Inter,sans-serif}.text-2xl{font-size:1.5rem;line-height:2rem}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[8px\]{font-size:8px}.text-\[9px\]{font-size:9px}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.font-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.italic{font-style:italic}.leading-5{line-height:1.25rem}.leading-none{line-height:1}.leading-relaxed{line-height:1.625}.tracking-tight{letter-spacing:-.025em}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.text-blue-600{--tw-text-opacity:1;color:rgba(37,99,235,var(--tw-text-opacity))}.text-blue-700{--tw-text-opacity:1;color:rgba(29,78,216,var(--tw-text-opacity))}.text-orange-600{--tw-text-opacity:1;color:rgba(234,88,12,var(--tw-text-opacity))}.text-red-300{--tw-text-opacity:1;color:rgba(252,165,165,var(--tw-text-opacity))}.text-red-500{--tw-text-opacity:1;color:rgba(239,68,68,var(--tw-text-opacity))}.text-slate-200{--tw-text-opacity:1;color:rgba(226,232,240,var(--tw-text-opacity))}.text-slate-300{--tw-text-opacity:1;color:rgba(203,213,225,var(--tw-text-opacity))}.text-slate-400{--tw-text-opacity:1;color:rgba(148,163,184,var(--tw-text-opacity))}.text-slate-500{--tw-text-opacity:1;color:rgba(100,116,139,var(--tw-text-opacity))}.text-slate-600{--tw-text-opacity:1;color:rgba(71,85,105,var(--tw-text-opacity))}.text-slate-700{--tw-text-opacity:1;color:rgba(51,65,85,var(--tw-text-opacity))}.text-slate-800{--tw-text-opacity:1;color:rgba(30,41,59,var(--tw-text-opacity))}.text-slate-900{--tw-text-opacity:1;color:rgba(15,23,42,var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgba(255,255,255,var(--tw-text-opacity))}.underline{-webkit-text-decoration-line:underline;text-decoration-line:underline}.line-through{-webkit-text-decoration-line:line-through;text-decoration-line:line-through}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.accent-orange-600{accent-color:#ea580c}.accent-slate-800{accent-color:#1e293b}.opacity-0{opacity:0}.shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent), var(--tw-ring-shadow,0 0 transparent), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent), var(--tw-ring-shadow,0 0 transparent), var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent), var(--tw-ring-shadow,0 0 transparent), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent), var(--tw-ring-shadow,0 0 transparent), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px rgba(0,0,0,.1), 0 8px 10px -6px rgba(0,0,0,.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent), var(--tw-ring-shadow,0 0 transparent), var(--tw-shadow)}.shadow-indigo-600\/10{--tw-shadow-color:rgba(79,70,229,.1);--tw-shadow:var(--tw-shadow-colored)}.shadow-orange-600\/10{--tw-shadow-color:rgba(234,88,12,.1);--tw-shadow:var(--tw-shadow-colored)}.shadow-orange-600\/20{--tw-shadow-color:rgba(234,88,12,.2);--tw-shadow:var(--tw-shadow-colored)}.outline-none{outline-offset:2px;outline:2px solid transparent}.ring-2{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow,0 0 transparent)}.ring-orange-500\/10{--tw-ring-color:rgba(249,115,22,.1)}.ring-slate-800{--tw-ring-opacity:1;--tw-ring-color:rgba(30,41,59,var(--tw-ring-opacity))}.filter{-webkit-filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-all{transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-property:color,background-color,border-color,-webkit-text-decoration-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-transform{transition-property:transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-150{transition-duration:.15s}.duration-75{transition-duration:75ms}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#94a3b8}[contenteditable=true]{outline:none}[contenteditable=true]:hover{border-radius:2px;outline:1px dashed rgba(249,115,22,.4)}[contenteditable=true]:focus{border-radius:4px;outline:2px solid #f97316}@keyframes pulse-border{0%,to{border-color:rgba(249,115,22,.3)}50%{border-color:rgba(249,115,22,.8)}}.drag-over{animation:1.5s infinite pulse-border;background-color:#fff7ed!important;border:2px dashed #f97316!important}.glass-panel{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:rgba(255,255,255,.8);border:1px solid rgba(226,232,240,.8)}.canvas-editor-area h1{font-size:2.25em;font-weight:700;line-height:1.2}.canvas-editor-area h2{font-size:1.875em;font-weight:600;line-height:1.25}.canvas-editor-area h3{font-size:1.5em;font-weight:600;line-height:1.3}.canvas-editor-area h4{font-size:1.25em;font-weight:600;line-height:1.4}.canvas-editor-area blockquote{color:#64748b;border-left:4px solid #cbd5e1;padding-left:1em;font-style:italic}.hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:border-gray-200:hover{--tw-border-opacity:1;border-color:rgba(229,231,235,var(--tw-border-opacity))}.hover\:border-slate-200\/60:hover{border-color:rgba(226,232,240,.6)}.hover\:border-slate-400:hover{--tw-border-opacity:1;border-color:rgba(148,163,184,var(--tw-border-opacity))}.hover\:bg-blue-50:hover{--tw-bg-opacity:1;background-color:rgba(239,246,255,var(--tw-bg-opacity))}.hover\:bg-blue-700:hover{--tw-bg-opacity:1;background-color:rgba(29,78,216,var(--tw-bg-opacity))}.hover\:bg-gray-200:hover{--tw-bg-opacity:1;background-color:rgba(229,231,235,var(--tw-bg-opacity))}.hover\:bg-gray-300:hover{--tw-bg-opacity:1;background-color:rgba(209,213,219,var(--tw-bg-opacity))}.hover\:bg-indigo-700:hover{--tw-bg-opacity:1;background-color:rgba(67,56,202,var(--tw-bg-opacity))}.hover\:bg-orange-50\/50:hover{background-color:rgba(255,247,237,.5)}.hover\:bg-orange-700:hover{--tw-bg-opacity:1;background-color:rgba(194,65,12,var(--tw-bg-opacity))}.hover\:bg-red-100:hover{--tw-bg-opacity:1;background-color:rgba(254,226,226,var(--tw-bg-opacity))}.hover\:bg-red-50:hover{--tw-bg-opacity:1;background-color:rgba(254,242,242,var(--tw-bg-opacity))}.hover\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgba(241,245,249,var(--tw-bg-opacity))}.hover\:bg-slate-200:hover{--tw-bg-opacity:1;background-color:rgba(226,232,240,var(--tw-bg-opacity))}.hover\:bg-slate-200\/50:hover{background-color:rgba(226,232,240,.5)}.hover\:bg-slate-50:hover{--tw-bg-opacity:1;background-color:rgba(248,250,252,var(--tw-bg-opacity))}.hover\:bg-slate-50\/20:hover{background-color:rgba(248,250,252,.2)}.hover\:bg-slate-50\/30:hover{background-color:rgba(248,250,252,.3)}.hover\:bg-slate-800:hover{--tw-bg-opacity:1;background-color:rgba(30,41,59,var(--tw-bg-opacity))}.hover\:text-orange-600:hover{--tw-text-opacity:1;color:rgba(234,88,12,var(--tw-text-opacity))}.hover\:text-red-400:hover{--tw-text-opacity:1;color:rgba(248,113,113,var(--tw-text-opacity))}.hover\:text-red-600:hover{--tw-text-opacity:1;color:rgba(220,38,38,var(--tw-text-opacity))}.hover\:text-slate-700:hover{--tw-text-opacity:1;color:rgba(51,65,85,var(--tw-text-opacity))}.hover\:text-slate-800:hover{--tw-text-opacity:1;color:rgba(30,41,59,var(--tw-text-opacity))}.hover\:text-slate-900:hover{--tw-text-opacity:1;color:rgba(15,23,42,var(--tw-text-opacity))}.hover\:text-white:hover{--tw-text-opacity:1;color:rgba(255,255,255,var(--tw-text-opacity))}.hover\:underline:hover{-webkit-text-decoration-line:underline;text-decoration-line:underline}.focus\:border-slate-500:focus{--tw-border-opacity:1;border-color:rgba(100,116,139,var(--tw-border-opacity))}.focus\:bg-slate-100\/50:focus{background-color:rgba(241,245,249,.5)}.focus\:outline-none:focus{outline-offset:2px;outline:2px solid transparent}.active\:cursor-grabbing:active{cursor:grabbing}.disabled\:opacity-30:disabled{opacity:.3}.disabled\:hover\:bg-transparent:hover:disabled{background-color:transparent}@media (min-width:640px){.sm\:flex-row{flex-direction:row}}@media (min-width:1024px){.lg\:w-\[30\%\]{width:30%}.lg\:w-\[70\%\]{width:70%}.lg\:flex-row{flex-direction:row}.lg\:border-b-0{border-bottom-width:0}.lg\:border-l{border-left-width:1px}.lg\:border-r{border-right-width:1px}.lg\:border-t-0{border-top-width:0}}
+*,:before,:after{box-sizing:border-box;border:0 solid #e5e7eb}:before,:after{--tw-content:""}html{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;font-family:Outfit,Inter,sans-serif;line-height:1.5}:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;font-family:Outfit,Inter,sans-serif;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-feature-settings:normal;font-variation-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-feature-settings:inherit;font-variation-settings:inherit;font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button{-webkit-appearance:button;background-color:transparent;background-image:none}[type=button]{-webkit-appearance:button;background-color:transparent;background-image:none}[type=reset]{-webkit-appearance:button;background-color:transparent;background-image:none}[type=submit]{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder{opacity:1;color:#9ca3af}textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::-webkit-input-placeholder{opacity:1;color:#9ca3af}input::-moz-placeholder{opacity:1;color:#9ca3af}input::-ms-input-placeholder{opacity:1;color:#9ca3af}input::placeholder{opacity:1;color:#9ca3af}textarea::-webkit-input-placeholder{opacity:1;color:#9ca3af}textarea::-moz-placeholder{opacity:1;color:#9ca3af}textarea::-ms-input-placeholder{opacity:1;color:#9ca3af}textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}[hidden]{display:none}body{--tw-bg-opacity:1;background-color:rgba(248,250,252,var(--tw-bg-opacity));--tw-text-opacity:1;color:rgba(30,41,59,var(--tw-text-opacity));font-family:Outfit,Inter,sans-serif}*,:before,:after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 transparent;--tw-ring-shadow:0 0 transparent;--tw-shadow:0 0 transparent;--tw-shadow-colored:0 0 transparent;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::-ms-backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 transparent;--tw-ring-shadow:0 0 transparent;--tw-shadow:0 0 transparent;--tw-shadow-colored:0 0 transparent;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 transparent;--tw-ring-shadow:0 0 transparent;--tw-shadow:0 0 transparent;--tw-shadow-colored:0 0 transparent;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.visible{visibility:visible}.collapse{visibility:collapse}.fixed{position:fixed}.\!absolute{position:absolute!important}.absolute{position:absolute}.relative{position:relative}.sticky{position:-webkit-sticky;position:sticky}.\!inset-0{top:0!important;bottom:0!important;left:0!important;right:0!important}.inset-0{top:0;bottom:0;left:0;right:0}.-top-3{top:-.75rem}.-top-3\.5{top:-.875rem}.left-3{left:.75rem}.right-3{right:.75rem}.top-0{top:0}.top-2{top:.5rem}.top-2\.5{top:.625rem}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-50{z-index:50}.\!m-auto{margin:auto!important}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-auto{margin-left:auto;margin-right:auto}.my-1{margin-top:.25rem;margin-bottom:.25rem}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.ml-2{margin-left:.5rem}.ml-4{margin-left:1rem}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mt-0{margin-top:0}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.\!block{display:block!important}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.h-1{height:.25rem}.h-10{height:2.5rem}.h-2{height:.5rem}.h-2\.5{height:.625rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-\[2px\]{height:2px}.h-\[90\%\]{height:90%}.h-fit{height:-moz-fit-content;height:fit-content}.h-full{height:100%}.max-h-\[140px\]{max-height:140px}.max-h-\[180px\]{max-height:180px}.max-h-\[250px\]{max-height:250px}.max-h-\[300px\]{max-height:300px}.min-h-0{min-height:0}.min-h-\[1123px\]{min-height:1123px}.min-h-screen{min-height:100vh}.w-10{width:2.5rem}.w-12{width:3rem}.w-2{width:.5rem}.w-2\.5{width:.625rem}.w-20{width:5rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-7{width:1.75rem}.w-8{width:2rem}.w-\[180px\]{width:180px}.w-\[1px\]{width:1px}.w-\[794px\]{width:794px}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.max-w-\[130px\]{max-width:130px}.max-w-\[900px\]{max-width:900px}.max-w-sm{max-width:24rem}.flex-1{flex:1}.flex-shrink-0,.shrink-0{flex-shrink:0}.border-collapse{border-collapse:collapse}.-translate-x-1\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}.animate-bounce{animation:1s infinite bounce}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:2s cubic-bezier(.4,0,.6,1) infinite pulse}.cursor-default{cursor:default}.cursor-grab{cursor:grab}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.select-all{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}.appearance-none{-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0{gap:0}.gap-0\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.space-x-0>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0px * var(--tw-space-x-reverse));margin-left:calc(0px * calc(1 - var(--tw-space-x-reverse)))}.space-x-0\.5>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.125rem * var(--tw-space-x-reverse));margin-left:calc(.125rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-1\.5>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.375rem * var(--tw-space-x-reverse));margin-left:calc(.375rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-3>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.75rem * var(--tw-space-x-reverse));margin-left:calc(.75rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-4>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1rem * var(--tw-space-x-reverse));margin-left:calc(1rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-0>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0px * var(--tw-space-y-reverse))}.space-y-0\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.125rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.125rem * var(--tw-space-y-reverse))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}.space-y-1\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.375rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.375rem * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.space-y-5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.25rem * var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-x-hidden{overflow-x:hidden}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{overflow-wrap:break-word}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-l-2{border-left-width:2px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-dashed{border-style:dashed}.border-blue-200{--tw-border-opacity:1;border-color:rgba(191,219,254,var(--tw-border-opacity))}.border-blue-300{--tw-border-opacity:1;border-color:rgba(147,197,253,var(--tw-border-opacity))}.border-gray-100{--tw-border-opacity:1;border-color:rgba(243,244,246,var(--tw-border-opacity))}.border-gray-200{--tw-border-opacity:1;border-color:rgba(229,231,235,var(--tw-border-opacity))}.border-gray-300\/80{border-color:rgba(209,213,219,.8)}.border-orange-100{--tw-border-opacity:1;border-color:rgba(255,237,213,var(--tw-border-opacity))}.border-orange-300{--tw-border-opacity:1;border-color:rgba(253,186,116,var(--tw-border-opacity))}.border-orange-500{--tw-border-opacity:1;border-color:rgba(249,115,22,var(--tw-border-opacity))}.border-red-100{--tw-border-opacity:1;border-color:rgba(254,226,226,var(--tw-border-opacity))}.border-red-200{--tw-border-opacity:1;border-color:rgba(254,202,202,var(--tw-border-opacity))}.border-slate-100{--tw-border-opacity:1;border-color:rgba(241,245,249,var(--tw-border-opacity))}.border-slate-200{--tw-border-opacity:1;border-color:rgba(226,232,240,var(--tw-border-opacity))}.border-slate-200\/50{border-color:rgba(226,232,240,.5)}.border-slate-700{--tw-border-opacity:1;border-color:rgba(51,65,85,var(--tw-border-opacity))}.border-slate-800{--tw-border-opacity:1;border-color:rgba(30,41,59,var(--tw-border-opacity))}.border-transparent{border-color:transparent}.bg-blue-100{--tw-bg-opacity:1;background-color:rgba(219,234,254,var(--tw-bg-opacity))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgba(59,130,246,var(--tw-bg-opacity))}.bg-blue-600{--tw-bg-opacity:1;background-color:rgba(37,99,235,var(--tw-bg-opacity))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgba(243,244,246,var(--tw-bg-opacity))}.bg-gray-200{--tw-bg-opacity:1;background-color:rgba(229,231,235,var(--tw-bg-opacity))}.bg-green-500{--tw-bg-opacity:1;background-color:rgba(34,197,94,var(--tw-bg-opacity))}.bg-indigo-600{--tw-bg-opacity:1;background-color:rgba(79,70,229,var(--tw-bg-opacity))}.bg-orange-50{--tw-bg-opacity:1;background-color:rgba(255,247,237,var(--tw-bg-opacity))}.bg-orange-50\/20{background-color:rgba(255,247,237,.2)}.bg-orange-500{--tw-bg-opacity:1;background-color:rgba(249,115,22,var(--tw-bg-opacity))}.bg-orange-600{--tw-bg-opacity:1;background-color:rgba(234,88,12,var(--tw-bg-opacity))}.bg-red-50{--tw-bg-opacity:1;background-color:rgba(254,242,242,var(--tw-bg-opacity))}.bg-red-500{--tw-bg-opacity:1;background-color:rgba(239,68,68,var(--tw-bg-opacity))}.bg-slate-100{--tw-bg-opacity:1;background-color:rgba(241,245,249,var(--tw-bg-opacity))}.bg-slate-100\/80{background-color:rgba(241,245,249,.8)}.bg-slate-200{--tw-bg-opacity:1;background-color:rgba(226,232,240,var(--tw-bg-opacity))}.bg-slate-300{--tw-bg-opacity:1;background-color:rgba(203,213,225,var(--tw-bg-opacity))}.bg-slate-50{--tw-bg-opacity:1;background-color:rgba(248,250,252,var(--tw-bg-opacity))}.bg-slate-50\/10{background-color:rgba(248,250,252,.1)}.bg-slate-50\/20{background-color:rgba(248,250,252,.2)}.bg-slate-50\/30{background-color:rgba(248,250,252,.3)}.bg-slate-50\/5{background-color:rgba(248,250,252,.05)}.bg-slate-50\/50{background-color:rgba(248,250,252,.5)}.bg-slate-700{--tw-bg-opacity:1;background-color:rgba(51,65,85,var(--tw-bg-opacity))}.bg-slate-800{--tw-bg-opacity:1;background-color:rgba(30,41,59,var(--tw-bg-opacity))}.bg-slate-900{--tw-bg-opacity:1;background-color:rgba(15,23,42,var(--tw-bg-opacity))}.bg-slate-950\/65{background-color:rgba(2,6,23,.65)}.bg-white{--tw-bg-opacity:1;background-color:rgba(255,255,255,var(--tw-bg-opacity))}.p-0{padding:0}.p-0\.5{padding:.125rem}.p-1{padding:.25rem}.p-1\.5{padding:.375rem}.p-2{padding:.5rem}.p-2\.5{padding:.625rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-0{padding-left:0;padding-right:0}.px-0\.5{padding-left:.125rem;padding-right:.125rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-\[60px\]{padding-left:60px;padding-right:60px}.py-0{padding-top:0;padding-bottom:0}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-\[60px\]{padding-top:60px;padding-bottom:60px}.pb-2{padding-bottom:.5rem}.pb-3{padding-bottom:.75rem}.pb-6{padding-bottom:1.5rem}.pl-2{padding-left:.5rem}.pl-2\.5{padding-left:.625rem}.pl-9{padding-left:2.25rem}.pr-1{padding-right:.25rem}.pr-4{padding-right:1rem}.pt-0{padding-top:0}.pt-0\.5{padding-top:.125rem}.pt-1{padding-top:.25rem}.pt-1\.5{padding-top:.375rem}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.align-top{vertical-align:top}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.font-sans{font-family:Outfit,Inter,sans-serif}.text-2xl{font-size:1.5rem;line-height:2rem}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[8px\]{font-size:8px}.text-\[9px\]{font-size:9px}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.font-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.italic{font-style:italic}.leading-5{line-height:1.25rem}.leading-relaxed{line-height:1.625}.tracking-tight{letter-spacing:-.025em}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.text-blue-600{--tw-text-opacity:1;color:rgba(37,99,235,var(--tw-text-opacity))}.text-blue-700{--tw-text-opacity:1;color:rgba(29,78,216,var(--tw-text-opacity))}.text-orange-600{--tw-text-opacity:1;color:rgba(234,88,12,var(--tw-text-opacity))}.text-red-300{--tw-text-opacity:1;color:rgba(252,165,165,var(--tw-text-opacity))}.text-red-500{--tw-text-opacity:1;color:rgba(239,68,68,var(--tw-text-opacity))}.text-slate-200{--tw-text-opacity:1;color:rgba(226,232,240,var(--tw-text-opacity))}.text-slate-300{--tw-text-opacity:1;color:rgba(203,213,225,var(--tw-text-opacity))}.text-slate-400{--tw-text-opacity:1;color:rgba(148,163,184,var(--tw-text-opacity))}.text-slate-500{--tw-text-opacity:1;color:rgba(100,116,139,var(--tw-text-opacity))}.text-slate-600{--tw-text-opacity:1;color:rgba(71,85,105,var(--tw-text-opacity))}.text-slate-700{--tw-text-opacity:1;color:rgba(51,65,85,var(--tw-text-opacity))}.text-slate-800{--tw-text-opacity:1;color:rgba(30,41,59,var(--tw-text-opacity))}.text-slate-900{--tw-text-opacity:1;color:rgba(15,23,42,var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgba(255,255,255,var(--tw-text-opacity))}.underline{-webkit-text-decoration-line:underline;text-decoration-line:underline}.line-through{-webkit-text-decoration-line:line-through;text-decoration-line:line-through}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.accent-orange-600{accent-color:#ea580c}.accent-slate-800{accent-color:#1e293b}.opacity-0{opacity:0}.shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent), var(--tw-ring-shadow,0 0 transparent), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent), var(--tw-ring-shadow,0 0 transparent), var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent), var(--tw-ring-shadow,0 0 transparent), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent), var(--tw-ring-shadow,0 0 transparent), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px rgba(0,0,0,.1), 0 8px 10px -6px rgba(0,0,0,.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent), var(--tw-ring-shadow,0 0 transparent), var(--tw-shadow)}.shadow-indigo-600\/10{--tw-shadow-color:rgba(79,70,229,.1);--tw-shadow:var(--tw-shadow-colored)}.shadow-orange-600\/10{--tw-shadow-color:rgba(234,88,12,.1);--tw-shadow:var(--tw-shadow-colored)}.shadow-orange-600\/20{--tw-shadow-color:rgba(234,88,12,.2);--tw-shadow:var(--tw-shadow-colored)}.outline-none{outline-offset:2px;outline:2px solid transparent}.ring-2{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow,0 0 transparent)}.ring-orange-500\/10{--tw-ring-color:rgba(249,115,22,.1)}.ring-slate-800{--tw-ring-opacity:1;--tw-ring-color:rgba(30,41,59,var(--tw-ring-opacity))}.filter{-webkit-filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-all{transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-property:color,background-color,border-color,-webkit-text-decoration-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-transform{transition-property:transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-150{transition-duration:.15s}.duration-75{transition-duration:75ms}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#94a3b8}[contenteditable=true]{outline:none}[contenteditable=true]:hover{border-radius:2px;outline:1px dashed rgba(249,115,22,.4)}[contenteditable=true]:focus{border-radius:4px;outline:2px solid #f97316}@keyframes pulse-border{0%,to{border-color:rgba(249,115,22,.3)}50%{border-color:rgba(249,115,22,.8)}}.drag-over{animation:1.5s infinite pulse-border;background-color:#fff7ed!important;border:2px dashed #f97316!important}.glass-panel{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:rgba(255,255,255,.8);border:1px solid rgba(226,232,240,.8)}.canvas-editor-area h1{font-size:2.25em;font-weight:700;line-height:1.2}.canvas-editor-area h2{font-size:1.875em;font-weight:600;line-height:1.25}.canvas-editor-area h3{font-size:1.5em;font-weight:600;line-height:1.3}.canvas-editor-area h4{font-size:1.25em;font-weight:600;line-height:1.4}.canvas-editor-area blockquote{color:#64748b;border-left:4px solid #cbd5e1;padding-left:1em;font-style:italic}.hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:border-gray-200:hover{--tw-border-opacity:1;border-color:rgba(229,231,235,var(--tw-border-opacity))}.hover\:border-slate-200\/60:hover{border-color:rgba(226,232,240,.6)}.hover\:border-slate-400:hover{--tw-border-opacity:1;border-color:rgba(148,163,184,var(--tw-border-opacity))}.hover\:bg-blue-50:hover{--tw-bg-opacity:1;background-color:rgba(239,246,255,var(--tw-bg-opacity))}.hover\:bg-blue-700:hover{--tw-bg-opacity:1;background-color:rgba(29,78,216,var(--tw-bg-opacity))}.hover\:bg-gray-200:hover{--tw-bg-opacity:1;background-color:rgba(229,231,235,var(--tw-bg-opacity))}.hover\:bg-gray-300:hover{--tw-bg-opacity:1;background-color:rgba(209,213,219,var(--tw-bg-opacity))}.hover\:bg-indigo-700:hover{--tw-bg-opacity:1;background-color:rgba(67,56,202,var(--tw-bg-opacity))}.hover\:bg-orange-50\/50:hover{background-color:rgba(255,247,237,.5)}.hover\:bg-orange-700:hover{--tw-bg-opacity:1;background-color:rgba(194,65,12,var(--tw-bg-opacity))}.hover\:bg-red-100:hover{--tw-bg-opacity:1;background-color:rgba(254,226,226,var(--tw-bg-opacity))}.hover\:bg-red-50:hover{--tw-bg-opacity:1;background-color:rgba(254,242,242,var(--tw-bg-opacity))}.hover\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgba(241,245,249,var(--tw-bg-opacity))}.hover\:bg-slate-200:hover{--tw-bg-opacity:1;background-color:rgba(226,232,240,var(--tw-bg-opacity))}.hover\:bg-slate-50:hover{--tw-bg-opacity:1;background-color:rgba(248,250,252,var(--tw-bg-opacity))}.hover\:bg-slate-50\/20:hover{background-color:rgba(248,250,252,.2)}.hover\:bg-slate-50\/30:hover{background-color:rgba(248,250,252,.3)}.hover\:bg-slate-800:hover{--tw-bg-opacity:1;background-color:rgba(30,41,59,var(--tw-bg-opacity))}.hover\:text-orange-600:hover{--tw-text-opacity:1;color:rgba(234,88,12,var(--tw-text-opacity))}.hover\:text-red-400:hover{--tw-text-opacity:1;color:rgba(248,113,113,var(--tw-text-opacity))}.hover\:text-red-600:hover{--tw-text-opacity:1;color:rgba(220,38,38,var(--tw-text-opacity))}.hover\:text-slate-700:hover{--tw-text-opacity:1;color:rgba(51,65,85,var(--tw-text-opacity))}.hover\:text-slate-800:hover{--tw-text-opacity:1;color:rgba(30,41,59,var(--tw-text-opacity))}.hover\:text-slate-900:hover{--tw-text-opacity:1;color:rgba(15,23,42,var(--tw-text-opacity))}.hover\:text-white:hover{--tw-text-opacity:1;color:rgba(255,255,255,var(--tw-text-opacity))}.hover\:underline:hover{-webkit-text-decoration-line:underline;text-decoration-line:underline}.focus\:border-slate-500:focus{--tw-border-opacity:1;border-color:rgba(100,116,139,var(--tw-border-opacity))}.focus\:bg-slate-100\/50:focus{background-color:rgba(241,245,249,.5)}.focus\:outline-none:focus{outline-offset:2px;outline:2px solid transparent}.active\:cursor-grabbing:active{cursor:grabbing}.disabled\:opacity-30:disabled{opacity:.3}.disabled\:hover\:bg-transparent:hover:disabled{background-color:transparent}@media (min-width:640px){.sm\:flex-row{flex-direction:row}}@media (min-width:1024px){.lg\:w-\[30\%\]{width:30%}.lg\:w-\[70\%\]{width:70%}.lg\:flex-row{flex-direction:row}.lg\:border-b-0{border-bottom-width:0}.lg\:border-l{border-left-width:1px}.lg\:border-r{border-right-width:1px}.lg\:border-t-0{border-top-width:0}}
 /*$vite$:1*/

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-edit-to-html",
-  "version": "1.1.7",
+  "version": "1.1.8",
   "author": "BEO Software (https://beo-software.in/)",
   "homepage": "https://beo-software.in/",
   "license": "SEE LICENSE IN LICENSE",