df-ae-forms-package 1.1.11 → 1.1.14

package/dist/index.js

@@ -327,16 +327,33 @@ var EIssueStatus;
     EIssueStatus["OPEN"] = "Open";
     EIssueStatus["IN_PROGRESS"] = "In-Progress";
     EIssueStatus["REJECTED"] = "Rejected";
-    EIssueStatus["RESOLVE"] = "Resolved";
+    EIssueStatus["RESOLVE"] = "Resolve";
 })(EIssueStatus || (EIssueStatus = {}));
+const normalizeIssueStatus = (issueStatus) => {
+    const normalizedValue = String(issueStatus || '').trim().toLowerCase().replace(/[\s_-]+/g, '');
+    if (normalizedValue === 'open') {
+        return EIssueStatus.OPEN;
+    }
+    if (normalizedValue === 'inprogress') {
+        return EIssueStatus.IN_PROGRESS;
+    }
+    if (normalizedValue === 'reject' || normalizedValue === 'rejected') {
+        return EIssueStatus.REJECTED;
+    }
+    if (normalizedValue === 'resolve' || normalizedValue === 'resolved') {
+        return EIssueStatus.RESOLVE;
+    }
+    return EIssueStatus.OPEN;
+};
 const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId, notes = '', attachments = null, issue = null, onCreateIssue, onUpdateIssue, user, availableUsers = [
     'Priya Das',
     'Maria Garcia',
     'John Smith',
     'Sarah Johnson'
-], workOrderNumber: initialWorkOrderNumber, assetNumber: initialAssetNumber, isStandalone, allowWorkflowActions, inEditMode = false, isEdit }) => {
-    // DEBUG: Log the isStandalone value
-    console.log('RaiseIssueModal - isStandalone:', isStandalone, 'type:', typeof isStandalone);
+], workOrderNumber: initialWorkOrderNumber, assetNumber: initialAssetNumber, isStandalone, inEditMode = false, isEdit }) => {
+    // Determine if workflow actions should be enabled
+    // If explicitly provided, use that. Otherwise, default to isEdit (true if editing, false/undefined otherwise).
+    // Fallback to false if neither is provided.
     const [title, setTitle] = React.useState('');
     const [description, setDescription] = React.useState('');
     const [workOrderNumber, setWorkOrderNumber] = React.useState('');
@@ -352,11 +369,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
     const [isViewMode, setIsViewMode] = React.useState(!!issue && !inEditMode);
     const fileInputRef = React.useRef(null);
     const isEditMode = isEdit !== undefined ? isEdit : !!issue;
-    // Determine if workflow actions should be enabled
-    // If explicitly provided, use that. Otherwise, default to showing them if we have an existing issue.
-    const showWorkflowActions = allowWorkflowActions !== undefined
-        ? allowWorkflowActions
-        : !!issue;
     React.useEffect(() => {
         if (isOpen) {
             // In edit mode, prioritize issue attachments from API
@@ -410,14 +422,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
             setLocalAttachments(prev => [...prev, ...newFiles]);
         }
     };
-    const convertFileToBase64 = (file) => {
-        return new Promise((resolve, reject) => {
-            const reader = new FileReader();
-            reader.readAsDataURL(file);
-            reader.onload = () => resolve(reader.result);
-            reader.onerror = error => reject(error);
-        });
-    };
     const getAttachmentName = (file) => {
         if (!file)
             return 'Attachment';
@@ -448,25 +452,10 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
             }
             return null;
         }
-        if (file.data) {
-            if (isDataUrlImage(file.data))
-                return file.data;
-            // Handle raw base64 data from API
-            if (file.fileName && isImage(file.fileName)) {
-                const fileName = String(file.fileName).toLowerCase();
-                let mimeType = 'image/png'; // Default
-                if (fileName.endsWith('.jpg') || fileName.endsWith('.jpeg'))
-                    mimeType = 'image/jpeg';
-                else if (fileName.endsWith('.png'))
-                    mimeType = 'image/png';
-                else if (fileName.endsWith('.gif'))
-                    mimeType = 'image/gif';
-                else if (fileName.endsWith('.webp'))
-                    mimeType = 'image/webp';
-                return `data:${mimeType};base64,${file.data}`;
-            }
+        if (file.data && isDataUrlImage(file.data))
+            return file.data;
+        if (file.fileName && isImage(file.fileName) && file.data)
             return file.data;
-        }
         return null;
     };
     React.useEffect(() => {
@@ -478,23 +467,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
                 setWorkOrderNumber(issue?.workOrderNumber || initialWorkOrderNumber || '');
                 setAssetNumber(issue?.assetNumber || initialAssetNumber || '');
                 setPriority(issue?.priority || 'Medium');
-                const issueStatus = issue?.status || EIssueStatus.OPEN;
-                // Normalize to enum values if needed (handle legacy values)
-                let normalizedStatus = EIssueStatus.OPEN;
-                if (issueStatus) {
-                    const statusLower = String(issueStatus).toLowerCase().trim();
-                    if (statusLower === 'open')
-                        normalizedStatus = EIssueStatus.OPEN;
-                    else if (statusLower === 'in-progress' || statusLower === 'in progress' || statusLower === 'inprogress')
-                        normalizedStatus = EIssueStatus.IN_PROGRESS;
-                    else if (statusLower === 'rejected')
-                        normalizedStatus = EIssueStatus.REJECTED;
-                    else if (statusLower === 'resolved' || statusLower === 'resolve')
-                        normalizedStatus = EIssueStatus.RESOLVE;
-                    else
-                        normalizedStatus = issueStatus; // Fallback to whatever it is if it's not matched but it might be valid
-                }
-                setStatus(normalizedStatus);
+                setStatus(normalizeIssueStatus(issue?.status || EIssueStatus.OPEN));
                 // Correctly map assignTo or fallback to assignee
                 setAssignee(issue?.assignTo || '');
                 setComments(issue?.comments || '');
@@ -612,17 +585,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
         try {
             if (isEditMode && issue) {
                 // Update existing issue
-                // Convert attachments to base64 objects for API
-                const attachmentObjects = await Promise.all(localAttachments.map(async (file) => {
-                    if (file instanceof File) {
-                        const base64 = await convertFileToBase64(file);
-                        return {
-                            fileName: file.name,
-                            data: base64
-                        };
-                    }
-                    return file; // Already a data object
-                }));
                 const updateData = {
                     title: String(title || '').trim(),
                     description: String(description || '').trim(),
@@ -635,9 +597,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
                     status: status,
                     comments: String(comments || '').trim() || '',
                     task: issue.component?.basic?.label || '',
-                    taskValue: issue.component?.basic?.value || '',
-                    isStandalone: !!isStandalone,
-                    attachments: attachmentObjects
+                    taskValue: issue.component?.basic?.value || ''
                 };
                 if (onUpdateIssue && issue._id) {
                     await onUpdateIssue(issue._id, updateData);
@@ -669,17 +629,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
                         comments: String(notes || '')
                     }
                 };
-                // Convert attachments to base64 objects for API
-                const attachmentObjects = await Promise.all(localAttachments.map(async (file) => {
-                    if (file instanceof File) {
-                        const base64 = await convertFileToBase64(file);
-                        return {
-                            fileName: file.name,
-                            data: base64
-                        };
-                    }
-                    return file; // Already a data object
-                }));
                 const createdBy = user ? `${user.firstName || ''} ${user.lastName || ''}`.trim() : 'User';
                 const issueData = {
                     title: String(title || '').trim(),
@@ -694,13 +643,11 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
                     comments: String(comments || '').trim() || '',
                     createdBy,
                     task: component?.basic?.label || '',
-                    taskValue: component?.basic?.value || '',
-                    isStandalone: !!isStandalone,
-                    attachments: attachmentObjects // Include in data as well
+                    taskValue: component?.basic?.value || ''
                 };
-                let createdIssueResponse;
+                let createdIssueResponse; // Renamed to avoid conflict with instruction's const
                 if (onCreateIssue) {
-                    createdIssueResponse = await onCreateIssue(issueData, attachmentObjects);
+                    createdIssueResponse = await onCreateIssue(issueData, localAttachments);
                 }
                 toastService.showSuccess('Issue raised successfully');
                 if (onSuccess) {
@@ -738,6 +685,9 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
     if (!isOpen) {
         return null;
     }
+    const normalizedWorkflowStatus = normalizeIssueStatus(status);
+    const showAcceptRejectActions = isEditMode && !!issue && normalizedWorkflowStatus === EIssueStatus.OPEN;
+    const showResolveAction = isEditMode && !!issue && normalizedWorkflowStatus === EIssueStatus.IN_PROGRESS;
     const modalContent = (jsxRuntime.jsx("div", { className: "raise-issue-modal-overlay", onClick: onClose, children: jsxRuntime.jsxs("div", { className: "raise-issue-modal", onClick: (e) => e.stopPropagation(), children: [jsxRuntime.jsxs("div", { className: "raise-issue-modal-header", children: [jsxRuntime.jsxs("div", { className: "raise-issue-modal-header-left", children: [jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "raise-issue-modal-icon", size: 20 }), jsxRuntime.jsx("div", { className: "raise-issue-modal-header-text", children: jsxRuntime.jsx("div", { className: "raise-issue-modal-title-main", children: isEditMode ? 'Issue Details' : 'Create Issue' }) })] }), jsxRuntime.jsx("button", { className: "raise-issue-modal-close", onClick: onClose, "aria-label": "Close", children: jsxRuntime.jsx(lucideReact.X, { size: 18 }) })] }), jsxRuntime.jsx("div", { className: "raise-issue-modal-content", children: jsxRuntime.jsxs("div", { className: "raise-issue-fields-grid", children: [isEditMode && issue?.issueNumber && (jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Issue ID" }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: issue.issueNumber, readOnly: true })] })), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Task" }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: isEditMode ? (issue?.component?.basic?.label || '') : (component?.basic?.label || ''), readOnly: true })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Task Value" }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: isEditMode ? (issue?.component?.basic?.value || '') : (component?.basic?.value || ''), readOnly: true })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Title ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: `raise-issue-field-input ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: title, onChange: (e) => setTitle(e.target.value), placeholder: "Enter issue title", readOnly: isEditMode && isViewMode })] }), !isStandalone && (jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Work Order ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: `raise-issue-field-input ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: workOrderNumber, onChange: (e) => setWorkOrderNumber(e.target.value), placeholder: "N/A", readOnly: isEditMode && isViewMode })] })), !isStandalone && (jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Asset Number ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: `raise-issue-field-input ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: assetNumber, onChange: (e) => setAssetNumber(e.target.value), placeholder: "Enter asset number", readOnly: isEditMode && isViewMode })] })), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Raised By ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field-value-with-icon", children: [jsxRuntime.jsx(lucideReact.User, { size: 16 }), jsxRuntime.jsx("span", { children: user ? `${user.firstName || ''} ${user.lastName || ''}`.trim() || 'User' : 'User' })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Created On" }), jsxRuntime.jsxs("div", { className: "raise-issue-field-value-with-icon", children: [jsxRuntime.jsx(lucideReact.Calendar, { size: 16 }), jsxRuntime.jsx("span", { children: isEditMode && issue?.createdAt
                                                     ? (safeDate(issue.createdAt) || new Date()).toLocaleString('en-US', {
                                                         year: 'numeric',
@@ -754,12 +704,12 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
                                                         hour: '2-digit',
                                                         minute: '2-digit',
                                                         hour12: true
-                                                    }) })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Description ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("textarea", { className: `raise-issue-field-textarea ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: description, onChange: (e) => setDescription(e.target.value), placeholder: "Enter issue description", rows: 4, readOnly: isEditMode && isViewMode })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Status ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: status, readOnly: true })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Assign to ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), isEditMode ? (jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: assignee || 'Unassigned', readOnly: true })) : (jsxRuntime.jsxs("select", { className: "raise-issue-field-select", value: assignee, onChange: (e) => setAssignee(e.target.value), disabled: isEditMode && isViewMode, children: [jsxRuntime.jsx("option", { value: "", children: "Unassigned" }), availableUsers.map((userName) => (jsxRuntime.jsx("option", { value: userName, children: userName }, userName)))] }))] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Priority ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsxs("div", { className: "raise-issue-priority-buttons", children: [jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-low ${priority === 'Low' ? 'active' : ''}`, onClick: () => setPriority('Low'), disabled: isEditMode && isViewMode, children: "Low" }), jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-medium ${priority === 'Medium' ? 'active' : ''}`, onClick: () => setPriority('Medium'), disabled: isEditMode && isViewMode, children: "Medium" }), jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-high ${priority === 'High' ? 'active' : ''}`, onClick: () => setPriority('High'), disabled: isEditMode && isViewMode, children: "High" })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label-with-icon", children: [jsxRuntime.jsx(lucideReact.MessageSquare, { size: 16 }), jsxRuntime.jsx("span", { children: "Comments" })] }), !comments && (jsxRuntime.jsx("div", { className: "raise-issue-no-comments", children: "No comments yet" })), jsxRuntime.jsx("textarea", { className: `raise-issue-field-textarea raise-issue-comments-textarea ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: comments, onChange: (e) => setComments(e.target.value), placeholder: "Add a comment...", rows: 4, readOnly: isEditMode })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", style: { marginTop: '1rem' }, children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Attachments" }), jsxRuntime.jsxs("div", { className: "raise-issue-attachments-container", children: [!isEditMode && (jsxRuntime.jsxs("div", { className: `raise-issue-dropzone ${isDragging ? 'dragging' : ''}`, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, onClick: () => fileInputRef.current?.click(), children: [jsxRuntime.jsx("input", { type: "file", ref: fileInputRef, style: { display: 'none' }, onChange: handleFileChange, multiple: true }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-icon", children: jsxRuntime.jsx(lucideReact.UploadCloud, { size: 24 }) }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-text", children: "Click to upload or drag and drop" }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-hint", children: "PNG, JPG up to 10MB" })] })), localAttachments.length > 0 && (jsxRuntime.jsx("div", { className: "raise-issue-attachments-list", children: localAttachments.map((file, index) => (jsxRuntime.jsxs("div", { className: "raise-issue-attachment-item", children: [jsxRuntime.jsx("div", { className: "raise-issue-attachment-thumbnail", children: getAttachmentPreview(file) ? (jsxRuntime.jsx("img", { src: getAttachmentPreview(file), alt: "Thumbnail" })) : (jsxRuntime.jsx(lucideReact.Paperclip, { size: 20, color: "#9ca3af" })) }), jsxRuntime.jsxs("div", { className: "raise-issue-attachment-info", children: [jsxRuntime.jsx("span", { className: "attachment-name", title: getAttachmentName(file), children: getAttachmentName(file) }), file instanceof File && (jsxRuntime.jsxs("span", { className: "attachment-size", children: [(file.size / 1024).toFixed(1), " KB"] }))] }), !isEditMode && (jsxRuntime.jsx("button", { type: "button", className: "attachment-remove-btn", onClick: () => handleRemoveAttachment(index), title: "Remove", children: jsxRuntime.jsx(lucideReact.X, { size: 12 }) }))] }, index))) }))] })] })] }) }), jsxRuntime.jsx("div", { className: "raise-issue-modal-actions", children: jsxRuntime.jsxs("div", { className: "raise-issue-modal-actions-buttons", children: [(showWorkflowActions && issue) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [status === EIssueStatus.OPEN && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-accept", onClick: handleAccept, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Accept' })), status === EIssueStatus.IN_PROGRESS && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-resolve", onClick: handleResolve, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Resolve' })), (status === EIssueStatus.OPEN) && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-reject", onClick: handleReject, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Reject' }))] })), !isEditMode && (jsxRuntime.jsx("button", { className: `raise-issue-modal-button raise-issue-modal-button-save ${!isFormValid ? 'disabled' : ''}`, onClick: handleSubmit, disabled: isSubmitting || !isFormValid, children: isSubmitting ? 'Creating...' : 'Create Issue' }))] }) })] }) }));
+                                                    }) })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Description ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("textarea", { className: `raise-issue-field-textarea ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: description, onChange: (e) => setDescription(e.target.value), placeholder: "Enter issue description", rows: 4, readOnly: isEditMode && isViewMode })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Status ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: status, readOnly: true })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Assign to ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsxs("select", { className: "raise-issue-field-select", value: assignee, onChange: (e) => setAssignee(e.target.value), disabled: isEditMode && isViewMode, children: [jsxRuntime.jsx("option", { value: "", children: "Unassigned" }), availableUsers.map(userName => (jsxRuntime.jsx("option", { value: userName, children: userName }, userName)))] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Priority ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsxs("div", { className: "raise-issue-priority-buttons", children: [jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-low ${priority === 'Low' ? 'active' : ''}`, onClick: () => setPriority('Low'), disabled: isEditMode && isViewMode, children: "Low" }), jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-medium ${priority === 'Medium' ? 'active' : ''}`, onClick: () => setPriority('Medium'), disabled: isEditMode && isViewMode, children: "Medium" }), jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-high ${priority === 'High' ? 'active' : ''}`, onClick: () => setPriority('High'), disabled: isEditMode && isViewMode, children: "High" })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label-with-icon", children: [jsxRuntime.jsx(lucideReact.MessageSquare, { size: 16 }), jsxRuntime.jsx("span", { children: "Comments" })] }), !comments && (jsxRuntime.jsx("div", { className: "raise-issue-no-comments", children: "No comments yet" })), jsxRuntime.jsx("textarea", { className: `raise-issue-field-textarea raise-issue-comments-textarea ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: comments, onChange: (e) => setComments(e.target.value), placeholder: "Add a comment...", rows: 4, readOnly: isEditMode })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", style: { marginTop: '1rem' }, children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Attachments" }), jsxRuntime.jsxs("div", { className: "raise-issue-attachments-container", children: [!isEditMode && (jsxRuntime.jsxs("div", { className: `raise-issue-dropzone ${isDragging ? 'dragging' : ''}`, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, onClick: () => fileInputRef.current?.click(), children: [jsxRuntime.jsx("input", { type: "file", ref: fileInputRef, style: { display: 'none' }, onChange: handleFileChange, multiple: true }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-icon", children: jsxRuntime.jsx(lucideReact.UploadCloud, { size: 24 }) }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-text", children: "Click to upload or drag and drop" }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-hint", children: "PNG, JPG up to 10MB" })] })), localAttachments.length > 0 && (jsxRuntime.jsx("div", { className: "raise-issue-attachments-list", children: localAttachments.map((file, index) => (jsxRuntime.jsxs("div", { className: "raise-issue-attachment-item", children: [jsxRuntime.jsx("div", { className: "raise-issue-attachment-thumbnail", children: getAttachmentPreview(file) ? (jsxRuntime.jsx("img", { src: getAttachmentPreview(file), alt: "Thumbnail" })) : (jsxRuntime.jsx(lucideReact.Paperclip, { size: 20, color: "#9ca3af" })) }), jsxRuntime.jsxs("div", { className: "raise-issue-attachment-info", children: [jsxRuntime.jsx("span", { className: "attachment-name", title: getAttachmentName(file), children: getAttachmentName(file) }), file instanceof File && (jsxRuntime.jsxs("span", { className: "attachment-size", children: [(file.size / 1024).toFixed(1), " KB"] }))] }), !isEditMode && (jsxRuntime.jsx("button", { type: "button", className: "attachment-remove-btn", onClick: () => handleRemoveAttachment(index), title: "Remove", children: jsxRuntime.jsx(lucideReact.X, { size: 12 }) }))] }, index))) }))] })] })] }) }), jsxRuntime.jsx("div", { className: "raise-issue-modal-actions", children: jsxRuntime.jsxs("div", { className: "raise-issue-modal-actions-buttons", children: [(showAcceptRejectActions || showResolveAction) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [showAcceptRejectActions && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-accept", onClick: handleAccept, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Accept' })), showResolveAction && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-resolve", onClick: handleResolve, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Resolve' })), showAcceptRejectActions && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-reject", onClick: handleReject, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Reject' }))] })), !isEditMode && (jsxRuntime.jsx("button", { className: `raise-issue-modal-button raise-issue-modal-button-save ${!isFormValid ? 'disabled' : ''}`, onClick: handleSubmit, disabled: isSubmitting || !isFormValid, children: isSubmitting ? 'Creating...' : 'Create Issue' }))] }) })] }) }));
     // Render modal using portal to document body for full-page overlay
     return require$$0.createPortal(modalContent, document.body);
 };
 
