[Bug]: The latest version of `@fluentui/merge-styles` package is breaking.

[dotnetjunky]

Library

React / v8 (@fluentui/react)

System Info

System:
    OS: Windows 10 10.0.22631
    CPU: (20) x64 Intel(R) Core(TM) i9-10900K CPU @ 3.70GHz
    Memory: 78.44 GB / 127.71 GB
  Browsers:
    Edge: Chromium (125.0.2535.92)
    Internet Explorer: 11.0.22621.3527

Are you reporting Accessibility issue?

None

Reproduction

https://codepen.io/dotnetjunky/pen/QWRQYxG

Bug Description

We've bumping the @FluentUI packages in our repo to the latest version and discovered that the latest version of @fluentui/merge-styles, v8.6.10, contains a breaking change.

Specifically, we're calling the concatStyleSetsWithProps() function, which used to return a DeepPartial<TStyleSet> object. With the latest version, it returns a new object DeepPartialV2 instead. As a result, the returned style set object that we use to assign to the DefaultButton.styles is no longer building.

When I tried to downgrade merge-styles to v8.6.9, our code built fine.

This is the commit #31703 that contains the breaking change. @Hotell

Logs

No response

Requested priority

High

Products/sites affected

No response

Are you willing to submit a PR to fix?

no

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.

[miroslavstastny]

Confirmed with the partner that they are not blocked.

[Hotell]

the previous DeepPartial was actually incorrect and also introduced infinite type recursions in other big repos. the change we did is a fix, based on your type gymnastics you might run into some issues but if you do they probably exposed hidden bugs within your code.

@dotnetjunky can you please share:

• proper reproduction showcasing the type issues assignment ( using stackblitz ideally https://stackblitz.com/edit/vitejs-vite-cb7rld?file=index.html&terminal=dev )?
• typescript version
• typescript configuration

ty

[Hotell]

@dotnetjunky can you also try out following to verify the issue:

tweak your node_modules:

1. open `@fluentui/merge-styles/lib/DeepPartial.d.ts
2. do following change:

export type DeepPartialV2<T> = T extends Function
- ? T
+ ? {}
  : T extends Array<infer U>
  ? IDeepPartialArray<U>
  : T extends object
  ? DeepPartialObject<T>
  : T;

3. run you type check command

[Hotell]

@dotnetjunky

ping to provide repro and verify #31769 (comment)