Awesome GitHub RepositoriesInteractive Tooltips

Tippy.js is a JavaScript tooltip library and interactive popup framework used to create tooltips, popovers, and dropdowns. It functions as a floating UI component toolkit that renders content relative to a reference element with support for automatic positioning, flip-positioning, and offsets. The library acts as an accessible overlay manager, using ARIA attributes and focus management to ensure screen reader compatibility. It also serves as a CSS animation tool, providing utilities for transitions, spring physics, and themes to manage the visual entry and exit of floating interface elements.

Carbon is an enterprise design system that provides a comprehensive collection of reusable UI components, design tokens, and guidelines for building professional web applications. It functions as a CSS framework that enforces a unified design language across projects through standardized typography, spacing, and color palettes. The system utilizes a platform-agnostic design token system to maintain visual consistency across different technologies. This includes centralized management of brand colors, motion easing curves, and a curated library of accessible SVG icons. The framework covers a

Tether is a DOM positioning engine designed to anchor floating user interface elements, such as tooltips and dropdowns, to target elements. It functions as a logic engine for managing the placement of overlays and synchronizing the position of secondary elements relative to primary anchors. The system includes collision detection and overflow prevention to ensure that floating menus and overlays remain within the visible viewport. It automatically repositions elements when they encounter page boundaries to prevent visual clipping. The tool manages dynamic element alignment and tracking durin

This project is a JavaScript UI component library and frontend utility toolkit. It serves as a web modal framework and popup library, providing a specialized system for rendering interactive dialogs, overlays, and layered interfaces over web page content. The library is distinguished by its comprehensive set of overlay tools, including alert dialogs, confirmation prompts, and the ability to embed external content via iframes. It also features a responsive twelve-column grid system for cross-device layout compatibility and an internal modular dependency management system for on-demand loading

XPopup is an Android popup UI framework and overlay component library used to build customizable dialogs, bottom sheets, and overlay views. It serves as a dialog engine for creating high-performance popup views and provides a toolkit for executing entrance and exit transitions. The library is distinguished by its ability to render ultra-long, high-resolution images using memory-efficient loading and drag-to-dismiss interactions. It supports displaying overlay views while an application is in the background through system overlay permissions. The framework covers anchor-based positioning for

Cobe est une bibliothèque de globe WebGL conçue pour la visualisation interactive de données géographiques 3D. Il fonctionne comme un composant de carte basé sur canvas qui rend une carte du monde, permettant le tracé de coordonnées de latitude et longitude via des marqueurs et des arcs de connexion. La bibliothèque se distingue en liant des éléments HTML standard à des coordonnées 3D en utilisant le positionnement d'ancrage CSS. Cette intégration permet l'attachement d'éléments DOM, tels que des étiquettes et des infobulles, directement aux marqueurs et arcs sur la sphère. Le système couvre le tracé de données géographiques et la cartographie de connexions réseau, utilisant la rotation automatisée et les interactions utilisateur pour afficher les relations spatiales. Il gère la projection de coordonnées géographiques dans l'espace 3D et l'interpolation de chemins courbes entre des emplacements mondiaux.

Codehike est un framework de documentation basé sur React et un outil de walkthrough de code interactif. Il fonctionne comme un orchestrateur de contenu markdown qui transforme le markdown décoré en données structurées et en composants React, servant de couche de visualisation pour mettre en évidence des plages de code, des diffs et des erreurs de compilation. Le projet se distingue par sa capacité à créer des expériences de "scrollycoding" et des tutoriels techniques étape par étape. Il propose des animations au niveau des tokens qui démontrent visuellement l'évolution de la logique entre les versions de code et fournit un système pour synchroniser l'état de l'UI avec la position de défilement du navigateur. Le framework couvre un large éventail de capacités de visualisation, incluant la création de diaporamas de code, des mises en page en surbrillance et des blocs de code à onglets. Il supporte l'annotation détaillée via des tooltips, des callouts et des notes de bas de page, ainsi que des utilitaires fonctionnels comme des sélecteurs de langage, la transpilation de code et l'intégration de données de compilation en temps réel. Le système utilise une validation basée sur des schémas pour garantir la sécurité des types et la cohérence des données extraites des fichiers markdown.

balloon.css est un framework léger piloté par CSS pour implémenter des infobulles et des superpositions textuelles personnalisables. C'est une bibliothèque pure CSS qui permet de créer des éléments contextuels informatifs sans nécessiter de runtime JavaScript. Le framework utilise des variables CSS pour permettre la personnalisation des couleurs, des polices et des animations. Les infobulles peuvent être positionnées dans des directions spécifiques par rapport à leur élément déclencheur et prennent en charge l'intégration de contenu riche, comme des caractères spéciaux HTML et des polices d'icônes. La visibilité est principalement gérée par des déclencheurs au survol, bien que le système prenne en charge la visibilité programmatique en basculant des attributs HTML spécifiques. Le moteur de rendu utilise le positionnement absolu et des pseudo-éléments pour afficher le contenu en fonction de l'interaction utilisateur ou d'états définis.

TagSpaces is an offline-first file tagging and organization platform that lets you manage local files with portable metadata stored directly in filenames or sidecar JSON files, eliminating the need for a central database. It functions as a full-text file search engine, a Kanban board file organizer, a local AI file assistant, an S3-compatible cloud file manager, and a web clipper and bookmark manager, all within a single application. The project distinguishes itself through a local-first architecture where all file operations, indexing, and AI processing run entirely on the device, with cloud

