📄️ Overview
The @kousta-ui/components package provides a collection of reusable React components.
📄️ Button
A theme‑aware Button with variants, sizes, disabled and loading states.
📄️ Menu
The Menu component renders a lightweight, accessible dropdown that can be opened via click or hover and positioned relative to its trigger. It’s composed, headless-friendly, and easy to customize.
📄️ Context Menu
The ContextMenu provides a customizable, nested right‑click menu. It supports options, groups, separators, sub‑menus, per‑item enable/disable, and automatic viewport‑aware placement.
📄️ Modal
The Modal component provides an accessible and flexible dialog interface for displaying content on top of the current page. It supports controlled and uncontrolled usage patterns, positioning, sizing, lifecycle callbacks, and backdrop configuration.
📄️ Input
A versatile Input component that provides form-friendly input fields with integrated labels, error handling, and optional left/right sections. Built with accessibility and customization in mind.
📄️ Select
A flexible Select component that provides searchable dropdown functionality with local filtering, disabled options, and customizable rendering. Perfect for choosing from a list of options with search capabilities.
📄️ AsyncSelect
An advanced AsyncSelect component that provides server-side search and infinite scrolling capabilities. Perfect for large datasets where you need to fetch data dynamically from an API.
📄️ WindowBoundary
A performance-optimized WindowBoundary component that detects when elements enter or exit the viewport using the Intersection Observer API. It is perfect for lazy loading, infinite scrolling, triggering animations, and other performance optimizations.
📄️ ComponentPropsProvider
A powerful ComponentPropsProvider that allows you to set global default props and create custom variants for Kousta UI components. Perfect for maintaining consistent design systems and reducing prop duplication across your application.
📄️ Label
The Label component renders a styled ` element with support for required and error states. It is designed to be used with form components like Input and Select`.
📄️ FormElement
The FormElement is a layout component used to arrange a label and its corresponding input field either vertically or horizontally.
📄️ Group
The Group is a layout component that arranges its children in a stack (horizontally or vertically) and intelligently handles the styling of the first, middle, and last elements to create a cohesive group.
📄️ ErrorBoundary
The ErrorBoundary is a component that catches JavaScript errors anywhere in its child component tree, logs those errors, and displays a fallback UI instead of the component tree that crashed.