@cognam/app-button v1.0.0

AppButton Component

A reusable Material-UI Button component wrapper for React applications.

Installation

npm install @cognam/app-button

Usage

import AppButton from '@cognam/app-button';
// or
import { AppButton } from '@cognam/app-button';

function MyComponent() {
  return (
    <AppButton 
      variant="contained" 
      color="primary" 
      onClick={() => console.log('Clicked!')}
    >
      Click Me
    </AppButton>
  );
}

Props

Requirements

• React 17+ or 18+
• Material-UI 5+
• Emotion (React and Styled)

## Step 7: Build and Publish

1. **Install dependencies:**
```bash
npm install

2. Build the package:

npm run build

3. Test locally (optional):

npm link

Then in your test project:

npm link @cognam/app-button

4. Publish to NPM:

npm login
npm publish --access public

Step 8: Using in Your New Project

In your new project, install the package:

npm install @cognam/app-button

Then use it:

import AppButton from '@cognam/app-button';

function MyApp() {
  return (
    <div>
      <AppButton variant="contained" color="primary">
        My Button
      </AppButton>
    </div>
  );
}

Key Benefits of This Approach:

1. Peer Dependencies: Material-UI and React are peer dependencies, so they won't be bundled
2. Tree Shaking: ESM build supports tree shaking
3. Multiple Formats: Both CommonJS and ESM builds
4. Optimized: Direct imports for Material-UI components
5. Reusable: Can be used across multiple projects

This setup will create a professional NPM package that you can reuse across all your projects while maintaining the same Material-UI and React versions.