base-ui

Étoiles0

Forks0

Mis à jour5 juillet 2026 à 07:31

This skills tells you how to access docs of Base UI. Base UI is a React component library focused on accessibility, performance, and developer experience.

Installation

Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.

Exécuter dans Manus

Source

sushichan044

sushichan044/vivlio-style-preview

Ouvrir le dépôt GitHub Voir les dépôts du créateur

Téléchargement

Exécuter dans Manus

Métiers associésSOC

Basé sur la classification professionnelle SOC

Développeurs de logicielsProfessions informatiques et mathématiques·SOC 15-1252

SKILL.md

readonly

Plus depuis ce dépôt

même dépôt

react-router

sushichan044/vivlio-style-preview

Build applications with React Router in Framework, Data, Declarative, and unstable RSC modes. Use when configuring routes, route modules, loaders, actions, forms, fetchers, navigation, pending UI, SSR/SPA/pre-rendering, middleware, URL params/search params, or React Router upgrades.

2026-07-050

vitest-browser-react

sushichan044/vivlio-style-preview

Read this when you are testing React Component with Vitest Browser Mode tests. Test file extension is expected to `.browser.test.{ts,tsx}`.

2026-07-050

name	base-ui
description	This skills tells you how to access docs of Base UI. Base UI is a React component library focused on accessibility, performance, and developer experience.

Base UI

This is the documentation for the @base-ui/react package. It contains a collection of components and utilities for building user interfaces in React. The library is designed to be composable and styling agnostic. The Tailwind CSS examples are written for Tailwind CSS v4. If package.json uses Tailwind CSS v3, automatically convert unsupported styles to v3-compatible equivalents.

Overview

Quick start: A quick guide to getting started with Base UI.
Accessibility: Learn how to make the most of Base UI's accessibility features and guidelines.
Releases:
About Base UI: An overview of Base UI, providing information on its history, team, and goals.
Community: Learn how to use Base UI with styles, where to get help, how to stay up to date, and how to contribute.
v1.0.0: v1.0.0 release notes. Dec 11, 2025.
v1.0.0-alpha.4: v1.0.0-alpha.4 release notes. Dec 17, 2024.
v1.0.0-alpha.5: v1.0.0-alpha.5 release notes. Jan 10, 2025.
v1.0.0-alpha.6: v1.0.0-alpha.6 release notes. Feb 6, 2025.
v1.0.0-alpha.7: v1.0.0-alpha.7 release notes. Mar 20, 2025.
v1.0.0-alpha.8: v1.0.0-alpha.8 release notes. Apr 17, 2025.
v1.0.0-beta.0: v1.0.0-beta.0 release notes. May 29, 2025.
v1.0.0-beta.1: v1.0.0-beta.1 release notes. Jul 1, 2025.
v1.0.0-beta.2: v1.0.0-beta.2 release notes. Jul 30, 2025.
v1.0.0-beta.3: v1.0.0-beta.3 release notes. Sep 3, 2025.
v1.0.0-beta.4: v1.0.0-beta.4 release notes. Oct 1, 2025.
v1.0.0-beta.5: v1.0.0-beta.5 release notes. Nov 17, 2025.
v1.0.0-beta.6: v1.0.0-beta.6 release notes. Nov 17, 2025.
v1.0.0-beta.7: v1.0.0-beta.7 release notes. Nov 27, 2025.
v1.0.0-rc.0: v1.0.0-rc.0 release notes. Dec 4, 2025.
v1.0.0-rc.1: v1.0.0-rc.1 release notes. Dec 11, 2025.
v1.0.0-rc.2: v1.0.0-rc.2 release notes. Dec 11, 2025.
v1.1.0: v1.1.0 release notes. Jan 15, 2026.
v1.2.0: v1.2.0 release notes. Feb 12, 2026.
v1.3.0: v1.3.0 release notes. Mar 12, 2026.
v1.4.0: v1.4.0 release notes. Apr 13, 2026.
v1.4.1: v1.4.1 release notes. Apr 20, 2026.
v1.5.0: v1.5.0 release notes. May 19, 2026.
v1.6.0: v1.6.0 release notes. Jun 18, 2026.