-const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, formTemplateId, workOrderNumber, assetNumber, user, onIssueRaised, isIssueRaised = false, compact = false, allowWorkflowActions, inEditMode }) => {
+const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, formTemplateId, workOrderNumber, assetNumber, user, onIssueRaised, isIssueRaised = false, compact = false }) => {
     const [showRaiseIssueModal, setShowRaiseIssueModal] = React.useState(false);
     const [issue, setIssue] = React.useState(null);
     const [isLoadingIssue, setIsLoadingIssue] = React.useState(false);
@@ -851,16 +801,16 @@ const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, fo
     // If issue is raised (either from prop or local state), don't show anything
     // The ComponentActionFeatures will handle showing the raised issue state
     if (isIssueRaised || localIssueRaised) {
-        return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: showRaiseIssueModal && (jsxRuntime.jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode })) }));
+        return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: showRaiseIssueModal && (jsxRuntime.jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue })) }));
     }
     // Show compact version for small screens/tables
     if (compact) {
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "threshold-alert threshold-alert-unresolved threshold-alert-compact", children: [jsxRuntime.jsx("div", { className: "threshold-alert-border" }), jsxRuntime.jsxs("div", { className: "threshold-alert-content-compact", children: [jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "threshold-alert-icon-compact", size: 14 }), jsxRuntime.jsx("span", { className: "threshold-alert-message-compact", children: getCompactMessage() }), jsxRuntime.jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn-compact", title: "Raise Issue", children: "Raise Issue" })] })] }), showRaiseIssueModal && (jsxRuntime.jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }))] }));
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "threshold-alert threshold-alert-unresolved threshold-alert-compact", children: [jsxRuntime.jsx("div", { className: "threshold-alert-border" }), jsxRuntime.jsxs("div", { className: "threshold-alert-content-compact", children: [jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "threshold-alert-icon-compact", size: 14 }), jsxRuntime.jsx("span", { className: "threshold-alert-message-compact", children: getCompactMessage() }), jsxRuntime.jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn-compact", title: "Raise Issue", children: "Raise Issue" })] })] }), showRaiseIssueModal && (jsxRuntime.jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue }))] }));
     }
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "threshold-alert threshold-alert-unresolved", children: [jsxRuntime.jsx("div", { className: "threshold-alert-border" }), jsxRuntime.jsxs("div", { className: "threshold-alert-content", children: [jsxRuntime.jsx("div", { className: "threshold-alert-header", children: jsxRuntime.jsxs("div", { className: "threshold-alert-title-group", children: [jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "threshold-alert-icon", size: 20 }), jsxRuntime.jsx("span", { className: "threshold-alert-title", children: "Threshold Condition Met - Action Required" })] }) }), jsxRuntime.jsxs("div", { className: "threshold-alert-message", children: [getConditionMessage(), jsxRuntime.jsx("span", { className: "threshold-alert-warning", children: " You must raise an issue before submitting the form." })] }), jsxRuntime.jsx("div", { className: "threshold-alert-buttons", children: jsxRuntime.jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn", children: "Raise Issue Now" }) })] })] }), showRaiseIssueModal && (jsxRuntime.jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }))] }));
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "threshold-alert threshold-alert-unresolved", children: [jsxRuntime.jsx("div", { className: "threshold-alert-border" }), jsxRuntime.jsxs("div", { className: "threshold-alert-content", children: [jsxRuntime.jsx("div", { className: "threshold-alert-header", children: jsxRuntime.jsxs("div", { className: "threshold-alert-title-group", children: [jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "threshold-alert-icon", size: 20 }), jsxRuntime.jsx("span", { className: "threshold-alert-title", children: "Threshold Condition Met - Action Required" })] }) }), jsxRuntime.jsxs("div", { className: "threshold-alert-message", children: [getConditionMessage(), jsxRuntime.jsx("span", { className: "threshold-alert-warning", children: " You must raise an issue before submitting the form." })] }), jsxRuntime.jsx("div", { className: "threshold-alert-buttons", children: jsxRuntime.jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn", children: "Raise Issue Now" }) })] })] }), showRaiseIssueModal && (jsxRuntime.jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue }))] }));
 };
 
-const DfFormInput = ({ id, properties, validationErrors = {}, formValue = '', inputType = 'text', readonly = false, disabled = false, touchedFields = {}, formSubmitted = false, mode = 'test', onValueChange, onBlur, onFocus, className = '', hideLabel = false, formTemplateId, onThresholdIssueRaised, raisedThresholdIssues = new Set(), workOrderNumber, assetNumber, user, allowWorkflowActions, inEditMode }) => {
+const DfFormInput = ({ id, properties, validationErrors = {}, formValue = '', inputType = 'text', readonly = false, disabled = false, touchedFields = {}, formSubmitted = false, mode = 'test', onValueChange, onBlur, onFocus, className = '', hideLabel = false, formTemplateId, onThresholdIssueRaised, raisedThresholdIssues = new Set(), workOrderNumber, assetNumber, user }) => {
     // Ensure formValue is always a string to prevent [object Object] errors
     const getStringValue = (val) => {
         if (val === null || val === undefined)
@@ -1224,7 +1174,7 @@ const DfFormInput = ({ id, properties, validationErrors = {}, formValue = '', in
                     inputWrapperRef.current?.closest('.datagrid-list-view') !== null ||
                     className.includes('table-cell') ||
                     className.includes('cell-content');
-                return (jsxRuntime.jsx(ThresholdAlert, { component: properties, condition: activeThresholdCondition, currentValue: value, thresholdValue: activeThresholdCondition.value, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onDismiss: () => handleDismissAlert(activeThresholdCondition.id), onIssueRaised: onThresholdIssueRaised, isIssueRaised: issueRaised, compact: isInTable, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }, `${activeThresholdCondition.id}-${issueRaised}`));
+                return (jsxRuntime.jsx(ThresholdAlert, { component: properties, condition: activeThresholdCondition, currentValue: value, thresholdValue: activeThresholdCondition.value, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onDismiss: () => handleDismissAlert(activeThresholdCondition.id), onIssueRaised: onThresholdIssueRaised, isIssueRaised: issueRaised, compact: isInTable }, `${activeThresholdCondition.id}-${issueRaised}`));
             })()] }));
 };
 
@@ -3811,7 +3761,7 @@ const AttachmentThumbnails = ({ attachments, onRemove }) => {
             return (jsxRuntime.jsx("div", { className: "attachment-thumbnail", children: isImage && objectUrl ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("img", { src: objectUrl, alt: file ? file.name : 'Attachment' }), jsxRuntime.jsx("button", { type: "button", className: "thumbnail-remove-btn", onClick: () => onRemove(index), title: "Remove attachment", children: jsxRuntime.jsx(lucideReact.X, { size: 14 }) })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "file-icon-placeholder", children: jsxRuntime.jsx(lucideReact.Paperclip, { size: 20 }) }), jsxRuntime.jsx("span", { className: "file-name", children: file ? file.name : 'Unknown File' }), jsxRuntime.jsx("button", { type: "button", className: "thumbnail-remove-btn", onClick: () => onRemove(index), title: "Remove attachment", children: jsxRuntime.jsx(lucideReact.X, { size: 14 }) })] })) }, index));
         }) }));
 };
