[Bug] Layout Sider ignoring theme token's breakpoints

[fribbels]

Reproduction link

Steps to reproduce

Drag to change the editor/demo screen size
Drag until the width is 1300, nothing happens

What is expected?

I expected that the layout 'lg' breakpoint follows the 1300px in the custom tokens defined in the ConfigProvider

<ConfigProvider
  theme={{
    token: {
      screenLG: 1300,
      screenLGMin: 200,
      screenLGMax: 1300,
    },
  }}
>

What is actually happening?

The layout ignores the 1300px defined and defaults to 992px. When dragging to 992px the layout then correctly shrinks. However it should be shrinking at 1300px not 992px.

Environment	Info
antd	5.17.0
React	18.3.1
System	Windows 11
Browser	Chrome

[stackblitz]

Start a new pull request in StackBlitz Codeflow.

• react-cmczs9-znoxlu (Open reproduction)

[fribbels]

2024-05-11.20-23-30.mp4

Example video - The window starts at 1307px -> doesn't change at 1300px -> changes at 992px

[MadCcc]

Refer to the default value of antd, screenLGMin should be the same as screenLG and screenLGMax should be larger than screenLG

[fribbels]

2024-05-15.12-37-30.mp4

https://stackblitz.com/edit/react-cmczs9-znoxlu?file=demo.tsx

Refer to the default value of antd, screenLGMin should be the same as screenLG and screenLGMax should be larger than screenLG

@MadCcc thanks for taking a look. See new video and the new sample code with adjusted values - I've changed screenLGMin == screenLG == 1300, and screenLGMax == 1500 to be > screenLG as suggested.

The issue is still present, and the behavior did not change. The layout ignores the 1300px breakpoint that I've defined in config, and only uses the default 992px.

[fribbels]

Hi, just checking in as its been two weeks, I'm still experiencing this issue.

See repro at: https://stackblitz.com/edit/react-cmczs9-znoxlu?file=demo.tsx