@openorgus/react

OpenGrid Design System - A comprehensive React component library with 81 production-ready components.

🚀 Installation

bash

npm install @openorgus/react

or

yarn add @openorgus/react

or

pnpm add @openorgus/react





📦 Components



$3

Alert, Avatar, Badge, Box, Breadcrumbs, Card, Chip, Container, Divider, Link, List, Paper, Skeleton, Stack, Tooltip



$3

Autocomplete, Checkbox, ColorPicker, DatePicker, NumberField, Radio, Select, Signature, Slider, Switch, TextArea, TextField, Upload, VerificationCode



$3

AppBar, BottomNavigation, Menu, Pagination, SpeedDial, Stepper, Tabs



$3

Backdrop, Dialog, Modal, Progress, Snackbar, Loader



$3

Charts, ImageList, Rating, Table, TransferList, TreeView, OrderSummary



$3

Button, ButtonGroup, FloatingActionButton, ToggleButton, Drawer, ActionSheet, Camera, Map



$3

AIChatbot, CodeGenerator, ImageGenerator, TextGenerator, VideoGenerator, VoiceChatbot, VoiceUI, DataQuery, Whiteboard, QRCode, CreditCard



$3

AnimationPreview, EmojisPreview, IconsPreview, IllustrationsPreview, VideoPlayer, TypographyPreview, FontAwesomeWrapper, ShoppingCart, VirtualKeyboard



$3

InteractiveCursor, MagnetLines, PixelTrail, DecayCard



💡 Usage

jsx

import { Button, Card, TextField } from '@openorgus/react';



function App() {

  return (

    

      

      

    

  );

}

🎨 Features

- ✅ 81 Production-ready components
- ✅ TypeScript support
- ✅ Fully customizable
- ✅ Responsive design
- ✅ Dark mode support
- ✅ Accessibility compliant
- ✅ Tree-shakeable
- ✅ Zero dependencies (except peer deps)

📖 Documentation

Visit https://opengrid.design for full documentation.

📄 License

MIT © OpenGrid Team

🚀 Installation

bash
npm install @openorgus/react

or

yarn add @openorgus/react

or

pnpm add @openorgus/react

📦 Components

$3

Alert, Avatar, Badge, Box, Breadcrumbs, Card, Chip, Container, Divider, Link, List, Paper, Skeleton, Stack, Tooltip

$3

Autocomplete, Checkbox, ColorPicker, DatePicker, NumberField, Radio, Select, Signature, Slider, Switch, TextArea, TextField, Upload, VerificationCode

$3

AppBar, BottomNavigation, Menu, Pagination, SpeedDial, Stepper, Tabs

$3

Backdrop, Dialog, Modal, Progress, Snackbar, Loader

$3

Charts, ImageList, Rating, Table, TransferList, TreeView, OrderSummary

$3

Button, ButtonGroup, FloatingActionButton, ToggleButton, Drawer, ActionSheet, Camera, Map

$3

AIChatbot, CodeGenerator, ImageGenerator, TextGenerator, VideoGenerator, VoiceChatbot, VoiceUI, DataQuery, Whiteboard, QRCode, CreditCard

$3

AnimationPreview, EmojisPreview, IconsPreview, IllustrationsPreview, VideoPlayer, TypographyPreview, FontAwesomeWrapper, ShoppingCart, VirtualKeyboard

$3

InteractiveCursor, MagnetLines, PixelTrail, DecayCard

💡 Usage

jsx
import { Button, Card, TextField } from '@openorgus/react';

function App() {
return (

);
}