-const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, formData, onNotesChange, onAttachmentChange, notes = '', attachments = null, onThresholdActionCompletion, onThresholdIssueRaised, onBasicPropertyActionCompletion, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
+const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, formData, onNotesChange, onAttachmentChange, notes = '', attachments = null, onThresholdActionCompletion, onThresholdIssueRaised, onBasicPropertyActionCompletion, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
     // Determine effective form value (prefer prop, fallback to formData lookup)
     const effectiveFormValue = formValue !== undefined ? formValue : (formData ? formData[component.id] : undefined);
     // Use effectiveFormValue for logic instead of raw formValue
@@ -4089,8 +4039,10 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
         }, 3000);
     }, [getActiveThresholdConditions, onThresholdActionCompletion, component, onBasicPropertyActionCompletion]);
     const handleRaiseIssueClick = React.useCallback(() => {
+        if (issueRaised)
+            return;
         setShowRaiseIssueModal(true);
-    }, []);
+    }, [issueRaised]);
     const handleRaiseIssueClose = React.useCallback(() => {
         setShowRaiseIssueModal(false);
     }, []);
@@ -4297,7 +4249,7 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
                         modalComponent.basic.value = selectedOption.value || effectiveValue;
                     }
                     return modalComponent;
-                })(), formTemplateId: formTemplateId || '', notes: localNotes, attachments: localAttachments, isStandalone: isStandalone, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode })), console.log('ComponentActionFeatures - isStandalone:', isStandalone, 'workOrderNumber:', workOrderNumber, 'assetNumber:', assetNumber)] }));
+                })(), formTemplateId: formTemplateId || '', notes: localNotes, attachments: localAttachments, isStandalone: isStandalone, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }))] }));
 };
 
 // Attachment Thumbnails Component for Submission View
