@equinor/[email protected]

Major Changes

• 15eacdf: Remove @material-ui/styles dependency and replace with custom JSS-based implementation for React 19 compatibility.

  ref: equinor/fusion-framework#3698

  Breaking Changes

  • Removed @material-ui/styles dependency - replaced with direct JSS integration
  • All Material-UI v4 styling APIs are now implemented internally
  • No API changes - existing code should work without modifications

  Added

  • Custom makeStyles implementation using JSS directly
  • Custom StylesProvider with enhanced scope isolation via seed prefixes
  • Custom ThemeProvider with React 19 compatibility
  • Comprehensive test suite with Vitest (52 tests, 100% statement coverage)
  • Utility modules in src/utils/:
    • jss-setup.ts - JSS instance configuration
    • class-name-generator.ts - Class name generation logic
    • sheet-manager.ts - Stylesheet caching and management
    • contexts.ts - React context definitions
  • TSDoc documentation for all exported APIs
  • Updated README with comprehensive documentation

  Changed

  • Package now uses JSS directly instead of Material-UI wrapper
  • Improved TypeScript types with better inference
  • Enhanced class name isolation for micro-frontend scenarios

  Technical Details

  • React 19 compatible (tested with React ^18 || ^19)
  • Uses JSS v10 with all necessary plugins
  • Maintains backward compatibility with existing API surface
  • Full test coverage with Vitest and React Testing Library

Minor Changes

• 15eacdf: Enhanced theme system with support for extending FusionTheme with custom properties, improved nested theme composition, and comprehensive documentation.

  Added

  • Theme Extension Support: FusionTheme now supports extending with custom properties using generics:

    type MyTheme = FusionTheme<{ colors: { primary: ColorStyleProperty } }>;

  • Custom Base Theme Merging: createTheme now accepts an optional baseTheme parameter for merging with custom base themes:

    const extendedTheme = createTheme(
      { colors: { ui: { background__danger: newColor } } },
      outerTheme,
    );

  • Deep Merging Improvements: Enhanced deepMerge function properly handles nested theme properties, Record types, and StyleProperty instances
  • Type Exports: Explicitly exported ThemeProviderProps, StylesProviderProps, FusionTheme, StyleDefinition, and createTheme for better TypeScript support
  • Complete TSDoc Documentation: All exported functions, types, and interfaces now have comprehensive TSDoc comments with examples, parameter descriptions, and usage patterns
  • Theme Extension Storybook Story: New ThemeExtension story demonstrating how to extend themes with custom properties, including step-by-step examples for type definition, theme creation, and usage with useTheme and makeStyles

  Changed

  • createTheme signature now accepts optional baseTheme parameter (backward compatible)
  • Improved type inference for extended themes in ThemeProvider, useTheme, and makeStyles
  • Better handling of nested theme composition when using theme functions in nested ThemeProvider components
  • Storybook Stories Updated: All stories now consistently use the .getVariable() method for accessing theme CSS values (e.g., theme.colors.*.getVariable('color'), theme.spacing.*.getVariable('padding')). Direct usage of the .css property has been replaced to ensure proper integration with Fusion design system tokens and to match the documented API usage.
  • README Updated: Updated all documentation examples to use correct getVariable() API for theme properties

  Technical Details

  • Deep merging now correctly handles StyleProperty instances (replaces instead of merging)
  • Theme composition works correctly with nested ThemeProvider components
  • All types are properly exported and documented with complete TSDoc comments
  • Typography properties accessed via .style.fontSize, .style.fontWeight, etc. for proper CSS value extraction
  • Color properties accessed via .getVariable('color') method to get CSS variable strings
  • Spacing properties accessed via .getVariable('padding') method to get CSS variable strings
  • makeStyles now returns Record<ClassKey, string> where ClassKey is inferred from style rules, providing type-safe access to class names when using createStyles

@equinor/[email protected]

Patch Changes

• Updated dependencies [15eacdf]
• Updated dependencies [15eacdf]
  • @equinor/[email protected]

@equinor/[email protected]

Patch Changes

• Updated dependencies [15eacdf]
• Updated dependencies [15eacdf]
  • @equinor/[email protected]

@equinor/[email protected]

Patch Changes

• Updated dependencies [15eacdf]
• Updated dependencies [15eacdf]
  • @equinor/[email protected]

@equinor/[email protected]

Patch Changes

• Updated dependencies [15eacdf]
• Updated dependencies [15eacdf]
  • @equinor/[email protected]

@equinor/[email protected]

Patch Changes

• 63af0ef: fix: remove unnecessary dependencies from useEffect in Step component

  This fixes potential infinite re-renders by removing handleChange, stepKey, stepKeys, and isCurrent from the useEffect dependency array, keeping only the essential 'done' dependency.

@equinor/[email protected]

Major Changes

• fbc8188: React 19 compatibility fixes

  • Fixed TypeScript errors related to React 19 type changes
  • Updated useRef calls to provide initial values when type is explicitly specified
  • Fixed HTMLDivElement type usage to use Partial<HTMLAttributes<HTMLDivElement>>
  • Fixed useFilterSelection observable type handling for Set<T> return type
  • Added proper type annotations for web components
  • Updated component prop types to be compatible with React 19's stricter type checking

  Reference equinor/fusion#696

  Devops: AB#65644

  Thanks to @AndreasPresthammer for reporting this issue!

@equinor/[email protected]

Major Changes

• fbc8188: React 19 compatibility fixes

  • Fixed TypeScript errors related to React 19 type changes
  • Updated useRef calls to provide initial values when type is explicitly specified
  • Fixed HTMLDivElement type usage to use Partial<HTMLAttributes<HTMLDivElement>>
  • Fixed useFilterSelection observable type handling for Set<T> return type
  • Added proper type annotations for web components
  • Updated component prop types to be compatible with React 19's stricter type checking

  Reference equinor/fusion#696

  Devops: AB#65644

  Thanks to @AndreasPresthammer for reporting this issue!

Patch Changes

• Updated dependencies [fbc8188]
  • @equinor/[email protected]

@equinor/[email protected]

Major Changes

• fbc8188: React 19 compatibility fixes

  • Fixed TypeScript errors related to React 19 type changes
  • Updated useRef calls to provide initial values when type is explicitly specified
  • Fixed HTMLDivElement type usage to use Partial<HTMLAttributes<HTMLDivElement>>
  • Fixed useFilterSelection observable type handling for Set<T> return type
  • Added proper type annotations for web components
  • Updated component prop types to be compatible with React 19's stricter type checking

  Reference equinor/fusion#696

  Devops: AB#65644

  Thanks to @AndreasPresthammer for reporting this issue!

@equinor/[email protected]

Major Changes

• fbc8188: React 19 compatibility fixes

  • Fixed TypeScript errors related to React 19 type changes
  • Updated useRef calls to provide initial values when type is explicitly specified
  • Fixed HTMLDivElement type usage to use Partial<HTMLAttributes<HTMLDivElement>>
  • Fixed useFilterSelection observable type handling for Set<T> return type
  • Added proper type annotations for web components
  • Updated component prop types to be compatible with React 19's stricter type checking

  Reference equinor/fusion#696

  Devops: AB#65644

  Thanks to @AndreasPresthammer for reporting this issue!