26 repositorios
Categorization of dropdown items into labeled groups for improved navigation.
Distinct from Select Dropdowns: Focuses on the grouping of options within dropdowns, distinct from general dropdown menus.
Explore 26 awesome GitHub repositories matching user interface & experience · Option Grouping. Refine with filters or upvote what's useful.
React-admin is a framework for building data-driven administrative interfaces that connect to REST or GraphQL backends. It provides a comprehensive suite of tools for managing the full lifecycle of administrative applications, including resource-oriented routing, declarative form scaffolding, and context-driven state management. By utilizing a modular adapter-based architecture, the framework abstracts backend communication, allowing developers to build consistent CRUD interfaces that handle data fetching, authentication, and synchronization automatically. The project distinguishes itself thr
Allows defining custom visual templates and filtering logic for dropdown suggestion options.
FastMCP is a Python framework designed for building servers that expose functions, resources, and prompts to AI models using the Model Context Protocol. It simplifies the development process by automatically deriving tool metadata, input schemas, and documentation directly from Python function signatures and type hints. The framework provides a unified container for managing these components, allowing developers to build modular applications that integrate seamlessly with AI assistants. The project distinguishes itself through its support for interactive, server-defined user interface compone
Displays predefined choices as interactive buttons to capture structured user input.
Chosen is a JavaScript library that transforms standard HTML select elements into searchable, user-friendly dropdown menus. It functions as a form input enhancement tool designed to improve the usability of long or complex selection lists. The library provides a multi-select interface that allows users to manage multiple options with selection limit controls and clear buttons. It also includes built-in support for right-to-left languages, adjusting the layout and text direction of the user interface components accordingly. The project covers a range of selection interface capabilities, inclu
Renders categorized lists of choices using group headers for better organization.
Pinia is a state management library for Vue applications that provides a centralized, type-safe architecture for organizing reactive data. It utilizes a modular store pattern, allowing developers to define independent, reusable state containers that manage shared application data, computed getters, and executable actions. The library distinguishes itself through a flexible definition model that supports both functional setup patterns and traditional object-based structures. It features a plugin-based extension architecture that enables developers to hook into the store lifecycle for custom fu
Provides a traditional object-based structure for defining state containers alongside modern composition patterns.
Android-PickerView is a custom view library for Android that provides a wheel-based scrolling interface for selecting dates, times, and custom data options. It functions as a selection component that can be used for specialized time and date picking or as a general wheel picker for custom data sets. The library features cascading selection capabilities, allowing for linked data selectors where choosing an option in one column filters the available choices in subsequent columns. It also supports cyclic scrolling to create a continuous loop and can encapsulate the selector within a modal dialog
Provides a scrolling wheel interface for users to select from custom data options.
CoreUI Free Bootstrap Admin Template is a pre-built, responsive admin dashboard template built on Bootstrap 5 for constructing back-office interfaces. It provides a library of UI components with native wrappers for React, Vue, and Angular applications, alongside a Sass-based theming system for managing brand colors, dark mode, and design tokens via variables and CSS custom properties. The template includes a set of advanced form controls such as autocomplete, date pickers, and multi-step wizards with built-in validation, and supports switching the entire interface between built-in dark and li
Allows custom HTML templates for dropdown option rendering in autocomplete inputs.
This repository contains the HTML specification, which defines the core standards for web page structuring, content organization, and document rendering. It establishes the fundamental algorithms for state-machine-based tokenization, tree construction for the document object model, and origin-based security isolation. The specification provides a framework for defining custom elements with independent lifecycles and registries. It also details the requirements for cross-document communication, session history management, and the synchronization of interface properties with content attributes.
Implements the categorization of selection options into labeled groups to improve usability.
Base UI is a headless component library and unstyled framework providing accessible interface primitives. It decouples behavioral logic and state management from the visual layer, allowing developers to implement complex UI patterns while maintaining total control over the final styling. The library implements WAI-ARIA design patterns to ensure all primitives support standard keyboard navigation and screen reader accessibility. It provides a suite of low-level building blocks that handle the internal mechanics of interface elements without bundling any CSS. The framework covers a broad range
Clusters related items under section headings within selection popups to improve scannability.
vue-multiselect is a suite of selection components for Vue.js that provides a searchable dropdown interface for single or multiple selections. It functions as a select input and tagging component capable of handling datasets from local sources or remote APIs. The project is distinguished by its support for asynchronous selection, enabling the retrieval of options from a remote source based on real-time search queries. It also features a dynamic tagging interface that allows users to create new custom tags when a required value is missing from the existing list. The component covers a broad r
Organizes long lists of selectable items into labeled categories for improved discoverability.
vue-multiselect is a selection component for Vue.js that provides a customizable dropdown input supporting single and multiple selection. It functions as a selection field that allows users to pick multiple options from a list simultaneously and as a tagging input for creating and adding custom labels to a collection. The component supports asynchronous data loading to fetch selection options from a remote API or data source on demand. It includes built-in search filtering to process queries against the options list and dynamically hide non-matching items. The project covers the development
Provides custom renderers for defining the visual templates of dropdown suggestions and selected tags.
Vue Apollo is a GraphQL integration library for Vue applications that connects Vue components to GraphQL APIs using Apollo Client. It provides a reactive data layer for querying, mutating, and subscribing to data from GraphQL endpoints, with automatic cache updates and real-time subscription support. The library offers multiple API surfaces for working with GraphQL data, including slot-based declarative components, composable functions for the Composition API, and Options API integration. It handles the full lifecycle of GraphQL operations, from automatic data fetching with reactive queries t
Renders data by using component options to manage loading, error, and success states declaratively.
Lets users manually add individual options to a dropdown using a separate component, useful for defaults or values not from a query.
Cronicle is a distributed job scheduler that replaces traditional cron with a browser-based management interface. It runs scheduled tasks across a cluster of servers with automatic failover, using a custom cron parser that intersects day-of-month and day-of-week constraints when both are specified. The system executes jobs through a plugin framework that runs command-line scripts in any language, communicating via JSON over standard input and output. The scheduler provides a web-based real-time dashboard for monitoring running jobs with live logs, resource usage charts, and progress updates.
Registers executable commands with custom parameters and advanced options for running jobs as plugins.
Zag es una librería de máquina de estados de UI headless que proporciona lógica de componentes sin estilo para asegurar un comportamiento consistente en diferentes motores de renderizado. Funciona como un kit de herramientas para modelar interacciones complejas de interfaz de usuario usando statecharts, desacoplando la lógica subyacente y los atributos de accesibilidad del estilo visual. La librería es agnóstica al framework, utilizando adaptadores especializados para conectar su lógica de máquina de estados con varias librerías de JavaScript como React, Solid, Vue y Svelte. Este enfoque permite a los desarrolladores mantener un modelo de interacción único mientras aplican cualquier solución CSS o de estilo a través de atributos de datos dirigidos por estado. Zag cubre una amplia gama de áreas funcionales, incluyendo gestión integral de accesibilidad para navegación por teclado y atributos ARIA, así como una vasta colección de primitivas interactivas. Estas incluyen controles de entrada, elementos de navegación como menús y pestañas, componentes de superposición como diálogos y popovers, y manejo complejo de medios para recorte de imágenes y captura de firmas. También proporciona utilidades para la gestión de datos jerárquicos, manejo de listas asíncronas y un sistema para construir tours guiados de productos.
Implements logic for organizing select dropdown options into categorized, labeled groups to improve navigation.
Este proyecto es una plantilla administrativa basada en React y un kit de UI diseñado para construir paneles. Proporciona una colección completa de diseños con estilo previo, una biblioteca de componentes accesible y un framework de UI basado en Sass para crear interfaces administrativas. La plantilla está estructurada específicamente como un proyecto optimizado para IA, utilizando patrones de codificación y organización diseñados para ayudar a los asistentes de IA a generar código React consistente y listo para producción. Cuenta con un sistema de estilos flexible que utiliza variables Sass y propiedades personalizadas de CSS para admitir temas claros y oscuros personalizables. El kit cubre una amplia gama de capacidades de interfaz, incluyendo widgets de visualización de datos, tablas interactivas con ordenamiento y paginación, y elementos de formulario complejos como asistentes de varios pasos. Incluye sistemas de navegación de alto nivel como barras laterales y rutas de navegación, así como componentes estructurales como cuadrículas receptivas, diálogos modales e interfaces de calendario accesibles.
Forces users to select only from a provided list to prevent custom value entry.
Ark is a headless UI component library that delivers accessible, cross-framework primitives with behavior governed by finite state machines. It provides unstyled components that encapsulate logic and accessibility — including full keyboard navigation, focus management, and WAI-ARIA support — while leaving visual styling entirely to the consumer. Components expose scoped data attributes for CSS targeting and use state machines to produce predictable, testable interactive behavior across every state transition. The library distinguishes itself through a state propagation model that distributes
Provides radio group components that enforce mutual exclusivity with full keyboard and ARIA support.
Searchkit es un framework de UI de búsqueda diseñado para construir interfaces de búsqueda con React y Vue que se conectan a backends de Elasticsearch y OpenSearch. Proporciona una capa de traducción de consultas de búsqueda para convertir estados de búsqueda del frontend en lenguajes de consulta específicos del motor y un motor de renderizado de resultados para mostrar aciertos, menús de facetas y paginación. El framework incluye una interfaz de búsqueda semántica que permite búsquedas de vecinos más cercanos basadas en vectores y procesamiento de lenguaje natural. Se diferencia por un sistema de traducción basado en adaptadores y un mapeo de UI basado en componentes que conecta la lógica de búsqueda con vistas intercambiables a través de una interfaz estandarizada. El proyecto cubre una amplia gama de capacidades, incluyendo gestión de estado para sincronizar filtros y paginación, generación compleja de facetas para filtrado jerárquico y numérico, y lógica de ranking personalizada mediante ponderación de prioridad de campos. También proporciona herramientas para fijar resultados, modificación de reglas de consulta y visualización geográfica mediante interfaces basadas en mapas. Para seguridad y extensibilidad, el proyecto utiliza una capa de acceso API para realizar proxy de solicitudes entre el navegador y el clúster de búsqueda, y soporta la interceptación de solicitudes basada en middleware para modificar consultas y respuestas.
Provides filtering interfaces specifically designed for rating-based attributes such as star ratings.
vue-select es un componente de UI reutilizable para aplicaciones Vue que sirve como reemplazo accesible para el elemento select estándar de HTML. Proporciona una interfaz desplegable filtrable diseñada para manejar selecciones simples o múltiples y etiquetado. El componente admite la obtención de datos de forma asíncrona y la selección de datos remotos, permitiendo a los usuarios buscar y recuperar información de servidores externos. También incluye integración con renderizado del lado del servidor (SSR) para mejorar la velocidad de carga inicial y la visibilidad en motores de búsqueda. El proyecto cubre una variedad de capacidades, incluyendo filtrado de búsqueda en tiempo real, desarrollo de entradas de formulario personalizadas y personalización de componentes basada en slots para anular la lógica de renderizado predeterminada.
Implements search filtering within the selection component to narrow down available options.
Este proyecto es una colección de patrones de implementación y ejemplos de código fuente para construir aplicaciones de escritorio utilizando varias librerías de interfaz de Python. Proporciona implementaciones de referencia y patrones arquitectónicos para múltiples frameworks, incluyendo PyQt, PySide, Tkinter, Kivy y Streamlit. El repositorio se distingue por ofrecer ejemplos especializados para diversos tipos de interfaz, que van desde software de escritorio profesional y ventanas nativas hasta dashboards de datos web reactivos y herramientas de ciencia de datos. Incluye material de referencia específico para patrones de UI multiplataforma, como diseños modelo-vista y ejecución asíncrona de tareas en segundo plano. El proyecto cubre una amplia gama de capacidades, incluyendo gestión de diseño, desarrollo de widgets personalizados con animaciones y renderizado acelerado por GPU para visualizaciones en tiempo real. También demuestra técnicas de gestión de datos como filtrado basado en proxy y estilo de datos tabulares, así como flujos de trabajo de despliegue para empaquetar código fuente en ejecutables distribuibles con activos incrustados. Los ejemplos abordan además componentes de UI funcionales como validación de entrada, menús de navegación e integración en la bandeja del sistema, junto con implementaciones de seguridad para autenticación de usuarios y control de acceso basado en roles.
Implements selection widgets that allow users to enter custom values not present in the predefined list.
Open-UI is a set of web UI standard specifications and a standardized UI component library. It provides technical definitions for universal UI components, behaviors, and accessibility requirements designed to ensure cross-browser compatibility through a series of web language proposals. The project features a web accessibility polyfill and extensible control polyfills that provide modern UI control functionality in environments lacking native browser support. It includes a browser compatibility suite to verify that components meet defined behavioral and accessibility requirements. The librar
Implements real-time filtering mechanisms to narrow down available options within a selection component.