@@ -4363,7 +4315,7 @@ function ensureStringId$2(id) {
     }
     return String(id);
 }
-const DraggableGridComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, formData = {}, formTemplateId, onThresholdIssueRaised, onNotesChange, onAttachmentChange, shouldShowComponent }) => {
+const DraggableGridComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, shouldShowComponent }) => {
     const formValue = formData[component.id];
     const isVisible = shouldShowComponent ? shouldShowComponent(component.id) : true;
     // Check if component has notes or attachments for submission view
@@ -4534,7 +4486,8 @@ const GridDropZone = ({ gridComponents, mode, onComponentSelect, onComponentDele
                     }, children: isOver ? (jsxRuntime.jsx("span", { style: { color: '#3b82f6', fontWeight: '500' }, children: "Drop component here to add to grid" })) : (jsxRuntime.jsx("span", { children: "+ Drop more components here" })) })] })) }));
 };
 // Sub-component for displaying entries (TableView)
-const TableView = ({ templateComponents, dataEntries, renderFormComponent, mode, allowAddRemoveEntries, addAnotherText, removeText, maxEntries, minEntries, displayAsGrid = true, onAddEntry, onRemoveEntry, formData, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, columnView, shouldShowComponent, allowWorkflowActions, inEditMode }) => {
+const TableView = ({ templateComponents, dataEntries, renderFormComponent, mode, allowAddRemoveEntries, addAnotherText, removeText, maxEntries, minEntries, displayAsGrid = true, onAddEntry, onRemoveEntry, formData, // Use current formData to render values
+formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, columnView, shouldShowComponent }) => {
     const _formData = formData || {};
     const visibleTemplateComponents = React.useMemo(() => {
         if (!shouldShowComponent)
@@ -5201,7 +5154,7 @@ const DfFormDataGrid = ({ id, properties, mode = 'edit', formData = {}, onValueC
                     templateComponents: gridComponents, dataEntries: dataEntries, renderFormComponent: renderFormComponent || renderComponent, mode: mode, allowAddRemoveEntries: properties.datagrid?.allowAddRemoveEntries ?? true, addAnotherText: properties.datagrid?.addAnotherText ?? 'Add Entry', removeText: properties.datagrid?.removeText ?? 'Remove', maxEntries: properties.datagrid?.maxEntries ?? 10, minEntries: properties.datagrid?.minEntries ?? 1, displayAsGrid: properties.datagrid?.displayAsGrid ?? true, onAddEntry: handleAddEntry, onRemoveEntry: handleRemoveEntry, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, columnView: properties.datagrid?.columnView, shouldShowComponent: shouldShowComponent })) }))] }));
 };
 
