Community Plugin

chakra-react-toolkit

Comprehensive frontend development toolkit for React/Next.js projects using Chakra UI. Provides component generation, accessibility auditing, theming tools, and testing utilities.

1.0.0

Updated 2 hours ago

Capabilities

Commands

Agents

Skills

Hooks

MCP Servers

Install

Add the repository(one-time)

/plugin marketplace add Lobbi-Docs/claude

Install the plugin

/plugin install chakra-react-toolkit@claude-orchestration

Security Notice

Modifies workflows with hooks

Component Details

a11y-audit

/a11y-audit

5 tools

Run accessibility audit on components (WCAG 2.1 AA checks)

a11y-fix

/a11y-fix

5 tools

Auto-fix common accessibility issues in components

Add Animation to Component

/add-animation

inherits

Add Framer Motion or Chakra transitions to components

create-card

/create-card

4 tools

Generate Card components including stat displays and info cards with Chakra UI

create-component

/create-component

4 tools

Generate a generic Chakra UI component with TypeScript, variants, and prop interfaces

create-data-table

/create-data-table

4 tools

Generate sortable, paginated data tables with Chakra UI Table components

create-form

/create-form

4 tools

Generate accessible forms with Chakra form controls, validation patterns, and TypeScript

create-icon

/create-icon

4 tools

Generate custom icon components wrapping Chakra UI Icon with TypeScript support

create-layout

/create-layout

4 tools

Generate page layouts using Chakra's Stack, Grid, Flex, and Container components

create-loader

/create-loader

4 tools

Generate loading components including spinners, skeletons, and progress indicators with Chakra UI

create-modal

/create-modal

4 tools

Generate Modal, Drawer, or AlertDialog with Chakra UI and focus management

create-nav

/create-nav

4 tools

Generate navigation components including menus, breadcrumbs, and tabs with Chakra UI

create-toast

/create-toast

4 tools

Generate toast notifications and alert systems using Chakra UI's useToast hook

responsive-check

/responsive-check

4 tools

Analyze responsive design across breakpoints

Setup Icon Library

/setup-icons

inherits

Configure icon library (Chakra Icons, React Icons, Lucide, Heroicons)

test-a11y

/test-a11y

5 tools

Generate accessibility tests using jest-axe or vitest-axe

test-component

/test-component

5 tools

Generate component tests (Vitest/Jest + Testing Library)

Generate Visual Snapshot Tests

/test-snapshot

inherits

Generate visual snapshot tests for Chakra components

theme-extend

/theme-extend

5 tools

Extend/customize existing Chakra theme

theme-setup

/theme-setup

5 tools

Initialize Chakra theme with design tokens

Stats

Stars00123456789

MaintenanceGood

Last Commit2 hours ago

Links

View on GitHub

View README

Plugin Marketplace JSON

Similar Plugins

security-guidance

49.1k

Warn about potential security issues when editing files - targets command injection, XSS vulnerabilities, and dangerous coding patterns

v1.0.0

plugin-dev

47.1k

Comprehensive toolkit for developing Claude Code plugins. Includes 7 expert skills covering hooks, MCP integration, commands, agents, and best practices. AI-assisted plugin creation and validation.

1mo

v0.1.0

commit-commands

47.1k

Streamline your git workflow with simple commands for committing, pushing, and creating pull requests

2mo

v1.0.0

feature-dev

47.1k

Comprehensive feature development workflow with specialized agents for codebase exploration, architecture design, and quality review

2mo

v1.0.0