Skip to content

Feat: Add an Astron MaaS screenshot-to-code skill #86

Description

@FenjuFu

Summary

Add a scenario-level iflytek-screenshot-to-code skill that turns a UI screenshot into runnable frontend code through an Astron MaaS vision model.

The workflow is inspired by abi/screenshot-to-code, while keeping this repository's skill self-contained and using iFLYTEK's OpenAI-compatible MaaS endpoint.

Motivation

The repository already exposes atomic OCR and image-understanding capabilities. Screenshot-to-code is a useful next composition: it combines visual understanding, layout reconstruction, and code generation into a reusable agent workflow. It also matches the repository roadmap toward scenario-oriented skills.

Proposed scope

  • Add skills/iflytek-screenshot-to-code/ with a focused SKILL.md and usage documentation.
  • Add a dependency-free Python CLI that:
    • accepts PNG, JPEG, or WebP screenshots;
    • sends a base64 data URL to the Astron MaaS OpenAI-compatible /chat/completions API;
    • supports a small set of explicit output stacks;
    • writes the generated code atomically to a caller-selected path;
    • reports API and malformed-response errors without exposing credentials.
  • Configure the endpoint, model ID, and API key through environment variables or CLI flags.
  • Add offline unit tests with a mocked HTTP transport; CI must not require MaaS credentials.
  • Document upstream inspiration and avoid vendoring code from screenshot-to-code.

Acceptance criteria

  • The skill is discoverable for screenshot/mockup-to-code requests.
  • Local validation rejects missing files, unsupported formats, empty model responses, and ambiguous multi-file output.
  • The default output is a single self-contained HTML file; framework modes clearly document their single-file contract.
  • Tests cover request construction, Markdown-fence normalization, response parsing, and output behavior.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions