refactor: fix embla-carousel types after v8.0.0-rc18

update embla deps

apps/www/package.json

@@ -29,8 +29,8 @@
     "codesandbox": "^2.2.3",
     "date-fns": "^2.30.0",
     "embla-carousel": "8.0.0-rc19",
-    "embla-carousel-autoplay": "8.0.0-rc18",
-    "embla-carousel-vue": "8.0.0-rc18",
+    "embla-carousel-autoplay": "8.0.0-rc19",
+    "embla-carousel-vue": "8.0.0-rc19",
     "lucide-vue-next": "^0.276.0",
     "radix-vue": "^1.2.5",
     "tailwindcss-animate": "^1.0.7",

apps/www/src/lib/registry/default/ui/carousel/index.ts

@@ -5,6 +5,6 @@ export { default as CarouselPrevious } from './CarouselPrevious.vue'
 export { default as CarouselNext } from './CarouselNext.vue'
 export { useCarousel } from './useCarousel'
 
-export {
-  type EmblaCarouselType as CarouselApi,
-} from 'embla-carousel-vue'
+export type {
+  EmblaCarouselType as CarouselApi,
+} from 'embla-carousel'

apps/www/src/lib/registry/default/ui/carousel/interface.ts

@@ -3,11 +3,11 @@ import type {
   EmblaOptionsType as CarouselOptions,
   EmblaPluginType as CarouselPlugin,
 } from 'embla-carousel'
-import type { HTMLAttributes } from 'vue'
+import type { HTMLAttributes, Ref } from 'vue'
 
 export interface CarouselProps {
-  opts?: CarouselOptions
-  plugins?: CarouselPlugin[]
+  opts?: CarouselOptions | Ref<CarouselOptions>
+  plugins?: CarouselPlugin[] | Ref<CarouselPlugin[]>
   orientation?: 'horizontal' | 'vertical'
 }
 

apps/www/src/lib/registry/default/ui/carousel/useCarousel.ts

@@ -1,8 +1,9 @@
 import { createInjectionState } from '@vueuse/core'
-import emblaCarouselVue, {
-  type EmblaCarouselType as CarouselApi,
-} from 'embla-carousel-vue'
+import emblaCarouselVue from 'embla-carousel-vue'
 import { onMounted, ref } from 'vue'
+import type {
+  EmblaCarouselType as CarouselApi,
+} from 'embla-carousel'
 import type { CarouselEmits, CarouselProps } from './interface'
 
 const [useProvideCarousel, useInjectCarousel] = createInjectionState(

apps/www/src/lib/registry/new-york/ui/carousel/index.ts

@@ -5,6 +5,6 @@ export { default as CarouselPrevious } from './CarouselPrevious.vue'
 export { default as CarouselNext } from './CarouselNext.vue'
 export { useCarousel } from './useCarousel'
 
-export {
-  type EmblaCarouselType as CarouselApi,
-} from 'embla-carousel-vue'
+export type {
+  EmblaCarouselType as CarouselApi,
+} from 'embla-carousel'

apps/www/src/lib/registry/new-york/ui/carousel/interface.ts

@@ -3,11 +3,11 @@ import type {
   EmblaOptionsType as CarouselOptions,
   EmblaPluginType as CarouselPlugin,
 } from 'embla-carousel'
-import type { HTMLAttributes } from 'vue'
+import type { HTMLAttributes, Ref } from 'vue'
 
 export interface CarouselProps {
-  opts?: CarouselOptions
-  plugins?: CarouselPlugin[]
+  opts?: CarouselOptions | Ref<CarouselOptions>
+  plugins?: CarouselPlugin[] | Ref<CarouselPlugin[]>
   orientation?: 'horizontal' | 'vertical'
 }
 

apps/www/src/lib/registry/new-york/ui/carousel/useCarousel.ts

@@ -1,8 +1,9 @@
 import { createInjectionState } from '@vueuse/core'
-import emblaCarouselVue, {
-  type EmblaCarouselType as CarouselApi,
-} from 'embla-carousel-vue'
+import emblaCarouselVue from 'embla-carousel-vue'
 import { onMounted, ref } from 'vue'
+import type {
+  EmblaCarouselType as CarouselApi,
+} from 'embla-carousel'
 import type { CarouselEmits, CarouselProps } from './interface'
 
 const [useProvideCarousel, useInjectCarousel] = createInjectionState(