{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\user\\\\Desktop\\\\000newport\\\\src\\\\components\\\\pages\\\\design\\\\crea2\\\\modal.js\",\n  _s = $RefreshSig$();\nimport React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faAngleRight, faXmark } from \"@fortawesome/free-solid-svg-icons\";\nimport Slider from \"react-slick\";\nimport { useRef } from \"react\";\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nconst Modal = ({\n  closeModal\n}) => {\n  _s();\n  const settings = {\n    dots: true,\n    infinite: true,\n    speed: 500,\n    slidesToShow: 1,\n    slidesToScroll: 1\n  };\n  const sliderRef = useRef();\n  const nextSlide = () => {\n    sliderRef.current.slickNext();\n  };\n  const prevSlide = () => {\n    sliderRef.current.slickPrev();\n  };\n  return /*#__PURE__*/_jsxDEV(\"div\", {\n    className: \"bg-stone-900\",\n    children: /*#__PURE__*/_jsxDEV(\"div\", {\n      className: \"modal absolute top-20 w-1/3 left-1/2  -translate-x-2/4 mt-10\",\n      children: [/*#__PURE__*/_jsxDEV(\"span\", {\n        className: \"close absolute -top-20 right-0 p-5  \",\n        onClick: closeModal,\n        children: /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n          className: \"text-4xl hover:bg-stone-300 transition-colors ease-in-out delay-150 hover:text-orange-500 p-2 rounded-full h-10 w-10\",\n          icon: faXmark,\n          style: {\n            color: \"#ffffff\"\n          }\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 37,\n          columnNumber: 21\n        }, this)\n      }, void 0, false, {\n        fileName: _jsxFileName,\n        lineNumber: 32,\n        columnNumber: 17\n      }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n        children: [/*#__PURE__*/_jsxDEV(\"div\", {\n          className: \"modal-content relative\",\n          children: /*#__PURE__*/_jsxDEV(Slider, {\n            ...settings,\n            ref: sliderRef,\n            children: [/*#__PURE__*/_jsxDEV(\"img\", {\n              className: \"rounded-2xl \",\n              src: \"/images/crea2/image-product-1.jpg\",\n              alt: \"\"\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 45,\n              columnNumber: 17\n            }, this), /*#__PURE__*/_jsxDEV(\"img\", {\n              className: \"rounded-2xl \",\n              src: \"/images/crea2/image-product-2.jpg\",\n              alt: \"\"\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 49,\n              columnNumber: 17\n            }, this), /*#__PURE__*/_jsxDEV(\"img\", {\n              className: \"rounded-2xl \",\n              src: \"/images/crea2/image-product-3.jpg\",\n              alt: \"\"\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 52,\n              columnNumber: 17\n            }, this), /*#__PURE__*/_jsxDEV(\"img\", {\n              className: \"rounded-2xl \",\n              src: \"/images/crea2/image-product-4.jpg\",\n              alt: \"\"\n            }, void 0, false, {\n              fileName: _jsxFileName,\n              lineNumber: 56,\n              columnNumber: 17\n            }, this)]\n          }, void 0, true, {\n            fileName: _jsxFileName,\n            lineNumber: 42,\n            columnNumber: 17\n          }, this)\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 41,\n          columnNumber: 13\n        }, this), /*#__PURE__*/_jsxDEV(\"button\", {\n          className: \"absolute h-24 w-24 hover:border hover:border-stone-500 transition  ease-in-out delay-100   rounded-full bg-stone-100 flex items-center justify-center -left-0 -translate-x-2/4 -translate-y-2/4 top-1/2 hover:bg-stone-300   \",\n          onClick: prevSlide,\n          children: /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n            className: \"text-5xl\",\n            icon: faAngleRight,\n            rotation: 180\n          }, void 0, false, {\n            fileName: _jsxFileName,\n            lineNumber: 62,\n            columnNumber: 17\n          }, this)\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 60,\n          columnNumber: 17\n        }, this), /*#__PURE__*/_jsxDEV(\"button\", {\n          className: \"absolute  h-24 w-24 transition  ease-in-out delay-100  hover:border hover:border-stone-500 hover:bg-stone-300  rounded-full bg-stone-100 flex items-center justify-center -right-0 translate-x-2/4 -translate-y-2/4 top-1/2 \",\n          onClick: nextSlide,\n          children: /*#__PURE__*/_jsxDEV(FontAwesomeIcon, {\n            className: \"text-5xl\",\n            icon: faAngleRight\n          }, void 0, false, {\n            fileName: _jsxFileName,\n            lineNumber: 67,\n            columnNumber: 17\n          }, this)\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 64,\n          columnNumber: 17\n        }, this)]\n      }, void 0, true, {\n        fileName: _jsxFileName,\n        lineNumber: 40,\n        columnNumber: 17\n      }, this)]\n    }, void 0, true, {\n      fileName: _jsxFileName,\n      lineNumber: 31,\n      columnNumber: 9\n    }, this)\n  }, void 0, false, {\n    fileName: _jsxFileName,\n    lineNumber: 30,\n    columnNumber: 9\n  }, this);\n};\n_s(Modal, \"wjKMYkN3mXB32DfSYznkohhJ8nw=\");\n_c = Modal;\nexport default Modal;\nvar _c;\n$RefreshReg$(_c, \"Modal\");","map":{"version":3,"names":["React","FontAwesomeIcon","faAngleRight","faXmark","Slider","useRef","jsxDEV","_jsxDEV","Modal","closeModal","_s","settings","dots","infinite","speed","slidesToShow","slidesToScroll","sliderRef","nextSlide","current","slickNext","prevSlide","slickPrev","className","children","onClick","icon","style","color","fileName","_jsxFileName","lineNumber","columnNumber","ref","src","alt","rotation","_c","$RefreshReg$"],"sources":["C:/Users/user/Desktop/000newport/src/components/pages/design/crea2/modal.js"],"sourcesContent":["import React from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {  faAngleRight, faXmark } from \"@fortawesome/free-solid-svg-icons\";\r\nimport Slider from \"react-slick\";\r\nimport { useRef } from \"react\";\r\n\r\n\r\nconst Modal=({closeModal} )=>{\r\n\r\n   \r\n        const settings = {\r\n          dots: true,\r\n          infinite: true,\r\n          speed: 500,\r\n          slidesToShow: 1,\r\n          slidesToScroll: 1\r\n        };\r\n\r\n        const sliderRef = useRef();\r\n\r\n        const nextSlide = () => {\r\n          sliderRef.current.slickNext();\r\n        };\r\n      \r\n        const prevSlide = () => {\r\n          sliderRef.current.slickPrev();\r\n        };\r\n\r\n    return(\r\n        <div className=\"bg-stone-900\">\r\n        <div className=\"modal absolute top-20 w-1/3 left-1/2  -translate-x-2/4 mt-10\">\r\n                <span className=\"close absolute -top-20 right-0 p-5  \"\r\n                onClick={closeModal}\r\n                >\r\n                 \r\n                \r\n                    <FontAwesomeIcon className=\"text-4xl hover:bg-stone-300 transition-colors ease-in-out delay-150 hover:text-orange-500 p-2 rounded-full h-10 w-10\" icon={faXmark} style={{color: \"#ffffff\",}}  />\r\n\r\n                </span>\r\n                <div>\r\n            <div className=\"modal-content relative\">\r\n                <Slider {...settings}  ref={sliderRef}>\r\n                   \r\n\r\n                <img className=\"rounded-2xl \" src=\"/images/crea2/image-product-1.jpg\"alt=\"\"/>\r\n                    \r\n        \r\n\r\n                <img className=\"rounded-2xl \" src=\"/images/crea2/image-product-2.jpg\"alt=\"\"/>\r\n                   \r\n\r\n                <img className=\"rounded-2xl \" src=\"/images/crea2/image-product-3.jpg\"alt=\"\"/>\r\n                \r\n                   \r\n\r\n                <img className=\"rounded-2xl \" src=\"/images/crea2/image-product-4.jpg\"alt=\"\"/>\r\n                 \r\n                </Slider>\r\n                </div>\r\n                <button className=\"absolute h-24 w-24 hover:border hover:border-stone-500 transition  ease-in-out delay-100   rounded-full bg-stone-100 flex items-center justify-center -left-0 -translate-x-2/4 -translate-y-2/4 top-1/2 hover:bg-stone-300   \"\r\n                onClick={prevSlide}>\r\n                <FontAwesomeIcon className=\"text-5xl\" icon={faAngleRight} rotation={180}  />\r\n                </button>\r\n                <button className=\"absolute  h-24 w-24 transition  ease-in-out delay-100  hover:border hover:border-stone-500 hover:bg-stone-300  rounded-full bg-stone-100 flex items-center justify-center -right-0 translate-x-2/4 -translate-y-2/4 top-1/2 \"\r\n                onClick={nextSlide}>\r\n\r\n                <FontAwesomeIcon className=\"text-5xl\" icon={faAngleRight}   />\r\n                </button>\r\n\r\n            </div>\r\n        </div>\r\n        </div>\r\n    )\r\n}\r\n\r\nexport default Modal"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAAUC,YAAY,EAAEC,OAAO,QAAQ,mCAAmC;AAC1E,OAAOC,MAAM,MAAM,aAAa;AAChC,SAASC,MAAM,QAAQ,OAAO;AAAC,SAAAC,MAAA,IAAAC,OAAA;AAG/B,MAAMC,KAAK,GAACA,CAAC;EAACC;AAAU,CAAC,KAAI;EAAAC,EAAA;EAGrB,MAAMC,QAAQ,GAAG;IACfC,IAAI,EAAE,IAAI;IACVC,QAAQ,EAAE,IAAI;IACdC,KAAK,EAAE,GAAG;IACVC,YAAY,EAAE,CAAC;IACfC,cAAc,EAAE;EAClB,CAAC;EAED,MAAMC,SAAS,GAAGZ,MAAM,CAAC,CAAC;EAE1B,MAAMa,SAAS,GAAGA,CAAA,KAAM;IACtBD,SAAS,CAACE,OAAO,CAACC,SAAS,CAAC,CAAC;EAC/B,CAAC;EAED,MAAMC,SAAS,GAAGA,CAAA,KAAM;IACtBJ,SAAS,CAACE,OAAO,CAACG,SAAS,CAAC,CAAC;EAC/B,CAAC;EAEL,oBACIf,OAAA;IAAKgB,SAAS,EAAC,cAAc;IAAAC,QAAA,eAC7BjB,OAAA;MAAKgB,SAAS,EAAC,8DAA8D;MAAAC,QAAA,gBACrEjB,OAAA;QAAMgB,SAAS,EAAC,sCAAsC;QACtDE,OAAO,EAAEhB,UAAW;QAAAe,QAAA,eAIhBjB,OAAA,CAACN,eAAe;UAACsB,SAAS,EAAC,sHAAsH;UAACG,IAAI,EAAEvB,OAAQ;UAACwB,KAAK,EAAE;YAACC,KAAK,EAAE;UAAU;QAAE;UAAAC,QAAA,EAAAC,YAAA;UAAAC,UAAA;UAAAC,YAAA;QAAA,OAAG;MAAC;QAAAH,QAAA,EAAAC,YAAA;QAAAC,UAAA;QAAAC,YAAA;MAAA,OAE9L,CAAC,eACPzB,OAAA;QAAAiB,QAAA,gBACJjB,OAAA;UAAKgB,SAAS,EAAC,wBAAwB;UAAAC,QAAA,eACnCjB,OAAA,CAACH,MAAM;YAAA,GAAKO,QAAQ;YAAGsB,GAAG,EAAEhB,SAAU;YAAAO,QAAA,gBAGtCjB,OAAA;cAAKgB,SAAS,EAAC,cAAc;cAACW,GAAG,EAAC,mCAAmC;cAAAC,GAAG,EAAC;YAAE;cAAAN,QAAA,EAAAC,YAAA;cAAAC,UAAA;cAAAC,YAAA;YAAA,OAAC,CAAC,eAI7EzB,OAAA;cAAKgB,SAAS,EAAC,cAAc;cAACW,GAAG,EAAC,mCAAmC;cAAAC,GAAG,EAAC;YAAE;cAAAN,QAAA,EAAAC,YAAA;cAAAC,UAAA;cAAAC,YAAA;YAAA,OAAC,CAAC,eAG7EzB,OAAA;cAAKgB,SAAS,EAAC,cAAc;cAACW,GAAG,EAAC,mCAAmC;cAAAC,GAAG,EAAC;YAAE;cAAAN,QAAA,EAAAC,YAAA;cAAAC,UAAA;cAAAC,YAAA;YAAA,OAAC,CAAC,eAI7EzB,OAAA;cAAKgB,SAAS,EAAC,cAAc;cAACW,GAAG,EAAC,mCAAmC;cAAAC,GAAG,EAAC;YAAE;cAAAN,QAAA,EAAAC,YAAA;cAAAC,UAAA;cAAAC,YAAA;YAAA,OAAC,CAAC;UAAA;YAAAH,QAAA,EAAAC,YAAA;YAAAC,UAAA;YAAAC,YAAA;UAAA,OAErE;QAAC;UAAAH,QAAA,EAAAC,YAAA;UAAAC,UAAA;UAAAC,YAAA;QAAA,OACJ,CAAC,eACNzB,OAAA;UAAQgB,SAAS,EAAC,+NAA+N;UACjPE,OAAO,EAAEJ,SAAU;UAAAG,QAAA,eACnBjB,OAAA,CAACN,eAAe;YAACsB,SAAS,EAAC,UAAU;YAACG,IAAI,EAAExB,YAAa;YAACkC,QAAQ,EAAE;UAAI;YAAAP,QAAA,EAAAC,YAAA;YAAAC,UAAA;YAAAC,YAAA;UAAA,OAAG;QAAC;UAAAH,QAAA,EAAAC,YAAA;UAAAC,UAAA;UAAAC,YAAA;QAAA,OACpE,CAAC,eACTzB,OAAA;UAAQgB,SAAS,EAAC,8NAA8N;UAChPE,OAAO,EAAEP,SAAU;UAAAM,QAAA,eAEnBjB,OAAA,CAACN,eAAe;YAACsB,SAAS,EAAC,UAAU;YAACG,IAAI,EAAExB;UAAa;YAAA2B,QAAA,EAAAC,YAAA;YAAAC,UAAA;YAAAC,YAAA;UAAA,OAAI;QAAC;UAAAH,QAAA,EAAAC,YAAA;UAAAC,UAAA;UAAAC,YAAA;QAAA,OACtD,CAAC;MAAA;QAAAH,QAAA,EAAAC,YAAA;QAAAC,UAAA;QAAAC,YAAA;MAAA,OAER,CAAC;IAAA;MAAAH,QAAA,EAAAC,YAAA;MAAAC,UAAA;MAAAC,YAAA;IAAA,OACL;EAAC;IAAAH,QAAA,EAAAC,YAAA;IAAAC,UAAA;IAAAC,YAAA;EAAA,OACD,CAAC;AAEd,CAAC;AAAAtB,EAAA,CAlEKF,KAAK;AAAA6B,EAAA,GAAL7B,KAAK;AAoEX,eAAeA,KAAK;AAAA,IAAA6B,EAAA;AAAAC,YAAA,CAAAD,EAAA"},"metadata":{},"sourceType":"module","externalDependencies":[]}