@superdoc-dev/template-builder 0.1.0 → 0.2.0-next.12

package/README.md

@@ -18,22 +18,19 @@ function TemplateEditor() {
   return (
     <SuperDocTemplateBuilder
       document={{
-        source: "template.docx",
-        mode: "editing"
+        source: 'template.docx',
+        mode: 'editing',
       }}
-      
       fields={{
         available: [
-          { id: 'customer_name', label: 'Customer Name', category: 'Contact' },
-          { id: 'invoice_date', label: 'Invoice Date', category: 'Invoice' },
-          { id: 'amount', label: 'Amount', category: 'Invoice' }
-        ]
+          { id: '1324567890', label: 'Customer Name', category: 'Contact' },
+          { id: '1324567891', label: 'Invoice Date', category: 'Invoice' },
+          { id: '1324567892', label: 'Amount', category: 'Invoice' },
+        ],
       }}
-      
       onTrigger={(event) => {
         console.log('User typed trigger at', event.position);
       }}
-      
       onFieldInsert={(field) => {
         console.log('Field inserted:', field.alias);
       }}
@@ -47,8 +44,8 @@ function TemplateEditor() {
 ```javascript
 {
   fields: [
-    { id: "field_123", alias: "Customer Name", tag: "contact" },
-    { id: "field_124", alias: "Invoice Date", tag: "invoice" }
+    { id: "1324567890", alias: "Customer Name", tag: "contact" },
+    { id: "1324567891", alias: "Invoice Date", tag: "invoice" }
   ],
   document: { /* ProseMirror document JSON */ }
 }
@@ -58,7 +55,7 @@ function TemplateEditor() {
 
 - **🎯 Trigger Detection** - Type `{{` (customizable) to insert fields
 - **📝 Field Management** - Insert, update, delete, and navigate fields
-- **🔍 Field Discovery** - Automatically finds existing fields in documents  
+- **🔍 Field Discovery** - Automatically finds existing fields in documents
 - **🎨 UI Agnostic** - Bring your own menus, panels, and components
 - **📄 SDT Based** - Uses structured content tags for Word compatibility
 - **⚡ Simple API** - Clear callbacks for trigger events and field changes
@@ -74,24 +71,24 @@ function TemplateEditor() {
     source: File | Blob | string,
     mode: 'editing' | 'viewing'
   }}
-  
+
   // Field configuration
   fields={{
     available: FieldDefinition[],  // Fields user can insert
     initial: TemplateField[]       // Pre-existing fields
   }}
-  
+
   // UI components (optional)
   menu={{
     trigger: '{{',                  // Trigger pattern
     component: CustomFieldMenu      // Custom menu component
   }}
-  
+
   list={{
     position: 'left' | 'right',    // Sidebar position
     component: CustomFieldList      // Custom list component
   }}
-  
+
   // Toolbar (optional)
   toolbar={true}                   // Render built-in toolbar container
   // toolbar="#my-toolbar"          // Mount into existing element
@@ -99,7 +96,7 @@ function TemplateEditor() {
   //   toolbarGroups: ['center'],
   //   excludeItems: ['italic', 'bold'],
   // }}
-  
+
   // Event handlers
   onReady={() => {}}
   onTrigger={(event) => {}}
@@ -126,8 +123,8 @@ ref.current.deleteField(fieldId);
 
 // Navigation
 ref.current.selectField(fieldId);
-ref.current.nextField();      // Tab behavior
-ref.current.previousField();  // Shift+Tab behavior
+ref.current.nextField(); // Tab behavior
+ref.current.previousField(); // Shift+Tab behavior
 
 // Get data
 const fields = ref.current.getFields();
@@ -141,10 +138,10 @@ const template = await ref.current.exportTemplate();
 ```jsx
 const CustomFieldMenu = ({ isVisible, position, availableFields, onSelect, onClose }) => {
   if (!isVisible) return null;
-  
+
   return (
     <div style={{ position: 'fixed', left: position?.left, top: position?.top }}>
-      {availableFields.map(field => (
+      {availableFields.map((field) => (
         <button key={field.id} onClick={() => onSelect(field)}>
           {field.label}
         </button>
@@ -162,8 +159,8 @@ const CustomFieldList = ({ fields, onSelect, onDelete, selectedFieldId }) => {
   return (
     <div>
       <h3>Fields ({fields.length})</h3>
-      {fields.map(field => (
-        <div 
+      {fields.map((field) => (
+        <div
           key={field.id}
           onClick={() => onSelect(field)}
           style={{ background: selectedFieldId === field.id ? '#blue' : '#gray' }}
@@ -184,7 +181,7 @@ Enable Tab/Shift+Tab navigation:
 ```jsx
 function TemplateEditor() {
   const ref = useRef();
-  
+
   const handleKeyDown = (e) => {
     if (e.key === 'Tab') {
       e.preventDefault();
@@ -195,7 +192,7 @@ function TemplateEditor() {
       }
     }
   };
-  
+
   return (
     <div onKeyDown={handleKeyDown}>
       <SuperDocTemplateBuilder ref={ref} {...props} />
@@ -206,25 +203,78 @@ function TemplateEditor() {
 
 ## Export Template
 
-Get the complete template data for saving:
+The `exportTemplate` method supports two modes of operation via the `ExportConfig` interface:
+
+### 1. Download Mode (Default)
+
+Automatically downloads the template as a file in the browser:
+
+```jsx
+const handleDownload = async () => {
+  // Download with default filename "document.docx"
+  await ref.current?.exportTemplate();
+
+  // Or with custom filename
+  await ref.current?.exportTemplate({
+    fileName: 'invoice-template.docx',
+  });
+};
+```
+
+### 2. Blob Mode (for Database/API)
+
+Get the template as a Blob for saving to your database or API:
 
 ```jsx
 const handleSave = async () => {
-  await ref.current?.exportTemplate({ fileName: 'invoice.docx' });
+  // Get the blob without triggering download
+  const blob = await ref.current?.exportTemplate({
+    fileName: 'invoice-template.docx',
+    triggerDownload: false,
+  });
+
+  if (blob) {
+    // Send to your API/database
+    const formData = new FormData();
+    formData.append('template', blob, 'invoice-template.docx');
+
+    await fetch('/api/templates', {
+      method: 'POST',
+      body: formData,
+    });
+  }
 };
 ```
 
+### ExportConfig Interface
+
+```typescript
+interface ExportConfig {
+  fileName?: string;         // Default: "document"
+  triggerDownload?: boolean; // Default: true
+}
+
+// Method signature
+exportTemplate(config?: ExportConfig): Promise<void | Blob>
+```
+
+**Return value:**
+
+- `Promise<void>` when `triggerDownload: true` (download happens automatically)
+- `Promise<Blob>` when `triggerDownload: false` (returns the docx data)
+
 ## TypeScript
 
 Full TypeScript support included:
 
 ```typescript
 import SuperDocTemplateBuilder from '@superdoc-dev/template-builder';
-import type { 
+import type {
   TemplateField,
   FieldDefinition,
   TriggerEvent,
-  SuperDocTemplateBuilderHandle 
+  ExportConfig,
+  SuperDocTemplateBuilderHandle,
 } from '@superdoc-dev/template-builder';
 
 const ref = useRef<SuperDocTemplateBuilderHandle>(null);
@@ -232,4 +282,4 @@ const ref = useRef<SuperDocTemplateBuilderHandle>(null);
 
 ## License
 
-MIT
+AGPLv3

package/dist/defaults/FieldList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldList.d.ts","sourceRoot":"","sources":["../../src/defaults/FieldList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE/C,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAsI9C,CAAC"}
+{"version":3,"file":"FieldList.d.ts","sourceRoot":"","sources":["../../src/defaults/FieldList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,KAAK,EAAE,cAAc,EAAiB,MAAM,UAAU,CAAC;AA0H9D,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAoJ9C,CAAC"}

package/dist/defaults/FieldMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldMenu.d.ts","sourceRoot":"","sources":["../../src/defaults/FieldMenu.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,cAAc,EAAE,MAAM,UAAU,CAAC;AAEhE,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA8U9C,CAAC"}
+{"version":3,"file":"FieldMenu.d.ts","sourceRoot":"","sources":["../../src/defaults/FieldMenu.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,cAAc,EAAE,MAAM,UAAU,CAAC;AAEhE,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA8b9C,CAAC"}

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import { FieldMenu, FieldList } from './defaults';
-import type * as Types from "./types";
+import type * as Types from './types';
 export * from './types';
 export { FieldMenu, FieldList };
 declare const SuperDocTemplateBuilder: import('react').ForwardRefExoticComponent<Types.SuperDocTemplateBuilderProps & import('react').RefAttributes<Types.SuperDocTemplateBuilderHandle>>;

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,KAAK,KAAK,MAAM,SAAS,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAElD,cAAc,SAAS,CAAC;AACxB,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC;AAsFhC,QAAA,MAAM,uBAAuB,oJAmjB3B,CAAC;AAIH,eAAe,uBAAuB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,SAAS,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAElD,cAAc,SAAS,CAAC;AACxB,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC;AAoGhC,QAAA,MAAM,uBAAuB,oJAolB3B,CAAC;AAIH,eAAe,uBAAuB,CAAC"}

package/dist/index.js

@@ -1,22 +1 @@
-"use strict";var Oe=Object.create;var xe=Object.defineProperty;var Pe=Object.getOwnPropertyDescriptor;var Ae=Object.getOwnPropertyNames;var Ie=Object.getPrototypeOf,Me=Object.prototype.hasOwnProperty;var De=(s,d,f,u)=>{if(d&&typeof d=="object"||typeof d=="function")for(let r of Ae(d))!Me.call(s,r)&&r!==f&&xe(s,r,{get:()=>d[r],enumerable:!(u=Pe(d,r))||u.enumerable});return s};var Le=(s,d,f)=>(f=s!=null?Oe(Ie(s)):{},De(d||!s||!s.__esModule?xe(f,"default",{value:s,enumerable:!0}):f,s));Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react");var ie={exports:{}},ne={};/**
- * @license React
- * react-jsx-runtime.production.js
- *
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */var ge;function Be(){if(ge)return ne;ge=1;var s=Symbol.for("react.transitional.element"),d=Symbol.for("react.fragment");function f(u,r,l){var F=null;if(l!==void 0&&(F=""+l),r.key!==void 0&&(F=""+r.key),"key"in r){l={};for(var I in r)I!=="key"&&(l[I]=r[I])}else l=r;return r=l.ref,{$$typeof:s,type:u,key:F,ref:r!==void 0?r:null,props:l}}return ne.Fragment=d,ne.jsx=f,ne.jsxs=f,ne}var oe={};/**
- * @license React
- * react-jsx-runtime.development.js
- *
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */var be;function $e(){return be||(be=1,process.env.NODE_ENV!=="production"&&(function(){function s(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===le?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case O:return"Fragment";case E:return"Profiler";case Q:return"StrictMode";case b:return"Suspense";case C:return"SuspenseList";case D:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case U:return"Portal";case A:return e.displayName||"Context";case V:return(e._context.displayName||"Context")+".Consumer";case c:var a=e.render;return e=e.displayName,e||(e=a.displayName||a.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case T:return a=e.displayName||null,a!==null?a:s(e.type)||"Memo";case S:a=e._payload,e=e._init;try{return s(e(a))}catch{}}return null}function d(e){return""+e}function f(e){try{d(e);var a=!1}catch{a=!0}if(a){a=console;var x=a.error,p=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return x.call(a,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",p),d(e)}}function u(e){if(e===O)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===S)return"<...>";try{var a=s(e);return a?"<"+a+">":"<...>"}catch{return"<...>"}}function r(){var e=Z.A;return e===null?null:e.getOwner()}function l(){return Error("react-stack-top-frame")}function F(e){if(se.call(e,"key")){var a=Object.getOwnPropertyDescriptor(e,"key").get;if(a&&a.isReactWarning)return!1}return e.key!==void 0}function I(e,a){function x(){L||(L=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",a))}x.isReactWarning=!0,Object.defineProperty(e,"key",{get:x,configurable:!0})}function z(){var e=s(this.type);return ee[e]||(ee[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function H(e,a,x,p,$,re){var h=x.ref;return e={$$typeof:M,type:e,key:a,props:x,_owner:p},(h!==void 0?h:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:z}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:$}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:re}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function P(e,a,x,p,$,re){var h=a.children;if(h!==void 0)if(p)if(K(h)){for(p=0;p<h.length;p++)N(h[p]);Object.freeze&&Object.freeze(h)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else N(h);if(se.call(a,"key")){h=s(e);var j=Object.keys(a).filter(function(ce){return ce!=="key"});p=0<j.length?"{key: someKey, "+j.join(": ..., ")+": ...}":"{key: someKey}",q[h+p]||(j=0<j.length?"{"+j.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
-  let props = %s;
-  <%s {...props} />
-React keys must be passed directly to JSX without using spread:
-  let props = %s;
-  <%s key={someKey} {...props} />`,p,h,j,h),q[h+p]=!0)}if(h=null,x!==void 0&&(f(x),h=""+x),F(a)&&(f(a.key),h=""+a.key),"key"in a){x={};for(var J in a)J!=="key"&&(x[J]=a[J])}else x=a;return h&&I(x,typeof e=="function"?e.displayName||e.name||"Unknown":e),H(e,h,x,r(),$,re)}function N(e){k(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===S&&(e._payload.status==="fulfilled"?k(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function k(e){return typeof e=="object"&&e!==null&&e.$$typeof===M}var Y=i,M=Symbol.for("react.transitional.element"),U=Symbol.for("react.portal"),O=Symbol.for("react.fragment"),Q=Symbol.for("react.strict_mode"),E=Symbol.for("react.profiler"),V=Symbol.for("react.consumer"),A=Symbol.for("react.context"),c=Symbol.for("react.forward_ref"),b=Symbol.for("react.suspense"),C=Symbol.for("react.suspense_list"),T=Symbol.for("react.memo"),S=Symbol.for("react.lazy"),D=Symbol.for("react.activity"),le=Symbol.for("react.client.reference"),Z=Y.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,se=Object.prototype.hasOwnProperty,K=Array.isArray,R=console.createTask?console.createTask:function(){return null};Y={react_stack_bottom_frame:function(e){return e()}};var L,ee={},B=Y.react_stack_bottom_frame.bind(Y,l)(),te=R(u(l)),q={};oe.Fragment=O,oe.jsx=function(e,a,x){var p=1e4>Z.recentlyCreatedOwnerStacks++;return P(e,a,x,!1,p?Error("react-stack-top-frame"):B,p?R(u(e)):te)},oe.jsxs=function(e,a,x){var p=1e4>Z.recentlyCreatedOwnerStacks++;return P(e,a,x,!0,p?Error("react-stack-top-frame"):B,p?R(u(e)):te)}})()),oe}var he;function We(){return he||(he=1,process.env.NODE_ENV==="production"?ie.exports=Be():ie.exports=$e()),ie.exports}var o=We();const Ee=({isVisible:s,position:d,availableFields:f,filteredFields:u,filterQuery:r,allowCreate:l,onSelect:F,onClose:I,onCreateField:z})=>{const[H,P]=i.useState(!1),[N,k]=i.useState("");i.useEffect(()=>{s||(P(!1),k(""))},[s]);const Y=i.useMemo(()=>({position:"absolute",left:d?.left,top:d?.top,zIndex:1e3,background:"white",border:"1px solid #ddd",borderRadius:"4px",boxShadow:"0 2px 8px rgba(0,0,0,0.1)",padding:"8px 0",minWidth:"200px"}),[d]),M=u??f,U=!!r,O=i.useMemo(()=>{const c=[],b=new Map;return M.forEach(C=>{const T=C.category?.trim()||"Uncategorized",S=b.get(T);if(S!==void 0){c[S].fields.push(C);return}b.set(T,c.length),c.push({category:T,fields:[C]})}),c},[M]),[Q,E]=i.useState({});i.useEffect(()=>{E(c=>{if(O.length===0)return Object.keys(c).length===0?c:{};const b={};let C=Object.keys(c).length!==O.length;return O.forEach(({category:T},S)=>{const D=U?!0:c[T]??S===0;b[T]=D,!C&&c[T]!==D&&(C=!0)}),C?b:c})},[O,U]);const V=i.useCallback(c=>{E(b=>({...b,[c]:!b[c]}))},[]);if(!s)return null;const A=async()=>{const c=N.trim();if(!c)return;const b={id:`custom_${Date.now()}`,label:c,category:"Custom"};try{if(z){const C=await z(b);F(C||b)}else F(b)}finally{P(!1),k("")}};return o.jsxs("div",{className:"superdoc-field-menu",style:Y,children:[U&&o.jsx("div",{style:{padding:"8px 16px",borderBottom:"1px solid #f0f0f0",marginBottom:"4px"},children:o.jsxs("div",{style:{fontSize:"12px",color:"#6b7280"},children:["Filtering results for",o.jsx("span",{style:{fontWeight:600,color:"#111827",marginLeft:"4px"},children:r})]})}),l&&!H&&o.jsx("div",{className:"field-menu-item",onClick:()=>P(!0),style:{padding:"8px 16px",cursor:"pointer",color:"#0066cc",fontWeight:500},children:"+ Create New Field"}),l&&H&&o.jsxs("div",{style:{padding:"8px 16px"},children:[o.jsx("input",{type:"text",value:N,placeholder:"Field name...",onChange:c=>k(c.target.value),onKeyDown:c=>{c.key==="Enter"&&A(),c.key==="Escape"&&(P(!1),k(""))},autoFocus:!0,style:{width:"100%",padding:"4px 8px",border:"1px solid #ddd",borderRadius:"3px"}}),o.jsxs("div",{style:{marginTop:"8px",display:"flex",gap:"8px"},children:[o.jsx("button",{onClick:A,disabled:!N.trim(),style:{padding:"4px 12px",background:N.trim()?"#0066cc":"#ccc",color:"white",border:"none",borderRadius:"3px",cursor:N.trim()?"pointer":"not-allowed"},children:"Create"}),o.jsx("button",{onClick:()=>{P(!1),k("")},style:{padding:"4px 12px",background:"white",border:"1px solid #ddd",borderRadius:"3px",cursor:"pointer"},children:"Cancel"})]})]}),l&&f.length>0&&o.jsx("div",{style:{borderTop:"1px solid #eee",margin:"4px 0"}}),O.length===0?o.jsx("div",{style:{padding:"16px",fontSize:"13px",color:"#6b7280",textAlign:"center"},children:"No matching fields"}):O.map(({category:c,fields:b},C)=>{const T=!!Q[c],S=`${Math.max(b.length*40,0)}px`;return o.jsxs("div",{style:{borderTop:C===0&&l?void 0:"1px solid #f0f0f0"},children:[o.jsxs("button",{type:"button",onClick:()=>V(c),style:{width:"100%",display:"flex",alignItems:"center",justifyContent:"space-between",padding:"8px 16px",background:"transparent",border:"none",cursor:"pointer",fontWeight:500,textAlign:"left"},children:[o.jsxs("span",{children:[c," (",b.length,")"]}),o.jsx("span",{"aria-hidden":!0,style:{display:"inline-block",width:"8px",height:"8px",borderRight:"2px solid #666",borderBottom:"2px solid #666",transform:T?"rotate(45deg)":"rotate(-45deg)",transition:"transform 0.2s ease",marginLeft:"12px"}})]}),o.jsx("div",{"data-category":c,"aria-hidden":!T,style:{overflow:"hidden",maxHeight:T?S:"0px",opacity:T?1:0,transition:"max-height 0.2s ease, opacity 0.2s ease",pointerEvents:T?"auto":"none"},children:o.jsx("div",{style:{padding:T?"4px 0":0},children:b.map(D=>o.jsx("div",{className:"field-menu-item",onClick:()=>F(D),style:{padding:"8px 16px",cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"space-between"},children:o.jsx("span",{style:{fontWeight:500},children:D.label})},D.id))})})]},c)}),o.jsx("div",{style:{borderTop:"1px solid #eee",marginTop:"4px"},children:o.jsx("button",{onClick:I,style:{width:"100%",padding:"6px 16px",background:"#f3f4f6",border:"none",borderRadius:"0 0 4px 4px",cursor:"pointer"},children:"Close"})})]})},Ce=({fields:s,onSelect:d,onDelete:f,selectedFieldId:u})=>o.jsxs("div",{className:"superdoc-field-list",style:{width:"250px",background:"white",border:"1px solid #e5e7eb",borderRadius:"8px",padding:"16px"},children:[o.jsxs("h3",{style:{margin:"0 0 16px 0",fontSize:"16px",fontWeight:"600"},children:["Template Fields (",s.length,")"]}),s.length===0?o.jsxs("div",{style:{color:"#9ca3af",fontSize:"14px",textAlign:"center",padding:"20px 0"},children:["No fields yet. Type ","{{"," to add a field."]}):o.jsx("div",{style:{display:"flex",flexDirection:"column",gap:"8px"},children:s.map(r=>o.jsxs("div",{onClick:()=>d(r),style:{position:"relative",padding:"12px",background:u===r.id?"#eff6ff":"#f9fafb",border:u===r.id?"1px solid #3b82f6":"1px solid #e5e7eb",borderRadius:"6px",cursor:"pointer",transition:"all 0.2s"},onMouseEnter:l=>{u!==r.id&&(l.currentTarget.style.background="#f3f4f6")},onMouseLeave:l=>{u!==r.id&&(l.currentTarget.style.background="#f9fafb")},title:r.alias,children:[o.jsx("button",{onClick:l=>{l.stopPropagation(),f(r.id)},style:{position:"absolute",top:"8px",right:"8px",padding:"4px",background:"transparent",border:"none",cursor:"pointer",color:"#9ca3af",transition:"color 0.2s",display:"flex",alignItems:"center",justifyContent:"center"},onMouseEnter:l=>{l.currentTarget.style.color="#ef4444"},onMouseLeave:l=>{l.currentTarget.style.color="#9ca3af"},title:"Delete field",children:o.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:o.jsx("path",{d:"M6 2V1.5C6 1.22386 6.22386 1 6.5 1H9.5C9.77614 1 10 1.22386 10 1.5V2M2 4H14M12.6667 4L12.1991 11.0129C12.129 12.065 12.0939 12.5911 11.8667 12.99C11.6666 13.3412 11.3648 13.6235 11.0011 13.7998C10.588 14 10.0607 14 9.00623 14H6.99377C5.93927 14 5.41202 14 4.99889 13.7998C4.63517 13.6235 4.33339 13.3412 4.13332 12.99C3.90607 12.5911 3.871 12.065 3.80086 11.0129L3.33333 4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}),o.jsxs("div",{style:{paddingRight:"24px"},children:[o.jsx("div",{style:{fontWeight:"500",fontSize:"14px",marginBottom:r.alias&&r.alias!==r.id?"4px":"0"},children:r.id}),r.alias&&r.alias!==r.id&&o.jsx("div",{style:{fontSize:"12px",color:"#4b5563"},children:r.alias})]})]},r.id))})]}),ye=s=>{const d=s.helpers?.structuredContentCommands;return d?.getStructuredContentTags?(d.getStructuredContentTags(s.state)||[]).map(u=>{const l=(u?.node??u)?.attrs??{};return{id:l.id,alias:l.alias||l.label||"",tag:l.tag}}).filter(u=>!!u.id):[]},ve=(s,d)=>{if(s===d)return!0;if(s.length!==d.length)return!1;for(let f=0;f<s.length;f+=1){const u=s[f],r=d[f];if(!r||u.id!==r.id||u.alias!==r.alias||u.tag!==r.tag||u.position!==r.position)return!1}return!0},Ye=s=>{if(!s)return null;if(s===!0)return{selector:"#superdoc-toolbar",config:{},renderDefaultContainer:!0};if(typeof s=="string")return{selector:s,config:{},renderDefaultContainer:!1};const{selector:d,...f}=s;return{selector:d||"#superdoc-toolbar",config:f,renderDefaultContainer:d===void 0}},Re=i.forwardRef((s,d)=>{const{document:f,fields:u={},menu:r={},list:l={},toolbar:F,onReady:I,onTrigger:z,onFieldInsert:H,onFieldUpdate:P,onFieldDelete:N,onFieldsChange:k,onFieldSelect:Y,onFieldCreate:M,className:U,style:O,documentHeight:Q="600px"}=s,[E,V]=i.useState(u.initial||[]),[A,c]=i.useState(null),[b,C]=i.useState(!1),[T,S]=i.useState(),[D,le]=i.useState(""),[Z,se]=i.useState(()=>u.available||[]),K=i.useRef(null),R=i.useRef(null),L=i.useRef(null),ee=i.useRef(u);ee.current=u;const B=i.useRef(null),te=i.useRef(b);i.useEffect(()=>{te.current=b},[b]);const q=r.trigger||"{{",e=ee.current.available||[],a=i.useCallback(t=>{const n=t.trim().toLowerCase();return n?e.filter(y=>{const v=y.label.toLowerCase(),_=y.category?.toLowerCase()||"";return v.includes(n)||_.includes(n)}):e},[e]),x=i.useCallback(t=>{le(t),se(a(t))},[a]),p=i.useCallback(()=>{x("")},[x]),$=i.useCallback((t,n)=>{if(!R.current?.activeEditor)return!1;const y=R.current.activeEditor,v=`field_${Date.now()}`,_=t==="inline"?y.commands.insertStructuredContentInline?.({attrs:{id:v,alias:n.alias,tag:n.metadata?JSON.stringify(n.metadata):n.category},text:n.defaultValue||n.alias}):y.commands.insertStructuredContentBlock?.({attrs:{id:v,alias:n.alias,tag:n.metadata?JSON.stringify(n.metadata):n.category},text:n.defaultValue||n.alias});if(_){const w={id:v,alias:n.alias,tag:n.category};V(g=>{const m=[...g,w];return k?.(m),m}),H?.(w)}return _},[H,k]),re=i.useCallback((t,n)=>{if(!R.current?.activeEditor)return!1;const v=R.current.activeEditor.commands.updateStructuredContentById?.(t,{attrs:n});return v&&V(_=>{const w=_.map(m=>m.id===t?{...m,...n}:m);k?.(w);const g=w.find(m=>m.id===t);return g&&P?.(g),w}),v},[P,k]),h=i.useCallback(t=>{const n=R.current?.activeEditor;if(!n){console.warn("[SuperDocTemplateBuilder] deleteField called without active editor");let g=!1;return V(m=>{if(!m.some(W=>W.id===t))return m;const X=m.filter(W=>W.id!==t);return g=!0,k?.(X),X}),g&&(N?.(t),c(m=>m===t?null:m)),g}let y=!1;try{y=n.commands.deleteStructuredContentById?.(t)??!1}catch(g){console.error("[SuperDocTemplateBuilder] Delete command failed:",g)}let v=ye(n);const _=v.some(g=>g.id===t);!y&&_&&(v=v.filter(g=>g.id!==t));let w=!1;return V(g=>{if(ve(g,v))return g;const m=g.some(W=>W.id===t),X=v.some(W=>W.id===t);return m&&!X&&(w=!0),k?.(v),v}),w&&(N?.(t),c(g=>g===t?null:g)),y||w},[N,k]),j=i.useCallback(t=>{if(!R.current?.activeEditor)return;R.current.activeEditor.commands.selectStructuredContentById?.(t),c(t);const y=E.find(v=>v.id===t);y&&Y?.(y)},[E,Y]),J=i.useCallback(t=>{if(!t)return;const n=ye(t);V(y=>ve(y,n)?y:(k?.(n),n))},[k]);i.useEffect(()=>K.current?((async()=>{const{SuperDoc:n}=await import("superdoc"),y={selector:K.current,document:f?.source,documentMode:f?.mode||"editing",onReady:()=>{if(v.activeEditor){const _=v.activeEditor;_.on("update",({editor:w})=>{const{state:g}=w,{from:m}=g.selection;if(m>=q.length){const ue=m-q.length;if(g.doc.textBetween(ue,m)===q){const fe=w.view.coordsAtPos(m),pe=new DOMRect(fe.left,fe.top,0,0),me=()=>{const ae=R.current?.activeEditor;if(!ae)return;const Fe=ae.state.selection.from,Ne=ae.state.tr.delete(ue,Fe);ae.view.dispatch(Ne)};L.current=me,B.current=m,S(pe),C(!0),p(),z?.({position:{from:ue,to:m},bounds:pe,cleanup:me});return}}if(!te.current)return;if(B.current==null){C(!1),p();return}if(m<B.current){C(!1),B.current=null,p();return}const X=g.doc.textBetween(B.current,m);x(X);const W=w.view.coordsAtPos(m),_e=new DOMRect(W.left,W.top,0,0);S(_e)}),_.on("update",()=>{J(_)}),J(_)}I?.()}},v=new n({...y,...G&&{toolbar:G.selector,modules:{toolbar:{selector:G.selector,toolbarGroups:G.config.toolbarGroups||["center"],excludeItems:G.config.excludeItems||[],...G.config}}}});R.current=v})(),()=>{R.current&&(typeof R.current.destroy=="function"&&R.current.destroy(),R.current=null)}):void 0,[f?.source,f?.mode,q,J,I,z,F]);const ce=i.useCallback(async t=>{if(L.current&&(L.current(),L.current=null),B.current=null,p(),t.id.startsWith("custom_")&&M)try{const n=await M(t);if(n){$("inline",{alias:n.label,category:n.category,metadata:n.metadata,defaultValue:n.defaultValue}),C(!1);return}}catch(n){console.error("Field creation failed:",n)}$("inline",{alias:t.label,category:t.category,metadata:t.metadata,defaultValue:t.defaultValue}),C(!1)},[$,M,p]),ke=i.useCallback(()=>{C(!1),B.current=null,p(),L.current&&(L.current(),L.current=null)},[p]),Te=i.useCallback(()=>{if(!R.current?.activeEditor||E.length===0)return;const t=E.findIndex(y=>y.id===A),n=t>=0?(t+1)%E.length:0;j(E[n].id)},[E,A,j]),je=i.useCallback(()=>{if(!R.current?.activeEditor||E.length===0)return;const t=E.findIndex(y=>y.id===A),n=t>0?t-1:E.length-1;j(E[n].id)},[E,A,j]),we=i.useCallback(async t=>{try{await R.current?.export({exportType:["docx"],exportedName:t?.fileName?t?.fileName:"document"})}catch(n){throw console.error("Failed to export DOCX",n),n}},[]);i.useImperativeHandle(d,()=>({insertField:t=>$("inline",t),insertBlockField:t=>$("block",t),updateField:re,deleteField:h,selectField:j,nextField:Te,previousField:je,getFields:()=>E,exportTemplate:we}));const Se=r.component||Ee,de=l.component||Ce,G=Ye(F);return o.jsxs("div",{className:`superdoc-template-builder ${U||""}`,style:O,children:[o.jsxs("div",{style:{display:"flex",gap:"20px"},children:[l.position==="left"&&o.jsx("div",{className:"superdoc-template-builder-sidebar",children:o.jsx(de,{fields:E,onSelect:t=>j(t.id),onDelete:h,selectedFieldId:A||void 0})}),o.jsxs("div",{className:"superdoc-template-builder-document",style:{flex:1},children:[G?.renderDefaultContainer&&o.jsx("div",{id:"superdoc-toolbar",className:"superdoc-template-builder-toolbar","data-testid":"template-builder-toolbar"}),o.jsx("div",{ref:K,className:"superdoc-template-builder-editor",style:{height:Q},"data-testid":"template-builder-editor"})]}),l.position==="right"&&o.jsx("div",{className:"superdoc-template-builder-sidebar",children:o.jsx(de,{fields:E,onSelect:t=>j(t.id),onDelete:h,selectedFieldId:A||void 0})})]}),o.jsx(Se,{isVisible:b,position:T,availableFields:u.available||[],filteredFields:Z,filterQuery:D,allowCreate:u.allowCreate||!1,onSelect:ce,onClose:ke,onCreateField:M})]})});Re.displayName="SuperDocTemplateBuilder";exports.FieldList=Ce;exports.FieldMenu=Ee;exports.default=Re;
+"use strict";var De=Object.create;var ge=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var ze=Object.getOwnPropertyNames;var Be=Object.getPrototypeOf,We=Object.prototype.hasOwnProperty;var Le=(n,o,c,i)=>{if(o&&typeof o=="object"||typeof o=="function")for(let d of ze(o))!We.call(n,d)&&d!==c&&ge(n,d,{get:()=>o[d],enumerable:!(i=Ne(o,d))||i.enumerable});return n};var He=(n,o,c)=>(c=n!=null?De(Be(n)):{},Le(o||!n||!n.__esModule?ge(c,"default",{value:n,enumerable:!0}):c,n));Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),r=require("react"),ye=({isVisible:n,position:o,availableFields:c,filteredFields:i,filterQuery:d,allowCreate:u,onSelect:I,onClose:W,onCreateField:A,existingFields:f=[],onSelectExisting:S})=>{const[g,y]=r.useState(!1),[k,E]=r.useState(""),[$,L]=r.useState("inline"),[q,te]=r.useState(!0),[x,R]=r.useState(!0);r.useEffect(()=>{n||(y(!1),E(""),L("inline"))},[n]);const H=r.useMemo(()=>({position:"absolute",left:o?.left,top:o?.top,zIndex:1e3,background:"white",border:"1px solid #ddd",borderRadius:"4px",boxShadow:"0 2px 8px rgba(0,0,0,0.1)",padding:"8px 0",width:"280px"}),[o]),V=i??c,P=!!d;if(r.useEffect(()=>{P&&R(!0)},[P]),!n)return null;const M=async()=>{const m=k.trim();if(!m)return;const D={id:`custom_${Date.now()}`,label:m,mode:$};try{if(A){const h=await A(D);I(h||D)}else I(D)}finally{y(!1),E(""),L("inline")}};return e.jsxs("div",{className:"superdoc-field-menu",style:H,children:[P&&e.jsx("div",{style:{padding:"8px 16px",borderBottom:"1px solid #f0f0f0",marginBottom:"4px"},children:e.jsxs("div",{style:{fontSize:"12px",color:"#6b7280"},children:["Filtering results for",e.jsx("span",{style:{fontWeight:600,color:"#111827",marginLeft:"4px"},children:d})]})}),u&&!g&&e.jsx("div",{className:"field-menu-item",onClick:()=>y(!0),style:{padding:"8px 16px",cursor:"pointer",color:"#0066cc",fontWeight:500},children:"+ Create New Field"}),u&&g&&e.jsxs("div",{style:{padding:"8px 16px"},children:[e.jsx("input",{type:"text",value:k,placeholder:"Field name...",onChange:m=>E(m.target.value),onKeyDown:m=>{m.key==="Enter"&&M(),m.key==="Escape"&&(y(!1),E(""),L("inline"))},autoFocus:!0,style:{width:"100%",padding:"4px 8px",border:"1px solid #ddd",borderRadius:"3px"}}),e.jsxs("div",{style:{marginTop:"8px",display:"flex",gap:"12px",fontSize:"13px"},children:[e.jsxs("label",{style:{display:"flex",alignItems:"center",gap:"4px",cursor:"pointer"},children:[e.jsx("input",{type:"radio",value:"inline",checked:$==="inline",onChange:()=>L("inline")}),"Inline"]}),e.jsxs("label",{style:{display:"flex",alignItems:"center",gap:"4px",cursor:"pointer"},children:[e.jsx("input",{type:"radio",value:"block",checked:$==="block",onChange:()=>L("block")}),"Block"]})]}),e.jsxs("div",{style:{marginTop:"8px",display:"flex",gap:"8px"},children:[e.jsx("button",{onClick:M,disabled:!k.trim(),style:{padding:"4px 12px",background:k.trim()?"#0066cc":"#ccc",color:"white",border:"none",borderRadius:"3px",cursor:k.trim()?"pointer":"not-allowed"},children:"Create"}),e.jsx("button",{onClick:()=>{y(!1),E(""),L("inline")},style:{padding:"4px 12px",background:"white",border:"1px solid #ddd",borderRadius:"3px",cursor:"pointer"},children:"Cancel"})]})]}),u&&c.length>0&&e.jsx("div",{style:{borderTop:"1px solid #eee",margin:"4px 0"}}),f.length>0&&(()=>{const m=new Map;f.forEach(h=>{const J=h.group||`individual-${h.id}`,Y=m.get(J)||[];Y.push(h),m.set(J,Y)});const D=Array.from(m.values()).map(h=>({...h[0],count:h.length}));return e.jsxs("div",{style:{borderBottom:"1px solid #f0f0f0"},children:[e.jsxs("button",{type:"button",onClick:()=>te(!q),style:{width:"100%",display:"flex",alignItems:"center",justifyContent:"space-between",padding:"8px 16px",background:"transparent",border:"none",cursor:"pointer",fontWeight:500,fontSize:"13px",color:"#374151",textAlign:"left"},children:[e.jsxs("span",{children:["Existing Fields (",D.length,")"]}),e.jsx("span",{"aria-hidden":!0,style:{display:"inline-block",width:"8px",height:"8px",borderRight:"2px solid #666",borderBottom:"2px solid #666",transform:q?"rotate(45deg)":"rotate(-45deg)",transition:"transform 0.2s ease"}})]}),q&&e.jsx("div",{style:{maxHeight:"300px",overflowY:"auto"},children:D.map(h=>e.jsxs("div",{className:"field-menu-item",onClick:()=>S?.(h),style:{padding:"8px 16px",cursor:"pointer",display:"flex",alignItems:"flex-start",justifyContent:"space-between",gap:"8px"},children:[e.jsxs("div",{style:{flex:1,minWidth:0},children:[e.jsx("div",{style:{fontWeight:500,fontSize:"13px"},children:h.alias||h.id}),e.jsx("div",{style:{fontSize:"11px",color:"#9ca3af",marginTop:"2px"},children:h.group?`group (${h.count} fields)`:`ID: ${h.id}`})]}),e.jsx("span",{style:{fontSize:"11px",color:"#6b7280",padding:"2px 6px",background:"#f3f4f6",borderRadius:"3px",textTransform:"capitalize",flexShrink:0},children:h.mode||"inline"})]},h.group||h.id))})]})})(),V.length===0?e.jsx("div",{style:{padding:"16px",fontSize:"13px",color:"#6b7280",textAlign:"center"},children:"No matching fields"}):e.jsxs("div",{style:{borderBottom:"1px solid #f0f0f0"},children:[e.jsxs("button",{type:"button",onClick:()=>R(!x),style:{width:"100%",display:"flex",alignItems:"center",justifyContent:"space-between",padding:"8px 16px",background:"transparent",border:"none",cursor:"pointer",fontWeight:500,fontSize:"13px",color:"#374151",textAlign:"left"},children:[e.jsxs("span",{children:["Available Fields (",V.length,")"]}),e.jsx("span",{"aria-hidden":!0,style:{display:"inline-block",width:"8px",height:"8px",borderRight:"2px solid #666",borderBottom:"2px solid #666",transform:x?"rotate(45deg)":"rotate(-45deg)",transition:"transform 0.2s ease"}})]}),x&&e.jsx("div",{style:{maxHeight:"300px",overflowY:"auto"},children:V.map(m=>e.jsxs("div",{className:"field-menu-item",onClick:()=>I(m),style:{padding:"8px 16px",cursor:"pointer",display:"flex",alignItems:"flex-start",justifyContent:"space-between",gap:"8px"},children:[e.jsxs("div",{style:{flex:1,minWidth:0},children:[e.jsx("div",{style:{fontWeight:500,fontSize:"13px"},children:m.label||m.id}),e.jsxs("div",{style:{fontSize:"11px",color:"#9ca3af",marginTop:"2px"},children:["ID: ",m.id]})]}),e.jsx("span",{style:{fontSize:"11px",color:"#6b7280",padding:"2px 6px",background:"#f3f4f6",borderRadius:"3px",textTransform:"capitalize",flexShrink:0},children:m.mode||"inline"})]},m.id))})]}),e.jsx("div",{style:{borderTop:"1px solid #eee",marginTop:"4px"},children:e.jsx("button",{onClick:W,style:{width:"100%",padding:"6px 16px",background:"#f3f4f6",border:"none",borderRadius:"0 0 4px 4px",cursor:"pointer"},children:"Close"})})]})},Pe=n=>{const o=n.split("-");return o.length>2?o[o.length-1].substring(0,6):n.substring(0,6)},me=({field:n,onSelect:o,onDelete:c,isSelected:i,isGrouped:d=!1})=>e.jsxs("div",{onClick:()=>o(n),style:{position:"relative",padding:"10px 12px",background:i?"#eff6ff":"#f9fafb",border:i?"1px solid #3b82f6":"1px solid #e5e7eb",borderRadius:"6px",cursor:"pointer",transition:"all 0.2s",fontSize:d?"13px":"14px"},onMouseEnter:u=>{i||(u.currentTarget.style.background="#f3f4f6")},onMouseLeave:u=>{i||(u.currentTarget.style.background="#f9fafb")},title:n.alias,children:[e.jsx("button",{onClick:u=>{u.stopPropagation(),c(n.id)},style:{position:"absolute",top:"6px",right:"6px",padding:"4px",background:"transparent",border:"none",cursor:"pointer",color:"#9ca3af",transition:"color 0.2s",display:"flex",alignItems:"center",justifyContent:"center"},onMouseEnter:u=>{u.currentTarget.style.color="#ef4444"},onMouseLeave:u=>{u.currentTarget.style.color="#9ca3af"},title:"Delete field",children:e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{d:"M6 2V1.5C6 1.22386 6.22386 1 6.5 1H9.5C9.77614 1 10 1.22386 10 1.5V2M2 4H14M12.6667 4L12.1991 11.0129C12.129 12.065 12.0939 12.5911 11.8667 12.99C11.6666 13.3412 11.3648 13.6235 11.0011 13.7998C10.588 14 10.0607 14 9.00623 14H6.99377C5.93927 14 5.41202 14 4.99889 13.7998C4.63517 13.6235 4.33339 13.3412 4.13332 12.99C3.90607 12.5911 3.871 12.065 3.80086 11.0129L3.33333 4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}),e.jsxs("div",{style:{paddingRight:"24px"},children:[e.jsx("div",{style:{fontWeight:"500",fontSize:d?"12px":"14px",color:d?"#6b7280":"#111827"},children:n.alias||n.id}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px",fontSize:"11px",color:"#9ca3af",marginTop:"2px"},children:[e.jsxs("span",{children:["ID: ",n.id]}),n.mode&&e.jsx("span",{style:{fontSize:"9px",padding:"2px 5px",borderRadius:"3px",background:n.mode==="block"?"#dbeafe":"#f3f4f6",color:n.mode==="block"?"#1e40af":"#4b5563",fontWeight:"500"},children:n.mode})]})]})]}),ve=({fields:n,onSelect:o,onDelete:c,selectedFieldId:i})=>{const[d,u]=r.useState(new Set),{groupedFields:I,ungroupedFields:W}=r.useMemo(()=>{const f={},S=[];return n.forEach(g=>{g.group?(f[g.group]||(f[g.group]=[]),f[g.group].push(g)):S.push(g)}),{groupedFields:f,ungroupedFields:S}},[n]),A=f=>{u(S=>{const g=new Set(S);return g.has(f)?g.delete(f):g.add(f),g})};return e.jsxs("div",{className:"superdoc-field-list",style:{width:"250px",background:"white",border:"1px solid #e5e7eb",borderRadius:"8px",padding:"16px"},children:[e.jsxs("h3",{style:{margin:"0 0 16px 0",fontSize:"16px",fontWeight:"600"},children:["Template Fields (",n.length,")"]}),n.length===0?e.jsxs("div",{style:{color:"#9ca3af",fontSize:"14px",textAlign:"center",padding:"20px 0"},children:["No fields yet. Type ","{{"," to add a field."]}):e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"8px"},children:[W.map(f=>e.jsx(me,{field:f,onSelect:o,onDelete:c,isSelected:i===f.id},f.id)),Object.entries(I).map(([f,S])=>{const g=d.has(f),y=S[0];return e.jsxs("div",{children:[e.jsx("div",{style:{position:"relative",padding:"12px",background:"#f9fafb",border:"1px solid #e5e7eb",borderRadius:"6px",cursor:"pointer",transition:"all 0.2s"},onClick:()=>A(f),onMouseEnter:k=>{k.currentTarget.style.background="#f3f4f6"},onMouseLeave:k=>{k.currentTarget.style.background="#f9fafb"},children:e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsx("span",{style:{fontSize:"12px",color:"#6b7280"},children:g?"▼":"▶"}),e.jsxs("div",{style:{flex:1},children:[e.jsx("div",{style:{fontWeight:"500",fontSize:"14px"},children:y.alias}),e.jsxs("div",{style:{fontSize:"11px",color:"#9ca3af",marginTop:"2px"},children:["group: ",Pe(f)," (",S.length," fields)"]})]})]})}),g&&e.jsx("div",{style:{marginLeft:"16px",marginTop:"4px",display:"flex",flexDirection:"column",gap:"4px"},children:S.map(k=>e.jsx(me,{field:k,onSelect:o,onDelete:c,isSelected:i===k.id,isGrouped:!0},k.id))})]},f)})]})]})},U=n=>{const o=n.helpers?.structuredContentCommands;return o?.getStructuredContentTags?(o.getStructuredContentTags(n.state)||[]).map(i=>{const d=i?.node??i,u=d?.attrs??{},W=(d?.type?.name||"").includes("Block")?"block":"inline";return{id:u.id,alias:u.alias||u.label||"",tag:u.tag,mode:W,group:o.getGroup?.(u.tag)??void 0}}):[]},he=(n,o)=>{if(n===o)return!0;if(n.length!==o.length)return!1;for(let c=0;c<n.length;c+=1){const i=n[c],d=o[c];if(!d||i.id!==d.id||i.alias!==d.alias||i.tag!==d.tag||i.position!==d.position||i.mode!==d.mode||i.group!==d.group)return!1}return!0},Ae=n=>{if(!n)return null;if(n===!0)return{selector:"#superdoc-toolbar",config:{},renderDefaultContainer:!0};if(typeof n=="string")return{selector:n,config:{},renderDefaultContainer:!1};const{selector:o,...c}=n;return{selector:o||"#superdoc-toolbar",config:c,renderDefaultContainer:o===void 0}},ee=10,Ve=250,Oe=300,be=n=>{const o=window.innerWidth-Ve-ee,c=window.innerHeight-Oe-ee,i=Math.min(n.left,o),d=Math.min(n.top,c);return new DOMRect(Math.max(i,ee),Math.max(d,ee),n.width,n.height)},je=r.forwardRef((n,o)=>{const{document:c,fields:i={},menu:d={},list:u={},toolbar:I,onReady:W,onTrigger:A,onFieldInsert:f,onFieldUpdate:S,onFieldDelete:g,onFieldsChange:y,onFieldSelect:k,onFieldCreate:E,onExport:$,className:L,style:q,documentHeight:te="600px"}=n,[x,R]=r.useState(i.initial||[]),[H,V]=r.useState(null),[P,M]=r.useState(!1),[m,D]=r.useState(),[h,J]=r.useState(""),[Y,Ce]=r.useState(()=>i.available||[]),ne=r.useRef(null),C=r.useRef(null),T=r.useRef(null),ae=r.useRef(i);ae.current=i;const N=r.useRef(null),de=r.useRef(P);r.useEffect(()=>{de.current=P},[P]);const K=d.trigger||"{{",se=ae.current.available||[],ce=r.useCallback(t=>{const s=t.trim().toLowerCase();return s?se.filter(l=>l.label.toLowerCase().includes(s)):se},[se]),re=r.useCallback(t=>{J(t),Ce(ce(t))},[ce]),z=r.useCallback(()=>{re("")},[re]),Q=r.useCallback((t,s)=>{if(!C.current?.activeEditor)return!1;const l=C.current.activeEditor,v=x,b=t==="inline"?l.commands.insertStructuredContentInline?.({attrs:{alias:s.alias,tag:s.metadata?JSON.stringify(s.metadata):void 0},text:s.defaultValue||s.alias}):l.commands.insertStructuredContentBlock?.({attrs:{alias:s.alias,tag:s.metadata?JSON.stringify(s.metadata):void 0},text:s.defaultValue||s.alias});if(b){const p=U(l);R(p),y?.(p);const w=p.find(j=>!v.some(a=>a.id===j.id));w&&f?.(w)}return b},[f,y,x]),X=r.useCallback((t,s)=>{if(!C.current?.activeEditor)return!1;const v=C.current.activeEditor.commands.updateStructuredContentById?.(t,{attrs:s});return v&&R(b=>{const p=b.map(j=>j.id===t?{...j,...s}:j);y?.(p);const w=p.find(j=>j.id===t);return w&&S?.(w),p}),v},[S,y]),oe=r.useCallback(t=>{const s=C.current?.activeEditor;if(!s){let a=!1;return R(F=>{if(!F.some(B=>B.id===t))return F;const _=F.filter(B=>B.id!==t);return a=!0,y?.(_),_}),a&&(g?.(t),V(F=>F===t?null:F)),a}const v=x.find(a=>a.id===t)?.group;let b=!1;try{b=s.commands.deleteStructuredContentById?.(t)??!1}catch{b=!1}let p=U(s);const w=p.some(a=>a.id===t);if(!b&&w&&(p=p.filter(a=>a.id!==t)),v){const a=p.filter(F=>F.group===v);if(a.length===1){const F=a[0];s.commands.updateStructuredContentById?.(F.id,{attrs:{tag:void 0}}),p=U(s)}}let j=!1;return R(a=>{if(he(a,p))return a;const F=a.some(B=>B.id===t),_=p.some(B=>B.id===t);return F&&!_&&(j=!0),y?.(p),p}),j&&(g?.(t),V(a=>a===t?null:a)),b||j},[g,y,x]),O=r.useCallback(t=>{if(!C.current?.activeEditor)return;C.current.activeEditor.commands.selectStructuredContentById?.(t),V(t);const l=x.find(v=>v.id===t);l&&k?.(l)},[x,k]),ie=r.useCallback(t=>{if(!t)return;const s=U(t);R(l=>he(l,s)?l:(y?.(s),s))},[y]);r.useEffect(()=>ne.current?((async()=>{const{SuperDoc:s}=await import("superdoc"),l={comments:!1,...G&&{toolbar:{selector:G.selector,toolbarGroups:G.config.toolbarGroups||["center"],excludeItems:G.config.excludeItems||[],...G.config}}},v=()=>{if(b.activeEditor){const p=b.activeEditor;p.on("update",({editor:w})=>{const{state:j}=w,{from:a}=j.selection;if(a>=K.length){const le=a-K.length;if(j.doc.textBetween(le,a)===K){const pe=w.view.coordsAtPos(a),xe=be(new DOMRect(pe.left,pe.top,0,0)),fe=()=>{const Z=C.current?.activeEditor;if(!Z)return;const Ie=Z.state.selection.from,Re=Z.state.tr.delete(le,Ie);Z.view.dispatch(Re)};T.current=fe,N.current=a,D(xe),M(!0),z(),A?.({position:{from:le,to:a},bounds:xe,cleanup:fe});return}}if(!de.current)return;if(N.current==null){M(!1),z();return}if(a<N.current){M(!1),N.current=null,z();return}const F=j.doc.textBetween(N.current,a);re(F);const _=w.view.coordsAtPos(a),B=be(new DOMRect(_.left,_.top,0,0));D(B)}),p.on("update",()=>{ie(p)}),ie(p)}W?.()},b=new s({selector:ne.current,document:c?.source,documentMode:c?.mode||"editing",modules:l,toolbar:G?.selector,onReady:v});C.current=b})(),()=>{T.current=null,N.current=null;const s=C.current;s&&typeof s.destroy=="function"&&s.destroy(),C.current=null}):void 0,[c?.source,c?.mode,K,ie,W,A,I]);const ke=r.useCallback(async t=>{T.current&&(T.current(),T.current=null),N.current=null,z();const s=t.mode||"inline";if(t.id.startsWith("custom_")&&E){const l=await E(t);if(l){const v=l.mode||s;Q(v,{alias:l.label,metadata:l.metadata,defaultValue:l.defaultValue}),M(!1);return}}Q(s,{alias:t.label,metadata:t.metadata,defaultValue:t.defaultValue}),M(!1)},[Q,E,z]),Fe=r.useCallback(t=>{T.current&&(T.current(),T.current=null),N.current=null,z();const s=C.current?.activeEditor;if(!s)return;const l=s.helpers?.structuredContentCommands;if(!l)return;const v=t.group||`group-${Date.now()}-${Math.random().toString(36).substring(2,11)}`,b=l.createTagObject?.({group:v});if((t.mode||"inline")==="inline"?s.commands.insertStructuredContentInline?.({attrs:{alias:t.alias,tag:b},text:t.alias}):s.commands.insertStructuredContentBlock?.({attrs:{alias:t.alias,tag:b},text:t.alias})){t.group||X(t.id,{tag:b}),M(!1);const j=U(s);R(j),y?.(j)}},[X,z,y]),Se=r.useCallback(()=>{M(!1),N.current=null,z(),T.current&&(T.current(),T.current=null)},[z]),we=r.useCallback(()=>{if(!C.current?.activeEditor||x.length===0)return;const t=x.findIndex(l=>l.id===H),s=t>=0?(t+1)%x.length:0;O(x[s].id)},[x,H,O]),Te=r.useCallback(()=>{if(!C.current?.activeEditor||x.length===0)return;const t=x.findIndex(l=>l.id===H),s=t>0?t-1:x.length-1;O(x[s].id)},[x,H,O]),Ee=r.useCallback(async t=>{const{fileName:s="document",triggerDownload:l=!0}=t||{},v=await C.current?.export({exportType:["docx"],exportedName:s,triggerDownload:l}),b=C.current?.activeEditor;if(b){const p=U(b);$?.({fields:p,blob:l?void 0:v,fileName:s})}return v},[$]);r.useImperativeHandle(o,()=>({insertField:t=>Q("inline",t),insertBlockField:t=>Q("block",t),updateField:X,deleteField:oe,selectField:O,nextField:we,previousField:Te,getFields:()=>x,exportTemplate:Ee,getSuperDoc:()=>C.current}));const Me=d.component||ye,ue=u.component||ve,G=Ae(I);return e.jsxs("div",{className:`superdoc-template-builder ${L||""}`,style:q,children:[e.jsxs("div",{style:{display:"flex",gap:"20px"},children:[u.position==="left"&&e.jsx("div",{className:"superdoc-template-builder-sidebar",children:e.jsx(ue,{fields:x,onSelect:t=>O(t.id),onDelete:oe,onUpdate:t=>X(t.id,t),selectedFieldId:H||void 0})}),e.jsxs("div",{className:"superdoc-template-builder-document",style:{flex:1},children:[G?.renderDefaultContainer&&e.jsx("div",{id:"superdoc-toolbar",className:"superdoc-template-builder-toolbar","data-testid":"template-builder-toolbar"}),e.jsx("div",{ref:ne,className:"superdoc-template-builder-editor",style:{height:te},"data-testid":"template-builder-editor"})]}),u.position==="right"&&e.jsx("div",{className:"superdoc-template-builder-sidebar",children:e.jsx(ue,{fields:x,onSelect:t=>O(t.id),onDelete:oe,onUpdate:t=>X(t.id,t),selectedFieldId:H||void 0})})]}),e.jsx(Me,{isVisible:P,position:m,availableFields:i.available||[],filteredFields:Y,filterQuery:h,allowCreate:i.allowCreate||!1,onSelect:ke,onClose:Se,onCreateField:E,existingFields:x,onSelectExisting:Fe})]})});je.displayName="SuperDocTemplateBuilder";exports.FieldList=ve;exports.FieldMenu=ye;exports.default=je;