blowfish/node_modules/@headlessui/react/dist/components/combobox/combobox.js
2023-01-29 22:30:24 +00:00

1 line
14 KiB
JavaScript

import q,{Fragment as ce,createContext as le,createRef as fe,useCallback as me,useContext as ie,useMemo as D,useReducer as Te,useRef as E,useEffect as xe}from"react";import{useComputed as z}from'../../hooks/use-computed.js';import{useDisposables as ee}from'../../hooks/use-disposables.js';import{useEvent as g}from'../../hooks/use-event.js';import{useId as W}from'../../hooks/use-id.js';import{useIsoMorphicEffect as F}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as ge}from'../../hooks/use-latest-value.js';import{useOutsideClick as Oe}from'../../hooks/use-outside-click.js';import{useResolveButtonType as Ce}from'../../hooks/use-resolve-button-type.js';import{useSyncRefs as X}from'../../hooks/use-sync-refs.js';import{useTreeWalker as Re}from'../../hooks/use-tree-walker.js';import{calculateActiveIndex as ve,Focus as y}from'../../utils/calculate-active-index.js';import{disposables as ue}from'../../utils/disposables.js';import{forwardRefWithAs as w,render as B,compact as ye,Features as pe}from'../../utils/render.js';import{isDisabledReactIssue7711 as Se}from'../../utils/bugs.js';import{match as U}from'../../utils/match.js';import{objectToFormEntries as Ae}from'../../utils/form.js';import{sortByDomNode as Pe}from'../../utils/focus-management.js';import{Hidden as Ee,Features as Ie}from'../../internal/hidden.js';import{useOpenClosed as Le,State as oe,OpenClosedProvider as De}from'../../internal/open-closed.js';import{Keys as S}from'../keyboard.js';import{useControllable as Ve}from'../../hooks/use-controllable.js';import{useWatch as Me}from'../../hooks/use-watch.js';import{useTrackedPointer as he}from'../../hooks/use-tracked-pointer.js';var Fe=(n=>(n[n.Open=0]="Open",n[n.Closed=1]="Closed",n))(Fe||{}),_e=(n=>(n[n.Single=0]="Single",n[n.Multi=1]="Multi",n))(_e||{}),ke=(n=>(n[n.Pointer=0]="Pointer",n[n.Other=1]="Other",n))(ke||{}),we=(l=>(l[l.OpenCombobox=0]="OpenCombobox",l[l.CloseCombobox=1]="CloseCombobox",l[l.GoToOption=2]="GoToOption",l[l.RegisterOption=3]="RegisterOption",l[l.UnregisterOption=4]="UnregisterOption",l[l.RegisterLabel=5]="RegisterLabel",l))(we||{});function te(t,r=n=>n){let n=t.activeOptionIndex!==null?t.options[t.activeOptionIndex]:null,o=Pe(r(t.options.slice()),i=>i.dataRef.current.domRef.current),a=n?o.indexOf(n):null;return a===-1&&(a=null),{options:o,activeOptionIndex:a}}let Be={[1](t){return t.dataRef.current.disabled||t.comboboxState===1?t:{...t,activeOptionIndex:null,comboboxState:1}},[0](t){if(t.dataRef.current.disabled||t.comboboxState===0)return t;let r=t.activeOptionIndex,{isSelected:n}=t.dataRef.current,o=t.options.findIndex(a=>n(a.dataRef.current.value));return o!==-1&&(r=o),{...t,comboboxState:0,activeOptionIndex:r}},[2](t,r){var a;if(t.dataRef.current.disabled||t.dataRef.current.optionsRef.current&&!t.dataRef.current.optionsPropsRef.current.static&&t.comboboxState===1)return t;let n=te(t);if(n.activeOptionIndex===null){let i=n.options.findIndex(l=>!l.dataRef.current.disabled);i!==-1&&(n.activeOptionIndex=i)}let o=ve(r,{resolveItems:()=>n.options,resolveActiveIndex:()=>n.activeOptionIndex,resolveId:i=>i.id,resolveDisabled:i=>i.dataRef.current.disabled});return{...t,...n,activeOptionIndex:o,activationTrigger:(a=r.trigger)!=null?a:1}},[3]:(t,r)=>{let n={id:r.id,dataRef:r.dataRef},o=te(t,i=>[...i,n]);t.activeOptionIndex===null&&t.dataRef.current.isSelected(r.dataRef.current.value)&&(o.activeOptionIndex=o.options.indexOf(n));let a={...t,...o,activationTrigger:1};return t.dataRef.current.__demoMode&&t.dataRef.current.value===void 0&&(a.activeOptionIndex=0),a},[4]:(t,r)=>{let n=te(t,o=>{let a=o.findIndex(i=>i.id===r.id);return a!==-1&&o.splice(a,1),o});return{...t,...n,activationTrigger:1}},[5]:(t,r)=>({...t,labelId:r.id})},ne=le(null);ne.displayName="ComboboxActionsContext";function $(t){let r=ie(ne);if(r===null){let n=new Error(`<${t} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(n,$),n}return r}let re=le(null);re.displayName="ComboboxDataContext";function G(t){let r=ie(re);if(r===null){let n=new Error(`<${t} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(n,G),n}return r}function Ue(t,r){return U(r.type,Be,t,r)}let Ge=ce;function Ne(t,r){let{value:n,defaultValue:o,onChange:a,name:i,by:l=(b,T)=>b===T,disabled:d=!1,__demoMode:f=!1,nullable:e=!1,multiple:p=!1,...A}=t,[s=p?[]:void 0,R]=Ve(n,a,o),[v,c]=Te(Ue,{dataRef:fe(),comboboxState:f?0:1,options:[],activeOptionIndex:null,activationTrigger:1,labelId:null}),x=E(!1),C=E({static:!1,hold:!1}),N=E(null),V=E(null),_=E(null),k=E(null),I=g(typeof l=="string"?(b,T)=>{let P=l;return(b==null?void 0:b[P])===(T==null?void 0:T[P])}:l),H=me(b=>U(m.mode,{[1]:()=>s.some(T=>I(T,b)),[0]:()=>I(s,b)}),[s]),m=D(()=>({...v,optionsPropsRef:C,labelRef:N,inputRef:V,buttonRef:_,optionsRef:k,value:s,defaultValue:o,disabled:d,mode:p?1:0,get activeOptionIndex(){if(x.current&&v.activeOptionIndex===null&&v.options.length>0){let b=v.options.findIndex(T=>!T.dataRef.current.disabled);if(b!==-1)return b}return v.activeOptionIndex},compare:I,isSelected:H,nullable:e,__demoMode:f}),[s,o,d,p,e,f,v]);F(()=>{v.dataRef.current=m},[m]),Oe([m.buttonRef,m.inputRef,m.optionsRef],()=>Z.closeCombobox(),m.comboboxState===0);let M=D(()=>({open:m.comboboxState===0,disabled:d,activeIndex:m.activeOptionIndex,activeOption:m.activeOptionIndex===null?null:m.options[m.activeOptionIndex].dataRef.current.value,value:s}),[m,d,s]),h=g(b=>{let T=m.options.find(P=>P.id===b);!T||j(T.dataRef.current.value)}),O=g(()=>{if(m.activeOptionIndex!==null){let{dataRef:b,id:T}=m.options[m.activeOptionIndex];j(b.current.value),Z.goToOption(y.Specific,T)}}),u=g(()=>{c({type:0}),x.current=!0}),L=g(()=>{c({type:1}),x.current=!1}),Q=g((b,T,P)=>(x.current=!1,b===y.Specific?c({type:2,focus:y.Specific,id:T,trigger:P}):c({type:2,focus:b,trigger:P}))),Y=g((b,T)=>(c({type:3,id:b,dataRef:T}),()=>c({type:4,id:b}))),se=g(b=>(c({type:5,id:b}),()=>c({type:5,id:null}))),j=g(b=>U(m.mode,{[0](){return R==null?void 0:R(b)},[1](){let T=m.value.slice(),P=T.findIndex(K=>I(K,b));return P===-1?T.push(b):T.splice(P,1),R==null?void 0:R(T)}})),Z=D(()=>({onChange:j,registerOption:Y,registerLabel:se,goToOption:Q,closeCombobox:L,openCombobox:u,selectActiveOption:O,selectOption:h}),[]),de=r===null?{}:{ref:r},J=E(null),be=ee();return xe(()=>{!J.current||o!==void 0&&be.addEventListener(J.current,"reset",()=>{j(o)})},[J,j]),q.createElement(ne.Provider,{value:Z},q.createElement(re.Provider,{value:m},q.createElement(De,{value:U(m.comboboxState,{[0]:oe.Open,[1]:oe.Closed})},i!=null&&s!=null&&Ae({[i]:s}).map(([b,T],P)=>q.createElement(Ee,{features:Ie.Hidden,ref:P===0?K=>{var ae;J.current=(ae=K==null?void 0:K.closest("form"))!=null?ae:null}:void 0,...ye({key:b,as:"input",type:"hidden",hidden:!0,readOnly:!0,name:b,value:T})})),B({ourProps:de,theirProps:A,slot:M,defaultTag:Ge,name:"Combobox"}))))}let He=w(Ne),je="input",Ke=w(function(r,n){var m,M,h,O;let o=W(),{id:a=`headlessui-combobox-input-${o}`,onChange:i,displayValue:l,type:d="text",...f}=r,e=G("Combobox.Input"),p=$("Combobox.Input"),A=X(e.inputRef,n),s=E(!1),R=ee(),v=function(){var u;return typeof l=="function"&&e.value!==void 0?(u=l(e.value))!=null?u:"":typeof e.value=="string"?e.value:""}();Me(([u,L],[Q,Y])=>{s.current||!e.inputRef.current||(Y===0&&L===1||u!==Q)&&(e.inputRef.current.value=u)},[v,e.comboboxState]);let c=E(!1),x=g(()=>{c.current=!0}),C=g(()=>{setTimeout(()=>{c.current=!1})}),N=g(u=>{switch(s.current=!0,u.key){case S.Backspace:case S.Delete:if(e.mode!==0||!e.nullable)return;let L=u.currentTarget;R.requestAnimationFrame(()=>{L.value===""&&(p.onChange(null),e.optionsRef.current&&(e.optionsRef.current.scrollTop=0),p.goToOption(y.Nothing))});break;case S.Enter:if(s.current=!1,e.comboboxState!==0||c.current)return;if(u.preventDefault(),u.stopPropagation(),e.activeOptionIndex===null){p.closeCombobox();return}p.selectActiveOption(),e.mode===0&&p.closeCombobox();break;case S.ArrowDown:return s.current=!1,u.preventDefault(),u.stopPropagation(),U(e.comboboxState,{[0]:()=>{p.goToOption(y.Next)},[1]:()=>{p.openCombobox()}});case S.ArrowUp:return s.current=!1,u.preventDefault(),u.stopPropagation(),U(e.comboboxState,{[0]:()=>{p.goToOption(y.Previous)},[1]:()=>{p.openCombobox(),R.nextFrame(()=>{e.value||p.goToOption(y.Last)})}});case S.Home:if(u.shiftKey)break;return s.current=!1,u.preventDefault(),u.stopPropagation(),p.goToOption(y.First);case S.PageUp:return s.current=!1,u.preventDefault(),u.stopPropagation(),p.goToOption(y.First);case S.End:if(u.shiftKey)break;return s.current=!1,u.preventDefault(),u.stopPropagation(),p.goToOption(y.Last);case S.PageDown:return s.current=!1,u.preventDefault(),u.stopPropagation(),p.goToOption(y.Last);case S.Escape:return s.current=!1,e.comboboxState!==0?void 0:(u.preventDefault(),e.optionsRef.current&&!e.optionsPropsRef.current.static&&u.stopPropagation(),p.closeCombobox());case S.Tab:if(s.current=!1,e.comboboxState!==0)return;e.mode===0&&p.selectActiveOption(),p.closeCombobox();break}}),V=g(u=>{p.openCombobox(),i==null||i(u)}),_=g(()=>{s.current=!1}),k=z(()=>{if(!!e.labelId)return[e.labelId].join(" ")},[e.labelId]),I=D(()=>({open:e.comboboxState===0,disabled:e.disabled}),[e]),H={ref:A,id:a,role:"combobox",type:d,"aria-controls":(m=e.optionsRef.current)==null?void 0:m.id,"aria-expanded":e.disabled?void 0:e.comboboxState===0,"aria-activedescendant":e.activeOptionIndex===null||(M=e.options[e.activeOptionIndex])==null?void 0:M.id,"aria-multiselectable":e.mode===1?!0:void 0,"aria-labelledby":k,defaultValue:(O=(h=r.defaultValue)!=null?h:e.defaultValue!==void 0?l==null?void 0:l(e.defaultValue):null)!=null?O:e.defaultValue,disabled:e.disabled,onCompositionStart:x,onCompositionEnd:C,onKeyDown:N,onChange:V,onBlur:_};return B({ourProps:H,theirProps:f,slot:I,defaultTag:je,name:"Combobox.Input"})}),We="button",Xe=w(function(r,n){var c;let o=G("Combobox.Button"),a=$("Combobox.Button"),i=X(o.buttonRef,n),l=W(),{id:d=`headlessui-combobox-button-${l}`,...f}=r,e=ee(),p=g(x=>{switch(x.key){case S.ArrowDown:return x.preventDefault(),x.stopPropagation(),o.comboboxState===1&&a.openCombobox(),e.nextFrame(()=>{var C;return(C=o.inputRef.current)==null?void 0:C.focus({preventScroll:!0})});case S.ArrowUp:return x.preventDefault(),x.stopPropagation(),o.comboboxState===1&&(a.openCombobox(),e.nextFrame(()=>{o.value||a.goToOption(y.Last)})),e.nextFrame(()=>{var C;return(C=o.inputRef.current)==null?void 0:C.focus({preventScroll:!0})});case S.Escape:return o.comboboxState!==0?void 0:(x.preventDefault(),o.optionsRef.current&&!o.optionsPropsRef.current.static&&x.stopPropagation(),a.closeCombobox(),e.nextFrame(()=>{var C;return(C=o.inputRef.current)==null?void 0:C.focus({preventScroll:!0})}));default:return}}),A=g(x=>{if(Se(x.currentTarget))return x.preventDefault();o.comboboxState===0?a.closeCombobox():(x.preventDefault(),a.openCombobox()),e.nextFrame(()=>{var C;return(C=o.inputRef.current)==null?void 0:C.focus({preventScroll:!0})})}),s=z(()=>{if(!!o.labelId)return[o.labelId,d].join(" ")},[o.labelId,d]),R=D(()=>({open:o.comboboxState===0,disabled:o.disabled,value:o.value}),[o]),v={ref:i,id:d,type:Ce(r,o.buttonRef),tabIndex:-1,"aria-haspopup":"listbox","aria-controls":(c=o.optionsRef.current)==null?void 0:c.id,"aria-expanded":o.disabled?void 0:o.comboboxState===0,"aria-labelledby":s,disabled:o.disabled,onClick:A,onKeyDown:p};return B({ourProps:v,theirProps:f,slot:R,defaultTag:We,name:"Combobox.Button"})}),$e="label",Je=w(function(r,n){let o=W(),{id:a=`headlessui-combobox-label-${o}`,...i}=r,l=G("Combobox.Label"),d=$("Combobox.Label"),f=X(l.labelRef,n);F(()=>d.registerLabel(a),[a]);let e=g(()=>{var s;return(s=l.inputRef.current)==null?void 0:s.focus({preventScroll:!0})}),p=D(()=>({open:l.comboboxState===0,disabled:l.disabled}),[l]);return B({ourProps:{ref:f,id:a,onClick:e},theirProps:i,slot:p,defaultTag:$e,name:"Combobox.Label"})}),qe="ul",Qe=pe.RenderStrategy|pe.Static,Ye=w(function(r,n){var v;let o=W(),{id:a=`headlessui-combobox-options-${o}`,hold:i=!1,...l}=r,d=G("Combobox.Options"),f=X(d.optionsRef,n),e=Le(),p=(()=>e!==null?e===oe.Open:d.comboboxState===0)();F(()=>{var c;d.optionsPropsRef.current.static=(c=r.static)!=null?c:!1},[d.optionsPropsRef,r.static]),F(()=>{d.optionsPropsRef.current.hold=i},[d.optionsPropsRef,i]),Re({container:d.optionsRef.current,enabled:d.comboboxState===0,accept(c){return c.getAttribute("role")==="option"?NodeFilter.FILTER_REJECT:c.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(c){c.setAttribute("role","none")}});let A=z(()=>{var c,x;return(x=d.labelId)!=null?x:(c=d.buttonRef.current)==null?void 0:c.id},[d.labelId,d.buttonRef.current]),s=D(()=>({open:d.comboboxState===0}),[d]),R={"aria-activedescendant":d.activeOptionIndex===null||(v=d.options[d.activeOptionIndex])==null?void 0:v.id,"aria-labelledby":A,role:"listbox",id:a,ref:f};return B({ourProps:R,theirProps:l,slot:s,defaultTag:qe,features:Qe,visible:p,name:"Combobox.Options"})}),Ze="li",ze=w(function(r,n){var M,h;let o=W(),{id:a=`headlessui-combobox-option-${o}`,disabled:i=!1,value:l,...d}=r,f=G("Combobox.Option"),e=$("Combobox.Option"),p=f.activeOptionIndex!==null?f.options[f.activeOptionIndex].id===a:!1,A=f.isSelected(l),s=E(null),R=ge({disabled:i,value:l,domRef:s,textValue:(h=(M=s.current)==null?void 0:M.textContent)==null?void 0:h.toLowerCase()}),v=X(n,s),c=g(()=>e.selectOption(a));F(()=>e.registerOption(a,R),[R,a]);let x=E(!f.__demoMode);F(()=>{if(!f.__demoMode)return;let O=ue();return O.requestAnimationFrame(()=>{x.current=!0}),O.dispose},[]),F(()=>{if(f.comboboxState!==0||!p||!x.current||f.activationTrigger===0)return;let O=ue();return O.requestAnimationFrame(()=>{var u,L;(L=(u=s.current)==null?void 0:u.scrollIntoView)==null||L.call(u,{block:"nearest"})}),O.dispose},[s,p,f.comboboxState,f.activationTrigger,f.activeOptionIndex]);let C=g(O=>{if(i)return O.preventDefault();c(),f.mode===0&&e.closeCombobox()}),N=g(()=>{if(i)return e.goToOption(y.Nothing);e.goToOption(y.Specific,a)}),V=he(),_=g(O=>V.update(O)),k=g(O=>{!V.wasMoved(O)||i||p||e.goToOption(y.Specific,a,0)}),I=g(O=>{!V.wasMoved(O)||i||!p||f.optionsPropsRef.current.hold||e.goToOption(y.Nothing)}),H=D(()=>({active:p,selected:A,disabled:i}),[p,A,i]);return B({ourProps:{id:a,ref:v,role:"option",tabIndex:i===!0?void 0:-1,"aria-disabled":i===!0?!0:void 0,"aria-selected":A,disabled:void 0,onClick:C,onFocus:N,onPointerEnter:_,onMouseEnter:_,onPointerMove:k,onMouseMove:k,onPointerLeave:I,onMouseLeave:I},theirProps:d,slot:H,defaultTag:Ze,name:"Combobox.Option"})}),ko=Object.assign(He,{Input:Ke,Button:Xe,Label:Je,Options:Ye,Option:ze});export{ko as Combobox};