Migrate picker-script-create to PCUI

[willeastcott]

Summary

• Migrates picker-script-create from Legacy UI components to PCUI (Overlay, Label, TextInput)
• Updates SCSS selectors from Legacy UI to PCUI
• Adds real-time validation feedback as the user types
• Improves keyboard handling with global Escape support
• Applies same improvements to both editor and code-editor versions

Changes

Component Migration

• Replaces LegacyOverlay, LegacyLabel, LegacyTextField with PCUI equivalents
• Uses PCUI event system (input.on('keydown', ...)) instead of DOM listeners

Keyboard Handling

• Modernizes from deprecated keyCode to evt.key
• Escape now works globally when overlay is visible (not just when input has focus)
• Event handlers are added on show and removed on hide for clean lifecycle management

Validation UX

• Real-time validation via keyChange: true - error message updates as user types
• Validate label starts hidden and only shows when input is invalid

Code Quality

• Adds TypeScript typing for callback parameter

• Uses nullish coalescing (??) for defaults

• Uses optional chaining (callback?.(...))

• Removes redundant code and comments

• I confirm I have read the contributing guidelines

[Copilot]

Pull request overview

Migrates the script-create picker UI from legacy components to PCUI in both the main editor and code editor, while updating styling and keyboard handling to modern patterns.

Changes:

• Reimplements picker-script-create in the editor and code editor using Overlay, Label, and TextInput from @playcanvas/pcui, including typed callback signatures.
• Modernizes keyboard handling from keyCode to evt.key and simplifies callback invocation with optional chaining.
• Updates SCSS to target PCUI overlay structure and classes for the script-create picker, aligning styling with existing PCUI-based pickers.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated no comments.

File	Description
src/editor/pickers/picker-script-create.ts	Replaces legacy UI elements with PCUI components, adds a typed callback, and updates key handling and focus behavior for the script-create picker in the main editor.
src/code-editor/pickers/picker-script-create.ts	Aligns the code editor’s script-create picker with the updated implementation, including typed callback, simplified input config, and modern key handling.
sass/editor/_editor-main.scss	Replaces legacy .picker-script-create.center styling with PCUI-specific .pcui-overlay.picker-script-create rules mirroring the code editor’s PCUI overlay styles.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.