fix+perf(QCarousel/QStepper/QTabPanels): active panel renders twice i…

…nitially #17698

ui/src/composables/private.use-panel/use-panel.js

@@ -54,9 +54,18 @@ export default function () {
 
   let panels, forcedPanelTransition
 
-  const panelIndex = ref(null)
   const panelTransition = ref(null)
 
+  /*
+   * Should not be reactive because it's assigned on render
+   * and it will trigger a subsequent useless render.
+   *
+   * Should be an object though, because it is being exported.
+   * Otherwise, the current value would be exported and no subsequent
+   * updates will be reflected in the exported value.
+   */
+  const panelIndex = { value: null }
+
   function onSwipe (evt) {
     const dir = props.vertical === true ? 'up' : 'left'
     goToPanelByOffset((proxy.$q.lang.rtl === true ? -1 : 1) * (evt.direction === dir ? 1 : -1))