JSON-Formatierer

You are an experienced full-stack web developer. Build a web tool called "JSON-Formatierer" that meets the requirements below.

## Goal

Build a tool that validates JSON and pretty-prints or minifies it.

## Core features

- Validation with error line and column
- Indent with 2 spaces, 4 spaces or tabs
- Minify mode
- Optional alphabetical key sorting
- Copy result and download as .json

## Inputs

- JSON text
- Indentation, sorting and mode options

## Outputs

- Formatted or minified JSON
- Error message with position

## Edge cases and handling rules

- Explain common errors such as trailing commas, single quotes and comments in plain language
- Preserve integers larger than 2^53 exactly
- Strip a leading BOM
- Stay responsive with multi-megabyte input

## Implementation requirements

- Build it as a single page (HTML, CSS, JavaScript) that runs entirely in the browser, and never send the user's input to a server.
- Make the UI responsive and easy to use on mobile; label every input and keep everything keyboard accessible.
- Add a Copy button for results and show clear, friendly error messages for invalid input.
- Keep the core logic in functions separate from the UI so it can be unit-tested.

## Definition of done (test cases)

- '{"a":1,}' is reported as a trailing comma error
- Formatting then minifying keeps the same meaning
- 12345678901234567890 is preserved

First outline your implementation plan in at most five lines, then write the complete code, and finally explain how to check the test cases above.

---
name: build-json-formatter
description: Use when building or changing a JSON-Formatierer tool. Build a tool that validates JSON and pretty-prints or minifies it.
---

# Build: JSON-Formatierer

## Goal

Build a tool that validates JSON and pretty-prints or minifies it.

## Workflow

1. Review the required features, inputs and outputs below and ask about anything missing first.
2. Implement the core logic as pure functions separate from the UI.
3. Check the logic against the test cases in the verification list.
4. Build a responsive UI with an input form, a result area and a Copy button.
5. Reproduce each edge case listed under Rules and refine the error messages.

## Core features

- Validation with error line and column
- Indent with 2 spaces, 4 spaces or tabs
- Minify mode
- Optional alphabetical key sorting
- Copy result and download as .json

## Inputs

- JSON text
- Indentation, sorting and mode options

## Outputs

- Formatted or minified JSON
- Error message with position

## Rules

- Explain common errors such as trailing commas, single quotes and comments in plain language
- Preserve integers larger than 2^53 exactly
- Strip a leading BOM
- Stay responsive with multi-megabyte input
- Build it as a single page (HTML, CSS, JavaScript) that runs entirely in the browser, and never send the user's input to a server.

## Verification

- [ ] '{"a":1,}' is reported as a trailing comma error
- [ ] Formatting then minifying keeps the same meaning
- [ ] 12345678901234567890 is preserved