Collection Editor

Allows viewing and editing of a collection of objects, supporting advanced list management, selection, and property editing.

Remarks

The Collection Editor control provides an interactive interface for managing collections of objects within the Grooper UI. It is designed for properties that represent lists or arrays, enabling users to add, remove, reorder, and edit items in a structured, tabular format. The editor supports both single and multi-selection, clipboard operations, and property editing for individual items.

UI Components

• Item List:
  • Displays all items in the collection as rows in a table.
  • Columns show relevant properties, types, and optional row numbers.
  • Supports multi-select, auto-select, row highlighting, and custom attributes.
  • Visual cues indicate invalid or dirty items.
• Session Properties Grid:
  • Shows editable properties for the currently selected item.
  • Supports inline editing, validation, and contextual help.
• Action Buttons:
  • Move Up / Move Down: Reorder selected items in the list.
  • Add: Insert a new item into the collection.
  • Delete: Remove selected items.
  • Copy / Paste: Copy selected items to the clipboard and paste items from the clipboard.

Interactive Features

• Selection Controls:
  • Click to select an item; use Ctrl + click for multi-select, Shift + click for range selection.
  • Selected rows are visually highlighted.
• Reordering:
  • Move items up or down using the action buttons or keyboard shortcuts (Ctrl + Up/Down).
• Editing:
  • Edit properties of the selected item in the session properties grid.
  • Validation errors and dirty states are flagged for review.
• Clipboard Operations:
  • Copy selected items to the clipboard for reuse.
  • Paste items from the clipboard into the collection.
• Row Attributes:
  • Custom HTML attributes and type names are included for integration with scripts and styling.

Usage Guidance

Use the Collection Editor to efficiently manage lists and arrays of objects in Grooper. Add new items, edit their properties, reorder or remove items, and use clipboard features for batch operations. The editor adapts its options and layout based on the collection type and configuration.

• For configuration lists, use multi-select and batch actions to streamline management.
• For single-instance collections, type name attributes and row highlighting provide clarity.
• Use the session properties grid to review and edit item details before committing changes.

Accessibility

• Fully navigable by keyboard and mouse.
• Screen reader support for list items, action buttons, and property grid.
• Visual highlighting for selection, focus, and error feedback.

Example

┌──────────────── Item List ─────────────────┐┌────────── Property Grid ──────────┐
│ | Name      | Type      | Status   |       ││ Category: General                 │  
│ |-----------|-----------|----------|       ││ ─ Name: {Text Box}                │
│ | Item 1    | Document  | Valid    | [↑↓]  ││ ─ Type: {Drop-down}               │
│ | Item 2    | Folder    | Invalid  | [↑↓]  ││ Category: Advanced                │
│ | Item 3    | Folder    | Invalid  | [↑↓]  ││ ─ Enabled: {Checkbox}             │
│                                            ││ ─────────── Help Window ───────── │
│ {Add} {Delete} {Copy} {Paste}              ││   Description and usage guidance  │
└────────────────────────────────────────────┘└───────────────────────────────────┘

Command Buttons

Button	Shortcut Key		Summary
north move_up	Ctrl+Up	►	Move the selected item up. The Move Up button reorders the selected item(s) in the collection, moving them one position higher in the list. Usage Select one or more items in the Item List. Click the move up button or press Ctrl + Up to move them up. The list updates immediately to reflect the new order. Accessibility Keyboard shortcut: Ctrl + Up. Screen reader support for button label and action.
south move_down	Ctrl+Down	►	Move the selected item down. The Move Down button reorders the selected item(s) in the collection, moving them one position lower in the list. Usage Select one or more items in the Item List. Click the move down button or press Ctrl + Down to move them down. The list updates immediately to reflect the new order. Accessibility Keyboard shortcut: Ctrl + Down. Screen reader support for button label and action.
delete delete	Del	►	Delete the selected item. The Delete button removes the selected item(s) from the collection. Usage Select one or more items in the Item List. Click the delete button or press Delete to remove them. The list updates immediately to reflect changes. Accessibility Keyboard shortcut: Delete. Screen reader support for button label and action.
add_circle add		►	Adds a new item. The Add button inserts a new item into the collection. Usage Click the add button to create a new item. The new item appears in the Item List and can be edited in the Session Properties grid. Accessibility Screen reader support for button label and action.
file_copy copy		►	Copy the selected rows to the clipboard. The Copy button copies the selected item(s) to the clipboard for reuse or transfer. Usage Select one or more items in the Item List. Click the copy button to copy them to the clipboard. Use the paste button to insert copied items into the collection. Accessibility Screen reader support for button label and action.
content_paste paste		►	Paste items from the clipboard into this list. The Paste button inserts items from the clipboard into the collection. Usage Click the paste button to insert copied items. Pasted items appear in the Item List and can be edited as needed. Accessibility Screen reader support for button label and action.

Child Controls

Name	Type		Summary
Item List	Object List	►	List of items in the collection. The Item List control displays all objects in the collection as rows in a table. Each row shows relevant properties, type information, and optional row numbers. The list supports multi-select, auto-select, row highlighting, and custom attributes. Visual cues indicate invalid or dirty items, and type name attributes are included for single-instance collections. Usage Click to select an item; use Ctrl + click for multi-select, Shift + click for range selection. Reorder items using the move up/down buttons or keyboard shortcuts. Review item status, type, and properties at a glance. Use custom row attributes for integration with scripts and styling. Accessibility Fully navigable by keyboard and mouse. Screen reader support for row and column data, including type names and status.
Session Properties	Property Grid	►	Properties of the selected list item. The Session Properties grid displays editable properties for the currently selected item in the collection. It supports inline editing, validation, and contextual help, allowing users to review and modify item details before committing changes. Usage Select an item in the Item List to view its properties. Edit properties directly in the grid; validation errors are flagged for review. Use contextual help and tooltips for guidance on property values. Accessibility Fully navigable by keyboard and mouse. Screen reader support for property names, values, and help content.