-const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDelete, renderFormComponent, isOverlay = false, isChildrenEditMode = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode, isStandalone }) => {
+const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDelete, renderFormComponent, isOverlay = false, isChildrenEditMode = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
     const formValue = formData[child.id];
     // Check if component has notes or attachments for submission view
     const hasSubmissionData = mode === 'preview' && ((child.basic?.notes && child.basic.notes.trim().length > 0) ||
@@ -5219,9 +5172,9 @@ const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDele
     return (jsxRuntime.jsxs("div", { ref: setNodeRef, style: style, className: `form-component section-child ${selectedChild?.id === child.id ? 'selected' : ''} ${isDragging ? 'dragging' : ''} ${isSorting ? 'sorting' : ''} ${isChildrenEditMode ? 'children-edit-active' : ''}`, onClick: () => !isDragging && onChildSelect(child), role: "button", tabIndex: 0, children: [(mode === 'edit' || isChildrenEditMode) && (jsxRuntime.jsx("div", { className: "child-drag-handle", ...listeners, ...attributes, onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsxRuntime.jsx(lucideReact.GripVertical, { size: 14 }) })), jsxRuntime.jsxs("div", { className: "form-component-content section-child-content", children: [(mode === 'edit' || isChildrenEditMode) && (jsxRuntime.jsxs("div", { className: "component-actions child-actions", children: [jsxRuntime.jsx("button", { className: "btn edit-btn", onClick: (e) => {
                                     e.stopPropagation();
                                     onChildSelect(child);
-                                }, onMouseDown: (e) => e.stopPropagation(), title: "Edit properties", children: jsxRuntime.jsx(lucideReact.Edit, { size: 12 }) }), jsxRuntime.jsx("button", { className: "btn delete-btn", onClick: (e) => onChildDelete(child, e), onMouseDown: (e) => e.stopPropagation(), title: "Delete component", children: jsxRuntime.jsx(lucideReact.Trash2, { size: 12 }) })] })), jsxRuntime.jsxs("div", { className: "component-preview child-preview", children: [renderFormComponent(child), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(child.name) && (jsxRuntime.jsx(ComponentActionFeatures, { component: child, mode: "test", formTemplateId: formTemplateId, formValue: formValue, formData: formData, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange ? (notes) => onNotesChange(child.id, notes) : undefined, onAttachmentChange: onAttachmentChange ? (attachments) => onAttachmentChange(child.id, attachments) : undefined, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode, isStandalone: isStandalone })), hasSubmissionData && (jsxRuntime.jsx(ComponentSubmissionActions, { component: child }))] })] })] }));
+                                }, onMouseDown: (e) => e.stopPropagation(), title: "Edit properties", children: jsxRuntime.jsx(lucideReact.Edit, { size: 12 }) }), jsxRuntime.jsx("button", { className: "btn delete-btn", onClick: (e) => onChildDelete(child, e), onMouseDown: (e) => e.stopPropagation(), title: "Delete component", children: jsxRuntime.jsx(lucideReact.Trash2, { size: 12 }) })] })), jsxRuntime.jsxs("div", { className: "component-preview child-preview", children: [renderFormComponent(child), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(child.name) && (jsxRuntime.jsx(ComponentActionFeatures, { component: child, mode: "test", formTemplateId: formTemplateId, formValue: formValue, formData: formData, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange ? (notes) => onNotesChange(child.id, notes) : undefined, onAttachmentChange: onAttachmentChange ? (attachments) => onAttachmentChange(child.id, attachments) : undefined, workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue })), hasSubmissionData && (jsxRuntime.jsx(ComponentSubmissionActions, { component: child }))] })] })] }));
 };
