https://shopper.com/_next/static/chunks/22-7a58354ce9f354a8c3b0.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[22],{20022:function(e,t,i){i.d(t,{Wn:function(){return I},Wo:function(){return w},z8:function(){return _},Bm:function(){return Z},cM:function(){return C}});var n=i(83789),a=i(59748),o=i(56890),l=i(69348),r=i(88710),c=i(30017),u=i(12671),d=i(9304),s=i(85100),h=i(80834),f=i(2804),m=i(8311);function p(e){var t=e.acceptor,i=e.name,n=e.lessTolerance,a=void 0!==n&&n,o=s[e.imageKey],l=o.size,r=o.width,c=o.height,u=o.m_ratio,d=o.ratio,p=(0,f.Zl)(h.rq);return(0,m.tZ)("div",{className:"input-img-file-file",children:(0,m.tZ)("input",{ref:e.fileRef,type:"file",accept:t,onChange:function(t){if(t.target.files&&t.target.files[0]){var n=t.target.files[0].size/Math.pow(1024,2),o=t.target.files[0].name||i;if(n<=l){var s=new Image,h=new FileReader;h.onload=function(t){s.src=t.target.result,s.onload=function(){if(s.width>=r&&s.height>=c){var n=s.width/s.height;n>=d&&n<=u?e.changeInputFile({name:i,f_name:o,file:t.target.result,width:s.width,height:s.height}):n>=d-.8*d&&n<=u+.8*u?(p({text:"Oops! The image has an incorrect aspect ratio and may not look good.",isAlert:!0,pos:"bottom-middle"}),e.changeInputFile({name:i,f_name:o,file:t.target.result,width:s.width,height:s.height})):s.width>s.height?p({text:"Oops! The image does not follow the width specifications and may not look good.",isAlert:!0,pos:"bottom-middle"}):p({text:"Oops! The image does not follow the height specifications and may not look good.",isAlert:!0,pos:"bottom-middle"})}else{if(p({text:"Oops! The image is too small and may not look good.",isAlert:!0,pos:"bottom-middle"}),!0===a)r>=r-.1*r&&c>=c-.1*c&&e.changeInputFile({name:i,f_name:o,file:t.target.result,width:s.width,height:s.height})}}},h.readAsDataURL(t.target.files[0])}else p({text:"Oops! The image is too big and should be less than "+l+" MB.",isAlert:!0,pos:"bottom-middle"});t.target.value=null}}})})}p.defaultProps={size:5,width:200,height:200,name:"fileuploader",acceptor:"image/png,image/jpeg,image/webp"};var g=i(44421);i(87652);var v="Hmm, this doesn\u2019t look like a web address",w=function(e){var t=(0,a.useState)(e.defaultvalue?e.defaultvalue:""),i=t[0],n=t[1],o=(0,a.useState)(!!e.defaultvalue),r=o[0],u=o[1],s=(0,a.useState)("this field cannot be empty"),h=s[0],f=s[1],p=(0,a.useRef)(),g=function(){var t=i;!0===(null===e||void 0===e?void 0:e.autoURLFormat)&&(t=(0,c.formatURL)(t)),t.length>0&&((0,c.validURL)(t)?(e.changeInputChip(t),u(!0)):f(e.customErrorMessage||"Invalid Url"))};(0,a.useEffect)((function(){e.value?(u(!0),n(e.value)):(u(!1),n(""))}),[e.value]),(0,a.useEffect)((function(){p.current&&""!==i&&p.current.focus()}),[r,i]),(0,a.useEffect)((function(){e.isFocus&&p.current&&p.current.focus()}),[e.isFocus]);return r?(0,m.BX)("div",{className:"input-with-dropdown-input-chip-container",onClick:function(){null!==e&&void 0!==e&&e.disableInputChip||(u(!1),n(i))},children:[(0,m.tZ)("div",{className:"input-with-dropdown-input-chip",children:(0,m.tZ)("span",{children:i})}),!e.noDelete&&(0,m.tZ)("div",{className:"input-with-dropdown-input-chip-close",onClick:function(t){t.stopPropagation();var a=i;n(""),u(!1),e.changeInputChip(""),e.inputChipCleared&&e.inputChipCleared(a)},children:(0,m.tZ)(l.Z,{color:"#ffff"})})]}):(0,m.BX)(m.HY,{children:[(0,m.tZ)("input",{disabled:!(null===e||void 0===e||!e.disableInputChip),type:"text",onChange:function(t){n(t.target.value);var i=t.target.value;!0===(null===e||void 0===e?void 0:e.autoURLFormat)&&(i=(0,c.formatURL)(i)),(null===e||void 0===e?void 0:e.changeInputCb)&&(null===e||void 0===e||e.changeInputCb(i))},value:i,name:e.name?e.name:"inputchip",onBlur:g,onKeyDown:function(e){13===e.keyCode&&g()},className:e.isEmpty?"_form _textfield _error":"",autoComplete:"off",ref:p,placeholder:(null===e||void 0===e?void 0:e.placeholder)||""}),e.isEmpty&&(0,m.BX)("div",{className:"input-error-text",children:[!e.noWarningIcon&&(0,m.tZ)(d.Z,{}),(0,m.BX)("span",{children:[h," "]})]})]})},_=function(e){var t=(0,a.useState)(""),i=t[0],o=t[1],l=(0,a.useState)([]),r=l[0],c=l[1],d=(0,a.useRef)();(0,a.useEffect)((function(){e.value&&c(e.value)}),[e.value]);var s=function(){if(i.length>0){var t=r;t.push(i),c(t),o(""),e.changeInputChip(t)}},h=function(){d.current&&d.current.focus()};return(0,m.BX)("div",{className:"input-with-dropdown-input-multichip-container",onClick:h,children:[r.map((function(t,i){return(0,m.BX)("div",{className:"chip-item",children:[(0,m.tZ)("div",{className:"chip-text",children:t}),(0,m.tZ)("div",{className:"chip-delete",onClick:function(t){t.stopPropagation(),function(t){var i=(0,n.Z)(r);i.splice(t,1),c(i),e.changeInputChip(i),setTimeout((function(){return h()}),10)}(i)},children:(0,m.tZ)(u.default,{})})]},i)})),r.length<(e.max?e.max:r.length<10)&&(0,m.tZ)("input",{ref:d,type:"text",onCh

