создаю телегу товаров

app.config.ts

@@ -0,0 +1,20 @@
+export default defineAppConfig({
+  ui: {
+    drawer: {
+      slots: {
+        overlay: 'fixed inset-0 bg-elevated/75',
+        content: 'fixed bg-default ring ring-default flex focus:outline-none',
+        handle: [
+          'shrink-0 !bg-accented',
+          'transition-opacity',
+        ],
+        container: 'w-full flex flex-col gap-4 p-4 overflow-hidden',
+        header: '',
+        title: 'text-highlighted font-semibold',
+        description: 'mt-1 text-muted text-sm',
+        body: 'flex-1 overflow-hidden',
+        footer: 'flex flex-col gap-1.5',
+      },
+    },
+  },
+})

nuxt.config.ts

@@ -1,5 +1,6 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
+  ssr: true,
   compatibilityDate: '2025-05-15',
   devtools: { enabled: true },
   modules: ['@nuxt/ui', '@nuxt/image', '@nuxt/icon', '@nuxt/fonts', '@nuxtjs/i18n'],

pages/product/[id].vue

@@ -3,15 +3,14 @@
     <UDrawer
       v-if="isMobile"
       v-model:open="open"
-      :class="{ animated: !isSwiping }"
+      style="overflow-y: hidden"
-      :style="{ top }"
+      class="product__drawer"
-      :snap-points="[0.5, 1]"
     >
       <ProductImages />
 
       <div class="product-info">
         <div class="product-info__title">
-          <ProductPrice :price="currentVariant?.options[0]?.price" />
+          <ProductPrice :price="currentVariant?.options[0]?.price || 0" />
 
           <div>
             фотомодель
@@ -55,9 +54,8 @@ const isMobile = useMediaQuery('(max-width: 1280px)')
 const open = ref(false)
 const target = shallowRef<HTMLElement | null>(null)
 const targetHeight = computed(() => target.value?.offsetHeight)
-const top = shallowRef('0')
 
-const { isSwiping, lengthY } = useSwipe(
+const { lengthY } = useSwipe(
   target,
   {
     passive: false,