melt-ui/melt-ui
Melt Ui
Melt UI este o bibliotecă headless UI pentru Svelte care oferă o colecție de constructori de componente accesibile și fără stiluri predefinite. Funcționează ca un framework de componente accesibile și un instrument de gestionare a stării, oferind logica necesară pentru a construi elemente de interfață care respectă standardele WAI-ARIA și suportă navigarea prin tastatură fără a impune stiluri vizuale specifice.
Biblioteca dispune de un motor de poziționare a elementelor flotante care gestionează plasarea popover-urilor, tooltip-urilor și meniurilor în raport cu elementele declanșatoare. Acest sistem utilizează portaluri pentru a preveni tăierea layout-ului și încorporează prevenirea automată a overflow-ului pentru a se asigura că elementele rămân în limitele ecranului.
Setul de instrumente acoperă o gamă largă de componente UI funcționale, inclusiv elemente de formular precum combobox-uri și slidere, tipare de navigare precum tree views și tab-uri, și utilitare de overlay precum modale de dialog. De asemenea, oferă interfețe specializate pentru selectarea datei și orei, precum și componente de layout precum acordeoane și bare de instrumente.
Features
- Headless Component Logic - Implements the headless UI pattern by separating functional behavior and accessibility logic from the visual presentation layer.
- Shared State Stores - Uses reactive Svelte stores as shared state containers to synchronize UI values across disparate interface elements.
- Application State Management - Provides systems for tracking and updating interaction states via reactive objects to drive real-time UI changes.
- Svelte UI Libraries - Provides a comprehensive collection of accessible, unstyled UI components specifically for the Svelte ecosystem.
- Headless Accessibility Logic - Provides a framework for implementing accessibility logic and ARIA patterns decoupled from visual styling.
- Floating Element Positioning - Implements a floating element positioning engine to calculate coordinate offsets for overlays relative to targets.
- Component State Coordination - Implements a logic layer that coordinates values and synchronization between complex UI components and stores.
- Headless UI Libraries - Offers a logic-only library that enables the creation of custom branded components without predefined visual styles.
- Svelte Headless UI Libraries - Provides a comprehensive suite of unstyled, accessible component builders designed exclusively for Svelte.
- WAI-ARIA Frameworks - Acts as a framework that automatically generates ARIA attributes and keyboard event handlers for accessibility compliance.
- ARIA Attribute Injection - Automatically computes and injects standardized ARIA roles and attributes into the DOM for accessibility compliance.
- Accordions - Ships an accordion component with collapsible content sections and accessible headings.
- Advanced UI Pattern Implementations - Implements a wide array of advanced interface patterns including comboboxes, tree views, and date pickers.
- Date Pickers - Ships accessible components for selecting and displaying single dates or specific date ranges.
- Toggle Switches - Provides a toggle switch component for capturing binary true or false states.
- Hierarchical Tree Views - Implements a tree view component for navigating hierarchical folder-like data structures.
- Dropdown Menus - Provides a dropdown menu component supporting keyboard navigation and typeahead searching.
- Select Inputs - Ships a select input component for choosing one or more options from a predefined list.
- Comboboxes - Provides an accessible combobox component combining text input with a selectable dropdown list.
- Pagination Controls - Provides pagination controls for navigating through large datasets broken into sequential pages.
- Menubars - Implements a menubar component for horizontal navigation with nested submenus.
- Popover Overlays - Provides popover overlays that appear as floating content panels anchored to a target element.
- Modal Overlays - Provides modal dialog overlays that trap user focus and support nested layers.
- PIN Input Components - Implements segmented input fields for security codes with auto-advancing focus and paste support.
- Portal Rendering - Utilizes portal rendering to mount floating UI elements outside the standard DOM hierarchy to prevent layout clipping.
- Radio Groups - Provides a radio group component for managing single-choice selection from a set of mutually exclusive options.
- Scroll Areas - Provides a custom scroll area container to manage overflow content with programmatic control.
- Slider Components - Provides an accessible slider component for range selection with support for tick marks and callbacks.
- Tabbed Navigation - Provides a tabbed navigation system for organizing content into selectable views.
- Table of Contents Components - Ships a table of contents component that tracks scroll position and highlights active anchors.
- Tag Inputs - Implements a tags input component for entering and managing multiple discrete labels.
- Toolbar Components - Implements a toolbar component for creating grouped sets of related action buttons or controls.
- Calendar Components - Provides accessible calendar components for managing date-based data input and navigation.
- UI Component Libraries - Accessible, headless component builders for custom UI development.
