Accordion in slick slider. What code is needed to recalculate the height of .slick-list?

Question

JavaScript

There is an accordion in the slick slider, the contents of the accordions are different. All accordions are closed. The slider determined the height. In order to open the accordion and to load all the content in the accordion, there is such a code as below. When you click on the .slick-list button, it takes the auto height, but here the problem arises that the height is set according to the most voluminous slide, which has the most content, it turns out that there is empty space in other slides, as in the example. Who will tell you how to solve it. We need a code which, when the button is clicked, will recalculate the height.
https://codepen.io/

$('.slider').slick({
  infinite: true,
  slidesToShow: 1,
  slidesToScroll: 1,
  adaptiveHeight: true,
});

// accordion


$('.content-hide').slideUp();
$('.show-btn').click(function (e) {
  e.preventDefault();
  
  var $this = $(this),
      wrap = $this.closest('.slide'),
      content = wrap.find('.content-hide'),
      $slider = $('.slider');
  
  content.slideToggle();
  
 $slider.find('.slick-slide').height('auto');
$slider.find('.slick-list').height('auto');
$slider.slick('setOption', null, null, true);
  
});

I found this code on the Internet: How to apply?
$slider[0].slick.animateHeight();