Official VSCode extension for ms-ui-kit - the professional React component library. Insert components directly at your cursor position with just a few clicks!
Prerequisites
Install ms-ui-kit first with: npm install ms-ui-kit
Installation
Install from the VSCode Marketplace: https://marketplace.visualstudio.com/items?itemName=maheshshinde9100.ms-ui-kit
Features
- Lightning-fast Component Insertion: Insert any MS-UI-KIT component directly at your cursor position
- Complete Component Library: Access all 39+ MS-UI-KIT components
- Smart Search: Quick search and filter components by name
- Optimized for React: Works with .jsx and .tsx files
- Clean UI: Simple and intuitive quick pick menu
- No Dependencies: Pure JavaScript implementation
Components Included
- Accordion
- Alert
- Avatar
- Badge
- Breadcrumb
- Button
- Card
- CardBody
- CardFooter
- CardHeader
- CardMedia
- Checkbox
- CommandPalette
- DataTable
- DatePicker
- Drawer
- Dropdown
- EmptyState
- FileUpload
- Footer
- Input
- Modal
- Navbar
- OTPInput
- Pagination
- Progress
- Rating
- Skeleton
- Spinner
- Stepper
- Switch
- Tabs
- Tag
- Textarea
- ThemeToggle
- Timeline
- Toast
- Tooltip
- TypewriterEffect
Usage
- Open any React file (.jsx or .tsx) in VSCode
- Place your cursor where you want to add a component
- Open the Command Palette (Ctrl+Shift+P on Windows/Linux, Cmd+Shift+P on macOS)
- Type "MS UI KIT: Insert Component" and select it
- Choose your desired component from the list
- The component code will be automatically inserted at your cursor position!
Requirements
- VSCode 1.74.0 or higher
- A React/JavaScript project with ms-ui-kit installed
Author
Mahesh Shinde
Links
- Portfolio: https://maheshshinde-dev.vercel.app/
- GitHub: https://github.com/maheshshinde9100
- LinkedIn: https://www.linkedin.com/in/maheshshinde9100
- npm Package: https://www.npmjs.com/package/ms-ui-kit
- Project Repository: https://github.com/maheshshinde9100/ms-ui-kit
License
MIT