Ensure Disclosure.Panel is properly linked (#1747)
* ensure `Disclosure.Panel` is properly linked * update changelog
This commit is contained in:
@@ -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]
|
||||
|
||||
Reference in New Issue
Block a user