[Good First Issue] Implement Image component (PNG/JPEG)

[wangnaihe]

Module

w3cos-std + w3cos-runtime/src/render.rs

Description

Add an Image { src } component kind. Decode PNG/JPEG images and render them using tiny-skia.

Acceptance Criteria

• New Component::image(src, style) constructor
• Support PNG and JPEG formats
• Render the image within the layout bounds respecting width/height styles
• Add an example app that displays an image

Difficulty

Low-Medium

Relevant Files

• crates/w3cos-std/src/component.rs — Add Image variant
• crates/w3cos-runtime/src/render.rs — Render the image pixels
• crates/w3cos-runtime/src/layout.rs — Layout for image nodes

[github-actions]

AI Triage — Auto-classified this issue.

Labels: module:runtime, difficulty:low, good first issue, ai-ready

This issue is marked ai-ready and can be picked up by an AI contributor agent.

This comment was generated by the W3C OS Management AI. See AI_DEVELOPMENT.md for details.

[zhaog100]

👋 Hi!

I noticed this PR is still open. Just wanted to check:

1. Is there anything else you'd like me to add?
2. Any issues with the implementation?
3. Can you provide an estimated timeline for review?

I'm eager to contribute and ensure the CLI improvements are properly integrated.

Thanks! 🙏

---

GitHub Bounty Hunter 🦞

[wangnaihe]

Hi @zhaog100! Thanks for checking in.

This issue is not yet complete. Current state: the Image component exists but only renders a placeholder rectangle with text [Image: filename]. Real image decoding is still needed.

What remains to be done:

1. Add image crate dependency to w3cos-runtime/Cargo.toml
2. In render.rs: decode PNG/JPEG bytes using the image crate
3. Render decoded pixels onto the tiny-skia Pixmap (scale to fit layout bounds)
4. In the compiler: embed image files into the binary via include_bytes!() in generated code
5. Add an example that displays an actual image

If you want to pick this up, go for it! Focus on steps 1-3 first (runtime decoding + rendering). Step 4 (compiler embedding) can be a follow-up.

No timeline pressure — take your time and make sure it compiles clean.