https://github.com/mrprotocoll/pillardash-ui-react
A React components library for building modern web applications with consistent design and behavior.
https://github.com/mrprotocoll/pillardash-ui-react
npm-package package react react-component-library
Last synced: 7 months ago
JSON representation
A React components library for building modern web applications with consistent design and behavior.
- Host: GitHub
- URL: https://github.com/mrprotocoll/pillardash-ui-react
- Owner: mrprotocoll
- Created: 2025-06-01T00:42:33.000Z (8 months ago)
- Default Branch: main
- Last Pushed: 2025-06-15T19:06:42.000Z (8 months ago)
- Last Synced: 2025-06-15T19:11:15.662Z (8 months ago)
- Topics: npm-package, package, react, react-component-library
- Language: TypeScript
- Homepage:
- Size: 1.3 MB
- Stars: 0
- Watchers: 0
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Pillardash Component Library
A collection of reusable React components for building modern web applications with consistent design and behavior.
## Features
- **TypeScript Support**: Fully typed components with exported prop types
- **Accessible**: Built with WAI-ARIA standards
- **Customizable**: Theme support and style overrides
- **Responsive**: Works across all device sizes
- **Form Components**: Complete suite of form inputs and controls
## Installation
```bash
npm install pillardash-ui-react
# or
yarn add pillardash-ui-react
```
## Peer Dependencies
This library requires:
```json
{
"react": "^18.0.0 || ^19.0.0",
"react-dom": "^18.0.0 || ^19.0.0"
}
```
## Available Components
### Form Controls
- `Button` - Interactive button element
- `CheckBox` - Custom checkbox input
- `FileUpload` - File upload component with drag-and-drop
- `Input` - Text input field
- `Search` - Search input with debounce
- `Select` - Custom select dropdown
- `TextEditor` - Rich text editor
### Data Display
- `DataTable` - Sortable and paginated table
- `Card` - Flexible content container
### Feedback
- `Alert` - Contextual notification messages
- `Loading` - Animated loading indicators
## Usage
```tsx
import { Button, Input } from 'pillardash-ui-react';
function Example() {
return (
Submit
);
}
```
## Theming
Customize the look and feel by wrapping your app with the `ThemeProvider`:
```tsx
import { ThemeProvider } from 'pillardash-ui-react';
function App() {
return (
{/* Your app */}
);
}
```
## TypeScript Support
All components include TypeScript definitions. Import prop types for extended customization:
```tsx
import { Button, type ButtonProps } from 'pillardash-ui-react';
const CustomButton = (props: ButtonProps) => (
);
```
## Contributing
We welcome contributions! Please see our [Contributing Guidelines](CONTRIBUTING.md).
## License
MIT © [Osai Technologies](https://osaitech.dev)
---
## Component Documentation
### Button
```tsx
void}
>
Click me
```
### Input
```tsx
void}
/>
```
### Select
```tsx
void}
/>
```
## Development Setup
1. Clone the repository
2. Install dependencies: `npm install`
3. Run Storybook: `npm run storybook`
4. Build the library: `npm run build`
## Testing
```bash
npm test
# or
npm run test:watch
```