kp-components
v2.0.20
Published
KP Components Library is a customizable library that provides context and components, allowing users to access and use Material-UI components and custom components with ease.
Downloads
336
Readme
KP Components Library
KP Components Library is a customizable library that provides context and components, allowing users to access and use Material-UI components and custom components with ease.
Installation
To install the library, you can use npm or yarn:
npm install kp-components
# or
yarn add kp-components
Peer Dependencies
Ensure you have the following peer dependencies installed in your project:
"peerDependencies": {
"@emotion/react": "^11.12.0",
"@emotion/styled": "^11.12.0",
"@mui/material": "^5.16.4",
"react": "^18.3.1",
"react-dom": "^18.3.1"
}
You can install them using npm or yarn:
npm install @emotion/react@^11.12.0 @emotion/styled@^11.12.0 @mui/material@^5.16.4 react@^18.3.1 react-dom@^18.3.1
# or
yarn add @emotion/react@^11.12.0 @emotion/styled@^11.12.0 @mui/material@^5.16.4 react@^18.3.1 react-dom@^18.3.1
Usage
Here's how you can use the KP Components Library in your project:
Theme Provider
The library provides a ThemeProvider
component that you can use to wrap your application and provide the custom theme context.
import { ThemeProvider } from 'kp-components';
function MyApp({ Component, pageProps }) {
return (
<ThemeProvider>
<Component {...pageProps} />
</ThemeProvider>
);
}
export default MyApp;
Custom Button
The library includes a custom Button
component that you can use in your application.
import { Button } from 'kp-components';
function App() {
return (
<div>
<Button variant="contained" color="primary">
Custom Button
</Button>
</div>
);
}
export default App;
Use Theme
You can use the useTheme
hook to access the theme within your components.
import { useTheme } from 'kp-components';
function ThemedComponent() {
const theme = useTheme();
return (
<div style={{ background: theme.palette.background.default }}>
Themed Component
</div>
);
}
export default ThemedComponent;
Contributing
We welcome contributions to improve the KP Components Library. If you have any ideas, suggestions, or issues, please create a pull request or an issue on our GitHub repository.
License
This project is licensed under the MIT License. See the LICENSE file for more details.
Contact
For any questions or support, please contact us at [email protected].