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 3 days 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@Lobbi-Docs/claude

Security Notice

Modifies workflows with hooks

Component Details

Stats

Stars00123456789

MaintenanceGood

Last Commit3 days ago

Links

View on GitHub

View README

Plugin Marketplace JSON

Similar Plugins

hookify

Easily create hooks to prevent unwanted behaviors by analyzing conversation patterns

45.7K

chakra-react-toolkit

Security Notice

Similar Plugins

hookify

ralph-wiggum

feature-dev

explanatory-output-style

chakra-react-toolkit

Security Notice

/a11y-audit[component-path] [--strict]5 toolsRun accessibility audit on components (WCAG 2.1 AA checks)

/a11y-fix[component-path] [--dry-run]5 toolsAuto-fix common accessibility issues in components

/add-animationinheritsAdd Framer Motion or Chakra transitions to components

/create-card[card-name] [type: basic|stat|info|feature]4 toolsGenerate Card components including stat displays and info cards with Chakra UI

/create-component[component-name] [base-chakra-element]4 toolsGenerate a generic Chakra UI component with TypeScript, variants, and prop interfaces

/create-data-table[table-name] [data-type]4 toolsGenerate sortable, paginated data tables with Chakra UI Table components

/create-form[form-name] [fields...]4 toolsGenerate accessible forms with Chakra form controls, validation patterns, and TypeScript

/create-icon[icon-name] [source: chakra|custom|react-icons]4 toolsGenerate custom icon components wrapping Chakra UI Icon with TypeScript support

/create-layout[layout-name] [layout-type: stack|grid|flex|dashboard]4 toolsGenerate page layouts using Chakra's Stack, Grid, Flex, and Container components

/create-loader[loader-name] [type: spinner|skeleton|progress|overlay]4 toolsGenerate loading components including spinners, skeletons, and progress indicators with Chakra UI

/create-modal[component-name] [type: modal|drawer|alert]4 toolsGenerate Modal, Drawer, or AlertDialog with Chakra UI and focus management

/create-nav[nav-name] [type: menu|breadcrumb|tabs|sidebar]4 toolsGenerate navigation components including menus, breadcrumbs, and tabs with Chakra UI

/create-toast[toast-name] [type: basic|custom|promise]4 toolsGenerate toast notifications and alert systems using Chakra UI's useToast hook

/responsive-check[component-path] [--breakpoints=sm,md,lg,xl,2xl]4 toolsAnalyze responsive design across breakpoints

/setup-iconsinheritsConfigure icon library (Chakra Icons, React Icons, Lucide, Heroicons)

/test-a11y[component-path] [--framework=vitest|jest]5 toolsGenerate accessibility tests using jest-axe or vitest-axe

/test-component[component-path] [--framework=vitest|jest] [--coverage]5 toolsGenerate component tests (Vitest/Jest + Testing Library)

/test-snapshotinheritsGenerate visual snapshot tests for Chakra components

/theme-extend[--component=ComponentName] [--foundation=colors|typography|spacing]5 toolsExtend/customize existing Chakra theme

/theme-setup[--preset=minimal|complete|tailwind-like] [--output=path]5 toolsInitialize Chakra theme with design tokens

Similar Plugins

hookify

ralph-wiggum

feature-dev

explanatory-output-style