@erpsquad/common 1.7.0 → 1.7.2

package/CHANGELOG.md

@@ -1,301 +1,279 @@
-# Changelog
-
-All notable changes to the ERP UI Library will be documented in this file.
-
-The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
-and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
-
-## [1.6.2] - 2024-11-17
-
-### Added
-- **Complete SCSS Export System**: All SCSS files (variables, mixins, utilities, animations) are now properly exported and accessible
-- **Centralized Style Bundling**: Created `src/styles/index.ts` that imports all component styles
-- **SCSS Export Wrappers**: Added export files for easy importing:
-  - `@erpsquad/common/styles/variables` - Color palette and design tokens
-  - `@erpsquad/common/styles/mixins` - Flexbox, transitions, and responsive mixins
-  - `@erpsquad/common/styles/utils` - Utility classes
-  - `@erpsquad/common/styles/animations` - Keyframe animations
-  - `@erpsquad/common/styles/all` - All SCSS features at once
-- **Package.json Exports**: Added proper exports configuration for all style resources
-- **SCSS Source Files in Package**: Added `src/styles` to the published package files
-- **Comprehensive Documentation**: 
-  - `src/styles/README.md` - Complete technical reference
-  - `STYLES_USAGE.md` - User guide with examples
-  - `STYLES_MIGRATION.md` - Migration guide
-  - `STYLES_QUICK_REFERENCE.md` - Quick reference cheat sheet
-  - `STYLES_TROUBLESHOOTING.md` - Troubleshooting guide
-  - `STYLES_IMPLEMENTATION_SUMMARY.md` - Technical implementation details
-
-### Fixed
-- **Bug in Utility Classes**: Fixed `.pl-1` and `.pr-1` which were incorrectly using `margin` instead of `padding`
-- **Empty main.scss**: Populated `main.scss` to properly import all shared SCSS files (variables, mixins, utils, animations)
-- **Missing SCSS Files**: SCSS source files are now included in the published package, resolving "Can't find stylesheet to import" errors
-
-### Changed
-- Updated `main.scss` to import normalize.css, reset.css, and all core SCSS files
-- Enhanced `README.md` with comprehensive "Styles & SCSS" section
-- Updated Vite configuration to include `styles` as an entry point
-- Improved build process to bundle all component styles correctly
-
-### Documentation
-- All styles documentation is now comprehensive and production-ready
-- Added usage examples for CSS bundle, SCSS variables, SCSS mixins, and utility classes
-- Provided troubleshooting guide for common style-related issues
-- Added migration guide showing what changed and how to use new features
-
-### Breaking Changes
-- None! This update is 100% backward compatible
-
-### Notes
-- Consumers can now import SCSS variables and mixins in their projects
-- Utility classes are fully documented and available via CSS import
-- Design tokens ensure consistency across consuming applications
-- Responsive breakpoints are available as SCSS mixins
-
-## [1.0.0] - 2024-01-15
-
-### Added
-- Initial release of the ERP UI Library as a standalone npm package
-- 80+ UI components extracted from erp-common workspace module
-- Comprehensive theming system with light/dark mode support
-- RTL/LTR text direction support
-- Flexible Redux integration (optional)
-- TypeScript definitions for all components and utilities
-- Custom hooks for authentication, language, permissions, and more
-- Utility functions for date formatting, file size, text manipulation, and colors
-- Context providers for auth, language, pages, and permissions
-- Enhanced components with flexible Redux/prop-based usage patterns
-- Comprehensive documentation and examples
-- Migration guide from erp-common workspace module
-
-### Components
-- **Form Controls**: Button, TextField, Select, DatePicker, Checkbox, Radio, Switch, etc.
-- **Data Display**: MaterialTable, Grid, Card, Avatar, Chip, Typography, etc.
-- **Navigation**: Sidebar, Breadcrumb, Pagination, Tabs, Menu, etc.
-- **Feedback**: Snackbar, Toast, Loader, Alert, Modal, etc.
-- **Layout**: Box, Container, Stack, Divider, etc.
-- **Enhanced Components**: ShareModalEnhanced, HeaderEnhanced with flexible Redux integration
-
-### Hooks
-- `useAuth` - Authentication state management
-- `useLanguage` - Internationalization and language switching
-- `usePermissions` - Role-based access control
-- `usePages` - Page state management
-- `useDeepMemo` - Deep memoization for complex objects
-- `useReduxIntegration` - Unified interface for Redux/prop-based components
-
-### Utilities
-- `formatDate` - Date formatting with various patterns
-- `formatFileSize` - Human-readable file size formatting
-- `formatText` / `deformatText` - Text transformation utilities
-- `colorUtils` - Color manipulation and conversion utilities
-
-### Theme System
-- `createLightTheme` - Light theme creation with custom colors
-- `createDarkTheme` - Dark theme creation with custom colors
-- `ERPUIProvider` - Main provider component with theme, context, and Redux integration
-- Support for custom primary colors and Material-UI theme extensions
-
-### Redux Integration
-- Optional Redux slices for share, header, and reports functionality
-- `createLibraryStore` - Helper for creating Redux store with library slices
-- `createConfiguredApiClient` - API client configuration helper
-- `getLibrarySlices` - Export all library Redux slices
-- Flexible component design supporting both Redux and prop-based usage
-
-### Breaking Changes from erp-common
-
-#### Import Path Changes
-- **Before**: `import Button from 'erp-common/src/components/button/button'`
-- **After**: `import { Button } from '@company/erp-ui-library'`
-
-#### Provider Requirements
-- **Before**: Theme and contexts automatically provided
-- **After**: Must wrap app with `ERPUIProvider`
-
-```typescript
-// Before
-function App() {
-  return <MyComponent />;
-}
-
-// After
-import { ERPUIProvider } from '@company/erp-ui-library';
-
-function App() {
-  return (
-    <ERPUIProvider>
-      <MyComponent />
-    </ERPUIProvider>
-  );
-}
-```
-
-#### Redux Integration Changes
-- **Before**: Components automatically used Redux
-- **After**: Must specify `useRedux` prop for enhanced components
-
-```typescript
-// Before
-<ShareModal open={isOpen} onClose={handleClose} />
-
-// After - with Redux
-<ShareModalEnhanced useRedux={true} open={isOpen} onClose={handleClose} />
-
-// After - without Redux
-<ShareModalEnhanced
-  useRedux={false}
-  users={users}
-  departments={departments}
-  loading={loading}
-  onFetchUsersAndDepartments={fetchData}
-  open={isOpen}
-  onClose={handleClose}
-/>
-```
-
-#### Store Configuration Changes
-- **Before**: Redux store automatically configured with all slices
-- **After**: Must explicitly configure store with library slices
-
-```typescript
-// Before
-import { store } from 'erp-common/src/redux/store';
-
-// After
-import { configureStore } from '@reduxjs/toolkit';
-import { getLibrarySlices } from '@company/erp-ui-library';
-
-const store = configureStore({
-  reducer: {
-    ...getLibrarySlices(),
-    // your app reducers
-  }
-});
-```
-
-#### API Client Configuration
-- **Before**: API client automatically configured
-- **After**: Must explicitly configure API client
-
-```typescript
-// After
-import { createConfiguredApiClient } from '@company/erp-ui-library';
-
-const apiClient = createConfiguredApiClient(
-  baseApiClient,
-  () => ({ authorization: `Bearer ${getToken()}` })
-);
-```
-
-### Migration Path
-
-1. **Install the library**: `npm install @company/erp-ui-library`
-2. **Install peer dependencies**: React, Material-UI, etc.
-3. **Update imports**: Change from workspace paths to npm package imports
-4. **Add ERPUIProvider**: Wrap your app with the provider
-5. **Configure Redux** (if using): Set up store with library slices
-6. **Update enhanced components**: Add `useRedux` prop and handle both patterns
-7. **Test thoroughly**: Ensure all functionality works as expected
-8. **Remove old workspace**: Clean up erp-common workspace module
-
-### Documentation
-- [README.md](README.md) - Installation and basic usage
-- [API.md](API.md) - Comprehensive API documentation
-- [EXAMPLES.md](EXAMPLES.md) - Usage examples and patterns
-- [MIGRATION.md](MIGRATION.md) - Detailed migration guide from erp-common
-- [TROUBLESHOOTING.md](TROUBLESHOOTING.md) - Common issues and solutions
-
-### Development
-- TypeScript support with strict type checking
-- Jest testing framework with React Testing Library
-- ESLint configuration for code quality
-- Vite build system for fast development and optimized production builds
-- Size limit monitoring to prevent bundle bloat
-- Comprehensive test coverage for components, hooks, and utilities
-
-### Performance
-- Tree shaking support for optimal bundle size
-- Lazy loading support for large components
-- Memoization utilities for expensive calculations
-- Optimized Material-UI theme integration
-- Minimal runtime overhead for unused features
-
----
-
-## Version History
-
-### [1.0.0] - 2024-01-15
-- Initial release as standalone npm package
-- Migration from erp-common workspace module
-- Comprehensive component library with 80+ components
-- Flexible Redux integration
-- Full TypeScript support
-- Theming system with light/dark modes
-- RTL/LTR support
-- Internationalization support
-- Complete documentation and migration guide
-
----
-
-## Upgrade Guide
-
-### From erp-common workspace to 1.0.0
-
-This is a major migration from a workspace module to an npm package. Please follow the detailed [Migration Guide](MIGRATION.md) for step-by-step instructions.
-
-**Key Changes:**
-1. Package installation required
-2. Import paths changed
-3. Provider wrapper required
-4. Redux integration made optional and explicit
-5. Enhanced components with flexible usage patterns
-
-**Estimated Migration Time:** 1-2 weeks depending on application size
-
-**Support:** See [TROUBLESHOOTING.md](TROUBLESHOOTING.md) for common issues and solutions
-
----
-
-## Future Releases
-
-### Planned for 1.1.0
-- Additional form components (file upload, rich text editor)
-- Enhanced data visualization components
-- Improved accessibility features
-- Performance optimizations
-- Additional utility functions
-
-### Planned for 1.2.0
-- Mobile-responsive component variants
-- Advanced theming capabilities
-- Component composition utilities
-- Enhanced testing utilities
-
-### Planned for 2.0.0
-- React 19 support
-- Material-UI v6 upgrade
-- Breaking changes for improved API consistency
-- New component architecture patterns
-
----
-
-## Contributing
-
-We welcome contributions! Please see our [Contributing Guidelines](CONTRIBUTING.md) for details on:
-- Code style and standards
-- Testing requirements
-- Documentation standards
-- Pull request process
-- Issue reporting
-
-## License
-
-This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
-
-## Support
-
-- **Documentation**: [GitHub Repository](https://github.com/company/erp-ui-library)
-- **Issues**: [GitHub Issues](https://github.com/company/erp-ui-library/issues)
-- **Discussions**: [GitHub Discussions](https://github.com/company/erp-ui-library/discussions)
+# Changelog
+
+All notable changes to the ERP UI Library will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## [1.6.3] - 2024-11-17
+
+### Fixed - CRITICAL
+- **MUI Style Override Issue**: Fixed MUI's Emotion styles overriding component styles
+  - Removed `normalize.css` import that conflicted with MUI's CssBaseline
+  - Added `_mui-overrides.scss` layer with automatic specificity boost using `:where(html)` selector
+  - Component styles now properly override MUI without requiring file modifications
+  - No breaking changes - existing components work automatically
+
+### Added
+- **MUI Override Layer**: New `_mui-overrides.scss` provides automatic specificity boost for all MUI components
+- **App Wrapper Class**: `.erp-ui-app` class for additional specificity control when needed
+- **Documentation**: `QUICK_FIX_GUIDE.md` for quick reference and `FIX_MUI_OVERRIDE_ISSUE.md` for comprehensive guide
+
+### Changed
+- Updated CSS import order: Variables → MUI Overrides → Components (83 files) → Utilities
+- Removed `normalize.css` from `reset.css` (MUI's CssBaseline component handles browser normalization)
+- Updated README with MUI app wrapper guidance for optimal style override
+
+### Technical Details
+- Uses `:where(html)` selector for specificity boost without increasing cascade complexity
+- Automatically targets all MUI component classes with override patterns
+- No changes required in individual component SCSS files
+- Compatible with all existing MUI theme customization approaches
+
+## [1.0.0] - 2024-01-15
+
+### Added
+- Initial release of the ERP UI Library as a standalone npm package
+- 80+ UI components extracted from erp-common workspace module
+- Comprehensive theming system with light/dark mode support
+- RTL/LTR text direction support
+- Flexible Redux integration (optional)
+- TypeScript definitions for all components and utilities
+- Custom hooks for authentication, language, permissions, and more
+- Utility functions for date formatting, file size, text manipulation, and colors
+- Context providers for auth, language, pages, and permissions
+- Enhanced components with flexible Redux/prop-based usage patterns
+- Comprehensive documentation and examples
+- Migration guide from erp-common workspace module
+
+### Components
+- **Form Controls**: Button, TextField, Select, DatePicker, Checkbox, Radio, Switch, etc.
+- **Data Display**: MaterialTable, Grid, Card, Avatar, Chip, Typography, etc.
+- **Navigation**: Sidebar, Breadcrumb, Pagination, Tabs, Menu, etc.
+- **Feedback**: Snackbar, Toast, Loader, Alert, Modal, etc.
+- **Layout**: Box, Container, Stack, Divider, etc.
+- **Enhanced Components**: ShareModalEnhanced, HeaderEnhanced with flexible Redux integration
+
+### Hooks
+- `useAuth` - Authentication state management
+- `useLanguage` - Internationalization and language switching
+- `usePermissions` - Role-based access control
+- `usePages` - Page state management
+- `useDeepMemo` - Deep memoization for complex objects
+- `useReduxIntegration` - Unified interface for Redux/prop-based components
+
+### Utilities
+- `formatDate` - Date formatting with various patterns
+- `formatFileSize` - Human-readable file size formatting
+- `formatText` / `deformatText` - Text transformation utilities
+- `colorUtils` - Color manipulation and conversion utilities
+
+### Theme System
+- `createLightTheme` - Light theme creation with custom colors
+- `createDarkTheme` - Dark theme creation with custom colors
+- `ERPUIProvider` - Main provider component with theme, context, and Redux integration
+- Support for custom primary colors and Material-UI theme extensions
+
+### Redux Integration
+- Optional Redux slices for share, header, and reports functionality
+- `createLibraryStore` - Helper for creating Redux store with library slices
+- `createConfiguredApiClient` - API client configuration helper
+- `getLibrarySlices` - Export all library Redux slices
+- Flexible component design supporting both Redux and prop-based usage
+
+### Breaking Changes from erp-common
+
+#### Import Path Changes
+- **Before**: `import Button from 'erp-common/src/components/button/button'`
+- **After**: `import { Button } from '@company/erp-ui-library'`
+
+#### Provider Requirements
+- **Before**: Theme and contexts automatically provided
+- **After**: Must wrap app with `ERPUIProvider`
+
+```typescript
+// Before
+function App() {
+  return <MyComponent />;
+}
+
+// After
+import { ERPUIProvider } from '@company/erp-ui-library';
+
+function App() {
+  return (
+    <ERPUIProvider>
+      <MyComponent />
+    </ERPUIProvider>
+  );
+}
+```
+
+#### Redux Integration Changes
+- **Before**: Components automatically used Redux
+- **After**: Must specify `useRedux` prop for enhanced components
+
+```typescript
+// Before
+<ShareModal open={isOpen} onClose={handleClose} />
+
+// After - with Redux
+<ShareModalEnhanced useRedux={true} open={isOpen} onClose={handleClose} />
+
+// After - without Redux
+<ShareModalEnhanced
+  useRedux={false}
+  users={users}
+  departments={departments}
+  loading={loading}
+  onFetchUsersAndDepartments={fetchData}
+  open={isOpen}
+  onClose={handleClose}
+/>
+```
+
+#### Store Configuration Changes
+- **Before**: Redux store automatically configured with all slices
+- **After**: Must explicitly configure store with library slices
+
+```typescript
+// Before
+import { store } from 'erp-common/src/redux/store';
+
+// After
+import { configureStore } from '@reduxjs/toolkit';
+import { getLibrarySlices } from '@company/erp-ui-library';
+
+const store = configureStore({
+  reducer: {
+    ...getLibrarySlices(),
+    // your app reducers
+  }
+});
+```
+
+#### API Client Configuration
+- **Before**: API client automatically configured
+- **After**: Must explicitly configure API client
+
+```typescript
+// After
+import { createConfiguredApiClient } from '@company/erp-ui-library';
+
+const apiClient = createConfiguredApiClient(
+  baseApiClient,
+  () => ({ authorization: `Bearer ${getToken()}` })
+);
+```
+
+### Migration Path
+
+1. **Install the library**: `npm install @company/erp-ui-library`
+2. **Install peer dependencies**: React, Material-UI, etc.
+3. **Update imports**: Change from workspace paths to npm package imports
+4. **Add ERPUIProvider**: Wrap your app with the provider
+5. **Configure Redux** (if using): Set up store with library slices
+6. **Update enhanced components**: Add `useRedux` prop and handle both patterns
+7. **Test thoroughly**: Ensure all functionality works as expected
+8. **Remove old workspace**: Clean up erp-common workspace module
+
+### Documentation
+- [README.md](README.md) - Installation and basic usage
+- [API.md](API.md) - Comprehensive API documentation
+- [EXAMPLES.md](EXAMPLES.md) - Usage examples and patterns
+- [MIGRATION.md](MIGRATION.md) - Detailed migration guide from erp-common
+- [TROUBLESHOOTING.md](TROUBLESHOOTING.md) - Common issues and solutions
+
+### Development
+- TypeScript support with strict type checking
+- Jest testing framework with React Testing Library
+- ESLint configuration for code quality
+- Vite build system for fast development and optimized production builds
+- Size limit monitoring to prevent bundle bloat
+- Comprehensive test coverage for components, hooks, and utilities
+
+### Performance
+- Tree shaking support for optimal bundle size
+- Lazy loading support for large components
+- Memoization utilities for expensive calculations
+- Optimized Material-UI theme integration
+- Minimal runtime overhead for unused features
+
+---
+
+## Version History
+
+### [1.0.0] - 2024-01-15
+- Initial release as standalone npm package
+- Migration from erp-common workspace module
+- Comprehensive component library with 80+ components
+- Flexible Redux integration
+- Full TypeScript support
+- Theming system with light/dark modes
+- RTL/LTR support
+- Internationalization support
+- Complete documentation and migration guide
+
+---
+
+## Upgrade Guide
+
+### From erp-common workspace to 1.0.0
+
+This is a major migration from a workspace module to an npm package. Please follow the detailed [Migration Guide](MIGRATION.md) for step-by-step instructions.
+
+**Key Changes:**
+1. Package installation required
+2. Import paths changed
+3. Provider wrapper required
+4. Redux integration made optional and explicit
+5. Enhanced components with flexible usage patterns
+
+**Estimated Migration Time:** 1-2 weeks depending on application size
+
+**Support:** See [TROUBLESHOOTING.md](TROUBLESHOOTING.md) for common issues and solutions
+
+---
+
+## Future Releases
+
+### Planned for 1.1.0
+- Additional form components (file upload, rich text editor)
+- Enhanced data visualization components
+- Improved accessibility features
+- Performance optimizations
+- Additional utility functions
+
+### Planned for 1.2.0
+- Mobile-responsive component variants
+- Advanced theming capabilities
+- Component composition utilities
+- Enhanced testing utilities
+
+### Planned for 2.0.0
+- React 19 support
+- Material-UI v6 upgrade
+- Breaking changes for improved API consistency
+- New component architecture patterns
+
+---
+
+## Contributing
+
+We welcome contributions! Please see our [Contributing Guidelines](CONTRIBUTING.md) for details on:
+- Code style and standards
+- Testing requirements
+- Documentation standards
+- Pull request process
+- Issue reporting
+
+## License
+
+This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
+
+## Support
+
+- **Documentation**: [GitHub Repository](https://github.com/company/erp-ui-library)
+- **Issues**: [GitHub Issues](https://github.com/company/erp-ui-library/issues)
+- **Discussions**: [GitHub Discussions](https://github.com/company/erp-ui-library/discussions)
 - **Email**: erp-ui-library@company.com

package/README.md

@@ -260,6 +260,18 @@ Add this to your main application file:
 import '@erpsquad/common/style.css';
 ```
 
+**Important for MUI users:** Wrap your app with the `erp-ui-app` class for proper style override:
+
+```tsx
+function App() {
+  return (
+    <div className="erp-ui-app">
+      {/* Your components */}
+    </div>
+  );
+}
+```
+
 This gives you:
 - All component styles
 - Utility classes for rapid development

package/dist/{article-cell-editor-JDI676YI-ql1HEe0N.esm.js → article-cell-editor-JDI676YI-Bgq3iI1C.esm.js}

@@ -1,4 +1,4 @@
-import { b1 as styled_default } from "./index-Dz5Y7-tW.esm.js";
+import { b1 as styled_default } from "./index-D-LS9re6.esm.js";
 import * as React from "react";
 import React__default from "react";
 import { p as getAugmentedNamespace, q as getDefaultExportFromCjs } from "./DefaultPropsProvider-CbRS6pK4.esm.js";
@@ -46093,4 +46093,4 @@ var article_cell_editor_default = ArticleCellEditor;
 export {
   article_cell_editor_default as default
 };
-//# sourceMappingURL=article-cell-editor-JDI676YI-ql1HEe0N.esm.js.map
+//# sourceMappingURL=article-cell-editor-JDI676YI-Bgq3iI1C.esm.js.map