fix(vc-slick): vueComponent#6100 - Fix content responsiveness in caro…

…usel component slot.

components/vc-slick/track.jsx

@@ -1,8 +1,7 @@
 import { createVNode } from 'vue';
 import classnames from '../_util/classNames';
-import { cloneElement } from '../_util/vnode';
 import { flattenChildren } from '../_util/props-util';
-import { lazyStartIndex, lazyEndIndex, getPreClones } from './utils/innerSliderUtils';
+import { lazyStartIndex, lazyEndIndex, getPreClones, cloneElement } from './utils/innerSliderUtils';
 
 // given specifications/props for a slide, fetch all the classes that need to be applied to the slide
 const getSlideClasses = spec => {
@@ -84,7 +83,6 @@ const renderSlides = function (spec, children) {
   const childrenCount = children.length;
   const startIndex = lazyStartIndex(spec);
   const endIndex = lazyEndIndex(spec);
-
   children.forEach((elem, index) => {
     let child;
     const childOnClickOptions = {
@@ -182,6 +180,7 @@ const renderSlides = function (spec, children) {
 
 const Track = (_, { attrs, slots }) => {
   const slides = renderSlides(attrs, flattenChildren(slots?.default()));
+  // const slides = renderSlides(attrs,  slots?.default);
   const { onMouseenter, onMouseover, onMouseleave } = attrs;
   const mouseEvents = { onMouseenter, onMouseover, onMouseleave };
   const trackProps = {

components/vc-slick/utils/innerSliderUtils.js

@@ -1,4 +1,5 @@
 // import supportsPassive from '../../../_util/supportsPassive';
+import { cloneElement as cloneVnode } from '../../_util/vnode';
 
 export function clamp(number, lowerBound, upperBound) {
   return Math.max(lowerBound, Math.min(number, upperBound));
@@ -788,3 +789,27 @@ export const slidesOnLeft = ({ slidesToShow, centerMode, rtl, centerPadding }) =
 
 export const canUseDOM = () =>
   !!(typeof window !== 'undefined' && window.document && window.document.createElement);
+
+export const cloneElement = (vnode, nodeProps) => {
+  const node = cloneVnode(vnode, nodeProps);
+
+  if (!Array.isArray(vnode.children)) {
+    return node;
+  }
+
+  const children = [];
+  node.children.forEach(el => {
+    if (Array.isArray(el)) {
+      const newItem = [];
+      el.forEach(item => {
+        newItem.push(cloneElement(item));
+      });
+      children.push(newItem);
+    } else {
+      children.push(cloneElement(el));
+    }
+  });
+  node.children = children;
+
+  return node;
+};