Ensure Disclosure.Panel is properly linked (#1747)

* ensure `Disclosure.Panel` is properly linked

* update changelog
This commit is contained in:
Robin Malfait
2022-08-09 13:38:15 +02:00
committed by GitHub
parent fa10cb0fb9
commit 4c433cdf5c
2 changed files with 3 additions and 13 deletions
+1
View File
@@ -27,6 +27,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Fix incorrect scrolling to the bottom when opening a `Dialog` ([#1716](https://github.com/tailwindlabs/headlessui/pull/1716))
- Make form components uncontrollable ([#1683](https://github.com/tailwindlabs/headlessui/pull/1683))
- Improve `Combobox` re-opening keyboard issue on mobile ([#1732](https://github.com/tailwindlabs/headlessui/pull/1732))
- Ensure `Disclosure.Panel` is properly linked ([#1747](https://github.com/tailwindlabs/headlessui/pull/1747))
## Changed
@@ -360,9 +360,8 @@ let Panel = forwardRefWithAs(function Panel<TTag extends ElementType = typeof DE
let [state, dispatch] = useDisclosureContext('Disclosure.Panel')
let { close } = useDisclosureAPIContext('Disclosure.Panel')
let panelRef = useSyncRefs(ref, state.panelRef, () => {
if (state.linkedPanel) return
dispatch({ type: ActionTypes.LinkPanel })
let panelRef = useSyncRefs(ref, state.panelRef, (el) => {
dispatch({ type: el ? ActionTypes.LinkPanel : ActionTypes.UnlinkPanel })
})
let usesOpenClosedState = useOpenClosed()
@@ -374,16 +373,6 @@ let Panel = forwardRefWithAs(function Panel<TTag extends ElementType = typeof DE
return state.disclosureState === DisclosureStates.Open
})()
// Unlink on "unmount" myself
useEffect(() => () => dispatch({ type: ActionTypes.UnlinkPanel }), [dispatch])
// Unlink on "unmount" children
useEffect(() => {
if (state.disclosureState === DisclosureStates.Closed && (props.unmount ?? true)) {
dispatch({ type: ActionTypes.UnlinkPanel })
}
}, [state.disclosureState, props.unmount, dispatch])
let slot = useMemo<PanelRenderPropArg>(
() => ({ open: state.disclosureState === DisclosureStates.Open, close }),
[state, close]