feat(agentflow): MessagesInput, StructuredOutputBuilder + ExpandTextDialog (FLOWISE-263, FLOWISE-267) (#5965)

* feat(agentflow): MessagesInput, StructuredOutputBuilder + ExpandTextDialog (FLOWISE-263, FLOWISE-267)

Wire MessagesInput and StructuredOutputBuilder atoms into EditNodeDialog
for agentMessages/llmMessages and agentStructuredOutput/llmStructuredOutput
array params. Extract shared ExpandTextDialog atom used by both
MessagesInput and NodeInputHandler for expanding multiline text fields.

- MessagesInput: role dropdown + multiline content with variable/expand icons
- StructuredOutputBuilder: key/type/description fields with conditional
  enum values and JSON schema fields
- ExpandTextDialog: reusable expand dialog for long text editing
- EditNodeDialog: name-based routing for specialized array components
- maxItems forward-compat guard on Add buttons
- Remove dead default exports for barrel-only modules

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* address gemini review feedback

* Enhance StructuredOutputBuilder with required asterisk for Description, add info tooltips for Enum Values and JSON Schema, and implement ExpandTextDialog for JSON Schema editing. Update tests to cover new features and interactions.

---------

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>

Author: jocelynlin-wd

packages/agentflow/src/atoms/ExpandTextDialog.test.tsx

@@ -0,0 +1,71 @@
+import { fireEvent, render, screen } from '@testing-library/react'
+
+import { ExpandTextDialog } from './ExpandTextDialog'
+
+const mockOnConfirm = jest.fn()
+const mockOnCancel = jest.fn()
+
+beforeEach(() => {
+    jest.clearAllMocks()
+})
+
+describe('ExpandTextDialog', () => {
+    it('should not render content when closed', () => {
+        render(<ExpandTextDialog open={false} value='' onConfirm={mockOnConfirm} onCancel={mockOnCancel} />)
+
+        expect(screen.queryByTestId('expand-content-input')).not.toBeInTheDocument()
+    })
+
+    it('should render with the provided value when open', () => {
+        render(<ExpandTextDialog open={true} value='Hello world' onConfirm={mockOnConfirm} onCancel={mockOnCancel} />)
+
+        const textarea = screen.getByTestId('expand-content-input').querySelector('textarea')!
+        expect(textarea).toHaveValue('Hello world')
+    })
+
+    it('should render title when provided', () => {
+        render(<ExpandTextDialog open={true} value='' title='Content' onConfirm={mockOnConfirm} onCancel={mockOnCancel} />)
+
+        expect(screen.getByText('Content')).toBeInTheDocument()
+    })
+
+    it('should not render title when not provided', () => {
+        render(<ExpandTextDialog open={true} value='' onConfirm={mockOnConfirm} onCancel={mockOnCancel} />)
+
+        expect(screen.queryByRole('heading')).not.toBeInTheDocument()
+    })
+
+    it('should call onConfirm with edited value when Save is clicked', () => {
+        render(<ExpandTextDialog open={true} value='Original' onConfirm={mockOnConfirm} onCancel={mockOnCancel} />)
+
+        const textarea = screen.getByTestId('expand-content-input').querySelector('textarea')!
+        fireEvent.change(textarea, { target: { value: 'Updated' } })
+        fireEvent.click(screen.getByRole('button', { name: 'Save' }))
+
+        expect(mockOnConfirm).toHaveBeenCalledWith('Updated')
+    })
+
+    it('should call onCancel when Cancel is clicked', () => {
+        render(<ExpandTextDialog open={true} value='Original' onConfirm={mockOnConfirm} onCancel={mockOnCancel} />)
+
+        fireEvent.click(screen.getByRole('button', { name: 'Cancel' }))
+
+        expect(mockOnCancel).toHaveBeenCalled()
+        expect(mockOnConfirm).not.toHaveBeenCalled()
+    })
+
+    it('should disable textarea and Save button when disabled', () => {
+        render(<ExpandTextDialog open={true} value='test' disabled={true} onConfirm={mockOnConfirm} onCancel={mockOnCancel} />)
+
+        const textarea = screen.getByTestId('expand-content-input').querySelector('textarea')!
+        expect(textarea).toBeDisabled()
+        expect(screen.getByRole('button', { name: 'Save' })).toBeDisabled()
+    })
+
+    it('should render placeholder when provided', () => {
+        render(<ExpandTextDialog open={true} value='' placeholder='Type here...' onConfirm={mockOnConfirm} onCancel={mockOnCancel} />)
+
+        const textarea = screen.getByTestId('expand-content-input').querySelector('textarea')!
+        expect(textarea).toHaveAttribute('placeholder', 'Type here...')
+    })
+})

packages/agentflow/src/atoms/ExpandTextDialog.tsx

@@ -0,0 +1,60 @@
+import { useCallback, useEffect, useState } from 'react'
+
+import { Button, Dialog, DialogActions, DialogContent, TextField, Typography } from '@mui/material'
+
+export interface ExpandTextDialogProps {
+    open: boolean
+    value: string
+    title?: string
+    placeholder?: string
+    disabled?: boolean
+    onConfirm: (value: string) => void
+    onCancel: () => void
+}
+
+/**
+ * A reusable expand dialog for editing long text content in a larger viewport.
+ * Used by NodeInputHandler (multiline string fields) and MessagesInput (message content).
+ */
+export function ExpandTextDialog({ open, value, title, placeholder, disabled = false, onConfirm, onCancel }: ExpandTextDialogProps) {
+    const [localValue, setLocalValue] = useState(value)
+
+    // Sync local state when dialog opens with a new value
+    useEffect(() => {
+        if (open) {
+            setLocalValue(value)
+        }
+    }, [open, value])
+
+    const handleConfirm = useCallback(() => {
+        onConfirm(localValue)
+    }, [localValue, onConfirm])
+
+    return (
+        <Dialog open={open} fullWidth maxWidth='md'>
+            <DialogContent>
+                {title && (
+                    <Typography variant='h6' sx={{ mb: 2 }}>
+                        {title}
+                    </Typography>
+                )}
+                <TextField
+                    fullWidth
+                    multiline
+                    minRows={12}
+                    value={localValue}
+                    disabled={disabled}
+                    onChange={(e) => setLocalValue(e.target.value)}
+                    placeholder={placeholder}
+                    data-testid='expand-content-input'
+                />
+            </DialogContent>
+            <DialogActions>
+                <Button onClick={onCancel}>Cancel</Button>
+                <Button variant='contained' disabled={disabled} onClick={handleConfirm}>
+                    Save
+                </Button>
+            </DialogActions>
+        </Dialog>
+    )
+}