Desktop: mermaid image nodes render without the image

Đang mở Phù hợp với người mới
  • Có gì không ổn?
#62,893 1 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

Chưa có ai nhận issue này.

Đánh giá

Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức phù hợp với người mới
77/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
typescript
Lĩnh vực
desktop

Hướng nghiên cứu

Bắt đầu tại packages/session-ui/src/components/markdown-mermaid.ts và kiểm tra các tùy chọn Pele renderAsync, đặc biệt là images: false. Kiểm tra cách các nút hình ảnh Mermaid được hiển thị trong ngăn Desktop Review và liệu việc bật hiển thị hình ảnh có giữ nguyên hành vi Markdown hiện tại hay không. Hoàn tất khi các nút hình ảnh trong lưu đồ hiển thị hình ảnh thay vì khoảng trống.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

reproduced
Description

Mermaid image nodes (node@{ img: "..." }) show only their label in the Markdown viewer. The image is missing. Normal Markdown images in the same file (![x](assets/x.png)) display correctly.

The cause seems to be ./packages/session-ui/src/components/markdown-mermaid.ts, which calls Pele with images: false:

const result = await pele.renderAsync(source, {
  ...
  images: false,
})

With this option, Pele leaves the <image> element out of the SVG but still reserves the space for it, so the node shows only its label above an empty gap.

Plugins

No response

OpenCode version

2.2.6

Steps to reproduce
  1. Create a markdown file with: 
    ![image](assets/image.png)

```mermaid
flowchart TB
  a["start"]
  b@{ img: "assets/image.png", label: "image node", pos: "b", w: 90, h: 53, constraint: "on" }
  c@{ img: "https://mermaid.js.org/favicon.svg", label: "remote image", pos: "b", w: 60, h: 60 }
  a --> b --> c
```
  2. Open the file in the desktop Review pane.
  3. The Markdown image shows, but nodes b and c show only their labels with empty space.
Screenshot

No response

Operating System

Mac OS

Terminal

No response

Ngôn ngữ chính
TypeScript
Star
225k
Fork
30.4k
Merge trung bình
4 giờ 7 phút
Pull request đã merge (30 ngày)
554

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của anomalyco/opencode

Tất cả issue của anomalyco/opencode

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.