-const DfFormSection = ({ id, properties, mode = 'edit', formData = {}, onValueChange, onSelect, isSelected = false, className = '', onSectionSelect, onChildSelect, onChildDelete, selectedChild, renderFormComponent, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode, isStandalone }) => {
+const DfFormSection = ({ id, properties, mode = 'edit', formData = {}, onValueChange, onSelect, isSelected = false, className = '', onSectionSelect, onChildSelect, onChildDelete, selectedChild, renderFormComponent, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
     const [isCollapsed, setIsCollapsed] = React.useState(properties.basic.collapsed);
     const [isEditingTitle, setIsEditingTitle] = React.useState(false);
     const [isEditingDescription, setIsEditingDescription] = React.useState(false);
@@ -5434,7 +5387,7 @@ const DfFormSection = ({ id, properties, mode = 'edit', formData = {}, onValueCh
                                 }, children: isOver ? 'Drop components here' : 'Empty Section' }), jsxRuntime.jsx("div", { style: {
                                     fontSize: '12px',
                                     color: '#9ca3af'
-                                }, children: "Drag and drop components here to create your section" })] })) : (children.map((child) => (jsxRuntime.jsx(DraggableChild, { child: child, selectedChild: selectedChild || null, mode: mode, onChildSelect: handleChildSelect, onChildDelete: handleChildDelete, renderFormComponent: renderComponent, isChildrenEditMode: isChildrenEditMode, formData: formData, formTemplateId: formTemplateId, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode, isStandalone: isStandalone }, child.id)))) }) }))] }));
+                                }, children: "Drag and drop components here to create your section" })] })) : (children.map((child) => (jsxRuntime.jsx(DraggableChild, { child: child, selectedChild: selectedChild || null, mode: mode, onChildSelect: handleChildSelect, onChildDelete: handleChildDelete, renderFormComponent: renderComponent, isChildrenEditMode: isChildrenEditMode, formData: formData, formTemplateId: formTemplateId, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, child.id)))) }) }))] }));
 };
 
 // Dynamic imports to avoid circular dependencies
