skills.rest
siriwatknp
siriwatknpCOMMUNITY
Explore all skills by this author →
Website𝕏@siriwatknpGitHub

reviewing-base-ui-usage

Audit codebases for Base UI usage patterns and accessibility best practices.

Updated Aug 23, 2026
Search Tags:#accessibility#review#code-quality#lint#base-ui#pattern-enforcement
One-click install
npx skills add https://github.com/siriwatknp/jun-cc --skill reviewing-base-ui-usage
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: reviewing-base-ui-usage
Source: https://github.com/siriwatknp/jun-cc/tree/main/skills/reviewing-base-ui-usage
Command: npx skills add https://github.com/siriwatknp/jun-cc --skill reviewing-base-ui-usage

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams quickly audit codebases for correct Base UI usage patterns, identify accessibility gaps, and ensure adherence to official Base UI conventions.

Core Features & Use Cases

  • Pattern enforcement: checks import paths, render prop usage, and state handling against official Base UI guidelines.
  • Accessibility auditing: flags missing labels, semantic structure issues, and data-attribute usage.
  • Use Case: before upgrading a large codebase to a new Base UI version, run this Skill to surface violations and recommended fixes.

Quick Start

Run this skill against your repository to surface Base UI usage issues, with a prioritized list of fixes and examples.

Frequently Asked Questions about reviewing-base-ui-usage

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit my codebase for correct Base UI component usage and accessibility?▼

You can audit Base UI usage by running this Skill against your repository to surface import path, render prop, state handling, and accessibility violations, returning a prioritized list of recommended fixes.

What accessibility issues should I check for when using @base-ui/react components?▼

When using @base-ui/react, you should check for missing labels, semantic structure issues, and incorrect data-attribute usage. This Skill automatically flags these accessibility gaps during code reviews.

How do I enforce Base UI import paths and render prop patterns during a code review?▼

To enforce Base UI import paths and render prop patterns during code review, run this Skill to check your codebase against official Base UI conventions and identify structural guideline violations.

Can I check for Base UI convention violations before upgrading to a new version?▼

Yes, you can run this Skill before upgrading a large codebase to a new Base UI version. It surfaces usage violations and provides recommended fixes to ensure a smooth migration.

Does this Base UI code audit work for projects with complex state handling?▼

Yes, this Skill audits complex projects by checking state handling, component structure guidelines, and data attribute conventions against official Base UI patterns to ensure correct implementation.

Related Skills

Explore More Software Engineering Skills→
krlmrrkrlmrr

eslint-prettier

Automate ESLint and Prettier linting and formatting for JavaScript/TypeScript projects.

Community
Intermediate
patternflypatternfly
10

pf-import-checker

Audit and fix PatternFly import paths for charts, chatbot, and component-groups.

Official
Intermediate
VoDaiLoczVoDaiLocz
24

lint-and-validate

Automate linting and static analysis of code in CI pipelines.

Community
Intermediate
CollabalistCollabalist

reviewing-lwc-mobile-offline

Analyze Salesforce Lightning Web Components for mobile offline compatibility with Komaci static analysis.

Community
Advanced