YAML counterpart: visual-yaml

[lucianfialho]

Hey! 👋

First off, great work on visual-json — the schema-aware tree/form editing approach is really well done.

I've been building visual-yaml, a YAML counterpart inspired by this project. It follows a similar architecture (headless core + framework UI packages) but adds YAML-specific features:

• Full YAML support: comments, anchors & aliases, scalar styles, collection styles
• Tree + Form split-panel editor with resizable sidebar
• Drag-and-drop reordering
• Search across keys, values, and comments
• Structural diff view
• Undo / redo history
• JSON Schema validation and auto-detection (GitHub Actions, Docker Compose, GitLab CI, Kubernetes, etc.)
• Dark mode

The core package is headless (@visual-yaml/core) with a React UI layer (@visual-yaml/react), mirroring visual-json's separation of concerns.

I wanted to open this issue to:

1. Give credit and say thanks for the inspiration
2. Ask whether a YAML counterpart was ever considered for this repo or if keeping them as separate projects makes more sense
3. See if there's any interest in cross-pollinating ideas or sharing an ecosystem (e.g., shared schema validation logic)

Happy to hear your thoughts!

[ctate]

Hey @lucianfialho - yes absolutely. visual-json is meant to handle any data structure format. JSON is just the most instantly recognizable 🙂

[lucianfialho]

Hey @ctate, thanks for the response! That's great to hear.

I've been working on a YAML adapter that follows the same architecture — the tree model is already format-agnostic, so it's really just about adding fromYaml/toYaml at the parse/serialize boundary.

I'll put together a PR with:

1. core/src/yaml.ts — fromYaml() and toYaml() adapters using the yaml library
2. Export from core/index.ts — so consumers can use both JSON and YAML
3. VS Code extension — add *.yaml/*.yml to file patterns with format detection
4. Tests — round-trip and edge cases (comments, multiline strings, anchors)

The operations layer (setValue, moveNode, etc.) stays completely untouched since it's already generic.

I'll have the PR up soon!

[lucianfialho]

PR is up! → #29

Kept it minimal — the tree model is already format-agnostic so it's just a thin adapter layer at the parse/serialize boundary. YAML schemas (Docker Compose, GitHub Actions, GitLab CI, etc.) are included too.

Let me know if you'd like any changes.