@@ -5484,7 +5437,7 @@ const normalizeTableRow = (row) => {
 };
 const DfFormPreview = ({ formComponents = [], currentDevice = 'desktop', isPreviewMode = false, initialFormData = [], onSubmit, onFormDataChange, formTitle, formDescription, formTemplateId, 
 // Add component management props for edit mode
-onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
+onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
     // Local copy of formComponents so structure updates (e.g. table cell init) are reflected immediately
     const [localFormComponents, setLocalFormComponents] = React.useState(formComponents);
     // Sync local state when the prop changes from the parent
@@ -6839,7 +6792,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
             case 'email-input':
                 // Regular text/email/number input
                 return (jsxRuntime.jsx(DfFormInput, { ...commonProps, properties: component, inputType: component.name === 'text-input' ? 'text' :
-                        component.name === 'number-input' ? 'number' : 'email', formTemplateId: formTemplateId, onThresholdIssueRaised: handleThresholdIssueRaised, raisedThresholdIssues: raisedThresholdIssues, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }));
+                        component.name === 'number-input' ? 'number' : 'email', formTemplateId: formTemplateId, onThresholdIssueRaised: handleThresholdIssueRaised, raisedThresholdIssues: raisedThresholdIssues, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user }));
             case 'textarea':
                 return jsxRuntime.jsx(DfFormTextarea, { ...commonProps, properties: component });
             case 'select':
@@ -6905,13 +6858,13 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
             case 'location':
                 return jsxRuntime.jsx(DfFormLocation, { ...commonProps, properties: component });
             case 'section':
-                return (jsxRuntime.jsx(DfFormSection, { ...commonProps, properties: component, formData: formValues, formTemplateId: formTemplateId, onThresholdActionCompletion: handleThresholdActionCompletion, onThresholdIssueRaised: handleThresholdIssueRaised, onNotesChange: handleComponentNotesChange, onAttachmentChange: handleComponentAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode, renderFormComponent: (field) => {
+                return (jsxRuntime.jsx(DfFormSection, { ...commonProps, properties: component, formData: formValues, formTemplateId: formTemplateId, onThresholdActionCompletion: handleThresholdActionCompletion, onThresholdIssueRaised: handleThresholdIssueRaised, onNotesChange: handleComponentNotesChange, onAttachmentChange: handleComponentAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, renderFormComponent: (field) => {
                         // Ensure the nested component gets the proper form value
                         // const fieldValue = formValues[field.id] || (field.basic as any)?.value || (field.basic as any)?.defaultValue || ''
                         return renderFormComponent(field);
                     } }));
             case 'table':
-                return (jsxRuntime.jsx(React.Suspense, { fallback: jsxRuntime.jsx("div", { children: "Loading table..." }), children: jsxRuntime.jsx(DfFormTable$1, { ...commonProps, properties: component, formData: formValues, formTemplateId: formTemplateId, mode: commonProps.mode, validationErrors: validationErrors, touchedFields: touchedFields, formSubmitted: formSubmitted, onThresholdActionCompletion: handleThresholdActionCompletion, onThresholdIssueRaised: handleThresholdIssueRaised, workOrderNumber: workOrderNumber, assetNumber: assetNumber, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode, renderFormComponent: (field) => {
+                return (jsxRuntime.jsx(React.Suspense, { fallback: jsxRuntime.jsx("div", { children: "Loading table..." }), children: jsxRuntime.jsx(DfFormTable$1, { ...commonProps, properties: component, formData: formValues, formTemplateId: formTemplateId, mode: commonProps.mode, validationErrors: validationErrors, touchedFields: touchedFields, formSubmitted: formSubmitted, onThresholdActionCompletion: handleThresholdActionCompletion, onThresholdIssueRaised: handleThresholdIssueRaised, workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, renderFormComponent: (field) => {
                             return renderFormComponent(field);
                         }, onNotesChange: (componentId, notes) => {
                             // Handle notes change for table cell components
@@ -7249,7 +7202,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
                                                     return comp;
                                                 });
                                                 onFormDataChange?.(updatedComponents);
-                                            }, notes: componentNotes[component.id] !== undefined ? componentNotes[component.id] : (component.basic?.notes || ''), attachments: componentAttachments[component.id] !== undefined ? componentAttachments[component.id] : (component.basic?.attachments || null), workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode })), isPreviewMode && hasSubmissionData && (jsxRuntime.jsx(ComponentSubmissionActions, { component: component }))] }, component.id));
+                                            }, notes: componentNotes[component.id] !== undefined ? componentNotes[component.id] : (component.basic?.notes || ''), attachments: componentAttachments[component.id] !== undefined ? componentAttachments[component.id] : (component.basic?.attachments || null), workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue })), isPreviewMode && hasSubmissionData && (jsxRuntime.jsx(ComponentSubmissionActions, { component: component }))] }, component.id));
                             }), !isPreviewMode && (jsxRuntime.jsxs("div", { className: "form-actions", children: [!formSubmitted && (jsxRuntime.jsx("button", { type: "button", onClick: () => handleSubmit('Saved'), className: "form-save-button", disabled: formSubmitted && !isFormValid(), children: "Save" })), jsxRuntime.jsx("button", { type: "button", disabled: !isFormValid() || !thresholdValidationState.isValid, className: "form-submit-button", title: !thresholdValidationState.isValid ? thresholdValidationState.errorMessage : '', onClick: () => handleSubmit('Submitted'), children: "Submit" })] }))] }))] }) }) }));
 };
 
