@iqworksai/common-components 0.1.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.
Files changed (195) hide show
  1. package/CHANGELOG.md +27 -0
  2. package/README.md +398 -0
  3. package/dist/.gitkeep +3 -0
  4. package/dist/components/Alert/Alert.stories.d.ts +14 -0
  5. package/dist/components/Alert/Alert.stories.d.ts.map +1 -0
  6. package/dist/components/Alert/index.d.ts +15 -0
  7. package/dist/components/Alert/index.d.ts.map +1 -0
  8. package/dist/components/CSVImporter/CSVImporter.stories.d.ts +10 -0
  9. package/dist/components/CSVImporter/CSVImporter.stories.d.ts.map +1 -0
  10. package/dist/components/CSVImporter/helpers.d.ts +8 -0
  11. package/dist/components/CSVImporter/helpers.d.ts.map +1 -0
  12. package/dist/components/CSVImporter/index.d.ts +15 -0
  13. package/dist/components/CSVImporter/index.d.ts.map +1 -0
  14. package/dist/components/Charts/ChartHeader/ChartHeader.stories.d.ts +9 -0
  15. package/dist/components/Charts/ChartHeader/ChartHeader.stories.d.ts.map +1 -0
  16. package/dist/components/Charts/ChartHeader/index.d.ts +10 -0
  17. package/dist/components/Charts/ChartHeader/index.d.ts.map +1 -0
  18. package/dist/components/Charts/CustomLegends/CustomLegends.stories.d.ts +10 -0
  19. package/dist/components/Charts/CustomLegends/CustomLegends.stories.d.ts.map +1 -0
  20. package/dist/components/Charts/CustomLegends/index.d.ts +13 -0
  21. package/dist/components/Charts/CustomLegends/index.d.ts.map +1 -0
  22. package/dist/components/Charts/DonutChart/DonutChart.stories.d.ts +10 -0
  23. package/dist/components/Charts/DonutChart/DonutChart.stories.d.ts.map +1 -0
  24. package/dist/components/Charts/DonutChart/index.d.ts +21 -0
  25. package/dist/components/Charts/DonutChart/index.d.ts.map +1 -0
  26. package/dist/components/Charts/GaugeChart/GaugeChart.stories.d.ts +10 -0
  27. package/dist/components/Charts/GaugeChart/GaugeChart.stories.d.ts.map +1 -0
  28. package/dist/components/Charts/GaugeChart/index.d.ts +47 -0
  29. package/dist/components/Charts/GaugeChart/index.d.ts.map +1 -0
  30. package/dist/components/Charts/GeoChart/GeoChart.stories.d.ts +9 -0
  31. package/dist/components/Charts/GeoChart/GeoChart.stories.d.ts.map +1 -0
  32. package/dist/components/Charts/GeoChart/index.d.ts +35 -0
  33. package/dist/components/Charts/GeoChart/index.d.ts.map +1 -0
  34. package/dist/components/Charts/HorizontalBarChart/HorizontalBarChart.stories.d.ts +11 -0
  35. package/dist/components/Charts/HorizontalBarChart/HorizontalBarChart.stories.d.ts.map +1 -0
  36. package/dist/components/Charts/HorizontalBarChart/index.d.ts +12 -0
  37. package/dist/components/Charts/HorizontalBarChart/index.d.ts.map +1 -0
  38. package/dist/components/Charts/NoDataChart/NoDataChart.stories.d.ts +9 -0
  39. package/dist/components/Charts/NoDataChart/NoDataChart.stories.d.ts.map +1 -0
  40. package/dist/components/Charts/NoDataChart/index.d.ts +8 -0
  41. package/dist/components/Charts/NoDataChart/index.d.ts.map +1 -0
  42. package/dist/components/Charts/PieChart/PieChart.stories.d.ts +10 -0
  43. package/dist/components/Charts/PieChart/PieChart.stories.d.ts.map +1 -0
  44. package/dist/components/Charts/PieChart/index.d.ts +22 -0
  45. package/dist/components/Charts/PieChart/index.d.ts.map +1 -0
  46. package/dist/components/Charts/StorageChart/StorageChart.stories.d.ts +10 -0
  47. package/dist/components/Charts/StorageChart/StorageChart.stories.d.ts.map +1 -0
  48. package/dist/components/Charts/StorageChart/index.d.ts +11 -0
  49. package/dist/components/Charts/StorageChart/index.d.ts.map +1 -0
  50. package/dist/components/Charts/VerticalBarChart/VerticalBarChart.stories.d.ts +9 -0
  51. package/dist/components/Charts/VerticalBarChart/VerticalBarChart.stories.d.ts.map +1 -0
  52. package/dist/components/Charts/VerticalBarChart/index.d.ts +15 -0
  53. package/dist/components/Charts/VerticalBarChart/index.d.ts.map +1 -0
  54. package/dist/components/ConfidenceScoreTooltip/ConfidenceScoreTooltip.stories.d.ts +10 -0
  55. package/dist/components/ConfidenceScoreTooltip/ConfidenceScoreTooltip.stories.d.ts.map +1 -0
  56. package/dist/components/ConfidenceScoreTooltip/index.d.ts +16 -0
  57. package/dist/components/ConfidenceScoreTooltip/index.d.ts.map +1 -0
  58. package/dist/components/ConfirmationModal/ConfirmationModal.stories.d.ts +10 -0
  59. package/dist/components/ConfirmationModal/ConfirmationModal.stories.d.ts.map +1 -0
  60. package/dist/components/ConfirmationModal/index.d.ts +16 -0
  61. package/dist/components/ConfirmationModal/index.d.ts.map +1 -0
  62. package/dist/components/CountryBox/CountryBox.stories.d.ts +9 -0
  63. package/dist/components/CountryBox/CountryBox.stories.d.ts.map +1 -0
  64. package/dist/components/CountryBox/index.d.ts +9 -0
  65. package/dist/components/CountryBox/index.d.ts.map +1 -0
  66. package/dist/components/Dropdown/Dropdown.stories.d.ts +9 -0
  67. package/dist/components/Dropdown/Dropdown.stories.d.ts.map +1 -0
  68. package/dist/components/Dropdown/index.d.ts +14 -0
  69. package/dist/components/Dropdown/index.d.ts.map +1 -0
  70. package/dist/components/ErrorBoundary/ComponentErrorBoundary.d.ts +19 -0
  71. package/dist/components/ErrorBoundary/ComponentErrorBoundary.d.ts.map +1 -0
  72. package/dist/components/ErrorBoundary/ErrorBoundary.stories.d.ts +10 -0
  73. package/dist/components/ErrorBoundary/ErrorBoundary.stories.d.ts.map +1 -0
  74. package/dist/components/ErrorBoundary/index.d.ts +29 -0
  75. package/dist/components/ErrorBoundary/index.d.ts.map +1 -0
  76. package/dist/components/FileTypeIcon/FileTypeIcon.stories.d.ts +9 -0
  77. package/dist/components/FileTypeIcon/FileTypeIcon.stories.d.ts.map +1 -0
  78. package/dist/components/FileTypeIcon/index.d.ts +9 -0
  79. package/dist/components/FileTypeIcon/index.d.ts.map +1 -0
  80. package/dist/components/ImagePreviewModal/ImagePreviewModal.stories.d.ts +12 -0
  81. package/dist/components/ImagePreviewModal/ImagePreviewModal.stories.d.ts.map +1 -0
  82. package/dist/components/ImagePreviewModal/index.d.ts +23 -0
  83. package/dist/components/ImagePreviewModal/index.d.ts.map +1 -0
  84. package/dist/components/InstallUpdateLoader/InstallUpdateLoader.stories.d.ts +11 -0
  85. package/dist/components/InstallUpdateLoader/InstallUpdateLoader.stories.d.ts.map +1 -0
  86. package/dist/components/InstallUpdateLoader/index.d.ts +11 -0
  87. package/dist/components/InstallUpdateLoader/index.d.ts.map +1 -0
  88. package/dist/components/Loader/Loader.stories.d.ts +10 -0
  89. package/dist/components/Loader/Loader.stories.d.ts.map +1 -0
  90. package/dist/components/Loader/index.d.ts +9 -0
  91. package/dist/components/Loader/index.d.ts.map +1 -0
  92. package/dist/components/Modal/Modal.stories.d.ts +12 -0
  93. package/dist/components/Modal/Modal.stories.d.ts.map +1 -0
  94. package/dist/components/Modal/index.d.ts +23 -0
  95. package/dist/components/Modal/index.d.ts.map +1 -0
  96. package/dist/components/MultiSelect/MultiSelect.stories.d.ts +11 -0
  97. package/dist/components/MultiSelect/MultiSelect.stories.d.ts.map +1 -0
  98. package/dist/components/MultiSelect/index.d.ts +37 -0
  99. package/dist/components/MultiSelect/index.d.ts.map +1 -0
  100. package/dist/components/NoActiveAttributeWarning/NoActiveAttributeWarning.stories.d.ts +9 -0
  101. package/dist/components/NoActiveAttributeWarning/NoActiveAttributeWarning.stories.d.ts.map +1 -0
  102. package/dist/components/NoActiveAttributeWarning/index.d.ts +8 -0
  103. package/dist/components/NoActiveAttributeWarning/index.d.ts.map +1 -0
  104. package/dist/components/ResourceUsageBadge/ResourceUsageBadge.stories.d.ts +11 -0
  105. package/dist/components/ResourceUsageBadge/ResourceUsageBadge.stories.d.ts.map +1 -0
  106. package/dist/components/ResourceUsageBadge/index.d.ts +13 -0
  107. package/dist/components/ResourceUsageBadge/index.d.ts.map +1 -0
  108. package/dist/components/RiskScoreLabel/RiskScoreLabel.stories.d.ts +12 -0
  109. package/dist/components/RiskScoreLabel/RiskScoreLabel.stories.d.ts.map +1 -0
  110. package/dist/components/RiskScoreLabel/index.d.ts +9 -0
  111. package/dist/components/RiskScoreLabel/index.d.ts.map +1 -0
  112. package/dist/components/ShowMultiData/ShowMultiData.stories.d.ts +10 -0
  113. package/dist/components/ShowMultiData/ShowMultiData.stories.d.ts.map +1 -0
  114. package/dist/components/ShowMultiData/index.d.ts +15 -0
  115. package/dist/components/ShowMultiData/index.d.ts.map +1 -0
  116. package/dist/components/StatusBadge/StatusBadge.stories.d.ts +15 -0
  117. package/dist/components/StatusBadge/StatusBadge.stories.d.ts.map +1 -0
  118. package/dist/components/StatusBadge/index.d.ts +24 -0
  119. package/dist/components/StatusBadge/index.d.ts.map +1 -0
  120. package/dist/components/Table/Table.stories.d.ts +20 -0
  121. package/dist/components/Table/Table.stories.d.ts.map +1 -0
  122. package/dist/components/Table/index.d.ts +43 -0
  123. package/dist/components/Table/index.d.ts.map +1 -0
  124. package/dist/components/TaskResult/TaskResult.stories.d.ts +10 -0
  125. package/dist/components/TaskResult/TaskResult.stories.d.ts.map +1 -0
  126. package/dist/components/TaskResult/index.d.ts +27 -0
  127. package/dist/components/TaskResult/index.d.ts.map +1 -0
  128. package/dist/components/Timer/Timer.stories.d.ts +10 -0
  129. package/dist/components/Timer/Timer.stories.d.ts.map +1 -0
  130. package/dist/components/Timer/index.d.ts +11 -0
  131. package/dist/components/Timer/index.d.ts.map +1 -0
  132. package/dist/components/Toast/Toast.stories.d.ts +13 -0
  133. package/dist/components/Toast/Toast.stories.d.ts.map +1 -0
  134. package/dist/components/Toast/index.d.ts +12 -0
  135. package/dist/components/Toast/index.d.ts.map +1 -0
  136. package/dist/components/ToggleSwitch/ToggleSwitch.stories.d.ts +12 -0
  137. package/dist/components/ToggleSwitch/ToggleSwitch.stories.d.ts.map +1 -0
  138. package/dist/components/ToggleSwitch/index.d.ts +12 -0
  139. package/dist/components/ToggleSwitch/index.d.ts.map +1 -0
  140. package/dist/components/ToolTip/ToolTip.stories.d.ts +13 -0
  141. package/dist/components/ToolTip/ToolTip.stories.d.ts.map +1 -0
  142. package/dist/components/ToolTip/index.d.ts +12 -0
  143. package/dist/components/ToolTip/index.d.ts.map +1 -0
  144. package/dist/constants/enums.d.ts +54 -0
  145. package/dist/constants/enums.d.ts.map +1 -0
  146. package/dist/constants/statusBadgeClasses.d.ts +2 -0
  147. package/dist/constants/statusBadgeClasses.d.ts.map +1 -0
  148. package/dist/context/ContextProvider.d.ts +33 -0
  149. package/dist/context/ContextProvider.d.ts.map +1 -0
  150. package/dist/context/ContextProvider.stories.d.ts +9 -0
  151. package/dist/context/ContextProvider.stories.d.ts.map +1 -0
  152. package/dist/context/LoaderContext.d.ts +13 -0
  153. package/dist/context/LoaderContext.d.ts.map +1 -0
  154. package/dist/context/LoaderContext.stories.d.ts +8 -0
  155. package/dist/context/LoaderContext.stories.d.ts.map +1 -0
  156. package/dist/context/ThemeContext.d.ts +51 -0
  157. package/dist/context/ThemeContext.d.ts.map +1 -0
  158. package/dist/context/ThemeContext.stories.d.ts +11 -0
  159. package/dist/context/ThemeContext.stories.d.ts.map +1 -0
  160. package/dist/context/ToastContext.d.ts +39 -0
  161. package/dist/context/ToastContext.d.ts.map +1 -0
  162. package/dist/context/ToastContext.stories.d.ts +9 -0
  163. package/dist/context/ToastContext.stories.d.ts.map +1 -0
  164. package/dist/hooks/useApiCache.d.ts +26 -0
  165. package/dist/hooks/useApiCache.d.ts.map +1 -0
  166. package/dist/hooks/useAssetPath.d.ts +28 -0
  167. package/dist/hooks/useAssetPath.d.ts.map +1 -0
  168. package/dist/hooks/useBodyScrollLock.d.ts +6 -0
  169. package/dist/hooks/useBodyScrollLock.d.ts.map +1 -0
  170. package/dist/hooks/useClickOutside.d.ts +13 -0
  171. package/dist/hooks/useClickOutside.d.ts.map +1 -0
  172. package/dist/hooks/useDebounce.d.ts +8 -0
  173. package/dist/hooks/useDebounce.d.ts.map +1 -0
  174. package/dist/hooks/useFilterCache.d.ts +26 -0
  175. package/dist/hooks/useFilterCache.d.ts.map +1 -0
  176. package/dist/hooks/useReduxHook.d.ts +19 -0
  177. package/dist/hooks/useReduxHook.d.ts.map +1 -0
  178. package/dist/index.cjs +168 -0
  179. package/dist/index.d.ts +56 -0
  180. package/dist/index.d.ts.map +1 -0
  181. package/dist/index.mjs +29076 -0
  182. package/dist/style.css +1 -0
  183. package/dist/types/table.d.ts +59 -0
  184. package/dist/types/table.d.ts.map +1 -0
  185. package/dist/utils/classNames.d.ts +16 -0
  186. package/dist/utils/classNames.d.ts.map +1 -0
  187. package/dist/utils/formatBytes.d.ts +8 -0
  188. package/dist/utils/formatBytes.d.ts.map +1 -0
  189. package/dist/utils/memoUtils.d.ts +13 -0
  190. package/dist/utils/memoUtils.d.ts.map +1 -0
  191. package/dist/utils/riskScore.d.ts +11 -0
  192. package/dist/utils/riskScore.d.ts.map +1 -0
  193. package/dist/utils/statusConfig.d.ts +14 -0
  194. package/dist/utils/statusConfig.d.ts.map +1 -0
  195. package/package.json +124 -0
