MUI Custom Component Library

A customized Material-UI component library with enhanced features, custom themes, and reusable components.

Features

• Enhanced MUI components with additional functionality
• Custom theme support
• TypeScript support
• Storybook documentation
• Comprehensive test coverage
• Easy integration with React applications

Installation

npm install @your-org/mui-custom-lib

Usage

import { ThemeProvider } from '@mui/material/styles';
import { EnhancedButton, defaultTheme } from '@your-org/mui-custom-lib';

function App() {
  return (
    <ThemeProvider theme={defaultTheme}>
      <EnhancedButton 
        variant="contained" 
        loading={false}
        success={false}
      >
        Click Me
      </EnhancedButton>
    </ThemeProvider>
  );
}

Components

EnhancedButton

An enhanced version of MUI's Button component with additional features:

• Loading state with spinner
• Success state with custom text
• All standard MUI Button props supported

<EnhancedButton
  variant="contained"
  loading={true}
  success={false}
  successText="Done!"
  onClick={() => console.log('clicked')}
>
  Submit
</EnhancedButton>

Development

Setup

1. Clone the repository
2. Install dependencies:

   npm install

Running Storybook

npm run storybook

Running Tests

# Run tests once
npm test

# Run tests in watch mode
npm run test:watch

# Run tests with coverage
npm run test:coverage

Building

npm run build

Publishing

1. Update version in package.json
2. Build the library:

   npm run build

3. Publish to npm:

   npm publish

Contributing

1. Fork the repository
2. Create your feature branch
3. Commit your changes
4. Push to the branch
5. Create a Pull Request

License

MIT

Support

For support, please open an issue in the repository.