%PDF- %PDF-
Direktori : /home/dopla/www/wp-content/plugins/ml-slider/extendify-sdk/src/pages/ |
Current File : /home/dopla/www/wp-content/plugins/ml-slider/extendify-sdk/src/pages/MainWindow.js |
import { Fragment, useRef } from '@wordpress/element' import { Dialog, Transition } from '@headlessui/react' import { useGlobalStore } from '../state/GlobalState' import Layout from './layout/Layout' import FooterNotice from '../components/FooterNotice' export default function MainWindow() { const containerRef = useRef(null) const open = useGlobalStore((state) => state.open) const setOpen = useGlobalStore((state) => state.setOpen) return ( <Transition.Root show={open} as={Fragment}> <Dialog as="div" static className="extendify-sdk" initialFocus={containerRef} onClose={() => setOpen(false)}> <div className="h-screen w-screen sm:h-auto m-auto sm:w-auto fixed z-high inset-0 overflow-y-auto"> <div className="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0"> <Transition.Child as={Fragment} enter="ease-out duration-300" enterFrom="opacity-0" enterTo="opacity-100"> <Dialog.Overlay className="fixed inset-0 bg-black bg-opacity-40 transition-opacity" /> </Transition.Child> <Transition.Child as={Fragment} enter="ease-out duration-300" enterFrom="opacity-0 translate-y-4 sm:translate-y-5" enterTo="opacity-100 translate-y-0"> <div ref={containerRef} tabIndex="0" onClick={(e) => e.target === e.currentTarget && setOpen(false) } className="fixed lg:absolute inset-0 lg:overflow-hidden transform transition-all p-2 lg:p-16"> <Layout /> <FooterNotice /> </div> </Transition.Child> </div> </div> </Dialog> </Transition.Root> ) }