Hopscotch est une bibliothèque et un framework JavaScript pour créer des visites guidées de produits interactives et des guides d'intégration utilisateur. Il sert d'outil pour construire des tutoriels étape par étape qui mettent en évidence des éléments de page spécifiques et affichent des infobulles contextuelles pour aider les utilisateurs à naviguer dans les interfaces d'applications web. La bibliothèque fonctionne comme un orchestrateur d'infobulles qui ancre les bulles pédagogiques aux éléments HTML en calculant leur position dans la fenêtre du navigateur. Elle prend en charge la création de visites personnalisées grâce à l'utilisation de feuilles de style et de modèles de balisage personnalisés pour la personnalisation visuelle. Le framework inclut des capacités pour la gestion de séquences et l'intégration d'événements, permettant aux développeurs de déclencher des rappels JavaScript personnalisés lors des transitions de visite pour synchroniser le guide avec les changements d'état de l'application.

Il s'agit d'une bibliothèque de visite guidée et d'un framework d'onboarding pour les applications React. Il fournit un système pour créer des visites interactives étape par étape en utilisant des popovers ancrés aux éléments et des outils de masquage visuel pour mettre en évidence des composants d'interface spécifiques. La bibliothèque se concentre sur l'accessibilité, fournissant un support intégré pour les lecteurs d'écran et la navigation au clavier afin d'assurer un onboarding utilisateur inclusif. Elle permet une personnalisation étendue en permettant le remplacement des éléments d'interface par défaut, tels que les badges et les boutons, par des composants React personnalisés. Le framework couvre l'orchestration de la visite via la gestion d'état et le ciblage d'éléments basé sur des sélecteurs. Il inclut des capacités pour le défilement automatique de la fenêtre, la gestion des transitions de popover et la capacité de restreindre l'interaction de l'utilisateur avec l'interface sous-jacente pendant une visite.

This project is a React tooltip component and CSS-driven library used to display descriptive text bubbles when users hover over or focus on specific elements. It functions as an accessible UI widget and customizable framework for managing informational popovers within React applications. The library distinguishes itself through flexible anchor management, allowing a single tooltip instance to be linked to multiple trigger elements via CSS selectors or HTML data attribute binding. It provides specific controls for visibility timing and animation, as well as the ability to disable automatic sty

Ace is a responsive admin template and UI component library built on Bootstrap 3. It provides a comprehensive framework for creating administrative dashboards with a grid-based layout system that adapts to various screen sizes. The project features a broad array of pre-styled layouts for administrative interfaces, including specialized page templates for user profiles, email clients, and real-time chat interfaces. It includes a configuration system for adjusting visual presentations through color skins and right-to-left mirroring support. The library covers a wide range of interface capabili

Makie.jl is a high-performance Julia data visualization library and hardware-accelerated plotting engine used to create interactive 2D and 3D visualizations. It functions as a reactive visualization framework where plots update automatically via observables and compute graphs, and as a vector graphics generator for high-resolution academic output. The system is distinguished by its backend-agnostic rendering pipeline, which supports OpenGL, WebGL, and ray-traced scenes. It employs a grammar-of-graphics approach to map variables to aesthetic attributes and utilizes a hierarchical scene graph t

Unovis is a modular SVG and Canvas data visualization library used to build interactive charts, maps, and network graphs. It provides a framework-agnostic set of primitives for creating data dashboards and specialized visualizations. The library is distinguished by its dedicated toolkits for different visualization domains, including an XY charting library for coordinated plots, a network graph framework for relational data, and a geospatial visualization toolkit for TopoJSON-based mapping. Its capability surface covers a wide range of data representations, including linear, area, and bar ch

This project is a comprehensive design system framework and component library built for React. It provides a suite of modular, accessible, and themeable interface elements designed to maintain a unified visual language and brand alignment across complex web applications. By encapsulating interaction logic and styling within individual components, it enables developers to build consistent, responsive interfaces through declarative composition. The library distinguishes itself by prioritizing inclusive user experiences through built-in accessibility management, including standardized keyboard n

Ce projet est un framework de jeu de stratégie en temps réel construit pour le moteur Godot, fournissant un modèle fondamental pour développer des titres de stratégie isométriques. Il offre une collection de systèmes réutilisables conçus pour accélérer la création de jeux compétitifs, incluant le support pour les participants humains et l'intelligence artificielle. Le framework se distingue par une suite complète de mécanismes de base adaptés au genre de la stratégie en temps réel. Il inclut un système dédié de brouillard de guerre qui obscurcit les régions de la carte en fonction de la ligne de vue des unités, aux côtés d'une recherche de chemin isométrique et d'une logique de navigation pour les unités terrestres et aériennes. Le moteur dispose également d'un système de point de ralliement de structure pour le déploiement automatisé d'unités et d'un utilitaire de configuration de match pour définir les règles, les rosters et les mises en page de carte avant le début des sessions. Au-delà de ces mécanismes de base, le projet fournit un ensemble complet de systèmes de jeu pour gérer le commandement et le contrôle des unités, l'équilibrage de l'économie des ressources et le suivi de l'inventaire. Il inclut des composants d'interface interactifs tels que la gestion de la sélection d'unités, des minimappes tactiques et des info-bulles contextuelles pour faciliter l'interaction du joueur. Le framework incorpore également des outils de diagnostic pour la surveillance des performances en temps réel et prend en charge la coordination multijoueur pour des environnements compétitifs partagés.