Refactor: Allow numeric IDs for template fields

Co-authored-by: caiopizzol <caiopizzol@gmail.com>

Author: cursoragent

src/index.tsx

@@ -143,7 +143,9 @@ const SuperDocTemplateBuilder = forwardRef<
   const [templateFields, setTemplateFields] = useState<Types.TemplateField[]>(
     fields.initial || [],
   );
-  const [selectedFieldId, setSelectedFieldId] = useState<string | null>(null);
+  const [selectedFieldId, setSelectedFieldId] = useState<string | number | null>(
+    null,
+  );
   const [menuVisible, setMenuVisible] = useState(false);
   const [menuPosition, setMenuPosition] = useState<DOMRect | undefined>();
   const [menuQuery, setMenuQuery] = useState<string>("");
@@ -202,13 +204,12 @@ const SuperDocTemplateBuilder = forwardRef<
       if (!superdocRef.current?.activeEditor) return false;
 
       const editor = superdocRef.current.activeEditor;
-      const fieldId = `field_${Date.now()}`;
+      const previousFields = templateFields;
 
       const success =
         mode === "inline"
           ? editor.commands.insertStructuredContentInline?.({
             attrs: {
-              id: fieldId,
               alias: field.alias,
               tag: field.metadata
                 ? JSON.stringify(field.metadata)
@@ -218,7 +219,6 @@ const SuperDocTemplateBuilder = forwardRef<
           })
           : editor.commands.insertStructuredContentBlock?.({
             attrs: {
-              id: fieldId,
               alias: field.alias,
               tag: field.metadata
                 ? JSON.stringify(field.metadata)
@@ -228,28 +228,28 @@ const SuperDocTemplateBuilder = forwardRef<
           });
 
       if (success) {
-        const newField: Types.TemplateField = {
-          id: fieldId,
-          alias: field.alias,
-          tag: field.category,
-        };
+        const updatedFields = getTemplateFieldsFromEditor(editor);
 
-        setTemplateFields((prev) => {
-          const updated = [...prev, newField];
-          onFieldsChange?.(updated);
-          return updated;
-        });
+        setTemplateFields(updatedFields);
+        onFieldsChange?.(updatedFields);
+
+        const insertedField = updatedFields.find(
+          (candidate) =>
+            !previousFields.some((existing) => existing.id === candidate.id),
+        );
 
-        onFieldInsert?.(newField);
+        if (insertedField) {
+          onFieldInsert?.(insertedField);
+        }
       }
 
       return success;
     },
-    [onFieldInsert, onFieldsChange],
+    [onFieldInsert, onFieldsChange, templateFields],
   );
 
   const updateField = useCallback(
-    (id: string, updates: Partial<Types.TemplateField>): boolean => {
+    (id: string | number, updates: Partial<Types.TemplateField>): boolean => {
       if (!superdocRef.current?.activeEditor) return false;
 
       const editor = superdocRef.current.activeEditor;
@@ -275,7 +275,7 @@ const SuperDocTemplateBuilder = forwardRef<
   );
 
   const deleteField = useCallback(
-    (id: string): boolean => {
+    (id: string | number): boolean => {
       const editor = superdocRef.current?.activeEditor;
 
       if (!editor) {
@@ -348,7 +348,7 @@ const SuperDocTemplateBuilder = forwardRef<
   );
 
   const selectField = useCallback(
-    (id: string) => {
+    (id: string | number) => {
       if (!superdocRef.current?.activeEditor) return;
 
       const editor = superdocRef.current.activeEditor;

src/types.ts

@@ -9,7 +9,7 @@ export interface FieldDefinition {
 }
 
 export interface TemplateField {
-  id: string;
+  id: string | number;
   alias: string;
   tag?: string;
   position?: number;
@@ -38,8 +38,8 @@ export interface FieldMenuProps {
 export interface FieldListProps {
   fields: TemplateField[];
   onSelect: (field: TemplateField) => void;
-  onDelete: (fieldId: string) => void;
-  selectedFieldId?: string;
+  onDelete: (fieldId: string | number) => void;
+  selectedFieldId?: string | number;
 }
 
 export interface DocumentConfig {
@@ -87,7 +87,7 @@ export interface SuperDocTemplateBuilderProps {
   onTrigger?: (event: TriggerEvent) => void;
   onFieldInsert?: (field: TemplateField) => void;
   onFieldUpdate?: (field: TemplateField) => void;
-  onFieldDelete?: (fieldId: string) => void;
+  onFieldDelete?: (fieldId: string | number) => void;
   onFieldsChange?: (fields: TemplateField[]) => void;
   onFieldSelect?: (field: TemplateField | null) => void;
   onFieldCreate?: (
@@ -105,9 +105,12 @@ export interface SuperDocTemplateBuilderHandle {
   insertBlockField: (
     field: Partial<FieldDefinition> & { alias: string },
   ) => boolean;
-  updateField: (id: string, updates: Partial<TemplateField>) => boolean;
-  deleteField: (id: string) => boolean;
-  selectField: (id: string) => void;
+  updateField: (
+    id: string | number,
+    updates: Partial<TemplateField>,
+  ) => boolean;
+  deleteField: (id: string | number) => boolean;
+  selectField: (id: string | number) => void;
   nextField: () => void;
   previousField: () => void;
   getFields: () => TemplateField[];