How to Use fancyapps V4 in Vue.js 3.x

Hi fancyapps is best plugin i used. i try in the vue:

after installing with npm; i quote in script: import { Fancybox, Carousel, Panzoom } from "@fancyapps/ui"; //V4

style: @import "@fancyapps/ui/dist/fancybox.css"; @import "https://cdn.jsdelivr.net/npm/@fancyapps/[email protected]/dist/panzoom.css"; @import "https://cdn.jsdelivr.net/npm/@fancyapps/[email protected]/dist/carousel.css";

i intend to realize the effect like this: https://fancyapps.com/playground/vu input the responsively html,and finally fail the effect.

so may know to how to use this in vue?thanks