package/CHANGELOG.md ADDED
@@ -0,0 +1,27 @@
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
+ ## [0.1.0] - 2025-01-XX
9
+
10
+ ### Added
11
+ - Initial project setup
12
+ - Package structure with TypeScript and Vite configuration
13
+ - Storybook setup with essential addons
14
+ - Basic utilities: classNames, memoUtils
15
+ - Constants: enums (ToastType, TableType, etc.)
16
+ - Components:
17
+ - Alert component with Storybook stories
18
+ - Loader component with Storybook stories
19
+ - Main export file (src/index.ts)
20
+
21
+ ### Infrastructure
22
+ - TypeScript configuration
23
+ - Vite build configuration for library
24
+ - Storybook configuration
25
+ - Package.json with all dependencies
26
+ - README.md with comprehensive documentation
27
+
package/README.md ADDED
@@ -0,0 +1,398 @@
1
+ # @iqworksai/common-components
2
+
3
+ A reusable React component library and utilities package for IQWorks applications. Provides 46+ UI components, custom hooks, context providers, and utility functions extracted from DiscoverIQ Desktop.
4
+
5
+ ## 🎉 Current Status
6
+
7
+ **Progress: 35 out of 46 components migrated (76%)**
8
+
9
+ ### ✅ Completed Categories
10
+ - ✅ **Context Providers**: 4/4 (100%) - ThemeProvider, LoaderProvider, ToastProvider, ContextProvider
11
+ - ✅ **Hooks**: 7/7 (100%) - All custom hooks migrated
12
+ - ✅ **Basic UI Components**: 13/13 (100%) - Alert, Modal, Toast, ToolTip, StatusBadge, etc.
13
+ - ✅ **Chart Components**: 7/7 (100%) - DonutChart, PieChart, BarCharts, GaugeChart, GeoChart, StorageChart
14
+ - ✅ **Chart Helper Components**: 3/3 (100%) - NoDataChart, ChartHeader, CustomLegends
15
+ - ✅ **Utility Components**: 4/4 (100%) - ConfirmationModal, Timer, ErrorBoundary, ComponentErrorBoundary
16
+ - ✅ **Form Components**: 4/4 (100%) - Dropdown, MultiSelect, Table, CSVImporter
17
+ - ✅ **Specialized Components**: 4/4 (100%) - TaskResult, InstallUpdateLoader, ConfidenceScoreTooltip, ImagePreviewModal
18
+
19
+ ### ⏳ In Progress
20
+ - 🔄 **FilterModal** - Advanced filtering modal (next priority)
21
+ - 📋 **Remaining Components**: 11 components remaining (FileBrowser, DbSchemaBrowser, MixedScanResults, etc.)
22
+
23
+ ## Features
24
+
25
+ - 🎨 **35+ UI Components** - Comprehensive set of React components including modals, charts, forms, and data display components
26
+ - 🪝 **7 Custom Hooks** - Reusable React hooks for common patterns (debounce, API caching, click outside, etc.)
27
+ - 🎯 **4 Context Providers** - Theme, Toast, Loader, and main Context providers
28
+ - 🛠️ **Utility Functions** - Data transformation, risk scoring, status configuration, and more
29
+ - 📚 **Storybook Documentation** - Interactive component documentation with live examples for all migrated components
30
+ - 🎯 **TypeScript** - Full TypeScript support with comprehensive type definitions
31
+ - 🌲 **Tree-shakeable** - Optimized for bundle size with ES modules
32
+ - ♿ **Accessible** - WCAG compliant components with keyboard navigation support
33
+ - 🎨 **Tailwind CSS** - Styled with Tailwind CSS for easy customization
34
+ - 🌓 **Dark Mode** - Full dark mode support via CSS variables and ThemeProvider
35
+ - 🔌 **Optional Dependencies** - Redux and React Router are optional, making the library flexible
36
+
37
+ ## Installation
38
+
39
+ ```bash
40
+ npm install @iqworksai/common-components
41
+ # or
42
+ yarn add @iqworksai/common-components
43
+ # or
44
+ pnpm add @iqworksai/common-components
45
+ ```
46
+
47
+ ## Quick Start
48
+
49
+ ### Basic Setup
50
+
51
+ ```tsx
52
+ import { ThemeProvider, ToastProvider } from '@iqworksai/common-components';
53
+
54
+ function App() {
55
+ return (
56
+ <ThemeProvider>
57
+ <ToastProvider>
58
+ {/* Your app content */}
59
+ </ToastProvider>
60
+ </ThemeProvider>
61
+ );
62
+ }
63
+ ```
64
+
65
+ ### Using Components
66
+
67
+ ```tsx
68
+ import { Alert, Modal, Loader, Table } from '@iqworksai/common-components';
69
+
70
+ function MyComponent() {
71
+ return (
72
+ <div>
73
+ <Alert message="Welcome!" type="success" />
74
+ <Loader loading={true} />
75
+ <Table data={myData} columns={myColumns} />
76
+ </div>
77
+ );
78
+ }
79
+ ```
80
+
81
+ ### Using Hooks
82
+
83
+ ```tsx
84
+ import { useDebounce, useClickOutside } from '@iqworksai/common-components';
85
+
86
+ function SearchComponent() {
87
+ const [searchTerm, setSearchTerm] = useState('');
88
+ const debouncedSearch = useDebounce(searchTerm, 500);
89
+
90
+ // Use debouncedSearch for API calls
91
+ }
92
+ ```
93
+
94
+ ### Using Utilities
95
+
96
+ ```tsx
97
+ import { formatBytes, getStatusConfig, getRiskScoreInfo } from '@iqworksai/common-components';
98
+
99
+ const size = formatBytes(1024); // "1 KB"
100
+ const status = getStatusConfig('successful'); // Status configuration with icon and colors
101
+ const riskInfo = getRiskScoreInfo(75); // Risk level information
102
+ ```
103
+
104
+ ## Documentation
105
+
106
+ - **Storybook Documentation** - Run `npm run storybook` to view interactive component playground with live examples
107
+ - **[Next Steps](./NEXT_STEPS.md)** - Detailed migration progress and roadmap
108
+ - **[Component Migration Guide](./COMPONENT_MIGRATION_GUIDE.md)** - Guidelines for migrating components
109
+ - **[Setup Progress](./SETUP_PROGRESS.md)** - Setup and configuration progress
110
+
111
+ ### Recent Accomplishments
112
+
113
+ - ✅ **CSVImporter Component** - CSV import with preview, validation, and optional TestConnection integration
114
+ - ✅ **Table Component** - Complex table with search, export, pagination, sorting, and bulk actions (Redux optional)
115
+ - ✅ **All Chart Components** - 7 chart types with full dark mode support
116
+ - ✅ **All Context Providers** - Theme, Toast, Loader, and ContextProvider with optional Redux/Router
117
+ - ✅ **All Hooks** - 7 custom hooks with optional Redux integration
118
+ - ✅ **Dark Mode Support** - All components support dark mode via CSS variables
119
+ - ✅ **Storybook Stories** - All migrated components have comprehensive Storybook stories
120
+
121
+ ## Component Categories
122
+
123
+ ### ✅ Basic UI Components (13/13 - 100%)
124
+ - **Alert** - Alert messages with variants (success, error, warning, info)
125
+ - **Loader** - Loading spinner component
126
+ - **Modal** - Modal dialog with header, body, and footer
127
+ - **Toast** - Toast notification component
128
+ - **ToolTip** - Tooltip component with positioning
129
+ - **StatusBadge** - Status badge with icons and animations
130
+ - **ToggleSwitch** - Toggle switch component
131
+ - **ResourceUsageBadge** - Resource usage indicator
132
+ - **ShowMultiData** - Expandable multi-line data display
133
+ - **RiskScoreLabel** - Risk score display with color coding
134
+ - **FileTypeIcon** - File type icon component
135
+ - **NoActiveAttributeWarning** - Warning message component
136
+ - **CountryBox** - Country selection/display box
137
+
138
+ ### ✅ Form Components (4/4 - 100%)
139
+ - **Dropdown** - Dropdown menu using Headless UI
140
+ - **MultiSelect** - Multi-select component using react-select
141
+ - **Table** - Advanced table component with pagination, sorting, search, export, and bulk actions (Redux optional)
142
+ - **CSVImporter** - CSV import component with preview and validation
143
+
144
+ ### ✅ Chart Components (7/7 - 100%)
145
+ - **DonutChart** - Doughnut chart with legends and optional table
146
+ - **PieChart** - Pie chart with percentage labels
147
+ - **VerticalBarChart** - Vertical bar chart with optional line overlay
148
+ - **HorizontalBarChart** - Horizontal bar chart with scale options (linear, logarithmic, normalized)
149
+ - **GaugeChart** - Gauge/donut chart with optional year range slider
150
+ - **GeoChart** - Geographic choropleth map chart
151
+ - **StorageChart** - Storage visualization with icon and formatted values
152
+
153
+ ### ✅ Chart Helper Components (3/3 - 100%)
154
+ - **NoDataChart** - Empty state component for charts
155
+ - **ChartHeader** - Chart header with title and optional right content
156
+ - **CustomLegends** - Custom legend component for charts
157
+
158
+ ### ✅ Utility Components (4/4 - 100%)
159
+ - **ConfirmationModal** - Confirmation dialog with customizable actions
160
+ - **Timer** - Countdown/elapsed time display
161
+ - **ErrorBoundary** - Top-level error boundary with fallback UI
162
+ - **ComponentErrorBoundary** - Component-level error boundary
163
+
164
+ ### ✅ Specialized Components (4/4 - 100%)
165
+ - **TaskResult** - Task result modal with summary and error details
166
+ - **InstallUpdateLoader** - Installation/update progress loader
167
+ - **ConfidenceScoreTooltip** - Classification confidence score tooltip
168
+ - **ImagePreviewModal** - Image preview modal with loading and error handling
169
+
170
+ ### ⏳ Remaining Components (11 components)
171
+ - **FilterModal** - Advanced filtering modal (in progress)
172
+ - **FileBrowser** - File browsing interface
173
+ - **DbSchemaBrowser** - Database schema browser
174
+ - **MixedScanResults** - Combined file and database scan results
175
+ - **NotificationQueue** - Toast notification queue
176
+ - **ProductSwitcher** - Product selection switcher
177
+ - **TestConnection** - Connection testing component
178
+ - **CustomRecurrenceDialog** - Recurrence pattern dialog
179
+ - **UpdateDepartmentModal** - Department update modal
180
+ - **UpdateSettings** - Settings update component
181
+ - **UserAppUpdateSettings** - User app update settings
182
+
183
+ ## Hooks (7/7 - 100% Complete)
184
+
185
+ - ✅ **useApiCache** - API response caching hook with Redux integration (optional)
186
+ - ✅ **useAssetPath** / **useFileIconPath** - Asset path resolution hook (Electron-agnostic)
187
+ - ✅ **useBodyScrollLock** - Body scroll lock hook for modals
188
+ - ✅ **useClickOutside** - Click outside detection hook
189
+ - ✅ **useDebounce** - Debounce hook for input values
190
+ - ✅ **useFilterCache** - Filter state caching hook with Redux integration (optional)
191
+ - ✅ **useReduxHook** - Redux integration hook (useAppDispatch, useAppSelector) - gracefully handles missing Redux
192
+
193
+ ## Context Providers (4/4 - 100% Complete)
194
+
195
+ - ✅ **ThemeProvider** - Theme management (light/dark mode) with CSS variables, custom fonts, and global styling
196
+ - ✅ **ToastProvider** - Toast notification management with optional Redux integration
197
+ - ✅ **LoaderProvider** - Global loading state management
198
+ - ✅ **ContextProvider** - Main context provider wrapper that aggregates all providers (Redux and Router optional)
199
+
200
+ ## Development
201
+
202
+ ### Prerequisites
203
+
204
+ - Node.js 18+
205
+ - npm, yarn, or pnpm
206
+
207
+ ### Setup
208
+
209
+ ```bash
210
+ # Clone the repository
211
+ git clone https://github.com/iqworksai/common-components.git
212
+ cd common-components
213
+
214
+ # Install dependencies
215
+ npm install
216
+
217
+ # Run Storybook
218
+ npm run storybook
219
+
220
+ # Build library
221
+ npm run build
222
+
223
+ # Run tests
224
+ npm test
225
+
226
+ # Run tests with coverage
227
+ npm run test:coverage
228
+ ```
229
+
230
+ ### Available Scripts
231
+
232
+ - `npm run build` - Build the library for production
233
+ - `npm run build:watch` - Build in watch mode
234
+ - `npm run typecheck` - Type check without emitting
235
+ - `npm test` - Run tests
236
+ - `npm run test:watch` - Run tests in watch mode
237
+ - `npm run test:coverage` - Run tests with coverage
238
+ - `npm run lint` - Lint code
239
+ - `npm run lint:fix` - Fix linting issues
240
+ - `npm run storybook` - Start Storybook dev server
241
+ - `npm run build-storybook` - Build Storybook for deployment
242
+
243
+ ## Styling
244
+
245
+ This library uses Tailwind CSS with CSS variables for theming. To use the components in your project:
246
+
247
+ 1. **Import the styles** in your app:
248
+ ```tsx
249
+ import '@iqworksai/common-components/dist/style.css';
250
+ ```
251
+
252
+ 2. **Configure Tailwind** to include the library:
253
+ ```js
254
+ // tailwind.config.js
255
+ module.exports = {
256
+ content: [
257
+ './src/**/*.{js,jsx,ts,tsx}',
258
+ './node_modules/@iqworksai/common-components/**/*.{js,jsx,ts,tsx}',
259
+ ],
260
+ darkMode: 'class', // Required for dark mode support
261
+ // ... rest of config
262
+ };
263
+ ```
264
+
265
+ 3. **Wrap your app with ThemeProvider** for theme support:
266
+ ```tsx
267
+ import { ThemeProvider } from '@iqworksai/common-components';
268
+
269
+ function App() {
270
+ return (
271
+ <ThemeProvider>
272
+ {/* Your app */}
273
+ </ThemeProvider>
274
+ );
275
+ }
276
+ ```
277
+
278
+ ### CSS Variables
279
+
280
+ The library uses CSS variables for theming. Key variables include:
281
+ - `--bg-color` - Background color
282
+ - `--text-color` - Text color
283
+ - `--border-color` - Border color
284
+ - `--brand-primary` - Primary brand color (orange)
285
+ - `--brand-light` - Light brand color
286
+ - `--brand-dark` - Dark brand color
287
+ - `--hover-bg-color` - Hover background color
288
+
289
+ See `src/styles/index.css` for the complete list of CSS variables.
290
+
291
+ ## TypeScript Support
292
+
293
+ Full TypeScript support is included. Import types as needed:
294
+
295
+ ```tsx
296
+ import type {
297
+ AlertProps,
298
+ TableProps,
299
+ CSVRow,
300
+ PaginatedResult,
301
+ ListApiParameters,
302
+ FilterState,
303
+ FilterField
304
+ } from '@iqworksai/common-components';
305
+ ```
306
+
307
+ ### Type Definitions
308
+
309
+ All components export their prop types. Key type exports include:
310
+ - Component prop types (e.g., `AlertProps`, `TableProps`, `ModalProps`)
311
+ - Table types (`PaginatedResult`, `ListApiParameters`, `FilterState`, `FilterField`)
312
+ - CSV types (`CSVRow`)
313
+ - Status types (`StatusConfig`, `RiskScoreInfo`)
314
+ - Context types (`ThemeConfig`, `ToastContextProps`, `LoaderContextProps`)
315
+
316
+ ## Browser Support
317
+
318
+ - Chrome (latest)
319
+ - Firefox (latest)
320
+ - Safari (latest)
321
+ - Edge (latest)
322
+
323
+ ## Contributing
324
+
325
+ Contributions are welcome! Please see [CONTRIBUTING.md](./CONTRIBUTING.md) for guidelines.
326
+
327
+ ## Versioning
328
+
329
+ This project follows [Semantic Versioning](https://semver.org/):
330
+ - **MAJOR** version for breaking changes
331
+ - **MINOR** version for new features (backward compatible)
332
+ - **PATCH** version for bug fixes (backward compatible)
333
+
334
+ ## License
335
+
336
+ PROPRIETARY - Internal use only
337
+
338
+ ## Support
339
+
340
+ For issues and questions, please open an issue on [GitHub](https://github.com/iqworksai/common-components/issues).
341
+
342
+ ## Changelog
343
+
344
+ See [CHANGELOG.md](./CHANGELOG.md) for a list of changes.
345
+
346
+ ## Key Features & Highlights
347
+
348
+ ### 🎯 Optional Dependencies
349
+ - **Redux** - All Redux dependencies are optional. Components work without Redux, but can integrate if available.
350
+ - **React Router** - Router is optional in ContextProvider.
351
+ - **Electron** - All Electron-specific code has been removed or made optional.
352
+
353
+ ### 🌓 Dark Mode
354
+ - All components support dark mode via CSS variables.
355
+ - ThemeProvider manages theme state and CSS variables.
356
+ - Seamless theme switching with `toggleTheme()`.
357
+
358
+ ### 📊 Advanced Table Component
359
+ - Pagination, sorting, searching, and filtering
360
+ - Bulk actions support
361
+ - Export to CSV functionality
362
+ - Optional Redux integration
363
+ - Optional FilterModal integration
364
+ - Row click handlers
365
+ - Column borders and styling options
366
+
367
+ ### 📈 Chart Components
368
+ - 7 chart types using Chart.js
369
+ - Full dark mode support
370
+ - Custom legends and headers
371
+ - Empty state handling
372
+ - Responsive and accessible
373
+
374
+ ### 🎨 Theming
375
+ - CSS variable-based theming
376
+ - Custom font support
377
+ - Global style overrides
378
+ - Consistent color palette
379
+
380
+ ## Migration Status
381
+
382
+ **35 out of 46 components completed (76%)**
383
+
384
+ - ✅ All basic UI components
385
+ - ✅ All chart components
386
+ - ✅ All context providers
387
+ - ✅ All hooks
388
+ - ✅ All form components (including complex Table)
389
+ - ✅ All utility components
390
+ - ⏳ FilterModal (in progress)
391
+ - ⏳ 10 remaining specialized components
392
+
393
+ See [NEXT_STEPS.md](./NEXT_STEPS.md) for detailed progress and roadmap.
394
+
395
+ ---
396
+
397
+ Built with ❤️ by the IQWorks team
398
+
package/dist/.gitkeep ADDED
@@ -0,0 +1,3 @@
1
+ # This directory is for static assets used by Storybook
2
+ # Add any static files (images, fonts, etc.) here
3
+
@@ -0,0 +1,14 @@
1
+ import { Meta, StoryObj } from '@storybook/react';
2
+ import { Alert } from './index';
3
+
4
+ declare const meta: Meta<typeof Alert>;
5
+ export default meta;
6
+ type Story = StoryObj<typeof Alert>;
7
+ export declare const Default: Story;
8
+ export declare const Success: Story;
9
+ export declare const Error: Story;
10
+ export declare const Warning: Story;
11
+ export declare const WithTitle: Story;
12
+ export declare const Compact: Story;
13
+ export declare const NoIcon: Story;
14
+ //# sourceMappingURL=Alert.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Alert.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/Alert.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,KAAK,CAuC5B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,KAAK,CAAC,CAAC;AAEpC,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAMvB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAMpB,CAAC"}
@@ -0,0 +1,15 @@
1
+ import { default as React } from 'react';
2
+
3
+ export type AlertVariant = 'info' | 'warning' | 'success' | 'error';
4
+ export interface AlertProps {
5
+ variant?: AlertVariant;
6
+ title?: string;
7
+ children: React.ReactNode;
8
+ compact?: boolean;
9
+ className?: string;
10
+ borderStyle?: 'left' | 'all';
11
+ icon?: boolean;
12
+ }
13
+ export declare const Alert: React.FC<AlertProps>;
14
+ export default Alert;
15
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAEpE,MAAM,WAAW,UAAU;IACzB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAgBD,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CA4BtC,CAAC;AAEF,eAAe,KAAK,CAAC"}
@@ -0,0 +1,10 @@
1
+ import { Meta, StoryObj } from '@storybook/react';
2
+ import { default as CSVImporter } from './index';
3
+
4
+ declare const meta: Meta<typeof CSVImporter>;
5
+ export default meta;
6
+ type Story = StoryObj<typeof CSVImporter>;
7
+ export declare const DatabaseImport: Story;
8
+ export declare const SharedDriveImport: Story;
9
+ export declare const WithTestConnection: Story;
10
+ //# sourceMappingURL=CSVImporter.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CSVImporter.stories.d.ts","sourceRoot":"","sources":["../../../src/components/CSVImporter/CSVImporter.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,WAAW,MAAM,SAAS,CAAC;AAIlC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAclC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AA+B1C,eAAO,MAAM,cAAc,EAAE,KAE5B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAE/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAsBhC,CAAC"}
@@ -0,0 +1,8 @@
1
+ import { CSVTypeValue } from '../../constants/enums';
2
+
3
+ export type CSVRow = Record<string, string>;
4
+ /** Generates and downloads a sample CSV */
5
+ export declare const generateSampleCSV: (csvType?: CSVTypeValue) => void;
6
+ /** Formats the CSV data into the expected structure */
7
+ export declare const formatCSVData: (data: CSVRow[], csvType?: CSVTypeValue) => CSVRow[];
8
+ //# sourceMappingURL=helpers.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/components/CSVImporter/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,MAAM,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAE5C,2CAA2C;AAC3C,eAAO,MAAM,iBAAiB,GAAI,UAAS,YAAyB,SAiEnE,CAAC;AAEF,uDAAuD;AACvD,eAAO,MAAM,aAAa,GAAI,MAAM,MAAM,EAAE,EAAE,UAAS,YAAyB,KAAG,MAAM,EA6BxF,CAAC"}
@@ -0,0 +1,15 @@
1
+ import { default as React } from 'react';
2
+ import { CSVRow } from './helpers';
3
+ import { CSVTypeValue } from '../../constants/enums';
4
+
5
+ type CSVImporterProps = {
6
+ csvType?: CSVTypeValue;
7
+ connectionType?: string;
8
+ onClose: () => void;
9
+ onConfirm: (data: CSVRow[]) => void;
10
+ TestConnection?: React.ComponentType<any>;
11
+ };
12
+ declare const CSVImporter: React.FC<CSVImporterProps>;
13
+ export default CSVImporter;
14
+ export type { CSVRow };
15
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CSVImporter/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,OAAO,EAAoC,MAAM,EAAE,MAAM,WAAW,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,KAAK,gBAAgB,GAAG;IACtB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACpC,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;CAC3C,CAAC;AAIF,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAkM3C,CAAC;AAEF,eAAe,WAAW,CAAC;AAC3B,YAAY,EAAE,MAAM,EAAE,CAAC"}
@@ -0,0 +1,9 @@
1
+ import { Meta, StoryObj } from '@storybook/react';
2
+ import { default as ChartHeader } from './index';
3
+
4
+ declare const meta: Meta<typeof ChartHeader>;
5
+ export default meta;
6
+ type Story = StoryObj<typeof ChartHeader>;
7
+ export declare const Default: Story;
8
+ export declare const WithRightContent: Story;
9
+ //# sourceMappingURL=ChartHeader.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChartHeader.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/ChartHeader/ChartHeader.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,WAAW,MAAM,SAAS,CAAC;AAElC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAIlC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AAE1C,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAO9B,CAAC"}
@@ -0,0 +1,10 @@
1
+ import { default as React } from 'react';
2
+
3
+ export interface ChartHeaderProps {
4
+ title: string;
5
+ mainClassname?: string;
6
+ rightContent?: React.ReactNode;
7
+ }
8
+ declare const ChartHeader: React.FC<ChartHeaderProps>;
9
+ export default ChartHeader;
10
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/ChartHeader/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAChC;AAED,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAY3C,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -0,0 +1,10 @@
1
+ import { Meta, StoryObj } from '@storybook/react';
2
+ import { default as CustomLegends } from './index';
3
+
4
+ declare const meta: Meta<typeof CustomLegends>;
5
+ export default meta;
6
+ type Story = StoryObj<typeof CustomLegends>;
7
+ export declare const Default: Story;
8
+ export declare const WithPercentages: Story;
9
+ export declare const WithViewAll: Story;
10
+ //# sourceMappingURL=CustomLegends.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CustomLegends.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/CustomLegends/CustomLegends.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,aAAa,MAAM,SAAS,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,aAAa,CAIpC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,aAAa,CAAC,CAAC;AAE5C,eAAO,MAAM,OAAO,EAAE,KASrB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAU7B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAezB,CAAC"}
@@ -0,0 +1,13 @@
1
+ import { default as React } from 'react';
2
+
3
+ export interface CustomLegendsProps {
4
+ legends: string[];
5
+ maxDisplayLegends?: number;
6
+ dataValues?: number[];
7
+ colors: string[];
8
+ showAllLegends?: boolean;
9
+ onClick?: () => void;
10
+ }
11
+ declare const CustomLegends: React.FC<CustomLegendsProps>;
12
+ export default CustomLegends;
13
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/CustomLegends/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,kBAAkB;IACjC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAuE/C,CAAC;AAEF,eAAe,aAAa,CAAC"}
@@ -0,0 +1,10 @@
1
+ import { Meta, StoryObj } from '@storybook/react';
2
+ import { default as DonutChart } from './index';
3
+
4
+ declare const meta: Meta<typeof DonutChart>;
5
+ export default meta;
6
+ type Story = StoryObj<typeof DonutChart>;
7
+ export declare const Default: Story;
8
+ export declare const WithCustomColors: Story;
9
+ export declare const ManyCategories: Story;
10
+ //# sourceMappingURL=DonutChart.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DonutChart.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/DonutChart/DonutChart.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,UAAU,MAAM,SAAS,CAAC;AAEjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CAIjC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAC;AAEzC,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAU5B,CAAC"}
@@ -0,0 +1,21 @@
1
+ import { default as React } from 'react';
2
+
3
+ export interface DonutChartProps {
4
+ labels: string[];
5
+ dataValues: number[];
6
+ colors?: string[];
7
+ title?: string;
8
+ tableHeader?: string;
9
+ /**
10
+ * Optional table component for showing all legends in modal
11
+ * If not provided, a simple list will be shown instead
12
+ */
13
+ renderLegendTable?: (data: Array<{
14
+ id: number;
15
+ label: string;
16
+ percentage: string;
17
+ }>) => React.ReactNode;
18
+ }
19
+ declare const DonutChart: React.FC<DonutChartProps>;
20
+ export default DonutChart;
21
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/DonutChart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAWxC,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;CACzG;AAED,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA8HzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -0,0 +1,10 @@
1
+ import { Meta, StoryObj } from '@storybook/react';
2
+ import { default as GaugeChart } from './index';
3
+
4
+ declare const meta: Meta<typeof GaugeChart>;
5
+ export default meta;
6
+ type Story = StoryObj<typeof GaugeChart>;
7
+ export declare const Default: Story;
8
+ export declare const WithSlider: Story;
9
+ export declare const NoData: Story;
10
+ //# sourceMappingURL=GaugeChart.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"GaugeChart.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Charts/GaugeChart/GaugeChart.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,UAAU,MAAM,SAAS,CAAC;AAEjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CAIjC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAC;AAEzC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAwBxB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAMpB,CAAC"}