{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\user\\\\Desktop\\\\000newport\\\\src\\\\components\\\\crea5.js\",\n  _s = $RefreshSig$();\nimport React, { useEffect, useState } from \"react\";\nimport { gsap } from \"gsap\";\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nconst Crea5 = () => {\n  _s();\n  useEffect(() => {\n    // Créez une animation GSAP pour l'effet d'overscroll\n    const triggerElement = document.querySelector('.js-scroll-list');\n    const contentElement = document.querySelector('.js-scroll-content');\n\n    // Écoutez le défilement\n    triggerElement.addEventListener('scroll', () => {\n      // Obtenez la position de défilement horizontale\n      const scrollLeft = triggerElement.scrollLeft;\n      const scrollWidth = contentElement.scrollWidth - contentElement.clientWidth;\n\n      // Si le défilement atteint la fin, activez l'animation\n      if (scrollLeft >= scrollWidth) {\n        // Créez une animation GSAP ici\n        gsap.to(contentElement, {\n          y: -100,\n          // Ajustez la valeur de déplacement horizontal\n          ease: 'none'\n        });\n      }\n    });\n  }, []);\n  return /*#__PURE__*/_jsxDEV(\"div\", {\n    className: \"wrapper\",\n    children: [/*#__PURE__*/_jsxDEV(\"div\", {\n      className: \"scroll-list js-scroll-listh-72 overflow-hidden \",\n      children: [/*#__PURE__*/_jsxDEV(\"div\", {\n        className: \"scroll-list__wrp js-scroll-content h-72 overflow-hidden\",\n        children: /*#__PURE__*/_jsxDEV(\"div\", {\n          className: \"h-96 w-96 border bg-purple-600\"\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 35,\n          columnNumber: 15\n        }, this)\n      }, void 0, false, {\n        fileName: _jsxFileName,\n        lineNumber: 34,\n        columnNumber: 13\n      }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n        className: \"scroll-list__wrp js-scroll-content h-72 overflow-hidden\",\n        children: /*#__PURE__*/_jsxDEV(\"div\", {\n          className: \"h-96 w-96 border bg-purple-600\"\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 38,\n          columnNumber: 15\n        }, this)\n      }, void 0, false, {\n        fileName: _jsxFileName,\n        lineNumber: 37,\n        columnNumber: 13\n      }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n        className: \"scroll-list__wrp js-scroll-content h-72 overflow-hidden\",\n        children: /*#__PURE__*/_jsxDEV(\"div\", {\n          className: \"h-96 w-96 border bg-purple-600\"\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 41,\n          columnNumber: 15\n        }, this)\n      }, void 0, false, {\n        fileName: _jsxFileName,\n        lineNumber: 40,\n        columnNumber: 13\n      }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n        className: \"scroll-list__wrp js-scroll-content h-72 overflow-hidden\",\n        children: /*#__PURE__*/_jsxDEV(\"div\", {\n          className: \"h-96 w-96 border bg-purple-600\"\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 44,\n          columnNumber: 15\n        }, this)\n      }, void 0, false, {\n        fileName: _jsxFileName,\n        lineNumber: 43,\n        columnNumber: 13\n      }, this)]\n    }, void 0, true, {\n      fileName: _jsxFileName,\n      lineNumber: 33,\n      columnNumber: 11\n    }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n      className: \"h-96 w-96 border bg-purple-300\"\n    }, void 0, false, {\n      fileName: _jsxFileName,\n      lineNumber: 47,\n      columnNumber: 15\n    }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n      className: \"h-96 w-96 border bg-purple-900\"\n    }, void 0, false, {\n      fileName: _jsxFileName,\n      lineNumber: 48,\n      columnNumber: 15\n    }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n      className: \"h-96 w-96 border bg-purple-700\"\n    }, void 0, false, {\n      fileName: _jsxFileName,\n      lineNumber: 49,\n      columnNumber: 15\n    }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n      className: \"h-96 w-96 border bg-purple-400\"\n    }, void 0, false, {\n      fileName: _jsxFileName,\n      lineNumber: 50,\n      columnNumber: 15\n    }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n      className: \"h-96 w-96 border bg-purple-600\"\n    }, void 0, false, {\n      fileName: _jsxFileName,\n      lineNumber: 51,\n      columnNumber: 15\n    }, this)]\n  }, void 0, true, {\n    fileName: _jsxFileName,\n    lineNumber: 32,\n    columnNumber: 9\n  }, this);\n};\n_s(Crea5, \"OD7bBpZva5O2jO+Puf00hKivP7c=\");\n_c = Crea5;\nexport default Crea5;\nvar _c;\n$RefreshReg$(_c, \"Crea5\");","map":{"version":3,"names":["React","useEffect","useState","gsap","jsxDEV","_jsxDEV","Crea5","_s","triggerElement","document","querySelector","contentElement","addEventListener","scrollLeft","scrollWidth","clientWidth","to","y","ease","className","children","fileName","_jsxFileName","lineNumber","columnNumber","_c","$RefreshReg$"],"sources":["C:/Users/user/Desktop/000newport/src/components/crea5.js"],"sourcesContent":["\r\nimport React, { useEffect, useState } from \"react\";\r\nimport { gsap } from \"gsap\";\r\n\r\n\r\n\r\nconst Crea5 = () => {\r\n \r\n        useEffect(() => {\r\n            // Créez une animation GSAP pour l'effet d'overscroll\r\n            const triggerElement = document.querySelector('.js-scroll-list');\r\n            const contentElement = document.querySelector('.js-scroll-content');\r\n        \r\n            // Écoutez le défilement\r\n            triggerElement.addEventListener('scroll', () => {\r\n              // Obtenez la position de défilement horizontale\r\n              const scrollLeft = triggerElement.scrollLeft;\r\n              const scrollWidth = contentElement.scrollWidth - contentElement.clientWidth;\r\n        \r\n              // Si le défilement atteint la fin, activez l'animation\r\n              if (scrollLeft >= scrollWidth) {\r\n                // Créez une animation GSAP ici\r\n                gsap.to(contentElement, {\r\n                  y: -100, // Ajustez la valeur de déplacement horizontal\r\n                  ease: 'none',\r\n                });\r\n              }\r\n            });\r\n          }, []);\r\n    \r\n      return (\r\n        <div className=\"wrapper\">\r\n          <div className=\"scroll-list js-scroll-listh-72 overflow-hidden \">\r\n            <div className=\"scroll-list__wrp js-scroll-content h-72 overflow-hidden\">\r\n              <div className=\"h-96 w-96 border bg-purple-600\"></div>\r\n            </div>\r\n            <div className=\"scroll-list__wrp js-scroll-content h-72 overflow-hidden\">\r\n              <div className=\"h-96 w-96 border bg-purple-600\"></div>\r\n            </div>\r\n            <div className=\"scroll-list__wrp js-scroll-content h-72 overflow-hidden\">\r\n              <div className=\"h-96 w-96 border bg-purple-600\"></div>\r\n            </div>\r\n            <div className=\"scroll-list__wrp js-scroll-content h-72 overflow-hidden\">\r\n              <div className=\"h-96 w-96 border bg-purple-600\"></div>\r\n            </div>\r\n          </div>\r\n              <div className=\"h-96 w-96 border bg-purple-300\"></div>\r\n              <div className=\"h-96 w-96 border bg-purple-900\"></div>\r\n              <div className=\"h-96 w-96 border bg-purple-700\"></div>\r\n              <div className=\"h-96 w-96 border bg-purple-400\"></div>\r\n              <div className=\"h-96 w-96 border bg-purple-600\"></div>\r\n        </div>\r\n      );\r\n    };\r\n\r\n\r\n\r\n  \r\n \r\n\r\n\r\n\r\n\r\nexport default Crea5;\r\n\r\n\r\n"],"mappings":"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"},"metadata":{},"sourceType":"module","externalDependencies":[]}