@omniyat/reactcomponents

A comprehensive collection of React components built with PrimeReact, designed for modern web applications.

Installation

npm install @omniyat/reactcomponents

Peer Dependencies

This package requires the following peer dependencies:

npm install react@^18.3.1 react-dom@^18.3.1

Available Components

ButtonComponent

Enhanced button component with confirmation dialog support.

import { ButtonComponent } from '@omniyat/reactcomponents';

<ButtonComponent 
  confirmMessage="Are you sure?" 
  onClick={handleClick}
  onReject={handleReject}
  full={true}
>
  Click Me
</ButtonComponent>

Props:

• confirmMessage - Show confirmation dialog before action
• onClick - Click handler function
• onReject - Rejection handler for confirmation
• full - Full width button (boolean)

ConfirmBoxComponent

Confirmation dialog component for user interactions.

import { ConfirmBoxComponent } from '@omniyat/reactcomponents';

<ConfirmBoxComponent />

DataTableComponent

Advanced data table with filtering, sorting, export, and customization features.

import { DataTableComponent } from '@omniyat/reactcomponents';

<DataTableComponent
  tableId="users-table"
  data={users}
  columns={columns}
  onNew={handleNew}
  rowActions={actions}
  exportFields={exportFields}
  allowedGroupFields={['status', 'department']}
/>

Key Features:

• Advanced filtering and search
• Column visibility controls
• Export to Excel/PDF
• Row grouping
• Context menus
• Row selection
• Pagination
• Sorting
• Responsive design

Props:

• tableId - Unique identifier for table configuration
• data - Array of data objects
• columns - Column configuration array
• onNew - Handler for new record creation
• rowActions - Array of row action objects
• exportFields - Fields available for export
• allowedGroupFields - Fields that can be used for grouping

DialogComponent

Modal dialog component wrapper.

import { DialogComponent } from '@omniyat/reactcomponents';

<DialogComponent />

FileUploaderComponent

File upload component with API integration.

import { FileUploaderComponent } from '@omniyat/reactcomponents';

<FileUploaderComponent />

FormComponent

Dynamic form component for data entry.

import { FormComponent } from '@omniyat/reactcomponents';

<FormComponent />

OverlayComponent

Overlay panel component for contextual content.

import { OverlayComponent } from '@omniyat/reactcomponents';

<OverlayComponent />

PiChartComponent

Pie chart visualization component using react-minimal-pie-chart.

import { PiChartComponent } from '@omniyat/reactcomponents';

<PiChartComponent />

TreeComponent

Tree view component for hierarchical data.

import { TreeComponent } from '@omniyat/reactcomponents';

<TreeComponent />

Development

Building the Package

npm run build

Testing

npm run test

Publishing

npm run publish

Dependencies

This package is built on top of:

• PrimeReact - UI component library
• React Minimal Pie Chart - Chart visualization
• @omniyat/buttoncomponent - Base button component

Configuration

The DataTableComponent supports persistent configuration through localStorage, including:

• Column visibility settings
• Export preferences
• Filter states
• Row grouping options

Browser Support

This package supports all modern browsers that support React 18+.

License

Private package - All rights reserved.

Contributing

This is a private package. Please contact the maintainers for contribution guidelines.