mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-06 00:44:17 +08:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

fix: PurePanel width measure (#37624)

Browse Source 
* fix: PurePanel width measure

* test: Update snapshot
This commit is contained in:
二货爱吃白萝卜 2022-09-19 11:37:44 +08:00 committed by GitHub
parent cce5f00b5b
commit 24d2074ca4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
15 changed files with 22 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
components/_util/PurePanel.tsx
View File

@ -18,6 +18,7 @@ export default function genPurePanel<ComponentProps extends BaseProps>(
const holderRef = React.useRef<HTMLDivElement>(null);
const [popupHeight, setPopupHeight] = React.useState(0);
const [popupWidth, setPopupWidth] = React.useState(0);
const [open, setOpen] = useMergedState(false, {
value: props.open,
});
@ -33,6 +34,7 @@ export default function genPurePanel<ComponentProps extends BaseProps>(
const resizeObserver = new ResizeObserver(entries => {
const element: HTMLDivElement = entries[0].target as any;
setPopupHeight(element.offsetHeight + 8);
setPopupWidth(element.offsetWidth);
});
const interval = setInterval(() => {
@ -66,7 +68,12 @@ export default function genPurePanel<ComponentProps extends BaseProps>(
>
<div
ref={holderRef}
style={{ paddingBottom: popupHeight, position: 'relative', width: 'fit-content' }}
style={{
paddingBottom: popupHeight,
position: 'relative',
width: 'fit-content',
minWidth: popupWidth,
}}
>
<Component
{...props}

2
components/auto-complete/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -1922,7 +1922,7 @@ exports[`renders ./components/auto-complete/demo/render-panel.md extend context
class="ant-space-item"
>
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-select ant-select-auto-complete ant-select-single ant-select-show-search"

2
components/auto-complete/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -1105,7 +1105,7 @@ exports[`renders ./components/auto-complete/demo/render-panel.md correctly 1`] =
class="ant-space-item"
>
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-select ant-select-auto-complete ant-select-single ant-select-show-search"

2
components/cascader/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -1924,7 +1924,7 @@ Array [
exports[`renders ./components/cascader/demo/render-panel.md extend context correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-select ant-cascader ant-select-single ant-select-allow-clear ant-select-show-arrow ant-select-open"

2
components/cascader/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -818,7 +818,7 @@ Array [
exports[`renders ./components/cascader/demo/render-panel.md correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-select ant-cascader ant-select-single ant-select-allow-clear ant-select-show-arrow ant-select-open"

2
components/date-picker/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -39398,7 +39398,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md extend context co
exports[`renders ./components/date-picker/demo/render-panel.md extend context correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-picker"

2
components/date-picker/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -3261,7 +3261,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
exports[`renders ./components/date-picker/demo/render-panel.md correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-picker"

2
components/dropdown/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -8598,7 +8598,7 @@ exports[`renders ./components/dropdown/demo/placement.md extend context correctl
exports[`renders ./components/dropdown/demo/render-panel.md extend context correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<span
class="ant-dropdown-trigger ant-dropdown-open"

2
components/dropdown/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -903,7 +903,7 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
exports[`renders ./components/dropdown/demo/render-panel.md correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<span
class="ant-dropdown-trigger ant-dropdown-open"

2
components/mentions/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -221,7 +221,7 @@ Array [
exports[`renders ./components/mentions/demo/render-panel.md extend context correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-mentions"

2
components/mentions/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -221,7 +221,7 @@ Array [
exports[`renders ./components/mentions/demo/render-panel.md correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-mentions"

2
components/time-picker/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -14724,7 +14724,7 @@ Array [
exports[`renders ./components/time-picker/demo/render-panel.md extend context correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-picker"

2
components/time-picker/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -647,7 +647,7 @@ exports[`renders ./components/time-picker/demo/range-picker.md correctly 1`] = `
exports[`renders ./components/time-picker/demo/render-panel.md correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-picker"

2
components/tree-select/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -1576,7 +1576,7 @@ Array [
exports[`renders ./components/tree-select/demo/render-panel.md extend context correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-select ant-tree-select ant-select-single ant-select-show-arrow ant-select-open"

2
components/tree-select/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -404,7 +404,7 @@ Array [
exports[`renders ./components/tree-select/demo/render-panel.md correctly 1`] = `
<div
style="padding-bottom: 0px; position: relative;"
style="padding-bottom: 0px; position: relative; min-width: 0;"
>
<div
class="ant-select ant-tree-select ant-select-single ant-select-show-arrow ant-select-open"