@machinemetrics/mm-react-components 0.1.1-1 → 0.2.3-0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +61 -0
- package/README.md +246 -0
- package/dist/App.d.ts +3 -0
- package/dist/App.d.ts.map +1 -0
- package/dist/components/ui/accordion.d.ts +10 -0
- package/dist/components/ui/accordion.d.ts.map +1 -0
- package/dist/components/ui/badge.d.ts +10 -0
- package/dist/components/ui/badge.d.ts.map +1 -0
- package/dist/components/ui/button.d.ts +11 -0
- package/dist/components/ui/button.d.ts.map +1 -0
- package/dist/components/ui/calendar.d.ts +9 -0
- package/dist/components/ui/calendar.d.ts.map +1 -0
- package/dist/components/ui/checkbox.d.ts +5 -0
- package/dist/components/ui/checkbox.d.ts.map +1 -0
- package/dist/components/ui/collapsible.d.ts +7 -0
- package/dist/components/ui/collapsible.d.ts.map +1 -0
- package/dist/components/ui/data-table/TableView.d.ts +3 -0
- package/dist/components/ui/data-table/TableView.d.ts.map +1 -0
- package/dist/components/ui/data-table/cards/ResponsiveTable.d.ts +10 -0
- package/dist/components/ui/data-table/cards/ResponsiveTable.d.ts.map +1 -0
- package/dist/components/ui/data-table/cards/RowCard.d.ts +9 -0
- package/dist/components/ui/data-table/cards/RowCard.d.ts.map +1 -0
- package/dist/components/ui/data-table/cards/index.d.ts +2 -0
- package/dist/components/ui/data-table/cards/index.d.ts.map +1 -0
- package/dist/components/ui/data-table/columnTypes/badgeColumn.d.ts +16 -0
- package/dist/components/ui/data-table/columnTypes/badgeColumn.d.ts.map +1 -0
- package/dist/components/ui/data-table/columnTypes/createColumn.d.ts +8 -0
- package/dist/components/ui/data-table/columnTypes/createColumn.d.ts.map +1 -0
- package/dist/components/ui/data-table/columnTypes/dateColumn.d.ts +13 -0
- package/dist/components/ui/data-table/columnTypes/dateColumn.d.ts.map +1 -0
- package/dist/components/ui/data-table/columnTypes/index.d.ts +8 -0
- package/dist/components/ui/data-table/columnTypes/index.d.ts.map +1 -0
- package/dist/components/ui/data-table/columnTypes/multiBadgeColumn.d.ts +16 -0
- package/dist/components/ui/data-table/columnTypes/multiBadgeColumn.d.ts.map +1 -0
- package/dist/components/ui/data-table/columnTypes/numericColumn.d.ts +15 -0
- package/dist/components/ui/data-table/columnTypes/numericColumn.d.ts.map +1 -0
- package/dist/components/ui/data-table/columnTypes/selectionColumn.d.ts +10 -0
- package/dist/components/ui/data-table/columnTypes/selectionColumn.d.ts.map +1 -0
- package/dist/components/ui/data-table/columnTypes/textColumn.d.ts +13 -0
- package/dist/components/ui/data-table/columnTypes/textColumn.d.ts.map +1 -0
- package/dist/components/ui/data-table/index.d.ts +14 -0
- package/dist/components/ui/data-table/index.d.ts.map +1 -0
- package/dist/components/ui/data-table/metadata/ColumnRegistry.d.ts +90 -0
- package/dist/components/ui/data-table/metadata/ColumnRegistry.d.ts.map +1 -0
- package/dist/components/ui/data-table/metadata/alignment.d.ts +8 -0
- package/dist/components/ui/data-table/metadata/alignment.d.ts.map +1 -0
- package/dist/components/ui/data-table/pagination.d.ts +9 -0
- package/dist/components/ui/data-table/pagination.d.ts.map +1 -0
- package/dist/components/ui/data-table/state/index.d.ts +3 -0
- package/dist/components/ui/data-table/state/index.d.ts.map +1 -0
- package/dist/components/ui/data-table/state/useBreakpoint.d.ts +2 -0
- package/dist/components/ui/data-table/state/useBreakpoint.d.ts.map +1 -0
- package/dist/components/ui/data-table/state/useDataTableState.d.ts +19 -0
- package/dist/components/ui/data-table/state/useDataTableState.d.ts.map +1 -0
- package/dist/components/ui/data-table/tokens.d.ts +10 -0
- package/dist/components/ui/data-table/tokens.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/ColumnVisibilityMenu.d.ts +8 -0
- package/dist/components/ui/data-table/toolbar/ColumnVisibilityMenu.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/DataTableToolbar.d.ts +15 -0
- package/dist/components/ui/data-table/toolbar/DataTableToolbar.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/MenuHeader.d.ts +8 -0
- package/dist/components/ui/data-table/toolbar/MenuHeader.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/SortMenu.d.ts +7 -0
- package/dist/components/ui/data-table/toolbar/SortMenu.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/filters/DateRangeFilter.d.ts +5 -0
- package/dist/components/ui/data-table/toolbar/filters/DateRangeFilter.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/filters/FilterMenu.d.ts +10 -0
- package/dist/components/ui/data-table/toolbar/filters/FilterMenu.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/filters/InlineDateRangePicker.d.ts +10 -0
- package/dist/components/ui/data-table/toolbar/filters/InlineDateRangePicker.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/filters/NumericRangeFilter.d.ts +5 -0
- package/dist/components/ui/data-table/toolbar/filters/NumericRangeFilter.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/filters/SelectFilter.d.ts +6 -0
- package/dist/components/ui/data-table/toolbar/filters/SelectFilter.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/filters/TextFilter.d.ts +5 -0
- package/dist/components/ui/data-table/toolbar/filters/TextFilter.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/filters/index.d.ts +9 -0
- package/dist/components/ui/data-table/toolbar/filters/index.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/filters/types.d.ts +26 -0
- package/dist/components/ui/data-table/toolbar/filters/types.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/filters/useColumnFilters.d.ts +5 -0
- package/dist/components/ui/data-table/toolbar/filters/useColumnFilters.d.ts.map +1 -0
- package/dist/components/ui/data-table/toolbar/index.d.ts +5 -0
- package/dist/components/ui/data-table/toolbar/index.d.ts.map +1 -0
- package/dist/components/ui/data-table/types.d.ts +40 -0
- package/dist/components/ui/data-table/types.d.ts.map +1 -0
- package/dist/components/ui/data-table/useTableController.d.ts +29 -0
- package/dist/components/ui/data-table/useTableController.d.ts.map +1 -0
- package/dist/components/ui/data-table/utils.d.ts +3 -0
- package/dist/components/ui/data-table/utils.d.ts.map +1 -0
- package/dist/components/ui/date-range-picker.d.ts +9 -0
- package/dist/components/ui/date-range-picker.d.ts.map +1 -0
- package/dist/components/ui/dialog.d.ts +16 -0
- package/dist/components/ui/dialog.d.ts.map +1 -0
- package/dist/components/ui/drawer.d.ts +16 -0
- package/dist/components/ui/drawer.d.ts.map +1 -0
- package/dist/components/ui/dropdown-menu.d.ts +28 -0
- package/dist/components/ui/dropdown-menu.d.ts.map +1 -0
- package/dist/components/ui/dropzone/index.d.ts +25 -0
- package/dist/components/ui/dropzone/index.d.ts.map +1 -0
- package/dist/components/ui/input.d.ts +5 -0
- package/dist/components/ui/input.d.ts.map +1 -0
- package/dist/components/ui/label.d.ts +5 -0
- package/dist/components/ui/label.d.ts.map +1 -0
- package/dist/components/ui/page-header/index.d.ts +3 -0
- package/dist/components/ui/page-header/index.d.ts.map +1 -0
- package/dist/components/ui/page-header/page-header-types.d.ts +44 -0
- package/dist/components/ui/page-header/page-header-types.d.ts.map +1 -0
- package/dist/components/ui/page-header/page-header.d.ts +5 -0
- package/dist/components/ui/page-header/page-header.d.ts.map +1 -0
- package/dist/components/ui/popover.d.ts +8 -0
- package/dist/components/ui/popover.d.ts.map +1 -0
- package/dist/components/ui/progress.d.ts +5 -0
- package/dist/components/ui/progress.d.ts.map +1 -0
- package/dist/components/ui/radio-group.d.ts +6 -0
- package/dist/components/ui/radio-group.d.ts.map +1 -0
- package/dist/components/ui/search-input.d.ts +7 -0
- package/dist/components/ui/search-input.d.ts.map +1 -0
- package/dist/components/ui/select.d.ts +16 -0
- package/dist/components/ui/select.d.ts.map +1 -0
- package/dist/components/ui/sheet.d.ts +14 -0
- package/dist/components/ui/sheet.d.ts.map +1 -0
- package/dist/components/ui/skeleton.d.ts +4 -0
- package/dist/components/ui/skeleton.d.ts.map +1 -0
- package/dist/components/ui/slider.d.ts +15 -0
- package/dist/components/ui/slider.d.ts.map +1 -0
- package/dist/components/ui/switch.d.ts +5 -0
- package/dist/components/ui/switch.d.ts.map +1 -0
- package/dist/components/ui/table/Table.d.ts +21 -0
- package/dist/components/ui/table/Table.d.ts.map +1 -0
- package/dist/components/ui/table/index.d.ts +2 -0
- package/dist/components/ui/table/index.d.ts.map +1 -0
- package/dist/components/ui/table.d.ts +11 -0
- package/dist/components/ui/table.d.ts.map +1 -0
- package/dist/components/ui/tabs.d.ts +15 -0
- package/dist/components/ui/tabs.d.ts.map +1 -0
- package/dist/components/ui/toggle.d.ts +10 -0
- package/dist/components/ui/toggle.d.ts.map +1 -0
- package/dist/components/ui/tooltip.d.ts +8 -0
- package/dist/components/ui/tooltip.d.ts.map +1 -0
- package/dist/docs/TAILWIND_SETUP.md +332 -0
- package/dist/index.css +536 -0
- package/dist/index.d.ts +30 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/lib/page-header-utils.d.ts +2 -0
- package/dist/lib/page-header-utils.d.ts.map +1 -0
- package/dist/lib/theme-utils.d.ts +104 -0
- package/dist/lib/theme-utils.d.ts.map +1 -0
- package/dist/lib/utils.d.ts +3 -0
- package/dist/lib/utils.d.ts.map +1 -0
- package/dist/main.d.ts +3 -0
- package/dist/main.d.ts.map +1 -0
- package/dist/mm-react-components.es.js +33709 -26
- package/dist/mm-react-components.es.js.map +1 -0
- package/dist/mm-react-components.umd.js +71 -1
- package/dist/mm-react-components.umd.js.map +1 -0
- package/dist/preview/AccordionPreview.d.ts +2 -0
- package/dist/preview/AccordionPreview.d.ts.map +1 -0
- package/dist/preview/BadgePreview.d.ts +2 -0
- package/dist/preview/BadgePreview.d.ts.map +1 -0
- package/dist/preview/ButtonPreview.d.ts +2 -0
- package/dist/preview/ButtonPreview.d.ts.map +1 -0
- package/dist/preview/CalendarPreview.d.ts +2 -0
- package/dist/preview/CalendarPreview.d.ts.map +1 -0
- package/dist/preview/CheckboxPreview.d.ts +2 -0
- package/dist/preview/CheckboxPreview.d.ts.map +1 -0
- package/dist/preview/CollapsiblePreview.d.ts +2 -0
- package/dist/preview/CollapsiblePreview.d.ts.map +1 -0
- package/dist/preview/DataTablePreview.d.ts +9 -0
- package/dist/preview/DataTablePreview.d.ts.map +1 -0
- package/dist/preview/DateRangePickerPreview.d.ts +2 -0
- package/dist/preview/DateRangePickerPreview.d.ts.map +1 -0
- package/dist/preview/DialogPreview.d.ts +2 -0
- package/dist/preview/DialogPreview.d.ts.map +1 -0
- package/dist/preview/DrawerPreview.d.ts +2 -0
- package/dist/preview/DrawerPreview.d.ts.map +1 -0
- package/dist/preview/DropdownMenuPreview.d.ts +2 -0
- package/dist/preview/DropdownMenuPreview.d.ts.map +1 -0
- package/dist/preview/DropzonePreview.d.ts +2 -0
- package/dist/preview/DropzonePreview.d.ts.map +1 -0
- package/dist/preview/InputPreview.d.ts +2 -0
- package/dist/preview/InputPreview.d.ts.map +1 -0
- package/dist/preview/LabelPreview.d.ts +2 -0
- package/dist/preview/LabelPreview.d.ts.map +1 -0
- package/dist/preview/PopoverPreview.d.ts +2 -0
- package/dist/preview/PopoverPreview.d.ts.map +1 -0
- package/dist/preview/ProgressPreview.d.ts +2 -0
- package/dist/preview/ProgressPreview.d.ts.map +1 -0
- package/dist/preview/RadioGroupPreview.d.ts +2 -0
- package/dist/preview/RadioGroupPreview.d.ts.map +1 -0
- package/dist/preview/SelectPreview.d.ts +2 -0
- package/dist/preview/SelectPreview.d.ts.map +1 -0
- package/dist/preview/SheetPreview.d.ts +2 -0
- package/dist/preview/SheetPreview.d.ts.map +1 -0
- package/dist/preview/SkeletonPreview.d.ts +2 -0
- package/dist/preview/SkeletonPreview.d.ts.map +1 -0
- package/dist/preview/SliderPreview.d.ts +2 -0
- package/dist/preview/SliderPreview.d.ts.map +1 -0
- package/dist/preview/SwitchPreview.d.ts +2 -0
- package/dist/preview/SwitchPreview.d.ts.map +1 -0
- package/dist/preview/TablePreview.d.ts +2 -0
- package/dist/preview/TablePreview.d.ts.map +1 -0
- package/dist/preview/TabsPreview.d.ts +2 -0
- package/dist/preview/TabsPreview.d.ts.map +1 -0
- package/dist/preview/TogglePreview.d.ts +2 -0
- package/dist/preview/TogglePreview.d.ts.map +1 -0
- package/dist/preview/TooltipPreview.d.ts +2 -0
- package/dist/preview/TooltipPreview.d.ts.map +1 -0
- package/dist/preview/data-table/data-table-preview_column-content.d.ts +18 -0
- package/dist/preview/data-table/data-table-preview_column-content.d.ts.map +1 -0
- package/dist/preview/page-header/PageHeaderPreview.d.ts +3 -0
- package/dist/preview/page-header/PageHeaderPreview.d.ts.map +1 -0
- package/dist/tailwind.config.export.js +153 -0
- package/dist/themes/carbide.css +1257 -0
- package/docs/TAILWIND_SETUP.md +332 -0
- package/package.json +119 -15
- package/scripts/README.md +171 -0
- package/scripts/chakra-to-shadcn-migrator/README.md +107 -0
- package/scripts/chakra-to-shadcn-migrator/bin/chakra-to-shadcn.js +1135 -0
- package/src/index.css +536 -0
- package/src/themes/carbide.css +1257 -0
- package/tailwind.config.export.js +153 -0
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
All notable changes to this project will be documented in this file.
|
|
4
|
+
|
|
5
|
+
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
|
6
|
+
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
|
7
|
+
|
|
8
|
+
## [Unreleased]
|
|
9
|
+
|
|
10
|
+
### Added
|
|
11
|
+
|
|
12
|
+
- Initial component library setup
|
|
13
|
+
- Button component with multiple variants
|
|
14
|
+
- Input component with validation states
|
|
15
|
+
- TypeScript support with full type definitions
|
|
16
|
+
- Tailwind CSS integration
|
|
17
|
+
- ESLint and Prettier configuration
|
|
18
|
+
- Playwright testing setup
|
|
19
|
+
|
|
20
|
+
### Changed
|
|
21
|
+
|
|
22
|
+
- N/A
|
|
23
|
+
|
|
24
|
+
### Deprecated
|
|
25
|
+
|
|
26
|
+
- N/A
|
|
27
|
+
|
|
28
|
+
### Removed
|
|
29
|
+
|
|
30
|
+
- N/A
|
|
31
|
+
|
|
32
|
+
### Fixed
|
|
33
|
+
|
|
34
|
+
- N/A
|
|
35
|
+
|
|
36
|
+
### Security
|
|
37
|
+
|
|
38
|
+
- N/A
|
|
39
|
+
|
|
40
|
+
## [0.1.0] - 2025-01-27
|
|
41
|
+
|
|
42
|
+
### Added
|
|
43
|
+
|
|
44
|
+
- Initial release of @machinemetrics/mm-react-components
|
|
45
|
+
- Button component with variants: default, primary, secondary, outline, destructive
|
|
46
|
+
- Input component with type support
|
|
47
|
+
- Utility functions for class name merging
|
|
48
|
+
- Comprehensive TypeScript configuration
|
|
49
|
+
- Modern build system with Vite
|
|
50
|
+
- ESLint and Prettier for code quality
|
|
51
|
+
- Playwright for end-to-end testing
|
|
52
|
+
- NPM distribution configuration
|
|
53
|
+
|
|
54
|
+
### Technical Details
|
|
55
|
+
|
|
56
|
+
- Built on React 19.1.1
|
|
57
|
+
- Uses shadcn/ui as component foundation
|
|
58
|
+
- Tailwind CSS for styling
|
|
59
|
+
- ES modules and UMD bundle support
|
|
60
|
+
- Tree-shakable architecture
|
|
61
|
+
- WCAG 2.1 AA accessibility compliance
|
package/README.md
ADDED
|
@@ -0,0 +1,246 @@
|
|
|
1
|
+
# @machinemetrics/mm-react-components
|
|
2
|
+
|
|
3
|
+
A comprehensive React component library designed specifically for MachineMetrics industrial and manufacturing applications.
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- 🏭 **Industrial-Focused**: Components designed for manufacturing and industrial environments
|
|
8
|
+
- 🎨 **Modern Design**: Built on shadcn/ui with Tailwind CSS for consistent, accessible UI
|
|
9
|
+
- 📦 **Tree-Shakable**: ES modules with full tree-shaking support
|
|
10
|
+
- 🔧 **TypeScript**: Full TypeScript support with comprehensive type definitions
|
|
11
|
+
- ♿ **Accessible**: WCAG 2.1 AA compliant components
|
|
12
|
+
- 🚀 **Performance**: Optimized for real-time data display and monitoring
|
|
13
|
+
|
|
14
|
+
## Installation
|
|
15
|
+
|
|
16
|
+
```bash
|
|
17
|
+
npm install @machinemetrics/mm-react-components
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
## Quick Start
|
|
21
|
+
|
|
22
|
+
### 1. Install Dependencies
|
|
23
|
+
|
|
24
|
+
```bash
|
|
25
|
+
npm install @machinemetrics/mm-react-components tailwindcss postcss autoprefixer
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
### 2. Configure Tailwind CSS
|
|
29
|
+
|
|
30
|
+
Copy the Tailwind configuration to your project:
|
|
31
|
+
|
|
32
|
+
```bash
|
|
33
|
+
cp node_modules/@machinemetrics/mm-react-components/tailwind.config.export.js tailwind.config.js
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
### 3. Import Theme CSS
|
|
37
|
+
|
|
38
|
+
```css
|
|
39
|
+
/* In your main CSS file */
|
|
40
|
+
@import '@machinemetrics/mm-react-components/themes/base';
|
|
41
|
+
@import '@machinemetrics/mm-react-components/themes/carbide';
|
|
42
|
+
@import 'tailwindcss';
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
### 4. Use Components
|
|
46
|
+
|
|
47
|
+
```tsx
|
|
48
|
+
import { Button, Input } from '@machinemetrics/mm-react-components';
|
|
49
|
+
|
|
50
|
+
function App() {
|
|
51
|
+
return (
|
|
52
|
+
<div>
|
|
53
|
+
<Button variant="primary">Start Monitoring</Button>
|
|
54
|
+
<Input placeholder="Enter machine ID..." />
|
|
55
|
+
</div>
|
|
56
|
+
);
|
|
57
|
+
}
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
### 5. Complete Setup Guide
|
|
61
|
+
|
|
62
|
+
For detailed setup instructions, see the [Tailwind Setup Guide](./docs/TAILWIND_SETUP.md).
|
|
63
|
+
|
|
64
|
+
## Theme System
|
|
65
|
+
|
|
66
|
+
The component library includes a comprehensive theme system with two main themes:
|
|
67
|
+
|
|
68
|
+
### Base Theme (OKLCH)
|
|
69
|
+
|
|
70
|
+
- Modern OKLCH color space for better perceptual uniformity
|
|
71
|
+
- Professional typography with Noto Sans and Inconsolata fonts
|
|
72
|
+
- Complete dark mode support
|
|
73
|
+
- Chart and sidebar color systems
|
|
74
|
+
|
|
75
|
+
### Carbide Theme (Industrial)
|
|
76
|
+
|
|
77
|
+
- Manufacturing-appropriate color palette
|
|
78
|
+
- MachineMetrics brand colors (green, grey)
|
|
79
|
+
- Enhanced component styling for industrial applications
|
|
80
|
+
- Complete dark mode support
|
|
81
|
+
|
|
82
|
+
### Using Themes
|
|
83
|
+
|
|
84
|
+
#### Option 1: Import CSS Files Directly
|
|
85
|
+
|
|
86
|
+
```tsx
|
|
87
|
+
// In your main.tsx or App.tsx
|
|
88
|
+
import '@machinemetrics/mm-react-components/themes/base';
|
|
89
|
+
import '@machinemetrics/mm-react-components/themes/carbide';
|
|
90
|
+
|
|
91
|
+
// Add carbide class to activate Carbide theme
|
|
92
|
+
document.documentElement.classList.add('carbide');
|
|
93
|
+
```
|
|
94
|
+
|
|
95
|
+
#### Option 2: Use Theme Utilities
|
|
96
|
+
|
|
97
|
+
```tsx
|
|
98
|
+
import {
|
|
99
|
+
activateCarbideTheme,
|
|
100
|
+
toggleDarkMode,
|
|
101
|
+
isCarbideThemeActive,
|
|
102
|
+
} from '@machinemetrics/mm-react-components';
|
|
103
|
+
|
|
104
|
+
// Activate Carbide theme
|
|
105
|
+
activateCarbideTheme();
|
|
106
|
+
|
|
107
|
+
// Toggle dark mode
|
|
108
|
+
toggleDarkMode();
|
|
109
|
+
|
|
110
|
+
// Check theme status
|
|
111
|
+
const isCarbideActive = isCarbideThemeActive();
|
|
112
|
+
```
|
|
113
|
+
|
|
114
|
+
#### Option 3: Manual CSS Import
|
|
115
|
+
|
|
116
|
+
```css
|
|
117
|
+
/* In your CSS file */
|
|
118
|
+
@import '@machinemetrics/mm-react-components/themes/base';
|
|
119
|
+
@import '@machinemetrics/mm-react-components/themes/carbide';
|
|
120
|
+
```
|
|
121
|
+
|
|
122
|
+
### Theme Classes
|
|
123
|
+
|
|
124
|
+
The theme system uses CSS classes for activation:
|
|
125
|
+
|
|
126
|
+
- **Base theme**: Active by default
|
|
127
|
+
- **Carbide theme**: Add `carbide` class to `<html>` element
|
|
128
|
+
- **Dark mode**: Add `dark` class to `<html>` element
|
|
129
|
+
|
|
130
|
+
```html
|
|
131
|
+
<!-- Base theme -->
|
|
132
|
+
<html>
|
|
133
|
+
<!-- Carbide theme -->
|
|
134
|
+
<html class="carbide">
|
|
135
|
+
<!-- Carbide theme + dark mode -->
|
|
136
|
+
<html class="carbide dark"></html>
|
|
137
|
+
</html>
|
|
138
|
+
</html>
|
|
139
|
+
```
|
|
140
|
+
|
|
141
|
+
### Available Theme Utilities
|
|
142
|
+
|
|
143
|
+
```tsx
|
|
144
|
+
import {
|
|
145
|
+
// Carbide theme utilities
|
|
146
|
+
activateCarbideTheme,
|
|
147
|
+
deactivateCarbideTheme,
|
|
148
|
+
toggleCarbideTheme,
|
|
149
|
+
isCarbideThemeActive,
|
|
150
|
+
|
|
151
|
+
// Dark mode utilities
|
|
152
|
+
activateDarkMode,
|
|
153
|
+
deactivateDarkMode,
|
|
154
|
+
toggleDarkMode,
|
|
155
|
+
isDarkModeActive,
|
|
156
|
+
} from '@machinemetrics/mm-react-components';
|
|
157
|
+
```
|
|
158
|
+
|
|
159
|
+
## Components
|
|
160
|
+
|
|
161
|
+
### Button
|
|
162
|
+
|
|
163
|
+
A versatile button component with multiple variants for different use cases.
|
|
164
|
+
|
|
165
|
+
```tsx
|
|
166
|
+
import { Button } from '@machinemetrics/mm-react-components';
|
|
167
|
+
|
|
168
|
+
// Basic usage
|
|
169
|
+
<Button>Default</Button>
|
|
170
|
+
|
|
171
|
+
// Variants
|
|
172
|
+
<Button variant="primary">Primary</Button>
|
|
173
|
+
<Button variant="secondary">Secondary</Button>
|
|
174
|
+
<Button variant="outline">Outline</Button>
|
|
175
|
+
<Button variant="destructive">Destructive</Button>
|
|
176
|
+
|
|
177
|
+
// Sizes
|
|
178
|
+
<Button size="sm">Small</Button>
|
|
179
|
+
<Button size="lg">Large</Button>
|
|
180
|
+
```
|
|
181
|
+
|
|
182
|
+
### Input
|
|
183
|
+
|
|
184
|
+
Form input component with built-in validation states.
|
|
185
|
+
|
|
186
|
+
```tsx
|
|
187
|
+
import { Input } from '@machinemetrics/mm-react-components';
|
|
188
|
+
|
|
189
|
+
<Input placeholder="Enter value..." />
|
|
190
|
+
<Input type="email" placeholder="Email address" />
|
|
191
|
+
<Input type="password" placeholder="Password" />
|
|
192
|
+
```
|
|
193
|
+
|
|
194
|
+
## Styling
|
|
195
|
+
|
|
196
|
+
The component library uses Tailwind CSS. Make sure to include the styles in your application:
|
|
197
|
+
|
|
198
|
+
```tsx
|
|
199
|
+
import '@machinemetrics/mm-react-components/styles';
|
|
200
|
+
```
|
|
201
|
+
|
|
202
|
+
If you're using Tailwind CSS in your project, you can also import the component styles directly:
|
|
203
|
+
|
|
204
|
+
```css
|
|
205
|
+
@import '@machinemetrics/mm-react-components/styles';
|
|
206
|
+
```
|
|
207
|
+
|
|
208
|
+
## TypeScript Support
|
|
209
|
+
|
|
210
|
+
This library is built with TypeScript and provides full type definitions:
|
|
211
|
+
|
|
212
|
+
```tsx
|
|
213
|
+
import { Button, type ButtonProps } from '@machinemetrics/mm-react-components';
|
|
214
|
+
|
|
215
|
+
const CustomButton: React.FC<ButtonProps> = (props) => {
|
|
216
|
+
return <Button {...props} />;
|
|
217
|
+
};
|
|
218
|
+
```
|
|
219
|
+
|
|
220
|
+
## Requirements
|
|
221
|
+
|
|
222
|
+
- React 18.0.0 or higher
|
|
223
|
+
- Node.js 20.0.0 or higher
|
|
224
|
+
|
|
225
|
+
## Browser Support
|
|
226
|
+
|
|
227
|
+
- Chrome (latest)
|
|
228
|
+
- Firefox (latest)
|
|
229
|
+
- Safari (latest)
|
|
230
|
+
- Edge (latest)
|
|
231
|
+
|
|
232
|
+
## Contributing
|
|
233
|
+
|
|
234
|
+
We welcome contributions! Please see our [Contributing Guide](CONTRIBUTING.md) for details.
|
|
235
|
+
|
|
236
|
+
## License
|
|
237
|
+
|
|
238
|
+
MIT License - see [LICENSE](LICENSE) file for details.
|
|
239
|
+
|
|
240
|
+
## Support
|
|
241
|
+
|
|
242
|
+
For support and questions, please contact the MachineMetrics development team.
|
|
243
|
+
|
|
244
|
+
---
|
|
245
|
+
|
|
246
|
+
Built with ❤️ by the MachineMetrics team for industrial applications.
|
package/dist/App.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"App.d.ts","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":"AAwEA,iBAAS,GAAG,4CAmPX;AAED,eAAe,GAAG,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import * as AccordionPrimitive from '@radix-ui/react-accordion';
|
|
3
|
+
declare function Accordion({ className, ...props }: React.ComponentProps<typeof AccordionPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
declare function AccordionItem({ className, ...props }: React.ComponentProps<typeof AccordionPrimitive.Item>): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
declare function AccordionTrigger({ className, children, indicatorClassName, ...props }: React.ComponentProps<typeof AccordionPrimitive.Trigger> & {
|
|
6
|
+
indicatorClassName?: string;
|
|
7
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
declare function AccordionContent({ className, children, ...props }: React.ComponentProps<typeof AccordionPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
|
|
10
|
+
//# sourceMappingURL=accordion.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/components/ui/accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,kBAAkB,MAAM,2BAA2B,CAAC;AAKhE,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC,2CAQtD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC,2CAQtD;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,kBAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,GAAG;IAC3D,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,2CAqBA;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,2CAUzD;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
3
|
+
declare const badgeVariants: (props?: ({
|
|
4
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | null | undefined;
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
|
+
declare function Badge({ className, variant, asChild, ...props }: React.ComponentProps<'span'> & VariantProps<typeof badgeVariants> & {
|
|
7
|
+
asChild?: boolean;
|
|
8
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export { Badge, badgeVariants };
|
|
10
|
+
//# sourceMappingURL=badge.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/components/ui/badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE,QAAA,MAAM,aAAa;;8EAmBlB,CAAC;AAEF,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,OAAO,EACP,OAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,GAC7B,YAAY,CAAC,OAAO,aAAa,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,2CAU3D;AAED,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
3
|
+
declare const buttonVariants: (props?: ({
|
|
4
|
+
variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
|
|
5
|
+
size?: "default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
|
|
6
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
7
|
+
declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
|
|
8
|
+
asChild?: boolean;
|
|
9
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export { Button, buttonVariants };
|
|
11
|
+
//# sourceMappingURL=button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/ui/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE,QAAA,MAAM,cAAc;;;8EAgCnB,CAAC;AAEF,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAO,EACP,IAAI,EACJ,OAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAC/B,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,2CAYF;AAED,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { DayButton, DayPicker } from 'react-day-picker';
|
|
3
|
+
import { Button } from '@/components/ui/button';
|
|
4
|
+
declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, ...props }: React.ComponentProps<typeof DayPicker> & {
|
|
5
|
+
buttonVariant?: React.ComponentProps<typeof Button>['variant'];
|
|
6
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
declare function CalendarDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export { Calendar, CalendarDayButton };
|
|
9
|
+
//# sourceMappingURL=calendar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../src/components/ui/calendar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAE,SAAS,EAAE,SAAS,EAAwB,MAAM,kBAAkB,CAAC;AAG9E,OAAO,EAAE,MAAM,EAAkB,MAAM,wBAAwB,CAAC;AAEhE,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,UAAU,EACV,eAAsB,EACtB,aAAuB,EACvB,aAAuB,EACvB,UAAU,EACV,UAAU,EACV,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,GAAG;IAC1C,aAAa,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC,SAAS,CAAC,CAAC;CAChE,2CA2IA;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,EACH,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,2CA4BxC;AAED,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,CAAC"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
|
|
3
|
+
declare function Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export { Checkbox };
|
|
5
|
+
//# sourceMappingURL=checkbox.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/ui/checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAK9D,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,2CAkBrD;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
|
|
3
|
+
declare function Collapsible({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.Root>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
declare function CollapsibleTrigger({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
declare function CollapsibleContent({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export { Collapsible, CollapsibleTrigger, CollapsibleContent };
|
|
7
|
+
//# sourceMappingURL=collapsible.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"collapsible.d.ts","sourceRoot":"","sources":["../../../src/components/ui/collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,oBAAoB,MAAM,6BAA6B,CAAC;AAEpE,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,2CAExD;AAED,iBAAS,kBAAkB,CAAC,EAC1B,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,kBAAkB,CAAC,2CAOtE;AAED,iBAAS,kBAAkB,CAAC,EAC1B,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,kBAAkB,CAAC,2CAOtE;AAED,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,CAAC"}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import type { DataTableProps } from './types';
|
|
2
|
+
export declare function DataTable<TData, TValue>({ columns, data, loading, columnRegistry, initialState, tableId, toolbar, emptyState, forceEmptyState, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
//# sourceMappingURL=TableView.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableView.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/data-table/TableView.tsx"],"names":[],"mappings":"AAoCA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAkH9C,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,EACvC,OAAO,EACP,IAAI,EACJ,OAAe,EACf,cAAc,EACd,YAAY,EACZ,OAAO,EACP,OAAO,EACP,UAAU,EACV,eAAe,GAChB,EAAE,cAAc,CAAC,KAAK,EAAE,MAAM,CAAC,2CAmkB/B"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { DataTableProps, DataTableToolbarOptions } from '../types';
|
|
2
|
+
export interface ResponsiveTableProps<TData, TValue> extends DataTableProps<TData, TValue> {
|
|
3
|
+
breakpoint?: string;
|
|
4
|
+
enableMobileVirtualization?: boolean;
|
|
5
|
+
virtualizeAt?: number;
|
|
6
|
+
overscan?: number;
|
|
7
|
+
toolbarOptions?: DataTableToolbarOptions;
|
|
8
|
+
}
|
|
9
|
+
export declare function ResponsiveTable<TData, TValue>({ columns, data, loading, columnRegistry, initialState, breakpoint, enableMobileVirtualization, virtualizeAt, overscan, tableId, toolbarOptions, emptyState, forceEmptyState, }: ResponsiveTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
//# sourceMappingURL=ResponsiveTable.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ResponsiveTable.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/data-table/cards/ResponsiveTable.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAC;AASxE,MAAM,WAAW,oBAAoB,CAAC,KAAK,EAAE,MAAM,CACjD,SAAQ,cAAc,CAAC,KAAK,EAAE,MAAM,CAAC;IACrC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,0BAA0B,CAAC,EAAE,OAAO,CAAC;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,uBAAuB,CAAC;CAC1C;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,EAC7C,OAAO,EACP,IAAI,EACJ,OAAO,EACP,cAAc,EACd,YAAY,EACZ,UAAiC,EACjC,0BAAiC,EACjC,YAAkB,EAClB,QAAY,EACZ,OAAO,EACP,cAAc,EACd,UAAU,EACV,eAAe,GAChB,EAAE,oBAAoB,CAAC,KAAK,EAAE,MAAM,CAAC,2CAqCrC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type Row } from '@tanstack/react-table';
|
|
2
|
+
import type { ColumnRegistry } from '../metadata/ColumnRegistry';
|
|
3
|
+
export interface RowCardProps<TData> {
|
|
4
|
+
row: Row<TData>;
|
|
5
|
+
columnRegistry?: ColumnRegistry<TData, unknown>;
|
|
6
|
+
className?: string;
|
|
7
|
+
}
|
|
8
|
+
export declare function RowCard<TData>({ row, columnRegistry, className, }: RowCardProps<TData>): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
//# sourceMappingURL=RowCard.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RowCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/data-table/cards/RowCard.tsx"],"names":[],"mappings":"AACA,OAAO,EAAyB,KAAK,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAExE,OAAO,KAAK,EAEV,cAAc,EACf,MAAM,4BAA4B,CAAC;AAEpC,MAAM,WAAW,YAAY,CAAC,KAAK;IACjC,GAAG,EAAE,GAAG,CAAC,KAAK,CAAC,CAAC;IAChB,cAAc,CAAC,EAAE,cAAc,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAiCD,wBAAgB,OAAO,CAAC,KAAK,EAAE,EAC7B,GAAG,EACH,cAAc,EACd,SAAS,GACV,EAAE,YAAY,CAAC,KAAK,CAAC,2CAmLrB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/data-table/cards/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { ColumnDef } from '@tanstack/react-table';
|
|
3
|
+
import { Badge } from '@/components/ui/badge';
|
|
4
|
+
import type { ColumnDefaults, ColumnDescriptor } from '../metadata/ColumnRegistry';
|
|
5
|
+
interface BadgeConfig<TValue extends string> {
|
|
6
|
+
labelMap: Record<TValue, string>;
|
|
7
|
+
variantMap?: Record<TValue, React.ComponentProps<typeof Badge>['variant']>;
|
|
8
|
+
}
|
|
9
|
+
interface BadgeColumnOptions<TData, TValue extends string> extends Partial<ColumnDefaults>, BadgeConfig<TValue> {
|
|
10
|
+
id: string;
|
|
11
|
+
accessorKey?: string;
|
|
12
|
+
header: ColumnDef<TData, TValue>['header'];
|
|
13
|
+
}
|
|
14
|
+
export declare function createBadgeColumn<TData, TValue extends string>(options: BadgeColumnOptions<TData, TValue>): ColumnDescriptor<TData, TValue>;
|
|
15
|
+
export {};
|
|
16
|
+
//# sourceMappingURL=badgeColumn.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"badgeColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/data-table/columnTypes/badgeColumn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAE9C,OAAO,KAAK,EACV,cAAc,EACd,gBAAgB,EACjB,MAAM,4BAA4B,CAAC;AAEpC,UAAU,WAAW,CAAC,MAAM,SAAS,MAAM;IACzC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACjC,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;CAC5E;AAED,UAAU,kBAAkB,CAAC,KAAK,EAAE,MAAM,SAAS,MAAM,CACvD,SAAQ,OAAO,CAAC,cAAc,CAAC,EAC7B,WAAW,CAAC,MAAM,CAAC;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC;CAC5C;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,SAAS,MAAM,EAC5D,OAAO,EAAE,kBAAkB,CAAC,KAAK,EAAE,MAAM,CAAC,GACzC,gBAAgB,CAAC,KAAK,EAAE,MAAM,CAAC,CA8BjC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { ColumnDef } from '@tanstack/react-table';
|
|
2
|
+
import type { ColumnDefaults, ColumnDescriptor } from '../metadata/ColumnRegistry';
|
|
3
|
+
export interface ColumnOptions<TData, TValue> extends Partial<ColumnDefaults> {
|
|
4
|
+
id: string;
|
|
5
|
+
column: ColumnDef<TData, TValue>;
|
|
6
|
+
}
|
|
7
|
+
export declare function createColumnDescriptor<TData, TValue>(options: ColumnOptions<TData, TValue>): ColumnDescriptor<TData, TValue>;
|
|
8
|
+
//# sourceMappingURL=createColumn.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"createColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/data-table/columnTypes/createColumn.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAY,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAAK,EACV,cAAc,EACd,gBAAgB,EAEjB,MAAM,4BAA4B,CAAC;AAuHpC,MAAM,WAAW,aAAa,CAAC,KAAK,EAAE,MAAM,CAAE,SAAQ,OAAO,CAAC,cAAc,CAAC;IAC3E,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;CAClC;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,EAClD,OAAO,EAAE,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,GACpC,gBAAgB,CAAC,KAAK,EAAE,MAAM,CAAC,CA8CjC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { ColumnDef } from '@tanstack/react-table';
|
|
2
|
+
import type { ColumnDefaults, ColumnDescriptor } from '../metadata/ColumnRegistry';
|
|
3
|
+
export interface DateColumnOptions<TData> extends Partial<ColumnDefaults> {
|
|
4
|
+
id: string;
|
|
5
|
+
accessorKey?: string;
|
|
6
|
+
header: ColumnDef<TData, string | Date>['header'];
|
|
7
|
+
/** Optional Intl.DateTimeFormat; defaults to en-US short date */
|
|
8
|
+
formatter?: Intl.DateTimeFormat;
|
|
9
|
+
/** Optional custom formatter override for full control */
|
|
10
|
+
format?: (date: Date) => string;
|
|
11
|
+
}
|
|
12
|
+
export declare function createDateColumn<TData>(options: DateColumnOptions<TData>): ColumnDescriptor<TData, string | Date>;
|
|
13
|
+
//# sourceMappingURL=dateColumn.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dateColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/data-table/columnTypes/dateColumn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,KAAK,EACV,cAAc,EACd,gBAAgB,EACjB,MAAM,4BAA4B,CAAC;AAEpC,MAAM,WAAW,iBAAiB,CAAC,KAAK,CAAE,SAAQ,OAAO,CAAC,cAAc,CAAC;IACvE,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC;IAClD,iEAAiE;IACjE,SAAS,CAAC,EAAE,IAAI,CAAC,cAAc,CAAC;IAChC,0DAA0D;IAC1D,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,CAAC;CACjC;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EACpC,OAAO,EAAE,iBAAiB,CAAC,KAAK,CAAC,GAChC,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC,CAkDxC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export * from './createColumn';
|
|
2
|
+
export * from './textColumn';
|
|
3
|
+
export * from './numericColumn';
|
|
4
|
+
export * from './badgeColumn';
|
|
5
|
+
export * from './selectionColumn';
|
|
6
|
+
export * from './multiBadgeColumn';
|
|
7
|
+
export * from './dateColumn';
|
|
8
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/data-table/columnTypes/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { ColumnDef } from '@tanstack/react-table';
|
|
3
|
+
import { Badge } from '@/components/ui/badge';
|
|
4
|
+
import type { ColumnDefaults, ColumnDescriptor } from '../metadata/ColumnRegistry';
|
|
5
|
+
interface MultiBadgeConfig<TValue extends string> {
|
|
6
|
+
labelMap?: Record<TValue, string>;
|
|
7
|
+
variantMap?: Record<TValue, React.ComponentProps<typeof Badge>['variant']>;
|
|
8
|
+
}
|
|
9
|
+
interface MultiBadgeColumnOptions<TData, TValue extends string> extends Partial<ColumnDefaults>, MultiBadgeConfig<TValue> {
|
|
10
|
+
id: string;
|
|
11
|
+
accessorKey?: string;
|
|
12
|
+
header: ColumnDef<TData, TValue[]>['header'];
|
|
13
|
+
}
|
|
14
|
+
export declare function createMultiBadgeColumn<TData, TValue extends string = string>(options: MultiBadgeColumnOptions<TData, TValue>): ColumnDescriptor<TData, TValue[]>;
|
|
15
|
+
export {};
|
|
16
|
+
//# sourceMappingURL=multiBadgeColumn.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"multiBadgeColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/data-table/columnTypes/multiBadgeColumn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAE9C,OAAO,KAAK,EACV,cAAc,EACd,gBAAgB,EACjB,MAAM,4BAA4B,CAAC;AAEpC,UAAU,gBAAgB,CAAC,MAAM,SAAS,MAAM;IAC9C,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;CAC5E;AAED,UAAU,uBAAuB,CAAC,KAAK,EAAE,MAAM,SAAS,MAAM,CAC5D,SAAQ,OAAO,CAAC,cAAc,CAAC,EAC7B,gBAAgB,CAAC,MAAM,CAAC;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC;CAC9C;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,SAAS,MAAM,GAAG,MAAM,EAC1E,OAAO,EAAE,uBAAuB,CAAC,KAAK,EAAE,MAAM,CAAC,GAC9C,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,CAAC,CAsCnC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { ColumnDef } from '@tanstack/react-table';
|
|
2
|
+
import type { ColumnDefaults, ColumnDescriptor } from '../metadata/ColumnRegistry';
|
|
3
|
+
interface NumericFormatOptions {
|
|
4
|
+
format?: 'integer' | 'decimal' | 'percent';
|
|
5
|
+
decimals?: number;
|
|
6
|
+
}
|
|
7
|
+
interface NumericColumnOptions<TData> extends NumericFormatOptions, Partial<ColumnDefaults> {
|
|
8
|
+
id: string;
|
|
9
|
+
accessorKey?: string;
|
|
10
|
+
header: ColumnDef<TData, number>['header'];
|
|
11
|
+
formatter?: (value: number) => string;
|
|
12
|
+
}
|
|
13
|
+
export declare function createNumericColumn<TData>(options: NumericColumnOptions<TData>): ColumnDescriptor<TData, number>;
|
|
14
|
+
export {};
|
|
15
|
+
//# sourceMappingURL=numericColumn.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"numericColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/data-table/columnTypes/numericColumn.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAGvD,OAAO,KAAK,EACV,cAAc,EACd,gBAAgB,EACjB,MAAM,4BAA4B,CAAC;AAEpC,UAAU,oBAAoB;IAC5B,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,CAAC;IAC3C,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,UAAU,oBAAoB,CAAC,KAAK,CAClC,SAAQ,oBAAoB,EAC1B,OAAO,CAAC,cAAc,CAAC;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC;IAC3C,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CACvC;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EACvC,OAAO,EAAE,oBAAoB,CAAC,KAAK,CAAC,GACnC,gBAAgB,CAAC,KAAK,EAAE,MAAM,CAAC,CA2CjC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { ColumnDescriptor } from '../metadata/ColumnRegistry';
|
|
2
|
+
export interface SelectionColumnOptions {
|
|
3
|
+
id?: string;
|
|
4
|
+
size?: number;
|
|
5
|
+
minSize?: number;
|
|
6
|
+
maxSize?: number;
|
|
7
|
+
order?: number;
|
|
8
|
+
}
|
|
9
|
+
export declare function createSelectionColumn<TData = unknown>(options?: SelectionColumnOptions): ColumnDescriptor<TData, unknown>;
|
|
10
|
+
//# sourceMappingURL=selectionColumn.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"selectionColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/data-table/columnTypes/selectionColumn.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAEnE,MAAM,WAAW,sBAAsB;IACrC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,qBAAqB,CAAC,KAAK,GAAG,OAAO,EACnD,OAAO,GAAE,sBAA2B,GACnC,gBAAgB,CAAC,KAAK,EAAE,OAAO,CAAC,CAyClC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { ColumnDef } from '@tanstack/react-table';
|
|
2
|
+
import type { ColumnDefaults, ColumnDescriptor } from '../metadata/ColumnRegistry';
|
|
3
|
+
interface BaseColumnOptions<TData, TValue> {
|
|
4
|
+
id: string;
|
|
5
|
+
header: ColumnDef<TData, TValue>['header'];
|
|
6
|
+
cell: ColumnDef<TData, TValue>['cell'];
|
|
7
|
+
accessorKey?: string;
|
|
8
|
+
column?: ColumnDef<TData, TValue>;
|
|
9
|
+
defaults?: Partial<ColumnDefaults>;
|
|
10
|
+
}
|
|
11
|
+
export declare function createTextColumn<TData, TValue = string>(options: BaseColumnOptions<TData, TValue>): ColumnDescriptor<TData, TValue>;
|
|
12
|
+
export {};
|
|
13
|
+
//# sourceMappingURL=textColumn.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"textColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/data-table/columnTypes/textColumn.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAGvD,OAAO,KAAK,EACV,cAAc,EACd,gBAAgB,EACjB,MAAM,4BAA4B,CAAC;AAGpC,UAAU,iBAAiB,CAAC,KAAK,EAAE,MAAM;IACvC,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC;IAC3C,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CACpC;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EACrD,OAAO,EAAE,iBAAiB,CAAC,KAAK,EAAE,MAAM,CAAC,GACxC,gBAAgB,CAAC,KAAK,EAAE,MAAM,CAAC,CAoBjC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export { DataTable } from './TableView';
|
|
2
|
+
export type { ColumnDefaults, ColumnDescriptor, ColumnRegistry, Align as TableColumnAlignment, MobileRole as TableMobileRole, } from './metadata/ColumnRegistry';
|
|
3
|
+
export type { DataTableProps, DataTableInitialState } from './types';
|
|
4
|
+
export { createColumnRegistry, resolveColumnOrder, resolveColumnVisibility, } from './metadata/ColumnRegistry';
|
|
5
|
+
export { getPresetAlignment, determineTextAlignment, detectContentType, getAlignmentForContentType, } from './metadata/alignment';
|
|
6
|
+
export { TABLE_TOKENS } from './tokens';
|
|
7
|
+
export { createColumnDescriptor, createTextColumn, createNumericColumn, createBadgeColumn, createSelectionColumn, createMultiBadgeColumn, createDateColumn, } from './columnTypes';
|
|
8
|
+
export { useDataTableState, useBreakpoint } from './state';
|
|
9
|
+
export { useTableController } from './useTableController';
|
|
10
|
+
export { DataTableToolbar } from './toolbar';
|
|
11
|
+
export { ResponsiveTable } from './cards/ResponsiveTable';
|
|
12
|
+
export { exportTableToCSV } from './utils';
|
|
13
|
+
export { DataTablePagination } from './pagination';
|
|
14
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/data-table/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EACV,cAAc,EACd,gBAAgB,EAChB,cAAc,EACd,KAAK,IAAI,oBAAoB,EAC7B,UAAU,IAAI,eAAe,GAC9B,MAAM,2BAA2B,CAAC;AACnC,YAAY,EAAE,cAAc,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AACrE,OAAO,EACL,oBAAoB,EACpB,kBAAkB,EAClB,uBAAuB,GACxB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACL,kBAAkB,EAClB,sBAAsB,EACtB,iBAAiB,EACjB,0BAA0B,GAC3B,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EACL,sBAAsB,EACtB,gBAAgB,EAChB,mBAAmB,EACnB,iBAAiB,EACjB,qBAAqB,EACrB,sBAAsB,EACtB,gBAAgB,GACjB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC"}
|