Skip to content

Commit ea29fe1

Browse files
committed
fix: 更新图表组件的最小宽度逻辑,以增强响应式布局
1 parent 1722745 commit ea29fe1

File tree

9 files changed

+122
-122
lines changed

9 files changed

+122
-122
lines changed

tests/demo/__snapshots__/src/MarkdownEditor/demos/bug.snap

+39-39
Original file line numberDiff line numberDiff line change
@@ -3217,7 +3217,7 @@
32173217
class="ant-md-editor-drag-el"
32183218
data-be="chart"
32193219
data-slate-node="element"
3220-
style="flex: 1; min-width: 256px; max-width: 100%;"
3220+
style="flex: 1; min-width: min(256px, 100%); max-width: 100%;"
32213221
>
32223222
<div
32233223
class="ant-md-editor-chart-box"
@@ -207956,155 +207956,155 @@
207956207956
>
207957207957
<div
207958207958
contenteditable="false"
207959-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
207959+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
207960207960
/>
207961207961
<div
207962207962
contenteditable="false"
207963-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
207963+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
207964207964
/>
207965207965
<div
207966207966
contenteditable="false"
207967-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
207967+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
207968207968
/>
207969207969
<div
207970207970
contenteditable="false"
207971-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
207971+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
207972207972
/>
207973207973
<div
207974207974
contenteditable="false"
207975-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
207975+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
207976207976
/>
207977207977
<div
207978207978
contenteditable="false"
207979-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
207979+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
207980207980
/>
207981207981
<div
207982207982
contenteditable="false"
207983-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
207983+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
207984207984
/>
207985207985
<div
207986207986
contenteditable="false"
207987-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
207987+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
207988207988
/>
207989207989
<div
207990207990
contenteditable="false"
207991-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
207991+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
207992207992
/>
207993207993
<div
207994207994
contenteditable="false"
207995-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
207995+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
207996207996
/>
207997207997
<div
207998207998
contenteditable="false"
207999-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
207999+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208000208000
/>
208001208001
<div
208002208002
contenteditable="false"
208003-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208003+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208004208004
/>
208005208005
<div
208006208006
contenteditable="false"
208007-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208007+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208008208008
/>
208009208009
<div
208010208010
contenteditable="false"
208011-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208011+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208012208012
/>
208013208013
<div
208014208014
contenteditable="false"
208015-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208015+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208016208016
/>
208017208017
<div
208018208018
contenteditable="false"
208019-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208019+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208020208020
/>
208021208021
<div
208022208022
contenteditable="false"
208023-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208023+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208024208024
/>
208025208025
<div
208026208026
contenteditable="false"
208027-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208027+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208028208028
/>
208029208029
<div
208030208030
contenteditable="false"
208031-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208031+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208032208032
/>
208033208033
<div
208034208034
contenteditable="false"
208035-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208035+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208036208036
/>
208037208037
<div
208038208038
contenteditable="false"
208039-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208039+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208040208040
/>
208041208041
<div
208042208042
contenteditable="false"
208043-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208043+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208044208044
/>
208045208045
<div
208046208046
contenteditable="false"
208047-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208047+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208048208048
/>
208049208049
<div
208050208050
contenteditable="false"
208051-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208051+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208052208052
/>
208053208053
<div
208054208054
contenteditable="false"
208055-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208055+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208056208056
/>
208057208057
<div
208058208058
contenteditable="false"
208059-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208059+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208060208060
/>
208061208061
<div
208062208062
contenteditable="false"
208063-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208063+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208064208064
/>
208065208065
<div
208066208066
contenteditable="false"
208067-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208067+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208068208068
/>
208069208069
<div
208070208070
contenteditable="false"
208071-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208071+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208072208072
/>
208073208073
<div
208074208074
contenteditable="false"
208075-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208075+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208076208076
/>
208077208077
<div
208078208078
contenteditable="false"
208079-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208079+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208080208080
/>
208081208081
<div
208082208082
contenteditable="false"
208083-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208083+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208084208084
/>
208085208085
<div
208086208086
contenteditable="false"
208087-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208087+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208088208088
/>
208089208089
<div
208090208090
contenteditable="false"
208091-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208091+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208092208092
/>
208093208093
<div
208094208094
contenteditable="false"
208095-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208095+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208096208096
/>
208097208097
<div
208098208098
contenteditable="false"
208099-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208099+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208100208100
/>
208101208101
<div
208102208102
contenteditable="false"
208103-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208103+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208104208104
/>
208105208105
<div
208106208106
contenteditable="false"
208107-
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: calc(100% - 16px); flex: 1; user-select: none;"
208107+
style="border: 1px solid #eee; border-radius: 0.5em; margin: auto; min-width: max(calc(100% - 16px), 256px); flex: 1; user-select: none;"
208108208108
/>
208109208109
</div>
208110208110
</div>

0 commit comments

Comments
 (0)