basecn

A set of collapsible panels with headings.

Displays a callout for user attention.

A dialog that requires user response to proceed.

Displays content within a desired ratio.

An input that suggests options as you type.

An easily stylable avatar component.

Displays a badge or a component that looks like a badge.

Displays the path to the current resource using a hierarchy of links.

Displays a button or a component that looks like a button.

A container that groups related buttons together with consistent styling.

A date field component that allows users to enter and edit date.

Displays a card with header, content, and footer.

A carousel with motion and swipe built using Embla.

A control that allows the user to toggle between checked and not checked.

An interactive component which expands/collapses a panel.

An input combined with a list of predefined items to select.

Fast, composable, unstyled command menu for React.

Displays a menu to the user — such as a set of actions or functions — triggered by a button.

A window overlaid on either the primary window or another dialog window, rendering the content underneath inert.

A drawer component for React.

A panel that slides in from the edge of the screen.

Displays a menu to the user — such as a set of actions or functions — triggered by a button.

Use the Empty component to display an empty state.

Combine labels, controls, and help text to compose accessible form fields and grouped inputs.

Renders a form built with React Hook Form.

Renders a form built with Tanstack Form.

For sighted users to preview content available behind a link.

Displays a form input field or a component that looks like an input field.

Display additional information or actions to an input or textarea.

A versatile component that you can use to display any content.

Used to display textual user input from keyboard.

Renders an accessible label associated with controls.

A visually persistent menu common in desktop applications that provides quick access to a consistent set of commands.

A collection of links for navigating websites.

Pagination with page navigation, next and previous links.

Displays rich content in a portal, triggered by a button.

Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.

A set of checkable buttons—known as radio buttons—where no more than one of the buttons can be checked at a time.

Accessible resizable panel groups and layouts with keyboard support.

Augments native scroll functionality for custom, cross-browser styling.

Displays a list of options for the user to pick from—triggered by a button.

Visually or semantically separates content.

Visually or semantically separates content.

Extends the Dialog component to display content that complements the main content of the screen.

A composable, themeable and customizable sidebar component.

Use to show a placeholder while content is loading.

An input where the user selects a value from within a given range.

An opinionated toast component for React.