| ... | @@ -80,11 +80,11 @@ export function AnimatedHeight({ | ... | @@ -80,11 +80,11 @@ export function AnimatedHeight({ |
| 80 | return ( | 80 | return ( |
| 81 | <div | 81 | <div |
| 82 | data-slot="animated-height" | 82 | data-slot="animated-height" |
| 83 | className="transition-[height] duration-200 ease-out motion-reduce:transition-none" | 83 | className="transition-[height] duration-200 ease-out motion-reduce:transition-none [overflow-clip-margin:2px]" |
| 84 | style={ | 84 | style={ |
| 85 | heightState.height === null | 85 | heightState.height === null |
| 86 | ? undefined | 86 | ? undefined |
| 87 | : { height: heightState.height, overflow: heightState.isClipping ? "hidden" : "visible" } | 87 | : { height: heightState.height, overflow: heightState.isClipping ? "clip" : "visible" } |
| 88 | } | 88 | } |
| 89 | onTransitionEnd={(event) => { | 89 | onTransitionEnd={(event) => { |
| 90 | if (event.target !== event.currentTarget || event.propertyName !== "height") return; | 90 | if (event.target !== event.currentTarget || event.propertyName !== "height") return; |