Handbook

Styling: Learn how to style Base UI components with your preferred styling engine.
Animation: A guide to animating Base UI components.
Composition: A guide to composing Base UI components with your own React components.
Customization: A guide to customizing the behavior of Base UI components.
Forms: A guide to building forms with Base UI components.
TypeScript: A guide to using TypeScript with Base UI.

Components

Accordion: A high-quality, unstyled React accordion component that displays a set of collapsible panels with headings.
Alert Dialog: A high-quality, unstyled React alert dialog component that requires a user response to proceed.
Autocomplete: A high-quality, unstyled React autocomplete component that renders an input with a list of filtered options.
Avatar: A high-quality, unstyled React avatar component that is easy to customize.
Button: A high-quality, unstyled React button component that can be rendered as another tag or focusable when disabled.
Checkbox: A high-quality, unstyled React checkbox component that is easy to customize.
Checkbox Group: A high-quality, unstyled React checkbox group component that provides a shared state for a series of checkboxes.
Collapsible: A high-quality, unstyled React collapsible component that displays a panel controlled by a button.
Combobox: A high-quality, unstyled React combobox component that renders an input combined with a list of predefined items to select.
Context Menu: A high-quality, unstyled React context menu component that appears at the pointer on right click or long press.
Dialog: A high-quality, unstyled React dialog component that opens on top of the entire page.
Drawer: A high-quality, unstyled React drawer component with swipe-to-dismiss gestures.
Field: A high-quality, unstyled React field component that provides labeling and validation for form controls.
Fieldset: A high-quality, unstyled React fieldset component with an easily stylable legend.
Form: A high-quality, unstyled React form component with consolidated error handling.
Input: A high-quality, unstyled React input component.
Menu: A high-quality, unstyled React menu component that displays list of actions in a dropdown, enhanced with keyboard navigation.
Menubar: A menu bar providing commands and options for your application.
Meter: A high-quality, unstyled React meter component that provides a graphical display of a numeric value.
Navigation Menu: A high-quality, unstyled React navigation menu component that displays a collection of links and menus for website navigation.
Number Field: A high-quality, unstyled React number field component with increment and decrement buttons, and a scrub area.
OTP Field: A high-quality, unstyled React OTP field component for one-time password and verification code entry.
Popover: A high-quality, unstyled React popover component that displays an accessible popup anchored to a button.
Preview Card: A high-quality, unstyled React preview card component that appears when a link is hovered, showing a preview for sighted users.
Progress: A high-quality, unstyled React progress bar component that displays the status of a task that takes a long time.
Radio: A high-quality, unstyled React radio button component that is easy to style.
Scroll Area: A high-quality, unstyled React scroll area that provides a native scroll container with custom scrollbars.
Select: A high-quality, unstyled React select component for choosing a predefined value in a dropdown menu.
Separator: A high-quality, unstyled React separator component that is accessible to screen readers.
Slider: A high-quality, unstyled React slider component that works like a range input and is easy to style.
Switch: A high-quality, unstyled React switch component that indicates whether a setting is on or off.
Tabs: A high-quality, unstyled React tabs component for toggling between related panels on the same page.
Toast: A high-quality, unstyled React toast component to generate notifications.
Toggle: A high-quality, unstyled React toggle component that displays a two-state button that can be on or off.
Toggle Group: A high-quality, unstyled React toggle group component that provides shared state to a series of toggle buttons.
Toolbar: A high-quality, unstyled React toolbar component that groups a set of buttons and controls.
Tooltip: A high-quality, unstyled React tooltip component that appears when an element is hovered or focused, showing a hint for sighted users.

Utilities

CSP Provider: A CSP provider component that applies a nonce to inline <style> and <script> tags rendered by Base UI components, and can disable inline <style> elements.
Direction Provider: A direction provider component that enables RTL behavior for Base UI components.
mergeProps: A utility to merge multiple sets of React props, handling event handlers, className, and style props intelligently.
useRender: Hook for enabling a render prop in custom components.