@reach/combobox - npm Package Compare versions

Comparing version 0.10.2 to 0.10.3

dist/combobox.cjs.development.js

@@ -209,5 +209,5 @@ 'use strict';
 
-  var _useDescendants = descendants.useDescendants(),
-      options = _useDescendants[0],
-      setOptions = _useDescendants[1]; // Need this to focus it
+  var _useDescendantsInit = descendants.useDescendantsInit(),
+      options = _useDescendantsInit[0],
+      setOptions = _useDescendantsInit[1]; // Need this to focus it
 
@@ -544,6 +544,5 @@
   var index = descendants.useDescendant({
-    context: ComboboxDescendantContext,
     element: ownRef.current,
     value: value
-  });
+  }, ComboboxDescendantContext);
   var isActive = navigationValue === value;
@@ -711,5 +710,3 @@
 
-  var _useContext9 = React.useContext(ComboboxDescendantContext),
-      options = _useContext9.descendants;
-
+  var options = descendants.useDescendants(ComboboxDescendantContext);
   return function handleKeyDown(event) {
@@ -872,8 +869,8 @@ var index = options.findIndex(function (_ref7) {
 function useBlur() {
-  var _useContext10 = React.useContext(ComboboxContext),
-      state = _useContext10.state,
-      transition = _useContext10.transition,
-      popoverRef = _useContext10.popoverRef,
-      inputRef = _useContext10.inputRef,
-      buttonRef = _useContext10.buttonRef;
+  var _useContext9 = React.useContext(ComboboxContext),
+      state = _useContext9.state,
+      transition = _useContext9.transition,
+      popoverRef = _useContext9.popoverRef,
+      inputRef = _useContext9.inputRef,
+      buttonRef = _useContext9.buttonRef;
 
@@ -986,5 +983,5 @@ return function handleBlur() {
 function useComboboxContext() {
-  var _useContext11 = React.useContext(ComboboxContext),
-      isExpanded = _useContext11.isExpanded,
-      comboboxId = _useContext11.comboboxId;
+  var _useContext10 = React.useContext(ComboboxContext),
+      isExpanded = _useContext10.isExpanded,
+      comboboxId = _useContext10.comboboxId;
 
@@ -991,0 +988,0 @@ return React.useMemo(function () {

dist/combobox.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react"),n=e(t);require("prop-types");var a,r,o,u,i,l=require("@reach/utils"),c=require("@reach/descendants"),s=require("highlight-words-core"),v=require("@reach/auto-id"),d=require("@reach/popover"),f=e(d);function E(){return(E=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e}).apply(this,arguments)}function p(e,t){if(null==e)return{};var n,a,r={},o=Object.keys(e);for(a=0;a<o.length;a++)t.indexOf(n=o[a])>=0||(r[n]=e[n]);return r}var C="IDLE",b="SUGGESTING",T="NAVIGATING",x="INTERACTING",I={initial:C,states:(i={},i.IDLE={on:(a={},a.BLUR=C,a.CLEAR=C,a.CHANGE=b,a.INITIAL_CHANGE=C,a.FOCUS=b,a.NAVIGATE=T,a.OPEN_WITH_BUTTON=b,a)},i[b]={on:(r={},r.CHANGE=b,r.FOCUS=b,r.NAVIGATE=T,r.CLEAR=C,r.ESCAPE=C,r.BLUR=C,r.SELECT_WITH_CLICK=C,r.INTERACT=x,r.CLOSE_WITH_BUTTON=C,r)},i[T]={on:(o={},o.CHANGE=b,o.FOCUS=b,o.CLEAR=C,o.BLUR=C,o.ESCAPE=C,o.NAVIGATE=T,o.SELECT_WITH_CLICK=C,o.SELECT_WITH_KEYBOARD=C,o.CLOSE_WITH_BUTTON=C,o.INTERACT=x,o)},i[x]={on:(u={},u.CLEAR=C,u.CHANGE=b,u.FOCUS=b,u.BLUR=C,u.ESCAPE=C,u.NAVIGATE=T,u.CLOSE_WITH_BUTTON=C,u.SELECT_WITH_CLICK=C,u)},i)},A=function(e,t){var n=E(E({},e),{},{lastEventType:t.type});switch(t.type){case"CHANGE":case"INITIAL_CHANGE":return E(E({},n),{},{navigationValue:null,value:t.value});case"NAVIGATE":case"OPEN_WITH_BUTTON":return E(E({},n),{},{navigationValue:g(n,t)});case"CLEAR":return E(E({},n),{},{value:"",navigationValue:null});case"BLUR":case"ESCAPE":return E(E({},n),{},{navigationValue:null});case"SELECT_WITH_CLICK":return E(E({},n),{},{value:t.value,navigationValue:null});case"SELECT_WITH_KEYBOARD":return E(E({},n),{},{value:e.navigationValue,navigationValue:null});case"CLOSE_WITH_BUTTON":return E(E({},n),{},{navigationValue:null});case"INTERACT":return n;case"FOCUS":return E(E({},n),{},{navigationValue:g(n,t)});default:return n}};function h(e){return[b,T,x].includes(e)}function g(e,t){return t.value?t.value:t.persistSelection?e.value:null}var m=c.createDescendantContext("ComboboxDescendantContext"),R=l.createNamedContext("ComboboxContext",{}),N=l.createNamedContext("OptionContext",{}),O=l.forwardRefWithAs((function(e,a){var r=e.onSelect,o=e.openOnFocus,u=void 0!==o&&o,i=e.children,s=e.as,d=void 0===s?"div":s,f=e["aria-label"],C=e["aria-labelledby"],b=p(e,["onSelect","openOnFocus","children","as","aria-label","aria-labelledby"]),T=c.useDescendants(),x=T[0],g=T[1],N=t.useRef(),O=t.useRef(),S=t.useRef(),L=t.useRef(),_=t.useRef(),w=function(e,n,a){var r=t.useState(e.initial),o=r[0],u=r[1],i=t.useReducer(n,{value:"",navigationValue:null}),l=i[1];return[o,i[0],function(t,n){void 0===n&&(n={});var a=e.states[o],r=a&&a.on[t];if(r)return l(E({type:t,state:o,nextState:o},n)),void u(r)}]}(I,A),y=w[0],H=w[1],G=w[2];!function(e,t){l.useIsomorphicLayoutEffect((function(){"NAVIGATE"!==e&&"ESCAPE"!==e&&"SELECT_WITH_CLICK"!==e&&"OPEN_WITH_BUTTON"!==e||t.current.focus()}),[t,e])}(H.lastEventType,N);var V=v.useId(b.id),D=V?l.makeId("listbox",V):"listbox",k={ariaLabel:f,ariaLabelledby:C,autocompletePropRef:L,buttonRef:S,comboboxId:V,data:H,inputRef:N,isExpanded:h(y),listboxId:D,onSelect:r||l.noop,openOnFocus:u,persistSelectionRef:_,popoverRef:O,state:y,transition:G};return t.useEffect((function(){return l.checkStyles("combobox")}),[]),n.createElement(c.DescendantProvider,{context:m,items:x,set:g},n.createElement(R.Provider,{value:k},n.createElement(d,Object.assign({},b,{"data-reach-combobox":"",ref:a}),l.isFunction(i)?i({id:V,isExpanded:h(y)}):i)))})),S=l.forwardRefWithAs((function(e,a){var r=e.as,o=void 0===r?"input":r,u=e.selectOnClick,i=void 0!==u&&u,c=e.autocomplete,s=void 0===c||c,v=e.onClick,d=e.onChange,f=e.onKeyDown,E=e.onBlur,C=e.onFocus,b=e.value,I=p(e,["as","selectOnClick","autocomplete","onClick","onChange","onKeyDown","onBlur","onFocus","value"]),A=t.useRef(b).current,h=t.useRef(!1);l.useUpdateEffect((function(){h.current=!0}),[b]);var g=t.useContext(R),m=g.data,N=m.navigationValue,O=m.value,S=m.lastEventType,L=g.inputRef,_=g.state,w=g.transition,y=g.listboxId,H=g.autocompletePropRef,k=g.openOnFocus,W=g.isExpanded,B=g.ariaLabel,U=g.ariaLabelledby,P=l.useForkedRef(L,a),F=t.useRef(!1),K=G(),j=V(),q=null!=b;l.useIsomorphicLayoutEffect((function(){H.current=s}),[s,H]);var M=t.useCallback((function(e){""===e.trim()?w("CLEAR"):w(e!==A||h.current?"CHANGE":"INITIAL_CHANGE",{value:e})}),[A,w]);t.useEffect((function(){!q||b===O||""===b.trim()&&""===(O||"").trim()||M(b)}),[b,M,q,O]);var Y=!s||_!==T&&_!==x?b||O:N||b||O;return n.createElement(o,Object.assign({"aria-activedescendant":N?String(D(N)):void 0,"aria-autocomplete":"both","aria-controls":y,"aria-expanded":W,"aria-haspopup":"listbox","aria-label":B,"aria-labelledby":B?void 0:U,role:"combobox"},I,{"data-reach-combobox-input":"",ref:P,onBlur:l.wrapEvent(E,j),onChange:l.wrapEvent(d,(function(e){q||M(e.target.value)})),onClick:l.wrapEvent(v,(function(){F.current&&(F.current=!1,L.current.select())})),onFocus:l.wrapEvent(C,(function(){i&&(F.current=!0),k&&"SELECT_WITH_CLICK"!==S&&w("FOCUS")})),onKeyDown:l.wrapEvent(f,K),value:Y||""}))})),L=t.forwardRef((function(e,a){var r=e.children,o=e.portal,u=void 0===o||o,i=e.onKeyDown,c=e.onBlur,s=p(e,["children","portal","onKeyDown","onBlur"]),v=t.useContext(R),E=v.inputRef,C=v.isExpanded,b=l.useForkedRef(v.popoverRef,a),T=G(),x=V(),I={"data-reach-combobox-popover":"",onKeyDown:l.wrapEvent(i,T),onBlur:l.wrapEvent(c,x),hidden:!C,tabIndex:-1,children:r};return u?n.createElement(f,Object.assign({},s,{ref:b,position:d.positionMatchWidth,targetRef:E},I)):n.createElement("div",Object.assign({ref:b},s,I))})),_=l.forwardRefWithAs((function(e,a){var r=e.persistSelection,o=void 0!==r&&r,u=e.as,i=void 0===u?"ul":u,l=p(e,["persistSelection","as"]),c=t.useContext(R),s=c.listboxId;return o&&(c.persistSelectionRef.current=!0),n.createElement(i,Object.assign({role:"listbox"},l,{ref:a,"data-reach-combobox-list":"",id:s}))})),w=l.forwardRefWithAs((function(e,a){var r=e.as,o=void 0===r?"li":r,u=e.children,i=e.value,s=e.onClick,v=p(e,["as","children","value","onClick"]),d=t.useContext(R),f=d.onSelect,E=d.data.navigationValue,C=d.transition,b=t.useRef(null),T=l.useForkedRef(a,b),x=c.useDescendant({context:m,element:b.current,value:i}),I=E===i;return n.createElement(N.Provider,{value:{value:i,index:x}},n.createElement(o,Object.assign({"aria-selected":I,role:"option"},v,{"data-reach-combobox-option":"",ref:T,id:String(D(i)),"data-highlighted":I?"":void 0,tabIndex:-1,onClick:l.wrapEvent(s,(function(){f&&f(i),C("SELECT_WITH_CLICK",{value:i})})),children:u||n.createElement(y,null)})))}));function y(){var e=t.useContext(N).value,a=t.useContext(R).data.value,r=t.useMemo((function(){return s.findAll({searchWords:k(a||"").split(/\s+/),textToHighlight:e})}),[a,e]);return n.createElement(n.Fragment,null,r.length?r.map((function(t,a){var r=e.slice(t.start,t.end);return n.createElement("span",{key:a,"data-user-value":!!t.highlight||void 0,"data-suggested-value":!t.highlight||void 0},r)})):e)}var H=l.forwardRefWithAs((function(e,a){var r=e.as,o=void 0===r?"button":r,u=e.onClick,i=e.onKeyDown,c=p(e,["as","onClick","onKeyDown"]),s=t.useContext(R),v=s.transition,d=s.state,f=s.listboxId,E=s.isExpanded,b=l.useForkedRef(s.buttonRef,a),T=G();return n.createElement(o,Object.assign({"aria-controls":f,"aria-haspopup":"listbox","aria-expanded":E},c,{"data-reach-combobox-button":"",ref:b,onClick:l.wrapEvent(u,(function(){v(d===C?"OPEN_WITH_BUTTON":"CLOSE_WITH_BUTTON")})),onKeyDown:l.wrapEvent(i,T)}))}));function G(){var e=t.useContext(R),n=e.data.navigationValue,a=e.onSelect,r=e.state,o=e.transition,u=e.autocompletePropRef,i=e.persistSelectionRef,l=t.useContext(m).descendants;return function(e){var t=l.findIndex((function(e){return e.value===n}));function c(){return l[0]}function s(){return l[l.length-1]}switch(e.key){case"ArrowDown":if(e.preventDefault(),!l||!l.length)return;if(r===C)o("NAVIGATE",{persistSelection:i.current});else{var v=t===l.length-1?u.current?null:c():l[(t+1)%l.length];o("NAVIGATE",{value:v?v.value:null})}break;case"ArrowUp":if(e.preventDefault(),!l||0===l.length)return;if(r===C)o("NAVIGATE");else{var d=0===t?u.current?null:s():-1===t?s():l[(t-1+l.length)%l.length];o("NAVIGATE",{value:d?d.value:null})}break;case"Home":case"PageUp":if(e.preventDefault(),!l||0===l.length)return;r===C?o("NAVIGATE"):o("NAVIGATE",{value:c().value});break;case"End":case"PageDown":if(e.preventDefault(),!l||0===l.length)return;r===C?o("NAVIGATE"):o("NAVIGATE",{value:s().value});break;case"Escape":r!==C&&o("ESCAPE");break;case"Enter":r===T&&null!==n&&(e.preventDefault(),a&&a(n),o("SELECT_WITH_KEYBOARD"))}}}function V(){var e=t.useContext(R),n=e.state,a=e.transition,r=e.popoverRef,o=e.inputRef,u=e.buttonRef;return function(){var e=l.getOwnerDocument(o.current)||document;requestAnimationFrame((function(){e.activeElement!==o.current&&e.activeElement!==u.current&&r.current&&(r.current.contains(e.activeElement)?n!==x&&a("INTERACT"):a("BLUR"))}))}}var D=function(e){var t=0;if(0===e.length)return t;for(var n=0;n<e.length;n++)t=(t<<5)-t+e.charCodeAt(n),t&=t;return t};function k(e){return String(e).replace(/([.*+?=^!:${}()|[\]/\\])/g,"\\$1")}exports.Combobox=O,exports.ComboboxButton=H,exports.ComboboxInput=S,exports.ComboboxList=_,exports.ComboboxOption=w,exports.ComboboxOptionText=y,exports.ComboboxPopover=L,exports.escapeRegexp=k,exports.useComboboxContext=function(){var e=t.useContext(R),n=e.isExpanded,a=e.comboboxId;return t.useMemo((function(){return{id:a,isExpanded:n}}),[a,n])};
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react"),n=e(t);require("prop-types");var a,r,o,i,u,l=require("@reach/utils"),c=require("@reach/descendants"),s=require("highlight-words-core"),v=require("@reach/auto-id"),d=require("@reach/popover"),f=e(d);function E(){return(E=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e}).apply(this,arguments)}function p(e,t){if(null==e)return{};var n,a,r={},o=Object.keys(e);for(a=0;a<o.length;a++)t.indexOf(n=o[a])>=0||(r[n]=e[n]);return r}var C="IDLE",b="SUGGESTING",T="NAVIGATING",x="INTERACTING",I={initial:C,states:(u={},u.IDLE={on:(a={},a.BLUR=C,a.CLEAR=C,a.CHANGE=b,a.INITIAL_CHANGE=C,a.FOCUS=b,a.NAVIGATE=T,a.OPEN_WITH_BUTTON=b,a)},u[b]={on:(r={},r.CHANGE=b,r.FOCUS=b,r.NAVIGATE=T,r.CLEAR=C,r.ESCAPE=C,r.BLUR=C,r.SELECT_WITH_CLICK=C,r.INTERACT=x,r.CLOSE_WITH_BUTTON=C,r)},u[T]={on:(o={},o.CHANGE=b,o.FOCUS=b,o.CLEAR=C,o.BLUR=C,o.ESCAPE=C,o.NAVIGATE=T,o.SELECT_WITH_CLICK=C,o.SELECT_WITH_KEYBOARD=C,o.CLOSE_WITH_BUTTON=C,o.INTERACT=x,o)},u[x]={on:(i={},i.CLEAR=C,i.CHANGE=b,i.FOCUS=b,i.BLUR=C,i.ESCAPE=C,i.NAVIGATE=T,i.CLOSE_WITH_BUTTON=C,i.SELECT_WITH_CLICK=C,i)},u)},A=function(e,t){var n=E(E({},e),{},{lastEventType:t.type});switch(t.type){case"CHANGE":case"INITIAL_CHANGE":return E(E({},n),{},{navigationValue:null,value:t.value});case"NAVIGATE":case"OPEN_WITH_BUTTON":return E(E({},n),{},{navigationValue:g(n,t)});case"CLEAR":return E(E({},n),{},{value:"",navigationValue:null});case"BLUR":case"ESCAPE":return E(E({},n),{},{navigationValue:null});case"SELECT_WITH_CLICK":return E(E({},n),{},{value:t.value,navigationValue:null});case"SELECT_WITH_KEYBOARD":return E(E({},n),{},{value:e.navigationValue,navigationValue:null});case"CLOSE_WITH_BUTTON":return E(E({},n),{},{navigationValue:null});case"INTERACT":return n;case"FOCUS":return E(E({},n),{},{navigationValue:g(n,t)});default:return n}};function h(e){return[b,T,x].includes(e)}function g(e,t){return t.value?t.value:t.persistSelection?e.value:null}var m=c.createDescendantContext("ComboboxDescendantContext"),R=l.createNamedContext("ComboboxContext",{}),N=l.createNamedContext("OptionContext",{}),O=l.forwardRefWithAs((function(e,a){var r=e.onSelect,o=e.openOnFocus,i=void 0!==o&&o,u=e.children,s=e.as,d=void 0===s?"div":s,f=e["aria-label"],C=e["aria-labelledby"],b=p(e,["onSelect","openOnFocus","children","as","aria-label","aria-labelledby"]),T=c.useDescendantsInit(),x=T[0],g=T[1],N=t.useRef(),O=t.useRef(),S=t.useRef(),L=t.useRef(),_=t.useRef(),w=function(e,n,a){var r=t.useState(e.initial),o=r[0],i=r[1],u=t.useReducer(n,{value:"",navigationValue:null}),l=u[1];return[o,u[0],function(t,n){void 0===n&&(n={});var a=e.states[o],r=a&&a.on[t];if(r)return l(E({type:t,state:o,nextState:o},n)),void i(r)}]}(I,A),y=w[0],H=w[1],G=w[2];!function(e,t){l.useIsomorphicLayoutEffect((function(){"NAVIGATE"!==e&&"ESCAPE"!==e&&"SELECT_WITH_CLICK"!==e&&"OPEN_WITH_BUTTON"!==e||t.current.focus()}),[t,e])}(H.lastEventType,N);var D=v.useId(b.id),V=D?l.makeId("listbox",D):"listbox",k={ariaLabel:f,ariaLabelledby:C,autocompletePropRef:L,buttonRef:S,comboboxId:D,data:H,inputRef:N,isExpanded:h(y),listboxId:V,onSelect:r||l.noop,openOnFocus:i,persistSelectionRef:_,popoverRef:O,state:y,transition:G};return t.useEffect((function(){return l.checkStyles("combobox")}),[]),n.createElement(c.DescendantProvider,{context:m,items:x,set:g},n.createElement(R.Provider,{value:k},n.createElement(d,Object.assign({},b,{"data-reach-combobox":"",ref:a}),l.isFunction(u)?u({id:D,isExpanded:h(y)}):u)))})),S=l.forwardRefWithAs((function(e,a){var r=e.as,o=void 0===r?"input":r,i=e.selectOnClick,u=void 0!==i&&i,c=e.autocomplete,s=void 0===c||c,v=e.onClick,d=e.onChange,f=e.onKeyDown,E=e.onBlur,C=e.onFocus,b=e.value,I=p(e,["as","selectOnClick","autocomplete","onClick","onChange","onKeyDown","onBlur","onFocus","value"]),A=t.useRef(b).current,h=t.useRef(!1);l.useUpdateEffect((function(){h.current=!0}),[b]);var g=t.useContext(R),m=g.data,N=m.navigationValue,O=m.value,S=m.lastEventType,L=g.inputRef,_=g.state,w=g.transition,y=g.listboxId,H=g.autocompletePropRef,k=g.openOnFocus,W=g.isExpanded,B=g.ariaLabel,U=g.ariaLabelledby,P=l.useForkedRef(L,a),F=t.useRef(!1),K=G(),j=D(),q=null!=b;l.useIsomorphicLayoutEffect((function(){H.current=s}),[s,H]);var M=t.useCallback((function(e){""===e.trim()?w("CLEAR"):w(e!==A||h.current?"CHANGE":"INITIAL_CHANGE",{value:e})}),[A,w]);t.useEffect((function(){!q||b===O||""===b.trim()&&""===(O||"").trim()||M(b)}),[b,M,q,O]);var Y=!s||_!==T&&_!==x?b||O:N||b||O;return n.createElement(o,Object.assign({"aria-activedescendant":N?String(V(N)):void 0,"aria-autocomplete":"both","aria-controls":y,"aria-expanded":W,"aria-haspopup":"listbox","aria-label":B,"aria-labelledby":B?void 0:U,role:"combobox"},I,{"data-reach-combobox-input":"",ref:P,onBlur:l.wrapEvent(E,j),onChange:l.wrapEvent(d,(function(e){q||M(e.target.value)})),onClick:l.wrapEvent(v,(function(){F.current&&(F.current=!1,L.current.select())})),onFocus:l.wrapEvent(C,(function(){u&&(F.current=!0),k&&"SELECT_WITH_CLICK"!==S&&w("FOCUS")})),onKeyDown:l.wrapEvent(f,K),value:Y||""}))})),L=t.forwardRef((function(e,a){var r=e.children,o=e.portal,i=void 0===o||o,u=e.onKeyDown,c=e.onBlur,s=p(e,["children","portal","onKeyDown","onBlur"]),v=t.useContext(R),E=v.inputRef,C=v.isExpanded,b=l.useForkedRef(v.popoverRef,a),T=G(),x=D(),I={"data-reach-combobox-popover":"",onKeyDown:l.wrapEvent(u,T),onBlur:l.wrapEvent(c,x),hidden:!C,tabIndex:-1,children:r};return i?n.createElement(f,Object.assign({},s,{ref:b,position:d.positionMatchWidth,targetRef:E},I)):n.createElement("div",Object.assign({ref:b},s,I))})),_=l.forwardRefWithAs((function(e,a){var r=e.persistSelection,o=void 0!==r&&r,i=e.as,u=void 0===i?"ul":i,l=p(e,["persistSelection","as"]),c=t.useContext(R),s=c.listboxId;return o&&(c.persistSelectionRef.current=!0),n.createElement(u,Object.assign({role:"listbox"},l,{ref:a,"data-reach-combobox-list":"",id:s}))})),w=l.forwardRefWithAs((function(e,a){var r=e.as,o=void 0===r?"li":r,i=e.children,u=e.value,s=e.onClick,v=p(e,["as","children","value","onClick"]),d=t.useContext(R),f=d.onSelect,E=d.data.navigationValue,C=d.transition,b=t.useRef(null),T=l.useForkedRef(a,b),x=c.useDescendant({element:b.current,value:u},m),I=E===u;return n.createElement(N.Provider,{value:{value:u,index:x}},n.createElement(o,Object.assign({"aria-selected":I,role:"option"},v,{"data-reach-combobox-option":"",ref:T,id:String(V(u)),"data-highlighted":I?"":void 0,tabIndex:-1,onClick:l.wrapEvent(s,(function(){f&&f(u),C("SELECT_WITH_CLICK",{value:u})})),children:i||n.createElement(y,null)})))}));function y(){var e=t.useContext(N).value,a=t.useContext(R).data.value,r=t.useMemo((function(){return s.findAll({searchWords:k(a||"").split(/\s+/),textToHighlight:e})}),[a,e]);return n.createElement(n.Fragment,null,r.length?r.map((function(t,a){var r=e.slice(t.start,t.end);return n.createElement("span",{key:a,"data-user-value":!!t.highlight||void 0,"data-suggested-value":!t.highlight||void 0},r)})):e)}var H=l.forwardRefWithAs((function(e,a){var r=e.as,o=void 0===r?"button":r,i=e.onClick,u=e.onKeyDown,c=p(e,["as","onClick","onKeyDown"]),s=t.useContext(R),v=s.transition,d=s.state,f=s.listboxId,E=s.isExpanded,b=l.useForkedRef(s.buttonRef,a),T=G();return n.createElement(o,Object.assign({"aria-controls":f,"aria-haspopup":"listbox","aria-expanded":E},c,{"data-reach-combobox-button":"",ref:b,onClick:l.wrapEvent(i,(function(){v(d===C?"OPEN_WITH_BUTTON":"CLOSE_WITH_BUTTON")})),onKeyDown:l.wrapEvent(u,T)}))}));function G(){var e=t.useContext(R),n=e.data.navigationValue,a=e.onSelect,r=e.state,o=e.transition,i=e.autocompletePropRef,u=e.persistSelectionRef,l=c.useDescendants(m);return function(e){var t=l.findIndex((function(e){return e.value===n}));function c(){return l[0]}function s(){return l[l.length-1]}switch(e.key){case"ArrowDown":if(e.preventDefault(),!l||!l.length)return;if(r===C)o("NAVIGATE",{persistSelection:u.current});else{var v=t===l.length-1?i.current?null:c():l[(t+1)%l.length];o("NAVIGATE",{value:v?v.value:null})}break;case"ArrowUp":if(e.preventDefault(),!l||0===l.length)return;if(r===C)o("NAVIGATE");else{var d=0===t?i.current?null:s():-1===t?s():l[(t-1+l.length)%l.length];o("NAVIGATE",{value:d?d.value:null})}break;case"Home":case"PageUp":if(e.preventDefault(),!l||0===l.length)return;r===C?o("NAVIGATE"):o("NAVIGATE",{value:c().value});break;case"End":case"PageDown":if(e.preventDefault(),!l||0===l.length)return;r===C?o("NAVIGATE"):o("NAVIGATE",{value:s().value});break;case"Escape":r!==C&&o("ESCAPE");break;case"Enter":r===T&&null!==n&&(e.preventDefault(),a&&a(n),o("SELECT_WITH_KEYBOARD"))}}}function D(){var e=t.useContext(R),n=e.state,a=e.transition,r=e.popoverRef,o=e.inputRef,i=e.buttonRef;return function(){var e=l.getOwnerDocument(o.current)||document;requestAnimationFrame((function(){e.activeElement!==o.current&&e.activeElement!==i.current&&r.current&&(r.current.contains(e.activeElement)?n!==x&&a("INTERACT"):a("BLUR"))}))}}var V=function(e){var t=0;if(0===e.length)return t;for(var n=0;n<e.length;n++)t=(t<<5)-t+e.charCodeAt(n),t&=t;return t};function k(e){return String(e).replace(/([.*+?=^!:${}()|[\]/\\])/g,"\\$1")}exports.Combobox=O,exports.ComboboxButton=H,exports.ComboboxInput=S,exports.ComboboxList=_,exports.ComboboxOption=w,exports.ComboboxOptionText=y,exports.ComboboxPopover=L,exports.escapeRegexp=k,exports.useComboboxContext=function(){var e=t.useContext(R),n=e.isExpanded,a=e.comboboxId;return t.useMemo((function(){return{id:a,isExpanded:n}}),[a,n])};
 //# sourceMappingURL=combobox.cjs.production.min.js.map

dist/combobox.esm.js

 import React, { useRef, useEffect, useContext, useCallback, forwardRef, useMemo, useState, useReducer } from 'react';
 import PropTypes from 'prop-types';
 import { forwardRefWithAs, makeId, checkStyles, isFunction, useUpdateEffect, useForkedRef, getOwnerDocument, useIsomorphicLayoutEffect, wrapEvent, createNamedContext, noop } from '@reach/utils';
-import { useDescendants, DescendantProvider, useDescendant, createDescendantContext } from '@reach/descendants';
+import { useDescendantsInit, DescendantProvider, useDescendant, useDescendants, createDescendantContext } from '@reach/descendants';
 import { findAll } from 'highlight-words-core';
@@ -201,5 +201,5 @@ import { useId } from '@reach/auto-id';
 
-  var _useDescendants = useDescendants(),
-      options = _useDescendants[0],
-      setOptions = _useDescendants[1]; // Need this to focus it
+  var _useDescendantsInit = useDescendantsInit(),
+      options = _useDescendantsInit[0],
+      setOptions = _useDescendantsInit[1]; // Need this to focus it
 
@@ -536,6 +536,5 @@
   var index = useDescendant({
-    context: ComboboxDescendantContext,
     element: ownRef.current,
     value: value
-  });
+  }, ComboboxDescendantContext);
   var isActive = navigationValue === value;
@@ -703,5 +702,3 @@
 
-  var _useContext9 = useContext(ComboboxDescendantContext),
-      options = _useContext9.descendants;
-
+  var options = useDescendants(ComboboxDescendantContext);
   return function handleKeyDown(event) {
@@ -864,8 +861,8 @@ var index = options.findIndex(function (_ref7) {
 function useBlur() {
-  var _useContext10 = useContext(ComboboxContext),
-      state = _useContext10.state,
-      transition = _useContext10.transition,
-      popoverRef = _useContext10.popoverRef,
-      inputRef = _useContext10.inputRef,
-      buttonRef = _useContext10.buttonRef;
+  var _useContext9 = useContext(ComboboxContext),
+      state = _useContext9.state,
+      transition = _useContext9.transition,
+      popoverRef = _useContext9.popoverRef,
+      inputRef = _useContext9.inputRef,
+      buttonRef = _useContext9.buttonRef;
 
@@ -978,5 +975,5 @@ return function handleBlur() {
 function useComboboxContext() {
-  var _useContext11 = useContext(ComboboxContext),
-      isExpanded = _useContext11.isExpanded,
-      comboboxId = _useContext11.comboboxId;
+  var _useContext10 = useContext(ComboboxContext),
+      isExpanded = _useContext10.isExpanded,
+      comboboxId = _useContext10.comboboxId;
 
@@ -983,0 +980,0 @@ return useMemo(function () {

package.json

 {
   "name": "@reach/combobox",
-  "version": "0.10.2",
+  "version": "0.10.3",
   "description": "Accessible React Combobox (Autocomplete).",
@@ -16,7 +16,7 @@ "author": "React Training <[e-mail]>",
   "dependencies": {
-    "@reach/auto-id": "^0.10.2",
-    "@reach/descendants": "^0.10.2",
-    "@reach/popover": "^0.10.2",
-    "@reach/portal": "^0.10.2",
-    "@reach/utils": "^0.10.2",
+    "@reach/auto-id": "^0.10.3",
+    "@reach/descendants": "^0.10.3",
+    "@reach/popover": "^0.10.3",
+    "@reach/portal": "^0.10.3",
+    "@reach/utils": "^0.10.3",
     "highlight-words-core": "1.2.2",
@@ -38,3 +38,3 @@ "prop-types": "^15.7.2",
   ],
-  "gitHead": "9e4b9adab7fd3085b1fb4b54882a2231308b7416"
+  "gitHead": "fd32b2b31a3e50265b0c274654a5e4105847d18e"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

253100

increased by0.01%

Worsened metrics

Lines of code

1988

decreased by-0.2%

Dependency changes

• Updated@reach/auto-id@^0.10.3

• Updated@reach/descendants@^0.10.3

• Updated@reach/popover@^0.10.3

• Updated@reach/portal@^0.10.3

• Updated@reach/utils@^0.10.3