(window.__LOADABLE_LOADED_CHUNKS__=window.__LOADABLE_LOADED_CHUNKS__||[]).push([[2],{161:function(t,e,s){"use strict";s.d(e,"a",(function(){return W})),s.d(e,"b",(function(){return F})),s.d(e,"c",(function(){return M}));var o=s(4),i=s(3),n=s(598),a=s.n(n),l=s(184),r=s.n(l),h=s(1),p=s.n(h),c=s(9),d=s(0),u=s(25),m=s.n(u),b=s(579),O=s.n(b),v=s(586),g=s.n(v),C=s(258),f=s.n(C),y=s(12),j=s.n(y),S=s(39),w=s(132),E=s(11),I=s(58),k=s(8),D=s(10),N=s(20),x=s(77);s(168),s(400);const B=Object(E.a)("Droplist");class L extends p.a.PureComponent{constructor(...t){super(...t),Object(i.a)(this,"state",{open:!1,searchString:"",selected:this.props.defaultOption,showAbove:null,showScrollbar:!1}),Object(i.a)(this,"droplistId",Object(N.h)("droplist")),Object(i.a)(this,"itemsWrapper",p.a.createRef()),Object(i.a)(this,"listElement",p.a.createRef()),Object(i.a)(this,"fixedBottomContent",p.a.createRef()),Object(i.a)(this,"paletteComponent",p.a.createRef()),Object(i.a)(this,"selectElement",p.a.createRef()),Object(i.a)(this,"selectedListItem",p.a.createRef()),Object(i.a)(this,"delayClearSearch",f()(()=>{this.setState({searchString:""})},800)),Object(i.a)(this,"bodyClickHandler",t=>{!Object(S.findDOMNode)(this).contains(t.target)&&this.state.open&&this.handleOutsideClick()}),Object(i.a)(this,"getCurItemVars",()=>{const t=this.getAllOptions(),e=this.state.selected;return{options:t,nextItem:e,curIndex:g()(t,["value",e.value])}}),Object(i.a)(this,"getNextItem",()=>{const{options:t,nextItem:e,curIndex:s}=this.getCurItemVars();if(s>-1){return t[s<t.length-1?s+1:0]}return e}),Object(i.a)(this,"getPrevItem",()=>{const{options:t,nextItem:e,curIndex:s}=this.getCurItemVars();if(s>-1){return t[s>0?s-1:t.length-1]}return e}),Object(i.a)(this,"bodyKeyDownHandler",t=>{if(this.props.useNativeControls)return;if((void 0!==this.props.focused?this.props.focused:this.state.focused)||this.state.open){if(40===t.keyCode||38===t.keyCode){t.preventDefault(),t.altKey&&this.setState({open:!0});const e=40===t.keyCode?this.getNextItem():this.getPrevItem();this.select(e),this.props.onChange&&e&&e.value&&!e.disabled&&this.props.onChange(e.value)}if(13!==t.keyCode&&32!==t.keyCode||(t.preventDefault(),this.props.onChange&&this.props.changeOnEnter&&this.props.onChange(this.state.selected.value),this.setState({open:!this.state.open,showAbove:null})),this.props.useKeyboardSearch&&t.keyCode>64&&t.keyCode<91){t.preventDefault();const e=String.fromCharCode(t.keyCode).toLocaleLowerCase(),s=this.state.searchString+e,o=this.props.options.findIndex(t=>t.display.toString().toLocaleLowerCase().startsWith(s));if(o>=0){const t=this.props.options[o],e=t.value;!t.disabled&&this.props.onChange&&(this.props.onChange(e),this.select(t))}this.setState({searchString:this.state.searchString+e})}else if(9===t.keyCode)this.setState({open:!1,showAbove:null});else{const e=new Date;32===t.keyCode&&t.preventDefault(),this.setState({lastKeyDown:e})}}}),Object(i.a)(this,"getAllOptions",()=>[this.props.defaultOption].concat(this.props.options)),Object(i.a)(this,"select",t=>{this.state.open&&this.setState({selected:t})}),Object(i.a)(this,"handleBlur",t=>{this.setState({focused:!1}),this.props.onBlur&&this.props.onBlur(t)}),Object(i.a)(this,"handleChange",t=>{var e,s;null===(e=(s=this.props).onChange)||void 0===e||e.call(s,t.currentTarget.value)}),Object(i.a)(this,"toggleOpen",()=>{const{open:t,showAbove:e}=this.state;this.setState({open:!t,showAbove:t?e:null})}),Object(i.a)(this,"handleFocus",t=>{this.setState({focused:!0}),this.props.onFocus&&this.props.onFocus(t)}),Object(i.a)(this,"handleItemClick",t=>{this.select(t);const e=t.value;t.disabled?this.handleOutsideClick():(this.props.onChange&&this.props.onChange(e),this.toggleOpen())}),Object(i.a)(this,"handleOutsideClick",()=>{const{value:t}=this.props;this.setState({selected:this.props.getOptionForValueWithOptions(this.props.options,t,this.props.defaultOption)}),this.toggleOpen()}),Object(i.a)(this,"handleRootClick",t=>{this.props.stopClickEventPropagation&&t.stopPropagation()}),Object(i.a)(this,"getListItems",()=>{const{options:t}=this.props;let e=!1;const s=[];for(let o=0;o<t.length;o++){const i=t[o];i.groupEnd&&(e=!1);const n=this.props.value===i.value,a=B("&-listItem",{"&-listItem--disabled":i.disabled,"&-listItem--groupEnd":i.groupEnd,"&-listItem--groupStart":i.groupStart,"&-listItem--selected":n,"&-listItem--tentativeSelected":this.state.selected&&this.state.selected.value===i.value,"&-listItem--withinGroup":e}),l=B("&-displayText");let r;this.props.height&&(r={height:this.props.height}),s.push(p.a.createElement("li",{className:a,key:null!=i.value?i.value.toString():"item"+o,ref:n?this.selectedListItem:void 0,style:r,onClick:()=>this.handleItemClick(i),onMouseDown:t=>t.preventDefault()},Object(d.a)("div",{className:l,style:{maxWidth:this.props.maxPaletteWidth}},void 0,i.display))),i.groupStart&&(e=!0)}return p.a.createElement("ul",{ref:this.listElement,style:{minWidth:this.props.width?this.props.width:"100%"}},s)})}static getDerivedStateFromProps(t){return{selected:t.getOptionForValueWithOptions(t.options,t.value,t.defaultOption)}}componentDidUpdate(t,e){this.props.useNativeControls||this.checkShowAbove(),(e.open||!this.state.open)&&e.selected&&this.state.selected&&e.selected.value===this.state.selected.value||this.scrollToSelectedOption(),!e.open&&this.state.open?(document.body.addEventListener("mousedown",this.bodyClickHandler),this.props.onOpen&&this.props.onOpen()):e.open&&!this.state.open&&(document.body.removeEventListener("mousedown",this.bodyClickHandler),this.props.onClose&&this.props.onClose()),e.searchString!==this.state.searchString&&this.state.searchString&&this.delayClearSearch()}componentDidMount(){this.state.open&&document.body.removeEventListener("mousedown",this.bodyClickHandler),document.body.addEventListener("keydown",this.bodyKeyDownHandler,!0)}componentWillUnmount(){document.body.removeEventListener("keydown",this.bodyKeyDownHandler,!0),document.body.removeEventListener("mousedown",this.bodyClickHandler)}checkShowAbove(){if(this.state.open&&null===this.state.showAbove){let t=0,e=window.innerHeight;const{constrainPaletteTo:s}=this.props;if(s){const o=O()(s)?document.body.querySelector(s):s;if(o){const s=o.getBoundingClientRect();t=s.top,e=s.top+s.height}}const o=Object(S.findDOMNode)(this).getBoundingClientRect(),i=Object(S.findDOMNode)(this.paletteComponent.current).firstElementChild.getBoundingClientRect(),n=this.listElement.current.getBoundingClientRect(),a=this.fixedBottomContent.current?this.fixedBottomContent.current.clientHeight:0,l=o.top-i.height>t,r=o.bottom+i.height<e,h=r||!l&&!r;this.setState({showAbove:!h,showScrollbar:n.height+a>i.height})}}scrollToSelectedOption(){if(!this.listElement.current)return;const t=this.listElement.current.getBoundingClientRect(),e=Object(S.findDOMNode)(this.paletteComponent.current).querySelector(".Palette-contents").getBoundingClientRect(),s=this.selectedListItem.current;if(s){const o=s.getBoundingClientRect(),i=o.top+o.height/2-t.top-e.height/2;this.itemsWrapper.current.scrollTop=i}}getFixedBottomContent(){const{fixedBottomContent:t}=this.props;if(t)return p.a.createElement("div",{className:B("&-fixedBottomContent"),ref:this.fixedBottomContent},t)}render(){var t;const{open:e,selected:s,showAbove:o,showScrollbar:i}=this.state,{disabled:n,options:a,paletteStyles:l,renderOpenDefaultContent:r,selectedItemClassName:h,showError:c,size:u,styleType:b,useNativeControls:O,width:v}=this.props,g=this.props.droplistId||this.droplistId,C=void 0!==this.props.focused?this.props.focused:this.state.focused;let f,y=s;if((e||null==s||this.props.disableSelection)&&null!=this.props.defaultOption&&(y=this.props.defaultOption),null==y&&(y=a[0]),!this.props.useNativeControls){const t={};this.props.height&&(t.height=this.props.height),f=Object(d.a)("div",{className:B("&-wrapper")},void 0,Object(d.a)("button",{"aria-haspopup":!0,className:B("&-selectedItem",h),id:g,style:t,onClick:this.toggleOpen,onMouseOver:this.select.bind(this,this.props.getOptionForValueWithOptions(this.props.options,this.props.value,this.props.defaultOption)),onMouseDown:t=>{this.props.avoidMouseFocus&&t.preventDefault()},onFocus:this.handleFocus,onBlur:this.handleBlur,type:"button"},void 0,Object(d.a)("div",{className:B("&-display")},void 0,Object(d.a)("div",{className:B("&-displayText")},void 0,y&&y.display))),r&&Object(d.a)("div",{className:B("&-openDefaultContent")},void 0,r()),e&&p.a.createElement(w.a,{className:B("&-listItems"),closeOnBodyClick:!1,onRequestClose:this.handleOutsideClick,ref:this.paletteComponent,style:l},p.a.createElement("div",{className:B("&-itemsWrapper"),ref:this.itemsWrapper},this.getListItems()),this.getFixedBottomContent()))}const S=this.props.defaultOption&&!a.some(t=>t.value===this.props.defaultOption.value)?[this.props.defaultOption].concat(a):a;let E;c&&(E=Object(d.a)(x.a,{message:this.props.validationErrors,bottomOfTarget:!0}));const I=B("&","&--"+W[u],"&--"+F[b],`&--${this.context&&this.context.theme}Theme`,{"&--closed":!e,"&--custom":!O,"&--disabled":n,"&--error":c,"&--focus":C,"&--isDisney":Object(k.a)().isDisneyIframe,"&--open":e,"&--showAbove":o,"&--showBelow":!o,"&--showScrollbar":i});return Object(d.a)("div",{className:B("&-outerWrapper"),style:v&&v.endsWith("%")?{width:"100%"}:void 0},void 0,this.props.label&&Object(d.a)("label",{className:B("&-labelContent",this.props.labelClassName),htmlFor:g},void 0,this.props.label),Object(d.a)("div",{className:j()(this.props.className,I),onClick:this.handleRootClick,style:v?{width:v}:void 0},void 0,p.a.createElement("select",{autoComplete:this.props.autoComplete,disabled:n,id:O?g:null,name:this.props.name,onBlur:this.handleBlur,onChange:this.handleChange,onFocus:this.handleFocus,ref:this.selectElement,value:null!==(t=y.value)&&void 0!==t?t:""},S.map((t,e)=>{var s;return Object(d.a)("option",{value:null!==(s=t.value)&&void 0!==s?s:""},null!=t.value?t.value.toString():"item"+e,m()(t.nativeDisplay)&&null!=t.display?t.display.toString():t.nativeDisplay)})),f,E))}}function A(t){const e=Object(D.e)(),s=Object(h.useMemo)(()=>({display:e("zi_myzazzle_Reviews_SelectOne"),value:""}),[e]);return p.a.createElement(L,Object(c.a)({},t,{defaultOption:t.defaultOption||s}))}var W,F;function R(t,e,s){if(null!=s&&(t=[s].concat(t)),null==e)return s;const o=r()(t,a()("value",e));return o||(t.length<1?s:t[0])}Object(i.a)(L,"contextType",I.a),Object(i.a)(L,"Sizes",W),Object(i.a)(L,"defaultProps",{useKeyboardSearch:!1,width:"100%"}),function(t){t[t.Small=0]="Small",t[t.Medium=1]="Medium",t[t.Large=2]="Large"}(W||(W={})),function(t){t[t.Normal=0]="Normal",t[t.White=1]="White"}(F||(F={}));const _={changeOnEnter:!0,defaultOption:null,label:"",onChange:()=>{},options:[],size:W.Medium,styleType:F.Normal,value:null};class M extends p.a.Component{render(){const t=Object(o.a)(Object(o.a)({},this.props),{},{getOptionForValueWithOptions:R});return p.a.createElement(A,t)}}Object(i.a)(M,"Styles",F),Object(i.a)(M,"defaultProps",_);class H extends p.a.Component{render(){const t=Object(o.a)(Object(o.a)({},this.props),{},{getOptionForValueWithOptions:R});return p.a.createElement(L,t)}}Object(i.a)(H,"Styles",F),Object(i.a)(H,"defaultProps",_)}}]);