df-ae-forms-package 1.1.7 → 1.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +12 -0
- package/dist/index.esm.js +33 -34
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +33 -34
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -334,10 +334,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
334
334
|
'Maria Garcia',
|
|
335
335
|
'John Smith',
|
|
336
336
|
'Sarah Johnson'
|
|
337
|
-
], workOrderNumber: initialWorkOrderNumber, assetNumber: initialAssetNumber, isStandalone, inEditMode = false, isEdit }) => {
|
|
338
|
-
// Determine if workflow actions should be enabled
|
|
339
|
-
// If explicitly provided, use that. Otherwise, default to isEdit (true if editing, false/undefined otherwise).
|
|
340
|
-
// Fallback to false if neither is provided.
|
|
337
|
+
], workOrderNumber: initialWorkOrderNumber, assetNumber: initialAssetNumber, isStandalone, allowWorkflowActions, inEditMode = false, isEdit }) => {
|
|
341
338
|
const [title, setTitle] = React.useState('');
|
|
342
339
|
const [description, setDescription] = React.useState('');
|
|
343
340
|
const [workOrderNumber, setWorkOrderNumber] = React.useState('');
|
|
@@ -353,6 +350,11 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
353
350
|
const [isViewMode, setIsViewMode] = React.useState(!!issue && !inEditMode);
|
|
354
351
|
const fileInputRef = React.useRef(null);
|
|
355
352
|
const isEditMode = isEdit !== undefined ? isEdit : !!issue;
|
|
353
|
+
// Determine if workflow actions should be enabled
|
|
354
|
+
// If explicitly provided, use that. Otherwise, default to showing them if we have an existing issue.
|
|
355
|
+
const showWorkflowActions = allowWorkflowActions !== undefined
|
|
356
|
+
? allowWorkflowActions
|
|
357
|
+
: !!issue;
|
|
356
358
|
React.useEffect(() => {
|
|
357
359
|
if (isOpen) {
|
|
358
360
|
// In edit mode, prioritize issue attachments from API
|
|
@@ -691,12 +693,12 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
691
693
|
hour: '2-digit',
|
|
692
694
|
minute: '2-digit',
|
|
693
695
|
hour12: true
|
|
694
|
-
}) })] })] }), 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: [
|
|
696
|
+
}) })] })] }), 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: [(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' }))] }) })] }) }));
|
|
695
697
|
// Render modal using portal to document body for full-page overlay
|
|
696
698
|
return require$$0.createPortal(modalContent, document.body);
|
|
697
699
|
};
|
|
698
700
|
|
|
699
|
-
const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, formTemplateId, workOrderNumber, assetNumber, user, onIssueRaised, isIssueRaised = false, compact = false }) => {
|
|
701
|
+
const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, formTemplateId, workOrderNumber, assetNumber, user, onIssueRaised, isIssueRaised = false, compact = false, allowWorkflowActions, inEditMode }) => {
|
|
700
702
|
const [showRaiseIssueModal, setShowRaiseIssueModal] = React.useState(false);
|
|
701
703
|
const [issue, setIssue] = React.useState(null);
|
|
702
704
|
const [isLoadingIssue, setIsLoadingIssue] = React.useState(false);
|
|
@@ -788,16 +790,16 @@ const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, fo
|
|
|
788
790
|
// If issue is raised (either from prop or local state), don't show anything
|
|
789
791
|
// The ComponentActionFeatures will handle showing the raised issue state
|
|
790
792
|
if (isIssueRaised || localIssueRaised) {
|
|
791
|
-
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 })) }));
|
|
793
|
+
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 })) }));
|
|
792
794
|
}
|
|
793
795
|
// Show compact version for small screens/tables
|
|
794
796
|
if (compact) {
|
|
795
|
-
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 }))] }));
|
|
797
|
+
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 }))] }));
|
|
796
798
|
}
|
|
797
|
-
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 }))] }));
|
|
799
|
+
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 }))] }));
|
|
798
800
|
};
|
|
799
801
|
|
|
800
|
-
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 }) => {
|
|
802
|
+
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 }) => {
|
|
801
803
|
// Ensure formValue is always a string to prevent [object Object] errors
|
|
802
804
|
const getStringValue = (val) => {
|
|
803
805
|
if (val === null || val === undefined)
|
|
@@ -1161,7 +1163,7 @@ const DfFormInput = ({ id, properties, validationErrors = {}, formValue = '', in
|
|
|
1161
1163
|
inputWrapperRef.current?.closest('.datagrid-list-view') !== null ||
|
|
1162
1164
|
className.includes('table-cell') ||
|
|
1163
1165
|
className.includes('cell-content');
|
|
1164
|
-
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}`));
|
|
1166
|
+
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}`));
|
|
1165
1167
|
})()] }));
|
|
1166
1168
|
};
|
|
1167
1169
|
|
|
@@ -3748,7 +3750,7 @@ const AttachmentThumbnails = ({ attachments, onRemove }) => {
|
|
|
3748
3750
|
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));
|
|
3749
3751
|
}) }));
|
|
3750
3752
|
};
|
|
3751
|
-
const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, formData, onNotesChange, onAttachmentChange, notes = '', attachments = null, onThresholdActionCompletion, onThresholdIssueRaised, onBasicPropertyActionCompletion, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
3753
|
+
const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, formData, onNotesChange, onAttachmentChange, notes = '', attachments = null, onThresholdActionCompletion, onThresholdIssueRaised, onBasicPropertyActionCompletion, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
|
|
3752
3754
|
// Determine effective form value (prefer prop, fallback to formData lookup)
|
|
3753
3755
|
const effectiveFormValue = formValue !== undefined ? formValue : (formData ? formData[component.id] : undefined);
|
|
3754
3756
|
// Use effectiveFormValue for logic instead of raw formValue
|
|
@@ -4026,10 +4028,8 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
|
|
|
4026
4028
|
}, 3000);
|
|
4027
4029
|
}, [getActiveThresholdConditions, onThresholdActionCompletion, component, onBasicPropertyActionCompletion]);
|
|
4028
4030
|
const handleRaiseIssueClick = React.useCallback(() => {
|
|
4029
|
-
if (issueRaised)
|
|
4030
|
-
return;
|
|
4031
4031
|
setShowRaiseIssueModal(true);
|
|
4032
|
-
}, [
|
|
4032
|
+
}, []);
|
|
4033
4033
|
const handleRaiseIssueClose = React.useCallback(() => {
|
|
4034
4034
|
setShowRaiseIssueModal(false);
|
|
4035
4035
|
}, []);
|
|
@@ -4236,7 +4236,7 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
|
|
|
4236
4236
|
modalComponent.basic.value = selectedOption.value || effectiveValue;
|
|
4237
4237
|
}
|
|
4238
4238
|
return modalComponent;
|
|
4239
|
-
})(), formTemplateId: formTemplateId || '', notes: localNotes, attachments: localAttachments, isStandalone: isStandalone, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }))] }));
|
|
4239
|
+
})(), formTemplateId: formTemplateId || '', notes: localNotes, attachments: localAttachments, isStandalone: isStandalone, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }))] }));
|
|
4240
4240
|
};
|
|
4241
4241
|
|
|
4242
4242
|
// Attachment Thumbnails Component for Submission View
|
|
@@ -4302,7 +4302,7 @@ function ensureStringId$2(id) {
|
|
|
4302
4302
|
}
|
|
4303
4303
|
return String(id);
|
|
4304
4304
|
}
|
|
4305
|
-
const DraggableGridComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, formData = {}, formTemplateId,
|
|
4305
|
+
const DraggableGridComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, formData = {}, formTemplateId, onThresholdIssueRaised, onNotesChange, onAttachmentChange, shouldShowComponent }) => {
|
|
4306
4306
|
const formValue = formData[component.id];
|
|
4307
4307
|
const isVisible = shouldShowComponent ? shouldShowComponent(component.id) : true;
|
|
4308
4308
|
// Check if component has notes or attachments for submission view
|
|
@@ -4473,8 +4473,7 @@ const GridDropZone = ({ gridComponents, mode, onComponentSelect, onComponentDele
|
|
|
4473
4473
|
}, 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" })) })] })) }));
|
|
4474
4474
|
};
|
|
4475
4475
|
// Sub-component for displaying entries (TableView)
|
|
4476
|
-
const TableView = ({ templateComponents, dataEntries, renderFormComponent, mode, allowAddRemoveEntries, addAnotherText, removeText, maxEntries, minEntries, displayAsGrid = true, onAddEntry, onRemoveEntry, formData,
|
|
4477
|
-
formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, columnView, shouldShowComponent }) => {
|
|
4476
|
+
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 }) => {
|
|
4478
4477
|
const _formData = formData || {};
|
|
4479
4478
|
const visibleTemplateComponents = React.useMemo(() => {
|
|
4480
4479
|
if (!shouldShowComponent)
|
|
@@ -5141,7 +5140,7 @@ const DfFormDataGrid = ({ id, properties, mode = 'edit', formData = {}, onValueC
|
|
|
5141
5140
|
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 })) }))] }));
|
|
5142
5141
|
};
|
|
5143
5142
|
|
|
5144
|
-
const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDelete, renderFormComponent, isOverlay = false, isChildrenEditMode = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue }) => {
|
|
5143
|
+
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 }) => {
|
|
5145
5144
|
const formValue = formData[child.id];
|
|
5146
5145
|
// Check if component has notes or attachments for submission view
|
|
5147
5146
|
const hasSubmissionData = mode === 'preview' && ((child.basic?.notes && child.basic.notes.trim().length > 0) ||
|
|
@@ -5159,9 +5158,9 @@ const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDele
|
|
|
5159
5158
|
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) => {
|
|
5160
5159
|
e.stopPropagation();
|
|
5161
5160
|
onChildSelect(child);
|
|
5162
|
-
}, 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 })), hasSubmissionData && (jsxRuntime.jsx(ComponentSubmissionActions, { component: child }))] })] })] }));
|
|
5161
|
+
}, 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 })), hasSubmissionData && (jsxRuntime.jsx(ComponentSubmissionActions, { component: child }))] })] })] }));
|
|
5163
5162
|
};
|
|
5164
|
-
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 }) => {
|
|
5163
|
+
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 }) => {
|
|
5165
5164
|
const [isCollapsed, setIsCollapsed] = React.useState(properties.basic.collapsed);
|
|
5166
5165
|
const [isEditingTitle, setIsEditingTitle] = React.useState(false);
|
|
5167
5166
|
const [isEditingDescription, setIsEditingDescription] = React.useState(false);
|
|
@@ -5374,7 +5373,7 @@ const DfFormSection = ({ id, properties, mode = 'edit', formData = {}, onValueCh
|
|
|
5374
5373
|
}, children: isOver ? 'Drop components here' : 'Empty Section' }), jsxRuntime.jsx("div", { style: {
|
|
5375
5374
|
fontSize: '12px',
|
|
5376
5375
|
color: '#9ca3af'
|
|
5377
|
-
}, 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 }, child.id)))) }) }))] }));
|
|
5376
|
+
}, 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 }, child.id)))) }) }))] }));
|
|
5378
5377
|
};
|
|
5379
5378
|
|
|
5380
5379
|
// Dynamic imports to avoid circular dependencies
|
|
@@ -5424,7 +5423,7 @@ const normalizeTableRow = (row) => {
|
|
|
5424
5423
|
};
|
|
5425
5424
|
const DfFormPreview = ({ formComponents = [], currentDevice = 'desktop', isPreviewMode = false, initialFormData = [], onSubmit, onFormDataChange, formTitle, formDescription, formTemplateId,
|
|
5426
5425
|
// Add component management props for edit mode
|
|
5427
|
-
onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
5426
|
+
onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
|
|
5428
5427
|
// Local copy of formComponents so structure updates (e.g. table cell init) are reflected immediately
|
|
5429
5428
|
const [localFormComponents, setLocalFormComponents] = React.useState(formComponents);
|
|
5430
5429
|
// Sync local state when the prop changes from the parent
|
|
@@ -6779,7 +6778,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
6779
6778
|
case 'email-input':
|
|
6780
6779
|
// Regular text/email/number input
|
|
6781
6780
|
return (jsxRuntime.jsx(DfFormInput, { ...commonProps, properties: component, inputType: component.name === 'text-input' ? 'text' :
|
|
6782
|
-
component.name === 'number-input' ? 'number' : 'email', formTemplateId: formTemplateId, onThresholdIssueRaised: handleThresholdIssueRaised, raisedThresholdIssues: raisedThresholdIssues, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user }));
|
|
6781
|
+
component.name === 'number-input' ? 'number' : 'email', formTemplateId: formTemplateId, onThresholdIssueRaised: handleThresholdIssueRaised, raisedThresholdIssues: raisedThresholdIssues, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }));
|
|
6783
6782
|
case 'textarea':
|
|
6784
6783
|
return jsxRuntime.jsx(DfFormTextarea, { ...commonProps, properties: component });
|
|
6785
6784
|
case 'select':
|
|
@@ -6845,13 +6844,13 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
6845
6844
|
case 'location':
|
|
6846
6845
|
return jsxRuntime.jsx(DfFormLocation, { ...commonProps, properties: component });
|
|
6847
6846
|
case 'section':
|
|
6848
|
-
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, renderFormComponent: (field) => {
|
|
6847
|
+
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) => {
|
|
6849
6848
|
// Ensure the nested component gets the proper form value
|
|
6850
6849
|
// const fieldValue = formValues[field.id] || (field.basic as any)?.value || (field.basic as any)?.defaultValue || ''
|
|
6851
6850
|
return renderFormComponent(field);
|
|
6852
6851
|
} }));
|
|
6853
6852
|
case 'table':
|
|
6854
|
-
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, renderFormComponent: (field) => {
|
|
6853
|
+
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) => {
|
|
6855
6854
|
return renderFormComponent(field);
|
|
6856
6855
|
}, onNotesChange: (componentId, notes) => {
|
|
6857
6856
|
// Handle notes change for table cell components
|
|
@@ -7189,7 +7188,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
7189
7188
|
return comp;
|
|
7190
7189
|
});
|
|
7191
7190
|
onFormDataChange?.(updatedComponents);
|
|
7192
|
-
}, 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));
|
|
7191
|
+
}, 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));
|
|
7193
7192
|
}), !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" })] }))] }))] }) }) }));
|
|
7194
7193
|
};
|
|
7195
7194
|
|
|
@@ -7284,12 +7283,12 @@ const ensureComponentHasId = (component) => {
|
|
|
7284
7283
|
}
|
|
7285
7284
|
return component;
|
|
7286
7285
|
};
|
|
7287
|
-
const SimpleTableComponent = ({ component, mode, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue }) => {
|
|
7286
|
+
const SimpleTableComponent = ({ component, mode, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
|
|
7288
7287
|
const formValue = formData[component.id];
|
|
7289
7288
|
// Check if component has notes or attachments for submission view
|
|
7290
7289
|
const hasSubmissionData = mode === 'preview' && ((component.basic?.notes && component.basic.notes.trim().length > 0) ||
|
|
7291
7290
|
(component.basic?.attachments && Array.isArray(component.basic.attachments) && component.basic.attachments.length > 0));
|
|
7292
|
-
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 })), hasSubmissionData && (jsxRuntime.jsx(ComponentSubmissionActions, { component: component }))] }));
|
|
7291
|
+
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 })), hasSubmissionData && (jsxRuntime.jsx(ComponentSubmissionActions, { component: component }))] }));
|
|
7293
7292
|
};
|
|
7294
7293
|
const DraggableTableComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, }) => {
|
|
7295
7294
|
const { attributes, listeners, setNodeRef, transform, transition, isDragging, isSorting, } = sortable.useSortable({
|
|
@@ -7310,7 +7309,7 @@ const DraggableTableComponent = ({ component, selectedComponent, mode, onCompone
|
|
|
7310
7309
|
onComponentDelete(component, e);
|
|
7311
7310
|
}, type: "button", title: "Delete Component", children: jsxRuntime.jsx(lucideReact.Trash2, { size: 12 }) })] }))] }));
|
|
7312
7311
|
};
|
|
7313
|
-
const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, tableId, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue }) => {
|
|
7312
|
+
const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, tableId, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
|
|
7314
7313
|
const dropZoneId = `table-cell-${tableId}-${cell.row}-${cell.column}`;
|
|
7315
7314
|
const { setNodeRef, isOver } = core.useDroppable({
|
|
7316
7315
|
id: dropZoneId,
|
|
@@ -7345,7 +7344,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
|
|
|
7345
7344
|
cell.components.map((component) => {
|
|
7346
7345
|
// Only ensure ID if it's truly missing - don't regenerate existing IDs
|
|
7347
7346
|
const componentWithId = component.id ? component : ensureComponentHasId(component);
|
|
7348
|
-
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 }, componentWithId.id));
|
|
7347
|
+
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 }, componentWithId.id));
|
|
7349
7348
|
}))) : (
|
|
7350
7349
|
// Only show drop zone content in edit mode
|
|
7351
7350
|
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, ")"] })] }) })) : (
|
|
@@ -7356,7 +7355,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
|
|
|
7356
7355
|
visibility: 'hidden' // Hide content but maintain space
|
|
7357
7356
|
}, children: "\u00A0" }))) }) }));
|
|
7358
7357
|
};
|
|
7359
|
-
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 }) => {
|
|
7358
|
+
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 }) => {
|
|
7360
7359
|
const [isCollapsed, setIsCollapsed] = React.useState(false); // Always start expanded to show drop zones
|
|
7361
7360
|
// CRITICAL: Normalize cells from API format (object with numeric keys) to proper 2D array
|
|
7362
7361
|
// The API may return cells as [{"0": {cell}, "1": {cell}}, ...] instead of [[cell, cell], ...]
|
|
@@ -7594,7 +7593,7 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
|
|
|
7594
7593
|
fontSize: '14px',
|
|
7595
7594
|
textAlign: 'center'
|
|
7596
7595
|
}, children: columnName }, `header-${colIndex}`));
|
|
7597
|
-
}) }) })), 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 }, cell.id))) }, rowIndex))) })] })] }))] }));
|
|
7596
|
+
}) }) })), 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 }, cell.id))) }, rowIndex))) })] })] }))] }));
|
|
7598
7597
|
};
|
|
7599
7598
|
|
|
7600
7599
|
var dfFormTable = /*#__PURE__*/Object.freeze({
|