File tree Expand file tree Collapse file tree 1 file changed +18
-12
lines changed
Expand file tree Collapse file tree 1 file changed +18
-12
lines changed Original file line number Diff line number Diff line change @@ -40,24 +40,30 @@ export const TabsBlock = ({
4040 const mediaWidth = ref ?. current ?. offsetWidth ;
4141 const captionId = useUniqId ( ) ;
4242 const themedMedia = getThemedValue ( activeTabData ?. media , theme ) ;
43- const hasNoImage = ! themedMedia ?. image || ! activeTabData ?. image ;
43+ const hasNoImage = ! themedMedia ?. image && ! activeTabData ?. image ;
4444 const mediaVideoHeight = hasNoImage && mediaWidth && getHeight ( mediaWidth ) ;
4545 const [ minImageHeight , setMinImageHeight ] = useState ( ref ?. current ?. offsetHeight ) ;
4646 // TODO remove property support activeTabData?.image. Use only activeTabData?.media?.image
4747 let imageProps ;
4848
4949 const handleImageHeight = useCallback ( ( ) => {
50- setMinImageHeight ( ref ?. current ?. offsetHeight ) ;
51- } , [ ] ) ;
52-
53- const onSelectTab = (
54- id : string | null ,
55- e : React . MouseEvent < HTMLButtonElement | HTMLAnchorElement > ,
56- ) => {
57- setActiveTab ( id ) ;
58- handleImageHeight ( ) ;
59- e . currentTarget . scrollIntoView ( { inline : 'center' , behavior : 'smooth' , block : 'nearest' } ) ;
60- } ;
50+ if ( minImageHeight !== ref ?. current ?. offsetHeight ) {
51+ setMinImageHeight ( ref ?. current ?. offsetHeight ) ;
52+ }
53+ } , [ minImageHeight ] ) ;
54+
55+ const onSelectTab = useCallback (
56+ ( id : string | null , e : React . MouseEvent < HTMLButtonElement | HTMLAnchorElement > ) => {
57+ setActiveTab ( id ) ;
58+ handleImageHeight ( ) ;
59+ e . currentTarget . scrollIntoView ( {
60+ inline : 'center' ,
61+ behavior : 'smooth' ,
62+ block : 'nearest' ,
63+ } ) ;
64+ } ,
65+ [ handleImageHeight ] ,
66+ ) ;
6167
6268 if ( activeTabData ) {
6369 const themedImage = getThemedValue ( activeTabData ?. image , theme ) ;
You can’t perform that action at this time.
0 commit comments