text: (this["webpackJsonpgoit-react-hw04-hooks-images"]=this["webpackJsonpgoit-react-hw04-hooks-images"]||[]).push([[0],{12:function(e,t,a){e.exports={overlay:"modal_overlay__2qmD-",modal:"modal_modal__Zkx26"}},23:function(e,t,a){e.exports={Button:"button_Button__10sln"}},28:function(e,t,a){e.exports={app:"App_app__3BaSc"}},5:function(e,t,a){e.exports={searchbar:"Searchbar_searchbar__3A0wl",SearchForm:"Searchbar_SearchForm__hBaoY",SearchButton:"Searchbar_SearchButton__3EGkk",SearchFormInput:"Searchbar_SearchFormInput__3zybq"}},7:function(e,t,a){e.exports={img:"ImageGallery_img__1YUzq",ImageGallery:"ImageGallery_ImageGallery__fZuHx",ImageGalleryItem:"ImageGallery_ImageGalleryItem__gi2Mu",ImageGalleryItemImage:"ImageGallery_ImageGalleryItemImage__2MPOI"}},74:function(e,t,a){"use strict";a.r(t),a.d(t,"Searchbar",(function(){return s}));var n=a(4),c=a(5),r=a.n(c),o=a(1),l=a(0);function s(e){var t=Object(o.useState)(""),a=Object(n.a)(t,2),c=a[0],s=a[1];return Object(l.jsx)("header",{className:r.a.searchbar,children:Object(l.jsxs)("form",{className:r.a.SearchForm,onSubmit:function(t){t.preventDefault(),e.onSubmit(c)},children:[Object(l.jsx)("button",{type:"submit",className:r.a.SearchButton,children:Object(l.jsx)("span",{className:r.a.SearchFormLabel,children:"Search"})}),Object(l.jsx)("input",{className:r.a.SearchFormInput,type:"text",autoComplete:"off",autoFocus:!0,placeholder:"Search images and photos",onChange:function(e){s(e.currentTarget.value)}})]})})}},75:function(e,t,a){"use strict";a.r(t);var n=a(22),c=a.n(n),r=a(13),o=a(4),l=a(1),s=a(23),i=a.n(s),u=a(0);function m(e){var t=Object(l.useState)(1),a=Object(o.a)(t,2),n=a[0],c=a[1];return Object(l.useEffect)((function(){return e.nextPage(n)})),Object(u.jsx)(u.Fragment,{children:e.data.length>0&&Object(u.jsx)("button",{onClick:function(){c(n+1)},type:"button",className:i.a.Button,children:"Load More"})})}var b=a(12),h=a.n(b);function j(e){var t=e.isOpen,a=e.onCloseModal,n=e.largeImage;return t?Object(u.jsx)("div",{className:h.a.overlay,onClick:a,children:Object(u.jsx)("div",{className:h.a.modal,children:Object(u.jsx)("img",{src:n,alt:""})})}):null}var d=a(7),f=a.n(d);function g(e){return Object(u.jsx)(u.Fragment,{children:e.data.map((function(t){return Object(u.jsx)("li",{className:f.a.ImageGalleryItem,children:Object(u.jsx)("img",{src:t.webformatURL,alt:"",className:f.a.ImageGalleryItemImage,onClick:function(){return e.toggleModal(t)}})},t.id)}))})}function p(e){var t=Object(l.useState)(!1),a=Object(o.a)(t,2),n=a[0],c=a[1],r=Object(l.useState)(""),s=Object(o.a)(r,2),i=s[0],m=s[1],b=function(e){"Escape"===e.code&&h()},h=function(){c(!n)};return Object(l.useEffect)((function(){window.addEventListener("keydown",b)})),Object(u.jsxs)("ul",{className:f.a.ImageGallery,children:[e.data.length>0&&Object(u.jsx)(g,{toggleModal:function(e){c(!n),m(e.largeImageURL)},data:e.data}),Object(u.jsx)(j,{isOpen:n,onCloseModal:h,largeImage:i})]},"id")}var O=a(24),_=a(25),x=a(30),y=a(29),I=a(26),S=a.n(I),v=function(e){Object(x.a)(a,e);var t=Object(y.a)(a);function a(){return Object(O.a)(this,a),t.apply(this,arguments)}return Object(_.a)(a,[{key:"render",value:function(){return Object(u.jsx)(S.a,{type:"TailSpin",color:"#00BFFF",height:100,width:100,timeout:1e3})}}]),a}(l.Component),G=a(27),k=a.n(G);function F(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1,a="https://pixabay.com/api/",n="23141875-b38ef2a229822d56efda8eea3";return k.a.get("".concat(a,"?q=").concat(e,"&page=").concat(t,"&key=").concat(n,"&image_type=photo&orientation=horizontal&per_page=12")).catch((function(e){return console.log(e)}))}var w=a(28),N=a.n(w),B=a(1),C=B.useState,E=B.useEffect,M=a(74).Searchbar;function q(){var e=C(""),t=Object(o.a)(e,2),a=t[0],n=t[1],c=C([]),l=Object(o.a)(c,2),s=l[0],i=l[1],b=C(1),h=Object(o.a)(b,2),j=h[0],d=h[1],f=C(!1),g=Object(o.a)(f,2),O=g[0],_=g[1];return E((function(){a&&(_(!0),F(a,j).then((function(e){return i(e.data.hits)})).catch((function(e){return console.log(e)})).finally(_(!1)))}),[a]),E((function(){a&&(_(!0),F(a,j).then((function(e){return i([].concat(Object(r.a)(s),Object(r.a)(e.data.hits)))})).then((function(){return window.scrollTo({top:document.documentElement.scrollHeight,behavior:"smooth"})})).catch((function(e){return console.log(e)})).finally(_(!1)))}),[j]),Object(u.jsxs)("div",{className:N.a.app,children:[Object(u.jsx)(M,{onSubmit:function(e){n(e)}}),Object(u.jsx)(p,{data:s}),O&&Object(u.jsx)(v,{}),Object(u.jsx)(m,{data:s,nextPage:function(e){d(e)}})]})}c.a.render(Object(u.jsx)(q,{}),document.querySelector("#root"))}},[[75,1,2]]]);
  //# sourceMappingURL=main.2b3fd888.chunk.js.map