7 dépôts
UI components that provide integrated code editing capabilities with syntax highlighting and language support.
Distinct from React Component Canvas Editors: None of the candidates cover general code editor components; mt1 is for canvas-based visual builders, and mt3 is for general visualization libraries.
Explore 7 awesome GitHub repositories matching user interface & experience · Code Editor Components. Refine with filters or upvote what's useful.
CodeMirror is a browser-based code editor framework and modular extension system used to embed full-featured text editors into web pages. It functions as a syntax tree parsing engine and a language server protocol client, enabling structural language analysis and deep integration with external programming language services. The project is distinguished by its modular architecture, which uses a system of extensions and compartments for dynamic reconfiguration at runtime. It supports real-time collaborative editing and state synchronization through an operational transformation framework, allow
Provides a complete code editor UI component featuring syntax highlighting, key bindings, and undo history.
Sandpack is a browser-based toolkit for building live code editing experiences. It combines a custom Node.js runtime that executes JavaScript and npm dependencies entirely client-side with composable React components for assembling code editor interfaces, all within an iframe-sandboxed execution environment for security. The toolkit provides a hot-reload development workflow where file and dependency updates are streamed to the running preview and trigger automatic recompilation without a full page refresh. It includes a theme-override styling system for customizing the editor and preview app
Assembles a tailored code editing interface by combining components, applying themes, and adjusting layout.
JSON Editor est un framework d'interface utilisateur piloté par schéma et un éditeur basé sur le web utilisé pour générer des formulaires interactifs et valider des données JSON. Il traduit les spécifications JSON Schema en une hiérarchie d'éléments de formulaire HTML, permettant aux utilisateurs de manipuler des structures JSON complexes via une interface structurée plutôt que par du texte brut. Le framework se distingue par un système d'extension basé sur des plugins qui prend en charge des fonctions de résolution personnalisées et l'intégration d'éditeurs spécialisés, tels que WYSIWYG, Markdown et des éditeurs de code avec coloration syntaxique. Il emploie une résolution de schéma récursive pour gérer les définitions imbriquées et implémente une validation conditionnelle basée sur l'état en utilisant une logique if-then-else. Le projet fournit un large éventail de capacités, y compris la liaison de données bidirectionnelle, la gestion de la mise en page des tableaux et des objets pour les grilles et les onglets, et la synchronisation dynamique des champs via l'interpolation de template. Sa bibliothèque de composants couvre les entrées standard aux côtés d'outils spécialisés comme les sélecteurs de couleur, les sélecteurs de date-heure, les composants d'autocomplétion et les interfaces de téléchargement de fichiers. L'interface prend en charge la localisation des chaînes d'interface utilisateur et s'intègre à divers frameworks CSS pour découpler la génération de formulaires structurels du style visuel.
Integrates full-featured code editor components with syntax highlighting for various programming and markup languages.
Platform est un framework pour construire des applications de back-office et des tableaux de bord administratifs en utilisant Laravel. Il fonctionne comme un framework d'interface utilisateur piloté par schéma et un générateur CRUD qui construit automatiquement des interfaces de gestion de base de données, des formulaires de saisie et des règles de validation à partir de définitions de modèles programmatiques. Le projet se distingue par un kit d'interface utilisateur backend complet qui prend en charge la capture de données avancée, y compris le mappage de coordonnées géographiques, les matrices de données JSON tabulaires et le suivi des métadonnées marketing. Il dispose d'un système robuste de contrôle d'accès basé sur les rôles pour gérer la visibilité des ressources et la protection des routes, parallèlement à une implémentation de recherche plein texte globale qui indexe les données à travers plusieurs modèles. La plateforme couvre un large éventail de capacités, y compris le chargement de données asynchrone, les systèmes de notification multicanaux et une bibliothèque de composants de formulaire spécialisés pour la gestion de texte riche et de fichiers. Elle fournit également des outils pour la visualisation de données via l'agrégation de modèles et la création de graphiques, ainsi que des utilitaires pour le rafraîchissement partiel de page afin de simuler une expérience d'application monopage. Les options d'intégration permettent la connexion de contrôleurs existants et de templates hérités pour faciliter une migration progressive des fonctionnalités vers le framework.
Includes UI components that provide integrated code editing capabilities with syntax highlighting.
monaco-react is a React component wrapper for the Monaco Editor, providing a declarative way to embed a browser-based text editor into web applications. It includes components for standard code editing with syntax highlighting and a specialized diff editor for side-by-side version comparison. The project enables the integration of syntax validation to flag errors and provides mechanisms for managing multiple files through unique model identifiers, which preserve undo history and selection states during switches. It allows for custom asset loading via CDN or local paths and provides access to
Provides a declarative React wrapper for embedding the Monaco Editor into web applications.
Ce projet est un wrapper React pour l'éditeur Monaco, fournissant un ensemble de composants d'interface réutilisables pour intégrer des éditeurs de code complets basés sur le navigateur et des outils de visualisation de différence côte à côte. Il permet l'intégration d'un éditeur de texte avec coloration syntaxique et prise en charge multi-langage directement dans les applications web. La bibliothèque inclut un visualiseur de diff de code dédié qui exploite le moteur de diff Monaco pour visualiser les changements entre deux versions différentes d'extraits de code. Elle fournit un accès programmatique aux instances d'éditeur sous-jacentes et gère le cycle de vie opérationnel de l'éditeur, incluant l'initialisation et le nettoyage. L'implémentation couvre la gestion de l'état de l'éditeur, la configuration pilotée par les props pour les thèmes et les dimensions, et la synchronisation des événements de changement de l'éditeur avec l'état de l'application.
Provides a reusable UI component for embedding a code editor with syntax highlighting and language support.
Judge0 is an online code execution engine and multi-language compiler API designed to compile and run source code within isolated sandboxes. It functions as an asynchronous job processor that handles code submissions via a queue and provides a secure environment to run arbitrary programs while preventing unauthorized system access. The system distinguishes itself through a multi-stage compilation pipeline and a flexible execution model that supports both single-file submissions and multi-file program execution via archives. It employs an isolate-based sandboxing mechanism to enforce strict ha
Provides a web-based code editor component with syntax highlighting for integration into external sites.