13 مستودعات
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 هو إطار عمل JavaScript تقدمي قائم على المكونات مصمم لبناء واجهات مستخدم تفاعلية وتطبيقات الصفحة الواحدة. يركز على نظام قوالب تصريحي يحول HTML إلى وظائف عرض فعالة، مما يسمح للمطورين بتنظيم الواجهات المعقدة في وحدات معزولة وقابلة لإعادة الاستخدام تتزامن تلقائياً مع حالة التطبيق. يتميز إطار العمل بنظام تفاعلية لتتبع التبعيات يراقب الوصول إلى البيانات أثناء العرض لإطلاق تحديثات دقيقة. يوفر بنية مرنة تدعم كلاً من التبني التزايدي كمكتبة خفيفة الوزن وتطوير التطبيقات على نطاق واسع. يمكن للمطورين الاستفادة من نموذج قابلية توسيع قوي قائم على الإضافات لحقن المنطق العام، بينما يضمن توفيق DOM الافتراضي لإطار العمل تحديثات فعالة للواجهة من خلال حساب الحد الأدنى من الطفرات. بعيداً عن قدرات العرض الأساسية، يتضمن المشروع مجموعة شاملة من الأدوات لإدارة حالة التطبيق، والتوجيه القائم على URL، والعرض من جانب الخادم. يوفر دعماً واسعاً لتركيب المكونات، وتوزيع المحتوى، وإدارة الرسوم المتحركة، إلى جانب تدابير أمنية مدمجة مثل الهروب التلقائي للمحتوى لمنع الثغرات الشائعة. يتم توزيع إطار العمل مع إعلانات نوع رسمية لدعم التحليل الثابت ويمكن تثبيته عبر مديري الحزم القياسيين أو دمجه مباشرة في بيئات المتصفح عبر علامات البرنامج النصي.
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.
هذا المشروع هو مجموعة شاملة من مقتطفات الكود القابلة لإعادة الاستخدام، والخطافات المخصصة، وأنماط التنفيذ لبناء واجهات المستخدم باستخدام React. يعمل كمكتبة من الأمثلة القصيرة المصممة لحل مهام التطوير الشائعة، بدءاً من إدارة الحالة إلى تكامل DOM. توفر المجموعة مجموعة واسعة من الأدوات المتخصصة للتفاعل مع واجهات برمجة تطبيقات المتصفح، بما في ذلك تتبع أبعاد النافذة، وتقييم استعلام الوسائط، ومراقبة حالة الاتصال. كما تتضمن أدلة عملية ومقتطفات لتحسين الأداء، مثل التخزين المؤقت (memoization)، والتحميل الكسول، وإلغاء ارتداد تغيير الحالة. تغطي مجالات القدرات الواسعة تنفيذ مكونات واجهة المستخدم التفاعلية مثل النوافذ المنبثقة، وشرائح العرض، والواجهات المتبوبة، بالإضافة إلى الأنماط المعمارية لجلب البيانات، واستمرار الحالة، والتحقق من التحديث غير المتزامن. تتضمن المكتبة أيضاً أدوات لإدارة النماذج، ومعالجة الأحداث، ومزامنة التوجيه عبر تتبع حالة URL.
Transforms hierarchical data structures into visual trees using self-referencing recursive components.
هذا هو موقع التوثيق الشامل لإطار عمل JavaScript التقدمي Vue 2. وهو بمثابة مرجع فني ودليل تطوير لبناء واجهات مستخدم تفاعلية وتطبيقات الصفحة الواحدة. يوفر الموقع مرجعاً مفصلاً لـ JavaScript API ودليل مكونات الويب. ويغطي تنفيذ البنى القائمة على المكونات، وإدارة الحالة التفاعلية، واستخدام DOM افتراضي لمزامنة حالة التطبيق مع المتصفح. تشرح الوثائق الإمكانيات بما في ذلك التوجيه من جانب العميل، ومعالجة DOM التعريفية، وتحسينات بناء الواجهة الأمامية مثل العرض من جانب الخادم وتجميع القوالب المسبق. كما تشرح نهج إطار العمل لمزامنة الحالة، ودورات حياة المكونات، واستخدام التوجيهات المخصصة. يتم الحفاظ على المحتوى كمجموعة من البرامج التعليمية والمواصفات، مع تحرير الوثائق عبر Markdown.
Supports components that can call themselves recursively to render nested or tree-like data structures.
This project is a React drag-and-drop tree component and tree data management utility used for rendering nested hierarchical data. It provides a sortable hierarchical list that allows users to manage parent-child relationships and visualize complex tree structures. The component enables interactive tree restructuring, where users can reorganize the hierarchy by dragging and dropping nodes to change their parent or sequence. It supports moving or copying nodes between different tree instances and provides controls to enforce movement restrictions based on custom logic or depth limits. The too
Renders nested hierarchies using self-referential components that recursively draw child node branches.
react-mosaic is a React tiling window manager used to organize components into a resizable grid of windows and tabbed containers. It provides a layout system featuring resizable split panes and a draggable window orchestrator for arranging content into nested rows and columns. The system includes a serializable layout engine that converts window arrangements into JSON, enabling the persistence and restoration of workspace configurations across sessions. It supports a tabbed workspace interface where multiple panels are grouped into single areas with switchable headers. The project covers com
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 هي أداة لإنشاء تمثيلات بصرية للقواعد الرسمية وهياكل اللغة. تعمل كمكتبة تحول أنظمة التدوين الكثيفة، مثل Backus-Naur Form أو التعبيرات العادية، إلى مخططات انسيابية قابلة للقراءة. تستخدم الأداة محرك تخطيط قائماً على الإحداثيات وتركيب مكونات متكرر لإنشاء مخططات كأشجار هرمية. من خلال فصل منطق الحساب الهندسي عن طبقة الإخراج، فإنها تدعم العرض من خلال الرسومات المتجهة القابلة للتوسع أو نص Unicode، مما يضمن بقاء المخططات واضحة وقابلة للتوسع عبر بيئات مختلفة. يمكن للمستخدمين ضبط المعلمات البصرية بما في ذلك تباعد الأسطر، والانحناء، ومحاذاة العناصر لتناسب متطلبات التوثيق المحددة. يمكن تصدير المخططات التي تم إنشاؤها كملفات صور مستقلة أو ترميز خام للدمج في الأدلة التقنية ومواصفات الويب.
Constructs complex diagrams by recursively nesting smaller structural elements into a unified hierarchical tree.
This library provides a React component for rendering interactive hierarchical data structures. It is designed to visualize nested information through recursive composition, allowing users to navigate deep data hierarchies by expanding and collapsing branches. The component distinguishes itself by integrating drag-and-drop functionality, enabling users to reorganize nodes directly within the interface. It also supports asynchronous data loading, which fetches child branches on demand to manage remote or deep datasets efficiently. The library includes performance optimizations for large datas
Implements recursive component rendering to build visual hierarchies of arbitrary depth.