Free GraphQL Schema @deprecated Directive Extractor Tool

Application Overview

This is a single-file, browser-based utility designed for GraphQL API maintainers. It serves as a rapid-scan tool for identifying fields and types marked with the @deprecated directive, helping developers manage API evolution and technical debt.

Core Features

• Input Parser: A large textarea for pasting raw GraphQL Schema Definition Language (SDL).
• Real-time Extraction: The tool parses input instantly without requiring a 'submit' action, providing a seamless user experience.
• Structured Output Table: Results are rendered in a clean, responsive table showing Type, Field/Enum Value, and Deprecation Reason.
• CSV Export: A one-click download feature to save the deprecation list for external reporting.
• Copy-to-Clipboard: Ability to copy specific rows or the entire list of deprecated items.
• Input Validation: Basic syntax validation to warn the user if the provided text is not a valid GraphQL format.

UI & Design Specifications

• Aesthetic: A modern, professional SaaS aesthetic. Strict light-mode configuration utilizing a color palette of #FFFFFF (background), #F8FAFC (secondary background), #1E293B (text), and #2563EB (primary action blue).
• Layout:
  • Header: Title and brief description, centered.
  • Input Section: Large, syntax-highlighted textarea (using monospace fonts like 'Fira Code' or 'Courier') with a subtle border and soft shadow.
  • Results Section: Located below the input, hidden by default. Appears with a smooth fade-in animation once data is parsed.
• Animations: Subtle interactions, such as row hover effects in the results table and smooth transitions for button state changes.

Developer Directives & Technical Constraints

• Single File: All HTML, CSS (Tailwind via CDN), and Vanilla JavaScript must be contained within a single .html file.
• State Management: Use only in-memory JavaScript variables. NO localStorage, sessionStorage, or cookies. The app must not attempt to persist state across reloads.
• Sandbox Compatibility: Do not use alert(), confirm(), or prompt(). Replace these with custom CSS/JS-driven modals.
• Performance: Use efficient regex or a lightweight tokenizer for parsing to ensure high performance on large schema files (up to 1MB).
• Accessibility: Ensure all inputs have appropriate labels, and the table is keyboard-navigable.
• Responsive Design: The layout must stack vertically on mobile devices and provide a side-by-side view (input on left, results on right) on desktop screens.