1ange:function(e){" "!==e.target.value&&o(e.target.value)},value:i,name:e.name?e.name:"inputchip",onBlur:function(){s()},onKeyDown:function(e){"Enter"===e.key&&s()},autoComplete:"off"})]})},Z=(0,a.forwardRef)((function(e,t){var i=(0,a.useState)(""),n=i[0],o=i[1],r=(0,a.useState)(!1),u=r[0],d=r[1],s=(0,a.useState)({}),h=s[0],f=s[1],p=(0,a.useState)(""),w=p[0],_=p[1],Z=(0,a.useState)(!1),C=Z[0],I=Z[1],N=(0,a.useRef)();(0,a.useEffect)((function(){e.errormsg&&I(e.errormsg)}),[e.errormsg]);var k=function(t){if(I(!1),e.onError&&e.onError(!1),"string"===typeof t&&-1==t.search(/^http[s]?\:\/\//)&&(t="https://"+t),t.length>0)if(t.length>10)if((0,c.validURL)(t)){var i="";if(null!==e&&void 0!==e&&e.inputIcon)f({icon:null===e||void 0===e?void 0:e.inputIcon});else{i=(0,c.IdentifyHost)(t);var n=(0,c.getSocialMediaIcon)(i);f({icon:n}),_(i)}o(t),e.changeInputChip(t,i,e.defaultKey),d(!0)}else I(v),e.changeInputChip(t,"",e.defaultKey),e.onError&&e.onError(!0);else I(v)};(0,a.useEffect)((function(){e.value&&k(e.value)}),[e.value]),(0,a.useEffect)((function(){N.current&&""!==n&&N.current.focus()}),[u,n]);var y={icon:null===h||void 0===h?void 0:h.icon,onClick:null===e||void 0===e?void 0:e.inputIconOnClick},b={icon:l.Z,onClick:function(){o(""),e.changeInputChip("",w,e.defaultKey),_(""),f(null),d(!1)}};return(0,m.BX)(m.HY,{children:[e.name&&(0,m.tZ)("label",{className:"_form _textfield_label ".concat(e.scoreCounter?"_textfield_label_flex":""),htmlFor:e.name,children:(0,m.tZ)("div",{className:"_form _helperlabel",children:e.label&&e.label})}),(0,m.BX)("div",{className:"_input_chip_with_button_div",children:[(0,m.BX)("div",{className:"edit-profile-social-media-first ".concat(!n&&e.fullWidth&&"_full_width_div"),children:[u?(0,m.tZ)(m.HY,{children:(0,m.BX)("div",{className:"input-with-dropdown-input-chip-container",onClick:function(){d(!1),o(n)},children:[(0,m.tZ)("div",{className:"input-with-dropdown-input-chip",children:(0,m.tZ)("span",{children:n})}),(null===e||void 0===e?void 0:e.extraIcon)&&""!==e.extraIcon&&(0,m.tZ)("div",{className:"input-with-dropdown-input-chip-extraicon",children:(0,m.tZ)("img",{src:e.extraIcon,width:22,height:22})})]})}):(0,m.tZ)(m.HY,{children:(0,m.tZ)("input",{type:"text",onChange:function(t){o(t.target.value),(null===e||void 0===e?void 0:e.changeInputCb)&&(null===e||void 0===e||e.changeInputCb(t.target.value))},value:n,placeholder:e.placeholder,name:e.name?e.name:"inputchip",className:C?"_form _textfield _error":"",onBlur:function(e){return k(e.target.value)},onKeyDown:function(e){return 13===e.keyCode&&k(e.target.value)},autoComplete:"off",ref:t||N})}),e.scoreCounter&&!n&&(0,m.tZ)("span",{className:"_form _scorecounter",children:e.scoreCounter})]}),(n||!e.fullWidth)&&(0,m.tZ)("div",{className:"edit-profile-social-media-second",children:(0,m.tZ)(g.Z,{variant:"secondary",icon1:y&&y,icon2:b})})]}),C&&(0,m.tZ)("span",{className:"_form _errorarea",children:(0,m.tZ)("span",{className:"_form _errormsg",children:C})})]})})),C=function(e){var t=e.name,i=e.lessTolerance,n=void 0!==i&&i,c=(0,a.useRef)(),u=(0,a.useState)(e.value?e.value:""),d=u[0],s=u[1],h=function(){c.current.click()},f=function(){s(null),e.changeInputImg({name:e.name?e.name:"inputImage",value:null})},v={icon:o.default,onClick:h},w={icon:l.Z,onClick:f};return(0,m.BX)("div",{className:"input-img-file",children:[(0,m.tZ)("div",{className:"input-img-file-file",children:(0,m.tZ)(p,{name:e.name?e.name:"inputImage",fileRef:c,imageKey:e.imageKey,changeInputFile:function(i){s(i.file),e.changeInputImg({name:t,value:i.file})},lessTolerance:n}

1)}),d&&""!==d?(0,m.BX)(m.HY,{children:[(0,m.tZ)("div",{className:"input-img-file-demo",style:{backgroundImage:"url(".concat(d,")")},children:(0,m.tZ)("div",{className:"input-img-file-selected-delete",onClick:f,children:(0,m.tZ)(l.Z,{})})}),(0,m.tZ)("div",{className:"input-img-file-demo-editpen",onClick:h,children:(0,m.tZ)(o.default,{})}),(0,m.tZ)("span",{className:"input-img-file-actions",children:(0,m.tZ)(g.Z,{variant:"primary",icon1:v,icon2:w})})]}):(0,m.tZ)("div",{className:"input-img-file-demo-upload",onClick:h,children:(0,m.tZ)("div",{className:"edit-header-image-new-background",children:(0,m.tZ)(r.Z,{})})})]})},I=function(e){var t=e.name,i=e.lessTolerance,n=void 0!==i&&i,o=e.showDimension,l=void 0!==o&&o,c=s[e.imageKey],u=c.size,d=c.width,h=c.height,f=(0,a.useRef)();return(0,m.BX)("div",{className:"edit-header-image edit-header-image-new",onClick:function(){f.current.click()},children:[(0,m.BX)("div",{className:"edit-header-image-new-background",children:[(0,m.tZ)(r.Z,{}),l&&(0,m.BX)("div",{className:"file-dimension-warning",children:[(0,m.tZ)("div",{children:"".concat(d,"x").concat(h,"px")}),(0,m.tZ)("div",{children:"Max file size: ".concat(u,"MB")})]})]}),(0,m.tZ)(p,{name:e.name?e.name:"inputImage",fileRef:f,imageKey:e.imageKey,changeInputFile:function(i){e.changeInputImg({name:t,value:i.file,f_name:i.f_name||t,width:i.width,height:i.height})},lessTolerance:n,showDimension:l})]})}},85100:function(e){e.exports=JSON.parse('{"profile_image":{"size":2,"width":150,"height":150,"m_ratio":5,"ratio":0.7},"profile_cover":{"size":3,"width":400,"height":100,"m_ratio":4,"ratio":3},"product_image":{"size":5,"width":300,"height":300,"m_ratio":5,"ratio":1.3},"collection_cover":{"size":5,"width":400,"height":500,"m_ratio":5,"ratio":0.8},"collection_cover_potrait":{"size":5,"width":400,"height":500,"m_ratio":2.5,"ratio":0.8},"collection_cover_landscape":{"size":5,"width":1120,"height":500,"m_ratio":5,"ratio":1.7},"background_image":{"size":4,"width":1920,"height":1080,"m_ratio":5,"ratio":1.7},"store_logo":{"size":2,"width":300,"height":100,"m_ratio":5,"ratio":0.7},"fav_icon":{"size":1,"width":16,"height":16,"m_ratio":5,"ratio":0.7}}')}}]);