Supporting tools

Download supporting tools to enhance your Click UI development workflow. These tools include AI assistant skills and linting plugins.

About the tools

AI skills (/tools/skills/)

Download the Markdown files from the table above. Click UI skills cover the design system and components; ClickHouse Cloud skills cover product philosophy and Cloud UX patterns. Each file includes YAML frontmatter (name, description, version) used by assistants such as Cursor.

Quick usage

Add downloaded .md files to your assistant’s skills directory. For Cursor, place them in .cursor/skills/ in your project root.

ESLint Plugin

The ESLint plugin for Click UI helps enforce best practices and catch common mistakes when using Click UI components in your React applications. Install it in your project to get real-time linting feedback.

Quick usage

# Install from zip file
yarn add -D eslint-plugin-click-ui@file:./eslint-plugin-click-ui
 
# Or extract and link manually
unzip eslint-plugin-click-ui-v1.1.1.zip
cd eslint-plugin-click-ui && yarn link
cd .. && yarn link eslint-plugin-click-ui

Add to .eslintrc.json:

{
  "extends": ["plugin:click-ui/recommended"],
  "plugins": ["click-ui"]
}

Run: npx eslint src/**/*.{ts,tsx} --fix