Name: tessl/npm-headlessui--react
Rating: 0.84 (1 reviews)
Author: tessl

tessl/npm-headlessui--react

A set of completely unstyled, fully accessible UI components for React, designed to integrate beautifully with Tailwind CSS.

1.25x

Overview

Eval results

Files

Evaluation results

100%

55%

Navigation Menu with Orientation Support

Horizontal and vertical orientation support

Criteria

Without context

With context

Uses Listbox Component

100%

Orientation Prop Usage

100%

Arrow Key Navigation

100%

Home/End Key Support

100%

ListboxOption Components

100%

User Dropdown Menu

Flexible component composition with context

Criteria

Without context

With context

Menu parent component

100%

MenuButton usage

100%

MenuItems container

100%

MenuItem components

100%

Context-based composition

100%

81%

User Profile Settings Form

Accessible UI components with automatic ARIA attributes

Criteria

Without context

With context

Switch component usage

100%

Label component usage

100%

Description component usage

53%

Field component usage

100%

Fieldset component usage

50%

Checkbox component usage

100%

Automatic ARIA associations

50%

30%

0%

Navigation Menu Bar

Popover group coordination

Criteria

Without context

With context

PopoverGroup usage

Popover component structure

PopoverButton implementation

PopoverPanel implementation

Automatic coordination behavior

Outside click handling

90%

Modal Settings Panel

Focus trap for modal interactions

Criteria

Without context

With context

Dialog Component Usage

100%

FocusTrap Implementation

80%

100%

Initial Focus Management

100%

Focus Restoration

100%

Dialog Button Integration

50%

Escape Key Handling

100%

Background Interaction Prevention

100%

User Profile Form

Automatic label and description association

Criteria

Without context

With context

Field component usage

100%

Label component usage

100%

Description component usage

100%

Input/Textarea components

100%

Checkbox component usage

100%

No manual IDs

100%

10%

Product Details Disclosure

State freezing during transition animations

Criteria

Without context

With context

Disclosure Component Usage

100%

Transition Component Integration

100%

State Freezing Implementation

71%

100%

Transition Timing Configuration

100%

65%

Navigation Menu Builder

Polymorphic rendering with 'as' prop

Criteria

Without context

With context

Menu component usage

100%

MenuButton usage

100%

MenuItems usage

100%

MenuItem for anchors

100%

MenuItem for buttons

100%

Polymorphic props

100%

67%

17%

Modal Dialog with Custom Hooks

Custom hooks library for advanced use cases

Criteria

Without context

With context

FocusTrap implementation

60%

100%

useClose hook usage

100%

40%

Label component usage

80%

Description component usage

100%

80%

useLabelledBy hook

41%

useDescribedBy hook

38%

97%

17%

Modal Dialog Manager

State machine architecture for complex components

Criteria

Without context

With context

Dialog Component Usage

100%

Controlled State Pattern

50%

100%

Dialog Stacking

100%

Focus Management

100%

Context Provider Pattern

100%

Dialog Interactions

70%

Install with Tessl CLI

npx tessl i tessl/npm-headlessui--react

Evaluated: about 2 months ago
Agent: Claude Code

Table of Contents

Navigation Menu with Orientation Support User Dropdown Menu User Profile Settings Form Navigation Menu Bar Modal Settings Panel User Profile Form Product Details Disclosure Navigation Menu Builder Modal Dialog with Custom Hooks Modal Dialog Manager