13 repositorios
UI components capable of invoking themselves within their own templates to render nested or tree-like data structures.
Distinct from Infinite Scroll Components: Distinct from infinite scroll components: focuses on self-referential component rendering rather than continuous data loading.
Explore 13 awesome GitHub repositories matching user interface & experience · Recursive Components. Refine with filters or upvote what's useful.
Vue es un framework de JavaScript progresivo basado en componentes diseñado para construir interfaces de usuario reactivas y aplicaciones de una sola página. Se centra en un sistema de plantillas declarativo que transforma HTML en funciones de renderizado eficientes, permitiendo a los desarrolladores organizar interfaces complejas en unidades aisladas y reutilizables que se sincronizan automáticamente con el estado de la aplicación. El framework se distingue por un sistema de reactividad de seguimiento de dependencias que monitorea el acceso a los datos durante el renderizado para activar actualizaciones precisas. Proporciona una arquitectura flexible que admite tanto la adopción incremental como una biblioteca ligera como el desarrollo de aplicaciones a gran escala. Los desarrolladores pueden aprovechar un modelo de extensibilidad basado en plugins robusto para inyectar lógica global, mientras que la reconciliación del DOM virtual del framework asegura actualizaciones de interfaz eficientes calculando mutaciones mínimas. Más allá de sus capacidades de renderizado principales, el proyecto incluye un conjunto completo de herramientas para gestionar el estado de la aplicación, enrutamiento basado en URL y renderizado del lado del servidor. Ofrece un amplio soporte para la composición de componentes, distribución de contenido y gestión de animaciones, junto con medidas de seguridad integradas como el escape automático de contenido para prevenir vulnerabilidades comunes. El framework se distribuye con declaraciones de tipo oficiales para admitir el análisis estático y puede instalarse a través de gestores de paquetes estándar o integrarse directamente en entornos de navegador a través de etiquetas de script.
Supports self-referential component rendering for building nested structures like trees.
Livewire is a full-stack framework for PHP that enables the development of reactive, dynamic user interfaces using server-side classes and templates. By bridging the gap between server-side logic and client-side DOM updates, it allows developers to build interactive web applications without writing custom JavaScript. The framework operates as a component-based library, where modular units encapsulate interface logic, state, and event handling directly on the server. The framework distinguishes itself through a reactive architecture that automatically synchronizes state between the browser and
Allows components to render themselves recursively to build hierarchical structures like tree views.
This project is a JSON Schema form generator and React UI component that automatically creates web forms based on JSON Schema definitions. It serves as a schema-driven form builder used to transform declarative data definitions into interactive user interfaces for data entry and validation. The tool provides capabilities for dynamic form generation and JSON Schema integration, allowing for the automatic creation of input fields and layouts to avoid manual coding. It implements schema-based validation to ensure user input adheres to standardized JSON Schema rules in real time. The system mana
Implements components that recursively render themselves to support nested JSON Schema data hierarchies.
This project is a declarative framework for building interactive web forms by parsing JSON Schema definitions. It functions as a component-based generator that automatically maps schema constraints to input fields and validation logic, ensuring that data collection remains consistent with defined structures. The library distinguishes itself through a registry-based architecture that allows for extensive customization of the user interface. Developers can override default widgets, field templates, and layout structures to accommodate unique data types or specific design requirements. It suppor
Renders nested or tree-like data structures by recursively invoking components within their own templates.
JSON Hero is a web-based utility designed for viewing, analyzing, and sharing structured data. It provides an interactive interface for exploring complex JSON payloads, allowing users to navigate nested structures through hierarchical rendering, global search, and keyboard-driven controls. The platform distinguishes itself by performing client-side schema inference and automated schema generation, which allows users to understand data types and constraints without server-side processing. It enhances data readability by injecting contextual previews for specific string patterns—such as dates,
Displays nested data structures by recursively mapping object nodes to interactive UI elements that support expansion and collapse.
Mindmap is a cybersecurity knowledge base and reference library that organizes security tools, frameworks, and methodologies into a visual knowledge map. It functions as a curated directory of cheat sheets and command guides for offensive and defensive security operations, presented as a hierarchical interface with collapsible nodes. The project converts structured markdown files into navigable visual trees to facilitate the study of penetration testing workflows and DevOps learning roadmaps. It also serves as a security compliance framework, providing structured mappings of NIST and ISO 2700
Employs recursive UI components to render deeply nested, collapsible navigation trees.
Este proyecto es una colección integral de fragmentos de código reutilizables, hooks personalizados y patrones de implementación para construir interfaces de usuario con React. Sirve como una biblioteca de ejemplos cortos diseñados para resolver tareas de desarrollo comunes, que van desde la gestión del estado hasta la integración con el DOM. La colección proporciona una amplia gama de utilidades especializadas para interactuar con APIs del navegador, incluyendo seguimiento de dimensiones de ventana, evaluación de consultas de medios y monitoreo de estado en línea. También incluye guías prácticas y fragmentos para la optimización del rendimiento, como memorización, carga diferida (lazy loading) y debouncing de cambios de estado. Las áreas de capacidad amplias cubren la implementación de componentes de UI interactivos como modales, carruseles e interfaces con pestañas, así como patrones arquitectónicos para la obtención de datos, persistencia de estado y verificación de actualizaciones asíncronas. La biblioteca también incluye utilidades para la gestión de formularios, manejo de eventos y sincronización de enrutamiento mediante el seguimiento del estado de la URL.
Transforms hierarchical data structures into visual trees using self-referencing recursive components.
Este es el sitio web de documentación integral para el framework de JavaScript progresivo Vue 2. Sirve como referencia técnica y guía de desarrollo para construir interfaces de usuario reactivas y aplicaciones de una sola página. El sitio proporciona una referencia detallada de la API de JavaScript y un directorio de componentes web. Cubre la implementación de arquitecturas basadas en componentes, gestión de estado reactivo y el uso de un DOM virtual para sincronizar el estado de la aplicación con el navegador. La documentación detalla capacidades que incluyen enrutamiento del lado del cliente, manipulación declarativa del DOM y optimizaciones de compilación frontend como renderizado del lado del servidor y precompilación de plantillas. También explica el enfoque del framework para la sincronización de estado, ciclos de vida de componentes y el uso de directivas personalizadas. El contenido se mantiene como una colección de tutoriales y especificaciones, con documentación editada a través de Markdown.
Supports components that can call themselves recursively to render nested or tree-like data structures.
Este proyecto es un componente de árbol de arrastrar y soltar para React y una utilidad de gestión de datos de árbol utilizada para renderizar datos jerárquicos anidados. Proporciona una lista jerárquica ordenable que permite a los usuarios gestionar relaciones padre-hijo y visualizar estructuras de árbol complejas. El componente permite la reestructuración interactiva del árbol, donde los usuarios pueden reorganizar la jerarquía arrastrando y soltando nodos para cambiar su padre o secuencia. Admite mover o copiar nodos entre diferentes instancias de árbol y proporciona controles para aplicar restricciones de movimiento basadas en lógica personalizada o límites de profundidad. La herramienta incluye capacidades para la visualización de datos jerárquicos, como buscar y resaltar nodos específicos mientras se expanden automáticamente sus rutas principales. También proporciona utilidades para el procesamiento de datos, incluyendo la conversión de arrays de datos planos en jerarquías anidadas y viceversa. Los usuarios pueden modificar la presentación visual de los nodos del árbol mediante estilos personalizados o temas predefinidos.
Renders nested hierarchies using self-referential components that recursively draw child node branches.
react-mosaic es un gestor de ventanas en mosaico de React utilizado para organizar componentes en una rejilla redimensionable de ventanas y contenedores con pestañas. Proporciona un sistema de diseño con paneles divididos redimensionables y un orquestador de ventanas arrastrables para organizar el contenido en filas y columnas anidadas. El sistema incluye un motor de diseño serializable que convierte las disposiciones de ventanas en JSON, permitiendo la persistencia y restauración de configuraciones de espacio de trabajo entre sesiones. Admite una interfaz de espacio de trabajo con pestañas donde múltiples paneles se agrupan en áreas únicas con encabezados conmutables. El proyecto cubre una gestión integral del diseño a través de control programático y mosaico automatizado, incluyendo la reorganización mediante arrastrar y soltar y el reequilibrio del orden de las ventanas. También proporciona opciones de personalización de UI para barras de herramientas de ventanas, encabezados de pestañas y renderizado de estados vacíos.
Uses recursive components to traverse and render the tiling layout tree into nested split-panes and tab groups.
This project is a React component for visualizing, exploring, and editing JSON data structures through an interactive, tree-based user interface. It renders complex JSON arrays and objects in a responsive browser interface that supports collapsing and expanding nodes. The utility functions as an interactive editor, allowing users to modify, add, or delete keys and values within JSON objects graphically rather than through raw text files. It includes a clipboard manager for copying specific objects or arrays from the visualized tree directly to the system clipboard. The component supports the
Uses self-referential components to recursively render deeply nested JSON objects and arrays.
Railroad-diagrams es una utilidad para generar representaciones visuales de gramáticas formales y estructuras de lenguaje. Funciona como una biblioteca que transforma sistemas de notación densos, como la forma de Backus-Naur o expresiones regulares, en diagramas de flujo legibles. La herramienta utiliza un motor de diseño basado en coordenadas y composición de componentes recursiva para construir diagramas como árboles jerárquicos. Al separar la lógica de cálculo geométrico de la capa de salida, admite el renderizado a través de gráficos vectoriales escalables (SVG) o texto Unicode, asegurando que los diagramas permanezcan claros y escalables en diferentes entornos. Los usuarios pueden ajustar parámetros visuales incluyendo el espaciado de línea, la curvatura y la alineación de elementos para adaptarse a requisitos de documentación específicos. Los diagramas generados pueden exportarse como archivos de imagen independientes o marcado sin formato para su integración en manuales técnicos y especificaciones basadas en web.
Constructs complex diagrams by recursively nesting smaller structural elements into a unified hierarchical tree.
Esta librería proporciona un componente de React para renderizar estructuras de datos jerárquicas interactivas. Está diseñada para visualizar información anidada mediante composición recursiva, permitiendo a los usuarios navegar por jerarquías de datos profundas expandiendo y colapsando ramas. El componente se distingue por integrar funcionalidad de arrastrar y soltar (drag-and-drop), permitiendo a los usuarios reorganizar nodos directamente dentro de la interfaz. También soporta carga de datos asíncrona, que obtiene ramas hijas bajo demanda para gestionar datasets remotos o profundos de manera eficiente. La librería incluye optimizaciones de rendimiento para grandes datasets utilizando scroll virtual para renderizar solo los nodos visibles en el viewport. Ofrece una gestión de estado flexible, permitiendo a los desarrolladores controlar la selección de nodos, expansión y estado de casillas de verificación (checkbox) a través de lógica de componente interna o sistemas de estado de aplicación externos.
Implements recursive component rendering to build visual hierarchies of arbitrary depth.