@@ -7344,12 +7297,12 @@ const ensureComponentHasId = (component) => {
     }
     return component;
 };
-const SimpleTableComponent = ({ component, mode, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode, isStandalone }) => {
+const SimpleTableComponent = ({ component, mode, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
     const formValue = formData[component.id];
     // Check if component has notes or attachments for submission view
     const hasSubmissionData = mode === 'preview' && ((component.basic?.notes && component.basic.notes.trim().length > 0) ||
         (component.basic?.attachments && Array.isArray(component.basic.attachments) && component.basic.attachments.length > 0));
-    return (jsxRuntime.jsxs("div", { className: "simple-table-component", children: [renderFormComponent(component), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(component.name) && (jsxRuntime.jsx(ComponentActionFeatures, { component: component, mode: "test", formTemplateId: formTemplateId, formValue: formValue, formData: formData, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange ? (notes) => onNotesChange(component.id, notes) : undefined, onAttachmentChange: onAttachmentChange ? (attachments) => onAttachmentChange(component.id, attachments) : undefined, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode, isStandalone: isStandalone })), hasSubmissionData && (jsxRuntime.jsx(ComponentSubmissionActions, { component: component }))] }));
+    return (jsxRuntime.jsxs("div", { className: "simple-table-component", children: [renderFormComponent(component), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(component.name) && (jsxRuntime.jsx(ComponentActionFeatures, { component: component, mode: "test", formTemplateId: formTemplateId, formValue: formValue, formData: formData, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange ? (notes) => onNotesChange(component.id, notes) : undefined, onAttachmentChange: onAttachmentChange ? (attachments) => onAttachmentChange(component.id, attachments) : undefined, workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue })), hasSubmissionData && (jsxRuntime.jsx(ComponentSubmissionActions, { component: component }))] }));
 };
 const DraggableTableComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, }) => {
     const { attributes, listeners, setNodeRef, transform, transition, isDragging, isSorting, } = sortable.useSortable({
@@ -7370,7 +7323,7 @@ const DraggableTableComponent = ({ component, selectedComponent, mode, onCompone
                             onComponentDelete(component, e);
                         }, type: "button", title: "Delete Component", children: jsxRuntime.jsx(lucideReact.Trash2, { size: 12 }) })] }))] }));
 };
-const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, tableId, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode, isStandalone }) => {
+const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, tableId, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
     const dropZoneId = `table-cell-${tableId}-${cell.row}-${cell.column}`;
     const { setNodeRef, isOver } = core.useDroppable({
         id: dropZoneId,
@@ -7405,7 +7358,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
             cell.components.map((component) => {
                 // Only ensure ID if it's truly missing - don't regenerate existing IDs
                 const componentWithId = component.id ? component : ensureComponentHasId(component);
-                return (jsxRuntime.jsx(SimpleTableComponent, { component: componentWithId, mode: mode, renderFormComponent: renderFormComponent, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode, isStandalone: isStandalone }, componentWithId.id));
+                return (jsxRuntime.jsx(SimpleTableComponent, { component: componentWithId, mode: mode, renderFormComponent: renderFormComponent, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, componentWithId.id));
             }))) : (
             // Only show drop zone content in edit mode
             mode === 'edit' ? (jsxRuntime.jsx("div", { className: "empty-cell-placeholder", children: jsxRuntime.jsxs("div", { className: "cell-info", children: [jsxRuntime.jsx("span", { className: "drop-zone-text", children: "Drag and Drop a form component" }), jsxRuntime.jsxs("span", { className: "cell-coordinates", children: ["Cell (", cell.row + 1, ", ", cell.column + 1, ")"] })] }) })) : (
@@ -7416,7 +7369,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
                     visibility: 'hidden' // Hide content but maintain space
                 }, children: "\u00A0" }))) }) }));
 };
-const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationErrors = {}, touchedFields = {}, formSubmitted = false, onValueChange, onSelect, isSelected = false, className = '', onTableSelect, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode, isStandalone }) => {
+const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationErrors = {}, touchedFields = {}, formSubmitted = false, onValueChange, onSelect, isSelected = false, className = '', onTableSelect, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
     const [isCollapsed, setIsCollapsed] = React.useState(false); // Always start expanded to show drop zones
     // CRITICAL: Normalize cells from API format (object with numeric keys) to proper 2D array
     // The API may return cells as [{"0": {cell}, "1": {cell}}, ...] instead of [[cell, cell], ...]
@@ -7654,7 +7607,7 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
                                                 fontSize: '14px',
                                                 textAlign: 'center'
                                             }, children: columnName }, `header-${colIndex}`));
-                                    }) }) })), jsxRuntime.jsx("tbody", { children: cellsWithIds.map((row, rowIndex) => (jsxRuntime.jsx("tr", { className: "table-row", children: row.map((cell) => (jsxRuntime.jsx(TableCellComponent, { cell: cell, mode: mode, onComponentSelect: onComponentSelect || (() => { }), onComponentDelete: handleComponentDelete, onComponentEdit: onComponentEdit, selectedComponent: selectedComponent || null, renderFormComponent: renderComponent, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, tableId: id, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode, isStandalone: isStandalone }, cell.id))) }, rowIndex))) })] })] }))] }));
+                                    }) }) })), jsxRuntime.jsx("tbody", { children: cellsWithIds.map((row, rowIndex) => (jsxRuntime.jsx("tr", { className: "table-row", children: row.map((cell) => (jsxRuntime.jsx(TableCellComponent, { cell: cell, mode: mode, onComponentSelect: onComponentSelect || (() => { }), onComponentDelete: handleComponentDelete, onComponentEdit: onComponentEdit, selectedComponent: selectedComponent || null, renderFormComponent: renderComponent, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, tableId: id, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, cell.id))) }, rowIndex))) })] })] }))] }));
 };
 
 var dfFormTable = /*#__PURE__*/Object.freeze({