4 suggestions displayed. To navigate, use up and down arrow keys.
+
4 suggestions displayed. To navigate, use up and down arrow keys.
-
-
Make
+
+ Make
-
-
-
- BRAUCH
+
+
+ BRAUCH
- BRAULT GLASAIR
+ BRAULT GLASAIR
- Brault
+ Brault
- Braunschmidt
+ Braunschmidt
{e.exports=function(e){if(Array.isArray(e))return e}},646:(e,t,n)=>{var r=n(228);e.exports=function(e){if(Array.isArray(e))return r(e)}},713:e=>{e.exports=function(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}},860:e=>{e.exports=function(e){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(e))return Array.from(e)}},884:e=>{e.exports=function(e,t){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(e)){var n=[],r=!0,o=!1,i=void 0;try{for(var a,s=e[Symbol.iterator]();!(r=(a=s.next()).done)&&(n.push(a.value),!t||n.length!==t);r=!0);}catch(e){o=!0,i=e}finally{try{r||null==s.return||s.return()}finally{if(o)throw i}}return n}}},521:e=>{e.exports=function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}},206:e=>{e.exports=function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}},38:(e,t,n)=>{var r=n(858),o=n(884),i=n(379),a=n(521);e.exports=function(e,t){return r(e)||o(e,t)||i(e,t)||a()}},319:(e,t,n)=>{var r=n(646),o=n(860),i=n(379),a=n(206);e.exports=function(e){return r(e)||o(e)||i(e)||a()}},379:(e,t,n)=>{var r=n(228);e.exports=function(e,t){if(e){if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(e,t):void 0}}},832:(e,t,n)=>{"use strict";n.r(t),n.d(t,{AutoSuggest:()=>T});var r=n(38),o=n.n(r),i=n(713),a=n.n(i),s=n(297),c=n.n(s),u=n(319),l=n.n(u),d=function(e){var t=e.id,n=e.styles,r=e.value,o=e.selected,i=e.onClick,a=e.name,s=void 0===a?void 0:a,u=e.abbr,l=void 0===u?void 0:u;return c().createElement("li",{role:"option",id:t,"aria-selected":t===o,className:t===o?"auto-suggestions highlighted":"auto-suggestions",style:n.suggestionOption&&n.suggestionOption,textvalue:r,onClick:i,name:s&&s,abbr:l&&l},r)},f=c().forwardRef((function(e,t){var n=e.id,r=e.onClick,o=e.options,i=e.styles,a=e.name,s=e.selected;return o[0].value&&o[0].name&&o[0].abbr?c().createElement("ul",{id:n,role:"listbox",ref:t,"aria-labelledby":"".concat(a,"-label"),style:i.suggestionOptions&&i.suggestionOptions},o&&o.map((function(e,t){var n=e.name,o=e.value,a=e.abbr;return c().createElement(d,{key:t,id:"".concat(n,"-suggestion").concat(t),selected:s,onClick:r,value:o,name:n,abbr:a,styles:i})}))):o[0].value&&o[0].name?c().createElement("ul",{id:n,role:"listbox",ref:t,"aria-labelledby":"".concat(a,"-label"),style:i.suggestionOptions&&i.suggestionOptions},o&&o.map((function(e,t){var n=e.name,o=e.value;return c().createElement(d,{key:t,id:"".concat(n,"-suggestion").concat(t),selected:s,onClick:r,value:o,name:n,styles:i})}))):c().createElement("ul",{id:n,role:"listbox",ref:t,"aria-labelledby":"".concat(a,"-label"),style:i.suggestionOptions&&i.suggestionOptions},o&&o.map((function(e,t){return c().createElement(d,{key:t,id:"".concat(a,"-suggestion").concat(t),selected:s,onClick:r,value:e,styles:i})})))}));function p(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function b(e){for(var t=1;t0?"".concat(r.length," suggestions displayed. To navigate, use up and down arrow keys."):""),c().createElement("div",null,c().createElement("div",{id:"".concat(n,"-searchField"),role:"combobox","aria-expanded":p?"true":"false","aria-owns":"".concat(n,"-input"),"aria-haspopup":"listbox","aria-controls":"".concat(n,"-autosuggest-options"),style:y.combobox&&y.combobox},c().createElement("label",{id:"".concat(n,"-label"),style:y.searchLabel&&y.searchLabel},L),c().createElement("input",{id:"".concat(n,"-input"),type:"text",className:x?"loading searchfield":"searchfield",autoComplete:"off","aria-autocomplete":"both",ref:t,onChange:function(e){t.current.focus(),s(e.target.value),v(!0)},onKeyDown:function(e){var t=P.current&&l()(P.current.children).find((function(e){return e.id===j}));switch(e.which){case 27:v(!1),S(!1),C(void 0),g();break;case 9:case 13:if(v(!1),S(!1),C(void 0),t)return e.preventDefault(),e.stopPropagation(),function(e){var t=e.getAttribute("textvalue");s(t)}(t);break;case 38:return e.preventDefault(),e.stopPropagation(),function(e){if(p){var t=e;if(t&&t.previousElementSibling){var n=t.previousElementSibling;n&&C(n.id),e=!1}else t=P.current.lastChild,C(t.id)}}(t);case 40:return e.preventDefault(),e.stopPropagation(),function(e){if(p){var t=e;if(t&&t.nextElementSibling){var n=t.nextElementSibling;n&&C(n.id),e=!1}else t=P.current.firstChild,C(t.id)}}(t);default:return}},value:d,"aria-labelledby":"".concat(n,"-label"),style:y.searchField&&y.searchField,"aria-activedescendant":j,disabled:!!k})),x&&c().createElement("p",{style:y.announcement&&y.announcement},"Loading ",L," options"),c().createElement("div",{className:"autocompleteSuggestions",id:"".concat(n,"-autocomplete"),style:y.suggestionsContainer?b(b({},y.suggestionsContainer),{},{display:p?"block":"none"}):{display:p?"block":"none"}},p&&r.length>0&&c().createElement(f,{ref:P,id:"".concat(n,"-autosuggest-options"),options:r,onClick:function(e){return s(e.target.getAttribute("textvalue")),C(void 0),v(!1),void S(!1)},styles:y,name:n,selected:j}))),h&&c().createElement("p",null,"No results found"),a&&c().createElement("p",null,"Results could not be fetched"))})),g=function(e){var t=new Intl.Collator(void 0,{numeric:!0,sensitivity:"base"});return e.sort(t.compare)},m=function(e){var t=new Intl.Collator(void 0,{numeric:!0,sensitivity:"base"});return e.sort((function(e,n){return t.compare(e.value,n.value)}))},h=c().forwardRef((function(e,t){var n=e.name,r=e.options,i=e.styles,a=e.type,s=e.isOpen,u=e.setIsOpen,l=e.handleChange,d=e.disabled,f=e.value,p=e.caseInsensitive,b=function(e){return e[0]?"string"==typeof e[0]?[g(e),"string"]:e[0].value?[m(e),"object"]:[e,""]:[e,""]}(r),h=o()(b,2),y=h[0],O=h[1],x=c().useState(y),w=o()(x,2),S=w[0],E=w[1],j=c().useState(!1),C=o()(j,2),k=C[0],T=C[1],P=c().useState(),L=o()(P,2),A=L[0],F=L[1];return c().useEffect((function(){if(s&&f){var e=[];"string"===O&&(e=p?r.filter((function(e){return e.toUpperCase().startsWith(f.toUpperCase())})):r.filter((function(e){return e.startsWith(f)}))),"object"===O&&(e=p?r.filter((function(e){return e.value.toUpperCase().startsWith(f.toUpperCase())})):r.filter((function(e){return e.value.startsWith(f)}))),E(e),e.length>=1&&u(!0)}}),[f,s,r]),c().useEffect((function(){f||u(!1)}),[f]),c().useEffect((function(){!1===s&&(E([]),T(!1))}),[s]),c().createElement(v,{ref:t,name:n,options:S,openListbox:s,searchText:f,setOpenListbox:u,setSearchText:function(e){l(e)},styles:i,dataType:a,noResult:k,activeDescendant:A,setActiveDescendant:F,clearText:function(){l()},disabled:d})})),y=n(994),O=n.n(y),x=n(424);O()(x.Z,{insert:"head",singleton:!1}),x.Z.locals;var w=n(300),S=n.n(w),E=c().forwardRef((function(e,t){var n=e.url,r=void 0===n?"":n,i=e.name,a=e.debounceTime,s=void 0===a?200:a,u=e.styles,l=e.type,d=e.isOpen,f=e.setIsOpen,p=e.handleChange,b=e.disabled,g=e.value,m=c().useState([]),h=o()(m,2),y=h[0],O=h[1],x=c().useState(!1),w=o()(x,2),E=w[0],j=w[1],C=c().useState(!1),k=o()(C,2),T=k[0],P=k[1],L=function(e,t,n){var r=c().useState(e),i=o()(r,2),a=i[0],s=i[1];return c().useEffect((function(){var n=setTimeout((function(){s(e)}),t);return function(){clearTimeout(n)}}),[e,t,n]),n?a:""}(g,s,d),A=c().useState(!1),F=o()(A,2),D=F[0],I=F[1],R=c().useState(),M=o()(R,2),N=M[0],U=M[1];if(c().useEffect((function(){d&&g&&I(!0),d&&g&&L&&g===L&&S()("".concat(r,"/").concat(encodeURIComponent(L))).then((function(e){return e.json()})).then((function(e){e&&e.length?(O(e),P(!1)):(f(!1),O([]),P(!0)),I(!1),j(!1)})).catch((function(){j(!0),I(!1)}))}),[d,g,L,r]),c().useEffect((function(){g||(I(!1),f(!1))})),""===r)throw new Error("AutoSuggestServer requires a url parameter");return c().createElement(v,{dataType:l,ref:t,name:i,options:y,error:E,setSearchText:function(e){p(e)},searchText:g,openListbox:d,setOpenListbox:f,noResult:T,styles:u,loading:D,setLoading:I,activeDescendant:N,setActiveDescendant:U,clearText:function(){p()},disabled:b})})),j={announcement:{position:"absolute",clip:"rect(0 0 0 0)",clipPath:"inset(50%)",height:"1px",width:"1px",overflow:"hidden"},combobox:{display:"inline-block"},searchField:{padding:".5rem",border:"2px solid #c8c8c8",backgroundColor:"#fff",borderRadius:"6px",color:"#000",fontWeight:"normal",fontSize:"1.35rem",margin:"0 auto",width:"19rem",focus:{color:"#000",border:"2px solid #005499",outline:"none"}},searchLabel:{display:"block",fontSize:"1.35rem"},suggestionsContainer:{display:"block",position:"absolute",border:"1px solid #999",background:"#fff",width:"20rem",zIndex:"1"},suggestionOptions:{margin:"0",padding:"0",listStyle:"none"},suggestionOption:{margin:"0",padding:".5rem",fontSize:"1.35rem",whiteSpace:"nowrap",overflow:"hidden",cursor:"default"}};function C(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function k(e){for(var t=1;t{"use strict";n.d(t,{Z:()=>i});var r=n(645),o=n.n(r)()((function(e){return e[1]}));o.push([e.id,"li:hover, li.highlighted {\n background: #110D3B;\n color: #FFF\n }\n input.loading {\n background-image: url(https://upload.wikimedia.org/wikipedia/commons/d/de/Ajax-loader.gif);\n background-position: right center;\n background-repeat: no-repeat;\n }\n ",""]);const i=o},645:e=>{"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n=e(t);return t[2]?"@media ".concat(t[2]," {").concat(n,"}"):n})).join("")},t.i=function(e,n,r){"string"==typeof e&&(e=[[null,e,""]]);var o={};if(r)for(var i=0;i{"use strict";var n=function(){if("undefined"!=typeof self)return self;if("undefined"!=typeof window)return window;if(void 0!==n)return n;throw new Error("unable to locate global object")}();e.exports=t=n.fetch,n.fetch&&(t.default=n.fetch.bind(n)),t.Headers=n.Headers,t.Request=n.Request,t.Response=n.Response},994:(e,t,n)=>{"use strict";var r,o=function(){var e={};return function(t){if(void 0===e[t]){var n=document.querySelector(t);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(e){n=null}e[t]=n}return e[t]}}(),i=[];function a(e){for(var t=-1,n=0;n{"use strict";t.exports=e}},n={};function r(e){if(n[e])return n[e].exports;var o=n[e]={id:e,exports:{}};return t[e](o,o.exports,r),o.exports}return r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r(832)})()}));
\ No newline at end of file
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports["react-autosuggestions"]=t(require("react")):e["react-autosuggestions"]=t(e.react)}(self,(function(e){return(()=>{var t={228:e=>{e.exports=function(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n{e.exports=function(e){if(Array.isArray(e))return e}},646:(e,t,n)=>{var r=n(228);e.exports=function(e){if(Array.isArray(e))return r(e)}},713:e=>{e.exports=function(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}},860:e=>{e.exports=function(e){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(e))return Array.from(e)}},884:e=>{e.exports=function(e,t){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(e)){var n=[],r=!0,o=!1,i=void 0;try{for(var a,s=e[Symbol.iterator]();!(r=(a=s.next()).done)&&(n.push(a.value),!t||n.length!==t);r=!0);}catch(e){o=!0,i=e}finally{try{r||null==s.return||s.return()}finally{if(o)throw i}}return n}}},521:e=>{e.exports=function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}},206:e=>{e.exports=function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}},38:(e,t,n)=>{var r=n(858),o=n(884),i=n(379),a=n(521);e.exports=function(e,t){return r(e)||o(e,t)||i(e,t)||a()}},319:(e,t,n)=>{var r=n(646),o=n(860),i=n(379),a=n(206);e.exports=function(e){return r(e)||o(e)||i(e)||a()}},379:(e,t,n)=>{var r=n(228);e.exports=function(e,t){if(e){if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(e,t):void 0}}},832:(e,t,n)=>{"use strict";n.r(t),n.d(t,{AutoSuggest:()=>T});var r=n(38),o=n.n(r),i=n(713),a=n.n(i),s=n(297),c=n.n(s),u=n(319),l=n.n(u),d=function(e){var t=e.abbr,n=void 0===t?void 0:t,r=e.id,o=e.name,i=void 0===o?void 0:o,a=e.onClick,s=e.selected,u=e.styles,l=e.value;return c().createElement("li",{abbr:n&&n,"aria-selected":r===s,className:r===s?"auto-suggestions highlighted":"auto-suggestions",id:r,name:i&&i,onClick:a,role:"option",style:u.suggestionOption&&u.suggestionOption,textvalue:l},l)},f=c().forwardRef((function(e,t){var n=e.id,r=e.onClick,o=e.options,i=e.styles,a=(e.name,e.selected);return o[0].value&&o[0].name&&o[0].abbr?c().createElement("ul",{"aria-labelledby":"".concat(n,"-label"),id:"".concat(n,"--autosuggest-options"),ref:t,role:"listbox",style:i.suggestionOptions&&i.suggestionOptions},o&&o.map((function(e,t){var o=e.name,s=e.value,u=e.abbr;return c().createElement(d,{abbr:u,id:"".concat(n,"-suggestion-").concat(t),key:t,name:o,onClick:r,selected:a,styles:i,value:s})}))):o[0].value&&o[0].name?c().createElement("ul",{"aria-labelledby":"".concat(n,"-label"),id:"".concat(n,"--autosuggest-options"),ref:t,role:"listbox",style:i.suggestionOptions&&i.suggestionOptions},o&&o.map((function(e,t){var o=e.name,s=e.value;return c().createElement(d,{id:"".concat(n,"-suggestion-").concat(t),key:t,name:o,onClick:r,selected:a,styles:i,value:s})}))):c().createElement("ul",{"aria-labelledby":"".concat(n,"-label"),id:"".concat(n,"--autosuggest-options"),ref:t,role:"listbox",style:i.suggestionOptions&&i.suggestionOptions},o&&o.map((function(e,t){return c().createElement(d,{id:"".concat(n,"-suggestion-").concat(t),key:t,onClick:r,selected:a,styles:i,value:e})})))}));function p(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function b(e){for(var t=1;t0?"".concat(O.length," suggestions displayed. To navigate, use up and down arrow keys."):""),c().createElement("div",null,c().createElement("div",{id:"".concat(F,"-searchField"),role:"combobox","aria-expanded":y?"true":"false","aria-owns":"".concat(F,"-input"),"aria-haspopup":"listbox","aria-controls":"".concat(F,"-autosuggest-options"),style:T.combobox&&T.combobox},c().createElement("label",{id:"".concat(F,"-label"),style:T.searchLabel&&T.searchLabel},A),c().createElement("input",{id:"".concat(F,"-input"),type:"text",className:v?"loading searchfield":"searchfield",autoComplete:"off","aria-autocomplete":"both",ref:t,onChange:function(e){t.current.focus(),k(e.target.value),C(!0)},onKeyDown:function(e){var t=L.current&&l()(L.current.children).find((function(e){return e.id===n}));switch(e.which){case 27:C(!1),j(!1),S(void 0),r();break;case 9:case 13:if(C(!1),j(!1),S(void 0),t)return e.preventDefault(),e.stopPropagation(),function(e){var t=e.getAttribute("textvalue");k(t)}(t);break;case 38:return e.preventDefault(),e.stopPropagation(),function(e){if(y){var t=e;if(t&&t.previousElementSibling){var n=t.previousElementSibling;n&&S(n.id),e=!1}else t=L.current.lastChild,S(t.id)}}(t);case 40:return e.preventDefault(),e.stopPropagation(),function(e){if(y){var t=e;if(t&&t.nextElementSibling){var n=t.nextElementSibling;n&&S(n.id),e=!1}else t=L.current.firstChild,S(t.id)}}(t);default:return}},value:w,"aria-labelledby":"".concat(F,"-label"),style:T.searchField&&T.searchField,"aria-activedescendant":n,disabled:!!a})),v&&c().createElement("p",{style:T.announcement&&T.announcement},"Loading ",A," options"),c().createElement("div",{className:"autocompleteSuggestions",id:"".concat(F,"-autocomplete"),style:T.suggestionsContainer?b(b({},T.suggestionsContainer),{},{display:y?"block":"none"}):{display:y?"block":"none"}},y&&O.length>0&&c().createElement(f,{id:F,name:g,onClick:function(e){return k(e.target.getAttribute("textvalue")),S(void 0),C(!1),void j(!1)},options:O,ref:L,selected:n,styles:T}))),h&&c().createElement("p",null,"No results found"),u&&c().createElement("p",null,"Results could not be fetched"))})),g=function(e){var t=new Intl.Collator(void 0,{numeric:!0,sensitivity:"base"});return e.sort(t.compare)},m=function(e){var t=new Intl.Collator(void 0,{numeric:!0,sensitivity:"base"});return e.sort((function(e,n){return t.compare(e.value,n.value)}))},h=c().forwardRef((function(e,t){var n=e.caseInsensitive,r=e.disabled,i=e.handleChange,a=e.id,s=e.isOpen,u=e.name,l=e.options,d=e.setIsOpen,f=e.styles,p=e.type,b=e.value,h=function(e){return e[0]?"string"==typeof e[0]?[g(e),"string"]:e[0].value?[m(e),"object"]:[e,""]:[e,""]}(l),y=o()(h,2),O=y[0],x=y[1],w=c().useState(O),S=o()(w,2),E=S[0],j=S[1],C=c().useState(!1),k=o()(C,2),T=k[0],P=k[1],L=c().useState(),A=o()(L,2),F=A[0],D=A[1];return c().useEffect((function(){if(s&&b){var e=[];"string"===x&&(e=n?l.filter((function(e){return e.toUpperCase().startsWith(b.toUpperCase())})):l.filter((function(e){return e.startsWith(b)}))),"object"===x&&(e=n?l.filter((function(e){return e.value.toUpperCase().startsWith(b.toUpperCase())})):l.filter((function(e){return e.value.startsWith(b)}))),j(e),e.length>=1&&d(!0)}}),[b,s,l]),c().useEffect((function(){b||d(!1)}),[b]),c().useEffect((function(){!1===s&&(j([]),P(!1))}),[s]),c().createElement(v,{activeDescendant:F,clearText:function(){i()},dataType:p,disabled:r,id:a,name:u,noResult:T,openListbox:s,options:E,ref:t,searchText:b,setActiveDescendant:D,setOpenListbox:d,setSearchText:function(e){i(e)},styles:f})})),y=n(994),O=n.n(y),x=n(424);O()(x.Z,{insert:"head",singleton:!1}),x.Z.locals;var w=n(300),S=n.n(w),E=c().forwardRef((function(e,t){var n=e.debounceTime,r=void 0===n?200:n,i=e.disabled,a=e.handleChange,s=e.id,u=e.isOpen,l=e.name,d=e.setIsOpen,f=e.styles,p=e.type,b=e.url,g=void 0===b?"":b,m=e.value,h=c().useState([]),y=o()(h,2),O=y[0],x=y[1],w=c().useState(!1),E=o()(w,2),j=E[0],C=E[1],k=c().useState(!1),T=o()(k,2),P=T[0],L=T[1],A=function(e,t,n){var r=c().useState(e),i=o()(r,2),a=i[0],s=i[1];return c().useEffect((function(){var n=setTimeout((function(){s(e)}),t);return function(){clearTimeout(n)}}),[e,t,n]),n?a:""}(m,r,u),F=c().useState(!1),D=o()(F,2),I=D[0],R=D[1],M=c().useState(),N=o()(M,2),U=N[0],q=N[1];if(c().useEffect((function(){u&&m&&R(!0),u&&m&&A&&m===A&&S()("".concat(g,"/").concat(encodeURIComponent(A))).then((function(e){return e.json()})).then((function(e){e&&e.length?(x(e),L(!1)):(d(!1),x([]),L(!0)),R(!1),C(!1)})).catch((function(){C(!0),R(!1)}))}),[u,m,A,g]),c().useEffect((function(){m||(R(!1),d(!1))})),""===g)throw new Error("AutoSuggestServer requires a url parameter");return c().createElement(v,{activeDescendant:U,clearText:function(){a()},dataType:p,disabled:i,error:j,id:s,loading:I,name:l,noResult:P,openListbox:u,options:O,ref:t,searchText:m,setActiveDescendant:q,setLoading:R,setOpenListbox:d,setSearchText:function(e){a(e)},styles:f})})),j={announcement:{position:"absolute",clip:"rect(0 0 0 0)",clipPath:"inset(50%)",height:"1px",width:"1px",overflow:"hidden"},combobox:{display:"inline-block"},searchField:{padding:".5rem",border:"2px solid #c8c8c8",backgroundColor:"#fff",borderRadius:"6px",color:"#000",fontWeight:"normal",fontSize:"1.35rem",margin:"0 auto",width:"19rem",focus:{color:"#000",border:"2px solid #005499",outline:"none"}},searchLabel:{display:"block",fontSize:"1.35rem"},suggestionsContainer:{display:"block",position:"absolute",border:"1px solid #999",background:"#fff",width:"20rem",zIndex:"1"},suggestionOptions:{margin:"0",padding:"0",listStyle:"none"},suggestionOption:{margin:"0",padding:".5rem",fontSize:"1.35rem",whiteSpace:"nowrap",overflow:"hidden",cursor:"default"}};function C(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function k(e){for(var t=1;t{"use strict";n.d(t,{Z:()=>i});var r=n(645),o=n.n(r)()((function(e){return e[1]}));o.push([e.id,"li:hover, li.highlighted {\n background: #110D3B;\n color: #FFF\n }\n input.loading {\n background-image: url(https://upload.wikimedia.org/wikipedia/commons/d/de/Ajax-loader.gif);\n background-position: right center;\n background-repeat: no-repeat;\n }\n ",""]);const i=o},645:e=>{"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n=e(t);return t[2]?"@media ".concat(t[2]," {").concat(n,"}"):n})).join("")},t.i=function(e,n,r){"string"==typeof e&&(e=[[null,e,""]]);var o={};if(r)for(var i=0;i{"use strict";var n=function(){if("undefined"!=typeof self)return self;if("undefined"!=typeof window)return window;if(void 0!==n)return n;throw new Error("unable to locate global object")}();e.exports=t=n.fetch,n.fetch&&(t.default=n.fetch.bind(n)),t.Headers=n.Headers,t.Request=n.Request,t.Response=n.Response},994:(e,t,n)=>{"use strict";var r,o=function(){var e={};return function(t){if(void 0===e[t]){var n=document.querySelector(t);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(e){n=null}e[t]=n}return e[t]}}(),i=[];function a(e){for(var t=-1,n=0;n{"use strict";t.exports=e}},n={};function r(e){if(n[e])return n[e].exports;var o=n[e]={id:e,exports:{}};return t[e](o,o.exports,r),o.exports}return r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r(832)})()}));
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index a5ffe51..b47ee5c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,11 +1,12 @@
{
"name": "react-autosuggestions",
- "version": "3.2.1",
+ "version": "3.3.0",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
- "version": "3.2.1",
+ "name": "react-autosuggestions",
+ "version": "3.3.0",
"license": "MIT",
"devDependencies": {
"@babel/core": "^7.12.10",
diff --git a/package.json b/package.json
index 34e205e..8ea4eab 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "react-autosuggestions",
- "version": "3.2.1",
+ "version": "3.3.0",
"keywords": [
"React",
"auto-suggest",
diff --git a/src/components/AutoSuggest.js b/src/components/AutoSuggest.js
index d12baf0..90b0edf 100644
--- a/src/components/AutoSuggest.js
+++ b/src/components/AutoSuggest.js
@@ -5,16 +5,17 @@ import "../index.css";
import { defaultOptions } from "../utils/defaultOptions.js";
export const AutoSuggest = ({
- type = "",
- url = "",
- name = "Search",
+ caseInsensitive = true,
debounceTime = 200,
- styles = defaultOptions,
- options = [],
- handleChange,
disabled = false,
+ handleChange,
+ id,
+ name = "Search",
+ options = [],
+ styles = defaultOptions,
+ type = "",
+ url = "",
value,
- caseInsensitive = true
}) => {
const combinedStyles = {
announcement: {
@@ -72,33 +73,35 @@ export const AutoSuggest = ({
if (type === "server" || url) {
return (
{
+ handleChange();
+ }}
+ dataType={type}
+ disabled={disabled}
+ id={id}
name={name}
- options={results}
+ noResult={noResult}
openListbox={isOpen}
+ options={results}
+ ref={ref}
searchText={value}
+ setActiveDescendant={setActiveDescendant}
setOpenListbox={setIsOpen}
setSearchText={handleInputChange}
styles={styles}
- dataType={type}
- noResult={noResult}
- activeDescendant={activeDescendant}
- setActiveDescendant={setActiveDescendant}
- clearText={() => {
- handleChange();
- }}
- disabled={disabled}
/>
);
}
diff --git a/src/components/AutoSuggestContainer.js b/src/components/AutoSuggestContainer.js
index 3d31d08..3fc3008 100644
--- a/src/components/AutoSuggestContainer.js
+++ b/src/components/AutoSuggestContainer.js
@@ -4,22 +4,23 @@ import { AutoSuggestOptions } from "./AutoSuggestOptions.js";
export const AutoSuggestContainer = React.forwardRef(
(
{
+ activeDescendant,
+ clearText,
+ dataType,
+ disabled,
+ error = false,
+ id,
+ loading = false,
name,
+ noResult = false,
+ openListbox,
options,
- error = false,
- setSearchText,
searchText = "",
- openListbox,
- setOpenListbox,
- clearText,
- noResult = false,
- styles,
- loading = false,
- setLoading = () => {},
- dataType,
- activeDescendant,
setActiveDescendant,
- disabled
+ setLoading = () => {},
+ setOpenListbox,
+ setSearchText,
+ styles
},
inputRef
) => {
@@ -133,10 +134,12 @@ export const AutoSuggestContainer = React.forwardRef(
let text = highlighted.getAttribute("textvalue");
setSearchText(text);
};
+
+ const idOrName = id || name;
return (
<>
-
+
{label}
{openListbox && options.length > 0 && (
copyTextRemoveSuggestions(e)}
- styles={styles}
+ id={idOrName}
name={name}
+ onClick={(e) => copyTextRemoveSuggestions(e)}
+ options={options}
+ ref={suggestionRef}
selected={activeDescendant}
+ styles={styles}
/>
)}
{value}
diff --git a/src/components/AutoSuggestOptions.js b/src/components/AutoSuggestOptions.js
index 05eaf96..28e2415 100644
--- a/src/components/AutoSuggestOptions.js
+++ b/src/components/AutoSuggestOptions.js
@@ -5,23 +5,23 @@ export const AutoSuggestOptions = React.forwardRef(({ id, onClick, options, styl
if (options[0].value && options[0].name && options[0].abbr) {
return (
{options &&
options.map(({ name, value, abbr }, index) => (
@@ -29,22 +29,22 @@ export const AutoSuggestOptions = React.forwardRef(({ id, onClick, options, styl
} else if (options[0].value && options[0].name) {
return (
{options &&
options.map(({ name, value }, index) => (
@@ -52,23 +52,23 @@ export const AutoSuggestOptions = React.forwardRef(({ id, onClick, options, styl
}
return (
- {options &&
- options.map((opt, index) => (
-
+ aria-labelledby={`${id}-label`}
+ id={`${id}--autosuggest-options`}
+ ref={ref}
+ role="listbox"
+ style={styles.suggestionOptions && styles.suggestionOptions}
+ >
+ {options &&
+ options.map((opt, index) => (
+ {
+ handleChange();
+ }}
dataType={type}
- ref={ref}
+ disabled={disabled}
+ error={errored}
+ id={id}
+ loading={loading}
name={name}
+ noResult={noResult}
+ openListbox={isOpen}
options={options}
- error={errored}
- setSearchText={handleInputChange}
+ ref={ref}
searchText={value}
- openListbox={isOpen}
+ setActiveDescendant={setActiveDescendant}
+ setLoading={setLoading}
setOpenListbox={setIsOpen}
- noResult={noResult}
+ setSearchText={handleInputChange}
styles={styles}
- loading={loading}
- setLoading={setLoading}
- activeDescendant={activeDescendant}
- setActiveDescendant={setActiveDescendant}
- clearText={() => {
- handleChange();
- }}
- disabled={disabled}
- />
+ />
);
}
}
diff --git a/src/utils/useDebounce.js b/src/utils/useDebounce.js
index ae205e2..e9c6dbd 100644
--- a/src/utils/useDebounce.js
+++ b/src/utils/useDebounce.js
@@ -5,26 +5,26 @@ function useDebounce(value, delay, isOpen) {
const [debouncedValue, setDebouncedValue] = React.useState(value);
React.useEffect(
- () => {
- // Update debounced value after delay
- const handler = setTimeout(() => {
- setDebouncedValue(value);
- }, delay);
+ () => {
+ // Update debounced value after delay
+ const handler = setTimeout(() => {
+ setDebouncedValue(value);
+ }, delay);
- // Cancel the timeout if value changes (also on delay change or unmount)
- // This is how we prevent debounced value from updating if value is changed ...
- // .. within the delay period. Timeout gets cleared and restarted.
- return () => {
- clearTimeout(handler);
- };
- },
- [value, delay, isOpen] // Only re-call effect if value or delay changes
+ // Cancel the timeout if value changes (also on delay change or unmount)
+ // This is how we prevent debounced value from updating if value is changed ...
+ // .. within the delay period. Timeout gets cleared and restarted.
+ return () => {
+ clearTimeout(handler);
+ };
+ },
+ [value, delay, isOpen] // Only re-call effect if value or delay changes
);
if (isOpen) {
- return debouncedValue;
+ return debouncedValue;
} else {
- return "";;;
+ return "";
}
}
diff --git a/tests/AutoSuggest.test.js b/tests/AutoSuggest.test.js
index 6639537..a979430 100644
--- a/tests/AutoSuggest.test.js
+++ b/tests/AutoSuggest.test.js
@@ -25,15 +25,16 @@ afterEach(() => server.resetHandlers());
afterAll(() => server.close());
const Form = ({
+ caseInsensitive,
+ disabled,
+ handleChange,
+ id = "",
name = "",
- url = "",
options = [],
- type = "",
styles,
- handleChange,
- disabled,
+ type = "",
+ url = "",
value,
- caseInsensitive
}) => {
const [make, setMake] = React.useState();
const [formData, setFormData] = React.useState();
@@ -45,15 +46,16 @@ const Form = ({
<>
@@ -97,6 +99,12 @@ describe("AutoSuggest rendering", () => {
})
});
+test("AutoSuggest should use user defined id if provided", () => {
+ render();
+ const input = screen.getByLabelText("Make");
+ expect(input.id).toBe("testId-input")
+})
+
test("AutoSuggest should accept input", () => {
render();
let input = screen.queryByRole("textbox");
@@ -307,7 +315,7 @@ describe("Down arrow", () => {
userEvent.type(input, "{arrowdown}");
userEvent.type(input, "{arrowdown}");
userEvent.type(input, "{arrowdown}");
- expect(input).toHaveAttribute("aria-activedescendant", "Make-suggestion2");
+ expect(input).toHaveAttribute("aria-activedescendant", "Make-suggestion-2");
});
test("Pressing down arrow should set aria-selected true for the selected option", () => {
render(
@@ -354,7 +362,7 @@ describe("Up arrow", () => {
userEvent.type(input, "{arrowup}");
userEvent.type(input, "{arrowup}");
userEvent.type(input, "{arrowup}");
- expect(input).toHaveAttribute("aria-activedescendant", "Make-suggestion0");
+ expect(input).toHaveAttribute("aria-activedescendant", "Make-suggestion-0");
});
test("Pressing down arrow should set aria-selected true for the selected option", () => {
render(