mirror of
https://github.com/basketikun/infinite-canvas.git
synced 2026-08-06 01:14:36 +08:00
HouYunFei
25 lines
1.5 KiB
Plaintext
25 lines
1.5 KiB
Plaintext
---
|
|
title: Prompt Reference Thumbnail Plan
|
|
description: Display real image thumbnails for @ references in the canvas prompt input
|
|
---
|
|
|
|
# Prompt Reference Thumbnail Plan
|
|
|
|
## Problem
|
|
|
|
A plain textarea can display only text labels for `@` references. The canvas prompt panel needs real image thumbnails while preserving ordinary text editing, IME input, keyboard navigation, deletion, and the existing send contract.
|
|
|
|
## Solution
|
|
|
|
Introduce `CanvasPromptChipInput`, a focused `contentEditable` input that renders text and atomic reference chips. Keep the external value and callbacks compatible with the existing prompt panel so model invocation and connected-resource numbering do not change.
|
|
|
|
Implementation requirements:
|
|
|
|
- Reuse the existing composer approach for selection restoration, composition events, paste, and keyboard handling.
|
|
- Treat each reference chip as a non-editable unit and remove it with Backspace or Delete.
|
|
- Render image references with object URLs and accessible labels; keep text, video, and audio references compact.
|
|
- Serialize the editable DOM back to the current plain-text reference format before sending.
|
|
- Replace only the prompt panel input and keep the existing model selectors, prompt library, resource resolution, and generation requests unchanged.
|
|
|
|
Manual verification should cover Chinese IME, ordinary slash text, multiline paste, adding and deleting multiple references, thumbnail rendering, selection movement, sending, and restoring the draft.
|