Detecting fillable fields

Author: falsaadehh

packages/super-editor/src/core/super-converter/exporter.js

@@ -81,7 +81,6 @@ export function exportSchemaToJson(params) {
     tableRow: translateTableRow,
     tableCell: translateTableCell,
     bookmarkStart: translateBookmarkStart,
-    fillableField: translateFillableField,
     fieldAnnotation: translateFieldAnnotation,
     tab: translateTab,
     image: translateImageNode,
@@ -1813,19 +1812,6 @@ function translateFieldAnnotation(params) {
   };
 };
 
-function translateFillableField(params) {
-  const { node, isFinalDoc } = params;
-  const { attrs = {} } = node;
-  const { displayLabel } = attrs;
-  console.log(params);
-
-  return {
-    name: 'w:t',
-
-    elements: [{ text:displayLabel, type: 'text' }],
-  };
-};
-
 export function translateHardBreak(params) {
   const { node = {} } = params;
   const { attrs = {} } = node;

packages/super-editor/src/core/super-converter/v2/importer/fillableFieldImporter.js

@@ -118,3 +118,6 @@ export const extractFillableParts = (text) => {
 
   return parts;
 };
+
+let uniqueIdCounter = 0;
+export const generateUniqueId = () => `fillable-${uniqueIdCounter++}`;

packages/super-editor/src/core/super-converter/v2/importer/importerHelpers.js

@@ -1,4 +1,4 @@
-import { extractFillableParts, getElementName, parseProperties } from './importerHelpers.js';
+import { generateUniqueId, extractFillableParts, getElementName, parseProperties } from './importerHelpers.js';
 
 /**
  * @type {import("docxImporter").NodeHandler}
@@ -29,10 +29,12 @@ export const handleTextNode = (params) => {
     let attrs = { type, attributes: attributes || {} }
     if(part.fillable) {
       let label = part.text;
-      attrs.fieldId = 'fillable-0';
+      attrs.fieldId = generateUniqueId();
       attrs.displayLabel = label;
+      attrs.highlighted = false;
+      attrs.type = "text";
       return {
-        type: 'fillableField',
+        type: 'fieldAnnotation',
         attrs: attrs,
         marks,
       };

packages/super-editor/src/core/super-converter/v2/importer/textNodeImporter.js

@@ -19,8 +19,8 @@ export const handleTrackChangeNode = (params) => {
   if (['w:ins', 'w:del'].includes(mainNode.name)) {
     node = mainNode;
   } else {
-    const sdtContent = mainNode.elements.find((el) => el.name === 'w:sdtContent');
-    const trackedChange = sdtContent?.elements.find((el) => ['w:ins', 'w:del'].includes(el.name));
+    const sdtContent = mainNode.elements?.find((el) => el.name === 'w:sdtContent');
+    const trackedChange = sdtContent?.elements?.find((el) => ['w:ins', 'w:del'].includes(el.name));
     if (trackedChange) node = trackedChange;
   }
 

packages/super-editor/src/core/super-converter/v2/importer/trackChangesImporter.js

@@ -37,7 +37,6 @@ import { PageNumber, TotalPageCount } from './page-number/index.js';
 import { ShapeContainer } from './shape-container/index.js';
 import { ShapeTextbox } from './shape-textbox/index.js';
 import { ContentBlock } from './content-block/index.js';
-import {FillableField} from "./fillable-field/index.js";
 
 // Marks extensions
 import { TextStyle } from './text-style/text-style.js';
@@ -93,7 +92,6 @@ const getRichTextExtensions = () => {
     TableRow,
     TableCell,
     TableHeader,
-    FillableField,
     FieldAnnotation,
     DropCursor,
     TrackInsert,
@@ -140,7 +138,6 @@ const getStarterExtensions = () => {
     TableRow,
     TableCell,
     TableHeader,
-    FillableField,
     FieldAnnotation,
     DropCursor,
     Image,
@@ -204,7 +201,6 @@ export {
   TableHeader,
   Placeholder,
   DropCursor,
-  FillableField,
   FieldAnnotation,
   fieldAnnotationHelpers,
   Image,