@headlessui/react
Advanced tools
Comparing version 1.7.14 to 1.7.17
@@ -1,1 +0,1 @@ | ||
import z,{Fragment as xe,createContext as ue,createRef as Ce,useCallback as Oe,useContext as pe,useEffect as se,useMemo as D,useReducer as ge,useRef as A}from"react";import{useComputed as te}from'../../hooks/use-computed.js';import{useDisposables as ne}from'../../hooks/use-disposables.js';import{useEvent as C}from'../../hooks/use-event.js';import{useId as K}from'../../hooks/use-id.js';import{useIsoMorphicEffect as _}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as ye}from'../../hooks/use-latest-value.js';import{useOutsideClick as Re}from'../../hooks/use-outside-click.js';import{useResolveButtonType as ve}from'../../hooks/use-resolve-button-type.js';import{useSyncRefs as W}from'../../hooks/use-sync-refs.js';import{useTreeWalker as Pe}from'../../hooks/use-tree-walker.js';import{calculateActiveIndex as Ae,Focus as y}from'../../utils/calculate-active-index.js';import{disposables as be}from'../../utils/disposables.js';import{forwardRefWithAs as w,render as U,compact as Ee,Features as de}from'../../utils/render.js';import{isDisabledReactIssue7711 as Se}from'../../utils/bugs.js';import{match as N}from'../../utils/match.js';import{objectToFormEntries as Ie}from'../../utils/form.js';import{sortByDomNode as Le}from'../../utils/focus-management.js';import{Hidden as Ve,Features as De}from'../../internal/hidden.js';import{useOpenClosed as Fe,State as ee,OpenClosedProvider as Me}from'../../internal/open-closed.js';import{Keys as v}from'../keyboard.js';import{useControllable as _e}from'../../hooks/use-controllable.js';import{useWatch as fe}from'../../hooks/use-watch.js';import{useTrackedPointer as he}from'../../hooks/use-tracked-pointer.js';import{isMobile as Be}from'../../utils/platform.js';var ke=(e=>(e[e.Open=0]="Open",e[e.Closed=1]="Closed",e))(ke||{}),we=(e=>(e[e.Single=0]="Single",e[e.Multi=1]="Multi",e))(we||{}),Ue=(e=>(e[e.Pointer=0]="Pointer",e[e.Other=1]="Other",e))(Ue||{}),Ne=(n=>(n[n.OpenCombobox=0]="OpenCombobox",n[n.CloseCombobox=1]="CloseCombobox",n[n.GoToOption=2]="GoToOption",n[n.RegisterOption=3]="RegisterOption",n[n.UnregisterOption=4]="UnregisterOption",n[n.RegisterLabel=5]="RegisterLabel",n))(Ne||{});function re(t,l=e=>e){let e=t.activeOptionIndex!==null?t.options[t.activeOptionIndex]:null,r=Le(l(t.options.slice()),b=>b.dataRef.current.domRef.current),i=e?r.indexOf(e):null;return i===-1&&(i=null),{options:r,activeOptionIndex:i}}let He={[1](t){var l;return(l=t.dataRef.current)!=null&&l.disabled||t.comboboxState===1?t:{...t,activeOptionIndex:null,comboboxState:1}},[0](t){var e;if((e=t.dataRef.current)!=null&&e.disabled||t.comboboxState===0)return t;let l=t.activeOptionIndex;if(t.dataRef.current){let{isSelected:r}=t.dataRef.current,i=t.options.findIndex(b=>r(b.dataRef.current.value));i!==-1&&(l=i)}return{...t,comboboxState:0,activeOptionIndex:l}},[2](t,l){var i,b,n,d;if((i=t.dataRef.current)!=null&&i.disabled||(b=t.dataRef.current)!=null&&b.optionsRef.current&&!((n=t.dataRef.current)!=null&&n.optionsPropsRef.current.static)&&t.comboboxState===1)return t;let e=re(t);if(e.activeOptionIndex===null){let o=e.options.findIndex(u=>!u.dataRef.current.disabled);o!==-1&&(e.activeOptionIndex=o)}let r=Ae(l,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:o=>o.id,resolveDisabled:o=>o.dataRef.current.disabled});return{...t,...e,activeOptionIndex:r,activationTrigger:(d=l.trigger)!=null?d:1}},[3]:(t,l)=>{var b,n;let e={id:l.id,dataRef:l.dataRef},r=re(t,d=>[...d,e]);t.activeOptionIndex===null&&(b=t.dataRef.current)!=null&&b.isSelected(l.dataRef.current.value)&&(r.activeOptionIndex=r.options.indexOf(e));let i={...t,...r,activationTrigger:1};return(n=t.dataRef.current)!=null&&n.__demoMode&&t.dataRef.current.value===void 0&&(i.activeOptionIndex=0),i},[4]:(t,l)=>{let e=re(t,r=>{let i=r.findIndex(b=>b.id===l.id);return i!==-1&&r.splice(i,1),r});return{...t,...e,activationTrigger:1}},[5]:(t,l)=>({...t,labelId:l.id})},ae=ue(null);ae.displayName="ComboboxActionsContext";function $(t){let l=pe(ae);if(l===null){let e=new Error(`<${t} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,$),e}return l}let le=ue(null);le.displayName="ComboboxDataContext";function H(t){let l=pe(le);if(l===null){let e=new Error(`<${t} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,H),e}return l}function Ge(t,l){return N(l.type,He,t,l)}let Xe=xe;function je(t,l){let{value:e,defaultValue:r,onChange:i,form:b,name:n,by:d=(p,T)=>p===T,disabled:o=!1,__demoMode:u=!1,nullable:P=!1,multiple:f=!1,...E}=t,[c=f?[]:void 0,g]=_e(e,i,r),[m,x]=ge(Ge,{dataRef:Ce(),comboboxState:u?0:1,options:[],activeOptionIndex:null,activationTrigger:1,labelId:null}),L=A(!1),F=A({static:!1,hold:!1}),h=A(null),B=A(null),k=A(null),G=A(null),V=C(typeof d=="string"?(p,T)=>{let R=d;return(p==null?void 0:p[R])===(T==null?void 0:T[R])}:d),M=Oe(p=>N(s.mode,{[1]:()=>c.some(T=>V(T,p)),[0]:()=>V(c,p)}),[c]),s=D(()=>({...m,optionsPropsRef:F,labelRef:h,inputRef:B,buttonRef:k,optionsRef:G,value:c,defaultValue:r,disabled:o,mode:f?1:0,get activeOptionIndex(){if(L.current&&m.activeOptionIndex===null&&m.options.length>0){let p=m.options.findIndex(T=>!T.dataRef.current.disabled);if(p!==-1)return p}return m.activeOptionIndex},compare:V,isSelected:M,nullable:P,__demoMode:u}),[c,r,o,f,P,u,m]),O=A(s.activeOptionIndex!==null?s.options[s.activeOptionIndex]:null);se(()=>{let p=s.activeOptionIndex!==null?s.options[s.activeOptionIndex]:null;O.current!==p&&(O.current=p)}),_(()=>{m.dataRef.current=s},[s]),Re([s.buttonRef,s.inputRef,s.optionsRef],()=>oe.closeCombobox(),s.comboboxState===0);let a=D(()=>({open:s.comboboxState===0,disabled:o,activeIndex:s.activeOptionIndex,activeOption:s.activeOptionIndex===null?null:s.options[s.activeOptionIndex].dataRef.current.value,value:c}),[s,o,c]),I=C(p=>{let T=s.options.find(R=>R.id===p);T&&j(T.dataRef.current.value)}),S=C(()=>{if(s.activeOptionIndex!==null){let{dataRef:p,id:T}=s.options[s.activeOptionIndex];j(p.current.value),oe.goToOption(y.Specific,T)}}),X=C(()=>{x({type:0}),L.current=!0}),q=C(()=>{x({type:1}),L.current=!1}),Q=C((p,T,R)=>(L.current=!1,p===y.Specific?x({type:2,focus:y.Specific,id:T,trigger:R}):x({type:2,focus:p,trigger:R}))),Y=C((p,T)=>(x({type:3,id:p,dataRef:T}),()=>{var R;((R=O.current)==null?void 0:R.id)===p&&(L.current=!0),x({type:4,id:p})})),ce=C(p=>(x({type:5,id:p}),()=>x({type:5,id:null}))),j=C(p=>N(s.mode,{[0](){return g==null?void 0:g(p)},[1](){let T=s.value.slice(),R=T.findIndex(J=>V(J,p));return R===-1?T.push(p):T.splice(R,1),g==null?void 0:g(T)}})),oe=D(()=>({onChange:j,registerOption:Y,registerLabel:ce,goToOption:Q,closeCombobox:q,openCombobox:X,selectActiveOption:S,selectOption:I}),[]),Te=l===null?{}:{ref:l},Z=A(null),me=ne();return se(()=>{Z.current&&r!==void 0&&me.addEventListener(Z.current,"reset",()=>{j(r)})},[Z,j]),z.createElement(ae.Provider,{value:oe},z.createElement(le.Provider,{value:s},z.createElement(Me,{value:N(s.comboboxState,{[0]:ee.Open,[1]:ee.Closed})},n!=null&&c!=null&&Ie({[n]:c}).map(([p,T],R)=>z.createElement(Ve,{features:De.Hidden,ref:R===0?J=>{var ie;Z.current=(ie=J==null?void 0:J.closest("form"))!=null?ie:null}:void 0,...Ee({key:p,as:"input",type:"hidden",hidden:!0,readOnly:!0,form:b,name:p,value:T})})),U({ourProps:Te,theirProps:E,slot:a,defaultTag:Xe,name:"Combobox"}))))}let Je="input";function Ke(t,l){var V,M,s,O;let e=K(),{id:r=`headlessui-combobox-input-${e}`,onChange:i,displayValue:b,type:n="text",...d}=t,o=H("Combobox.Input"),u=$("Combobox.Input"),P=W(o.inputRef,l),f=A(!1),E=ne(),c=function(){var a;return typeof b=="function"&&o.value!==void 0?(a=b(o.value))!=null?a:"":typeof o.value=="string"?o.value:""}();fe(([a,I],[S,X])=>{f.current||o.inputRef.current&&(X===0&&I===1||a!==S)&&(o.inputRef.current.value=a)},[c,o.comboboxState]),fe(([a],[I])=>{if(a===0&&I===1){let S=o.inputRef.current;if(!S)return;let X=S.value,{selectionStart:q,selectionEnd:Q,selectionDirection:Y}=S;S.value="",S.value=X,Y!==null?S.setSelectionRange(q,Q,Y):S.setSelectionRange(q,Q)}},[o.comboboxState]);let g=A(!1),m=C(()=>{g.current=!0}),x=C(()=>{setTimeout(()=>{g.current=!1})}),L=C(a=>{switch(f.current=!0,a.key){case v.Backspace:case v.Delete:if(o.mode!==0||!o.nullable)return;let I=a.currentTarget;E.requestAnimationFrame(()=>{I.value===""&&(u.onChange(null),o.optionsRef.current&&(o.optionsRef.current.scrollTop=0),u.goToOption(y.Nothing))});break;case v.Enter:if(f.current=!1,o.comboboxState!==0||g.current)return;if(a.preventDefault(),a.stopPropagation(),o.activeOptionIndex===null){u.closeCombobox();return}u.selectActiveOption(),o.mode===0&&u.closeCombobox();break;case v.ArrowDown:return f.current=!1,a.preventDefault(),a.stopPropagation(),N(o.comboboxState,{[0]:()=>{u.goToOption(y.Next)},[1]:()=>{u.openCombobox()}});case v.ArrowUp:return f.current=!1,a.preventDefault(),a.stopPropagation(),N(o.comboboxState,{[0]:()=>{u.goToOption(y.Previous)},[1]:()=>{u.openCombobox(),E.nextFrame(()=>{o.value||u.goToOption(y.Last)})}});case v.Home:if(a.shiftKey)break;return f.current=!1,a.preventDefault(),a.stopPropagation(),u.goToOption(y.First);case v.PageUp:return f.current=!1,a.preventDefault(),a.stopPropagation(),u.goToOption(y.First);case v.End:if(a.shiftKey)break;return f.current=!1,a.preventDefault(),a.stopPropagation(),u.goToOption(y.Last);case v.PageDown:return f.current=!1,a.preventDefault(),a.stopPropagation(),u.goToOption(y.Last);case v.Escape:return f.current=!1,o.comboboxState!==0?void 0:(a.preventDefault(),o.optionsRef.current&&!o.optionsPropsRef.current.static&&a.stopPropagation(),u.closeCombobox());case v.Tab:if(f.current=!1,o.comboboxState!==0)return;o.mode===0&&u.selectActiveOption(),u.closeCombobox();break}}),F=C(a=>{u.openCombobox(),i==null||i(a)}),h=C(()=>{f.current=!1}),B=te(()=>{if(o.labelId)return[o.labelId].join(" ")},[o.labelId]),k=D(()=>({open:o.comboboxState===0,disabled:o.disabled}),[o]),G={ref:P,id:r,role:"combobox",type:n,"aria-controls":(V=o.optionsRef.current)==null?void 0:V.id,"aria-expanded":o.disabled?void 0:o.comboboxState===0,"aria-activedescendant":o.activeOptionIndex===null||(M=o.options[o.activeOptionIndex])==null?void 0:M.id,"aria-labelledby":B,"aria-autocomplete":"list",defaultValue:(O=(s=t.defaultValue)!=null?s:o.defaultValue!==void 0?b==null?void 0:b(o.defaultValue):null)!=null?O:o.defaultValue,disabled:o.disabled,onCompositionStart:m,onCompositionEnd:x,onKeyDown:L,onChange:F,onBlur:h};return U({ourProps:G,theirProps:d,slot:k,defaultTag:Je,name:"Combobox.Input"})}let We="button";function $e(t,l){var g;let e=H("Combobox.Button"),r=$("Combobox.Button"),i=W(e.buttonRef,l),b=K(),{id:n=`headlessui-combobox-button-${b}`,...d}=t,o=ne(),u=C(m=>{switch(m.key){case v.ArrowDown:return m.preventDefault(),m.stopPropagation(),e.comboboxState===1&&r.openCombobox(),o.nextFrame(()=>{var x;return(x=e.inputRef.current)==null?void 0:x.focus({preventScroll:!0})});case v.ArrowUp:return m.preventDefault(),m.stopPropagation(),e.comboboxState===1&&(r.openCombobox(),o.nextFrame(()=>{e.value||r.goToOption(y.Last)})),o.nextFrame(()=>{var x;return(x=e.inputRef.current)==null?void 0:x.focus({preventScroll:!0})});case v.Escape:return e.comboboxState!==0?void 0:(m.preventDefault(),e.optionsRef.current&&!e.optionsPropsRef.current.static&&m.stopPropagation(),r.closeCombobox(),o.nextFrame(()=>{var x;return(x=e.inputRef.current)==null?void 0:x.focus({preventScroll:!0})}));default:return}}),P=C(m=>{if(Se(m.currentTarget))return m.preventDefault();e.comboboxState===0?r.closeCombobox():(m.preventDefault(),r.openCombobox()),o.nextFrame(()=>{var x;return(x=e.inputRef.current)==null?void 0:x.focus({preventScroll:!0})})}),f=te(()=>{if(e.labelId)return[e.labelId,n].join(" ")},[e.labelId,n]),E=D(()=>({open:e.comboboxState===0,disabled:e.disabled,value:e.value}),[e]),c={ref:i,id:n,type:ve(t,e.buttonRef),tabIndex:-1,"aria-haspopup":"listbox","aria-controls":(g=e.optionsRef.current)==null?void 0:g.id,"aria-expanded":e.disabled?void 0:e.comboboxState===0,"aria-labelledby":f,disabled:e.disabled,onClick:P,onKeyDown:u};return U({ourProps:c,theirProps:d,slot:E,defaultTag:We,name:"Combobox.Button"})}let qe="label";function Qe(t,l){let e=K(),{id:r=`headlessui-combobox-label-${e}`,...i}=t,b=H("Combobox.Label"),n=$("Combobox.Label"),d=W(b.labelRef,l);_(()=>n.registerLabel(r),[r]);let o=C(()=>{var f;return(f=b.inputRef.current)==null?void 0:f.focus({preventScroll:!0})}),u=D(()=>({open:b.comboboxState===0,disabled:b.disabled}),[b]);return U({ourProps:{ref:d,id:r,onClick:o},theirProps:i,slot:u,defaultTag:qe,name:"Combobox.Label"})}let Ye="ul",Ze=de.RenderStrategy|de.Static;function ze(t,l){let e=K(),{id:r=`headlessui-combobox-options-${e}`,hold:i=!1,...b}=t,n=H("Combobox.Options"),d=W(n.optionsRef,l),o=Fe(),u=(()=>o!==null?(o&ee.Open)===ee.Open:n.comboboxState===0)();_(()=>{var c;n.optionsPropsRef.current.static=(c=t.static)!=null?c:!1},[n.optionsPropsRef,t.static]),_(()=>{n.optionsPropsRef.current.hold=i},[n.optionsPropsRef,i]),Pe({container:n.optionsRef.current,enabled:n.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 P=te(()=>{var c,g;return(g=n.labelId)!=null?g:(c=n.buttonRef.current)==null?void 0:c.id},[n.labelId,n.buttonRef.current]),f=D(()=>({open:n.comboboxState===0}),[n]),E={"aria-labelledby":P,role:"listbox","aria-multiselectable":n.mode===1?!0:void 0,id:r,ref:d};return U({ourProps:E,theirProps:b,slot:f,defaultTag:Ye,features:Ze,visible:u,name:"Combobox.Options"})}let eo="li";function oo(t,l){var M,s;let e=K(),{id:r=`headlessui-combobox-option-${e}`,disabled:i=!1,value:b,...n}=t,d=H("Combobox.Option"),o=$("Combobox.Option"),u=d.activeOptionIndex!==null?d.options[d.activeOptionIndex].id===r:!1,P=d.isSelected(b),f=A(null),E=ye({disabled:i,value:b,domRef:f,textValue:(s=(M=f.current)==null?void 0:M.textContent)==null?void 0:s.toLowerCase()}),c=W(l,f),g=C(()=>o.selectOption(r));_(()=>o.registerOption(r,E),[E,r]);let m=A(!d.__demoMode);_(()=>{if(!d.__demoMode)return;let O=be();return O.requestAnimationFrame(()=>{m.current=!0}),O.dispose},[]),_(()=>{if(d.comboboxState!==0||!u||!m.current||d.activationTrigger===0)return;let O=be();return O.requestAnimationFrame(()=>{var a,I;(I=(a=f.current)==null?void 0:a.scrollIntoView)==null||I.call(a,{block:"nearest"})}),O.dispose},[f,u,d.comboboxState,d.activationTrigger,d.activeOptionIndex]);let x=C(O=>{if(i)return O.preventDefault();g(),d.mode===0&&o.closeCombobox(),Be()||requestAnimationFrame(()=>{var a;return(a=d.inputRef.current)==null?void 0:a.focus()})}),L=C(()=>{if(i)return o.goToOption(y.Nothing);o.goToOption(y.Specific,r)}),F=he(),h=C(O=>F.update(O)),B=C(O=>{F.wasMoved(O)&&(i||u||o.goToOption(y.Specific,r,0))}),k=C(O=>{F.wasMoved(O)&&(i||u&&(d.optionsPropsRef.current.hold||o.goToOption(y.Nothing)))}),G=D(()=>({active:u,selected:P,disabled:i}),[u,P,i]);return U({ourProps:{id:r,ref:c,role:"option",tabIndex:i===!0?void 0:-1,"aria-disabled":i===!0?!0:void 0,"aria-selected":P,disabled:void 0,onClick:x,onFocus:L,onPointerEnter:h,onMouseEnter:h,onPointerMove:B,onMouseMove:B,onPointerLeave:k,onMouseLeave:k},theirProps:n,slot:G,defaultTag:eo,name:"Combobox.Option"})}let to=w(je),no=w($e),ro=w(Ke),ao=w(Qe),lo=w(ze),io=w(oo),Wo=Object.assign(to,{Input:ro,Button:no,Label:ao,Options:lo,Option:io});export{Wo as Combobox}; | ||
import ee,{Fragment as xe,createContext as pe,createRef as Ce,useCallback as Oe,useContext as se,useEffect as be,useMemo as M,useReducer as ge,useRef as S}from"react";import{useComputed as ne}from'../../hooks/use-computed.js';import{useDisposables as re}from'../../hooks/use-disposables.js';import{useEvent as x}from'../../hooks/use-event.js';import{useId as Q}from'../../hooks/use-id.js';import{useIsoMorphicEffect as k}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as ye}from'../../hooks/use-latest-value.js';import{useOutsideClick as Re}from'../../hooks/use-outside-click.js';import{useResolveButtonType as ve}from'../../hooks/use-resolve-button-type.js';import{useSyncRefs as Y}from'../../hooks/use-sync-refs.js';import{useTreeWalker as Pe}from'../../hooks/use-tree-walker.js';import{calculateActiveIndex as Ae,Focus as R}from'../../utils/calculate-active-index.js';import{disposables as de}from'../../utils/disposables.js';import{forwardRefWithAs as G,render as X,compact as Ee,Features as fe}from'../../utils/render.js';import{isDisabledReactIssue7711 as Se}from'../../utils/bugs.js';import{match as j}from'../../utils/match.js';import{objectToFormEntries as Ie}from'../../utils/form.js';import{sortByDomNode as Le}from'../../utils/focus-management.js';import{Hidden as Ve,Features as De}from'../../internal/hidden.js';import{useOpenClosed as Fe,State as oe,OpenClosedProvider as Me}from'../../internal/open-closed.js';import{Keys as I}from'../keyboard.js';import{useControllable as _e}from'../../hooks/use-controllable.js';import{useWatch as ce}from'../../hooks/use-watch.js';import{useTrackedPointer as he}from'../../hooks/use-tracked-pointer.js';import{isMobile as Be}from'../../utils/platform.js';import{useOwnerDocument as ke}from'../../hooks/use-owner.js';var we=(e=>(e[e.Open=0]="Open",e[e.Closed=1]="Closed",e))(we||{}),Ue=(e=>(e[e.Single=0]="Single",e[e.Multi=1]="Multi",e))(Ue||{}),Ne=(e=>(e[e.Pointer=0]="Pointer",e[e.Other=1]="Other",e))(Ne||{}),He=(n=>(n[n.OpenCombobox=0]="OpenCombobox",n[n.CloseCombobox=1]="CloseCombobox",n[n.GoToOption=2]="GoToOption",n[n.RegisterOption=3]="RegisterOption",n[n.UnregisterOption=4]="UnregisterOption",n[n.RegisterLabel=5]="RegisterLabel",n))(He||{});function ae(t,a=e=>e){let e=t.activeOptionIndex!==null?t.options[t.activeOptionIndex]:null,r=Le(a(t.options.slice()),b=>b.dataRef.current.domRef.current),l=e?r.indexOf(e):null;return l===-1&&(l=null),{options:r,activeOptionIndex:l}}let Ge={[1](t){var a;return(a=t.dataRef.current)!=null&&a.disabled||t.comboboxState===1?t:{...t,activeOptionIndex:null,comboboxState:1}},[0](t){var e;if((e=t.dataRef.current)!=null&&e.disabled||t.comboboxState===0)return t;let a=t.activeOptionIndex;if(t.dataRef.current){let{isSelected:r}=t.dataRef.current,l=t.options.findIndex(b=>r(b.dataRef.current.value));l!==-1&&(a=l)}return{...t,comboboxState:0,activeOptionIndex:a}},[2](t,a){var l,b,n,d;if((l=t.dataRef.current)!=null&&l.disabled||(b=t.dataRef.current)!=null&&b.optionsRef.current&&!((n=t.dataRef.current)!=null&&n.optionsPropsRef.current.static)&&t.comboboxState===1)return t;let e=ae(t);if(e.activeOptionIndex===null){let o=e.options.findIndex(i=>!i.dataRef.current.disabled);o!==-1&&(e.activeOptionIndex=o)}let r=Ae(a,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:o=>o.id,resolveDisabled:o=>o.dataRef.current.disabled});return{...t,...e,activeOptionIndex:r,activationTrigger:(d=a.trigger)!=null?d:1}},[3]:(t,a)=>{var b,n;let e={id:a.id,dataRef:a.dataRef},r=ae(t,d=>[...d,e]);t.activeOptionIndex===null&&(b=t.dataRef.current)!=null&&b.isSelected(a.dataRef.current.value)&&(r.activeOptionIndex=r.options.indexOf(e));let l={...t,...r,activationTrigger:1};return(n=t.dataRef.current)!=null&&n.__demoMode&&t.dataRef.current.value===void 0&&(l.activeOptionIndex=0),l},[4]:(t,a)=>{let e=ae(t,r=>{let l=r.findIndex(b=>b.id===a.id);return l!==-1&&r.splice(l,1),r});return{...t,...e,activationTrigger:1}},[5]:(t,a)=>({...t,labelId:a.id})},le=pe(null);le.displayName="ComboboxActionsContext";function Z(t){let a=se(le);if(a===null){let e=new Error(`<${t} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,Z),e}return a}let ie=pe(null);ie.displayName="ComboboxDataContext";function J(t){let a=se(ie);if(a===null){let e=new Error(`<${t} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,J),e}return a}function Xe(t,a){return j(a.type,Ge,t,a)}let je=xe;function Je(t,a){let{value:e,defaultValue:r,onChange:l,form:b,name:n,by:d=(u,T)=>u===T,disabled:o=!1,__demoMode:i=!1,nullable:A=!1,multiple:O=!1,...C}=t,[f=O?[]:void 0,g]=_e(e,l,r),[m,c]=ge(Xe,{dataRef:Ce(),comboboxState:i?0:1,options:[],activeOptionIndex:null,activationTrigger:1,labelId:null}),D=S(!1),_=S({static:!1,hold:!1}),w=S(null),U=S(null),N=S(null),K=S(null),h=x(typeof d=="string"?(u,T)=>{let v=d;return(u==null?void 0:u[v])===(T==null?void 0:T[v])}:d),H=Oe(u=>j(p.mode,{[1]:()=>f.some(T=>h(T,u)),[0]:()=>h(f,u)}),[f]),p=M(()=>({...m,optionsPropsRef:_,labelRef:w,inputRef:U,buttonRef:N,optionsRef:K,value:f,defaultValue:r,disabled:o,mode:O?1:0,get activeOptionIndex(){if(D.current&&m.activeOptionIndex===null&&m.options.length>0){let u=m.options.findIndex(T=>!T.dataRef.current.disabled);if(u!==-1)return u}return m.activeOptionIndex},compare:h,isSelected:H,nullable:A,__demoMode:i}),[f,r,o,O,A,i,m]),y=S(p.activeOptionIndex!==null?p.options[p.activeOptionIndex]:null);be(()=>{let u=p.activeOptionIndex!==null?p.options[p.activeOptionIndex]:null;y.current!==u&&(y.current=u)}),k(()=>{m.dataRef.current=p},[p]),Re([p.buttonRef,p.inputRef,p.optionsRef],()=>te.closeCombobox(),p.comboboxState===0);let E=M(()=>({open:p.comboboxState===0,disabled:o,activeIndex:p.activeOptionIndex,activeOption:p.activeOptionIndex===null?null:p.options[p.activeOptionIndex].dataRef.current.value,value:f}),[p,o,f]),B=x(u=>{let T=p.options.find(v=>v.id===u);T&&V(T.dataRef.current.value)}),s=x(()=>{if(p.activeOptionIndex!==null){let{dataRef:u,id:T}=p.options[p.activeOptionIndex];V(u.current.value),te.goToOption(R.Specific,T)}}),W=x(()=>{c({type:0}),D.current=!0}),L=x(()=>{c({type:1}),D.current=!1}),$=x((u,T,v)=>(D.current=!1,u===R.Specific?c({type:2,focus:R.Specific,id:T,trigger:v}):c({type:2,focus:u,trigger:v}))),P=x((u,T)=>(c({type:3,id:u,dataRef:T}),()=>{var v;((v=y.current)==null?void 0:v.id)===u&&(D.current=!0),c({type:4,id:u})})),F=x(u=>(c({type:5,id:u}),()=>c({type:5,id:null}))),V=x(u=>j(p.mode,{[0](){return g==null?void 0:g(u)},[1](){let T=p.value.slice(),v=T.findIndex(q=>h(q,u));return v===-1?T.push(u):T.splice(v,1),g==null?void 0:g(T)}})),te=M(()=>({onChange:V,registerOption:P,registerLabel:F,goToOption:$,closeCombobox:L,openCombobox:W,selectActiveOption:s,selectOption:B}),[]),Te=a===null?{}:{ref:a},z=S(null),me=re();return be(()=>{z.current&&r!==void 0&&me.addEventListener(z.current,"reset",()=>{g==null||g(r)})},[z,g]),ee.createElement(le.Provider,{value:te},ee.createElement(ie.Provider,{value:p},ee.createElement(Me,{value:j(p.comboboxState,{[0]:oe.Open,[1]:oe.Closed})},n!=null&&f!=null&&Ie({[n]:f}).map(([u,T],v)=>ee.createElement(Ve,{features:De.Hidden,ref:v===0?q=>{var ue;z.current=(ue=q==null?void 0:q.closest("form"))!=null?ue:null}:void 0,...Ee({key:u,as:"input",type:"hidden",hidden:!0,readOnly:!0,form:b,name:u,value:T})})),X({ourProps:Te,theirProps:C,slot:E,defaultTag:je,name:"Combobox"}))))}let Ke="input";function We(t,a){var p,y,E,B;let e=Q(),{id:r=`headlessui-combobox-input-${e}`,onChange:l,displayValue:b,type:n="text",...d}=t,o=J("Combobox.Input"),i=Z("Combobox.Input"),A=Y(o.inputRef,a),O=ke(o.inputRef),C=S(!1),f=re(),g=x(()=>{i.onChange(null),o.optionsRef.current&&(o.optionsRef.current.scrollTop=0),i.goToOption(R.Nothing)}),m=function(){var s;return typeof b=="function"&&o.value!==void 0?(s=b(o.value))!=null?s:"":typeof o.value=="string"?o.value:""}();ce(([s,W],[L,$])=>{if(C.current)return;let P=o.inputRef.current;P&&(($===0&&W===1||s!==L)&&(P.value=s),requestAnimationFrame(()=>{if(C.current||!P||(O==null?void 0:O.activeElement)!==P)return;let{selectionStart:F,selectionEnd:V}=P;Math.abs((V!=null?V:0)-(F!=null?F:0))===0&&F===0&&P.setSelectionRange(P.value.length,P.value.length)}))},[m,o.comboboxState,O]),ce(([s],[W])=>{if(s===0&&W===1){if(C.current)return;let L=o.inputRef.current;if(!L)return;let $=L.value,{selectionStart:P,selectionEnd:F,selectionDirection:V}=L;L.value="",L.value=$,V!==null?L.setSelectionRange(P,F,V):L.setSelectionRange(P,F)}},[o.comboboxState]);let c=S(!1),D=x(()=>{c.current=!0}),_=x(()=>{f.nextFrame(()=>{c.current=!1})}),w=x(s=>{switch(C.current=!0,s.key){case I.Enter:if(C.current=!1,o.comboboxState!==0||c.current)return;if(s.preventDefault(),s.stopPropagation(),o.activeOptionIndex===null){i.closeCombobox();return}i.selectActiveOption(),o.mode===0&&i.closeCombobox();break;case I.ArrowDown:return C.current=!1,s.preventDefault(),s.stopPropagation(),j(o.comboboxState,{[0]:()=>{i.goToOption(R.Next)},[1]:()=>{i.openCombobox()}});case I.ArrowUp:return C.current=!1,s.preventDefault(),s.stopPropagation(),j(o.comboboxState,{[0]:()=>{i.goToOption(R.Previous)},[1]:()=>{i.openCombobox(),f.nextFrame(()=>{o.value||i.goToOption(R.Last)})}});case I.Home:if(s.shiftKey)break;return C.current=!1,s.preventDefault(),s.stopPropagation(),i.goToOption(R.First);case I.PageUp:return C.current=!1,s.preventDefault(),s.stopPropagation(),i.goToOption(R.First);case I.End:if(s.shiftKey)break;return C.current=!1,s.preventDefault(),s.stopPropagation(),i.goToOption(R.Last);case I.PageDown:return C.current=!1,s.preventDefault(),s.stopPropagation(),i.goToOption(R.Last);case I.Escape:return C.current=!1,o.comboboxState!==0?void 0:(s.preventDefault(),o.optionsRef.current&&!o.optionsPropsRef.current.static&&s.stopPropagation(),o.nullable&&o.mode===0&&o.value===null&&g(),i.closeCombobox());case I.Tab:if(C.current=!1,o.comboboxState!==0)return;o.mode===0&&i.selectActiveOption(),i.closeCombobox();break}}),U=x(s=>{l==null||l(s),o.nullable&&o.mode===0&&s.target.value===""&&g(),i.openCombobox()}),N=x(()=>{C.current=!1}),K=ne(()=>{if(o.labelId)return[o.labelId].join(" ")},[o.labelId]),h=M(()=>({open:o.comboboxState===0,disabled:o.disabled}),[o]),H={ref:A,id:r,role:"combobox",type:n,"aria-controls":(p=o.optionsRef.current)==null?void 0:p.id,"aria-expanded":o.comboboxState===0,"aria-activedescendant":o.activeOptionIndex===null||(y=o.options[o.activeOptionIndex])==null?void 0:y.id,"aria-labelledby":K,"aria-autocomplete":"list",defaultValue:(B=(E=t.defaultValue)!=null?E:o.defaultValue!==void 0?b==null?void 0:b(o.defaultValue):null)!=null?B:o.defaultValue,disabled:o.disabled,onCompositionStart:D,onCompositionEnd:_,onKeyDown:w,onChange:U,onBlur:N};return X({ourProps:H,theirProps:d,slot:h,defaultTag:Ke,name:"Combobox.Input"})}let $e="button";function qe(t,a){var g;let e=J("Combobox.Button"),r=Z("Combobox.Button"),l=Y(e.buttonRef,a),b=Q(),{id:n=`headlessui-combobox-button-${b}`,...d}=t,o=re(),i=x(m=>{switch(m.key){case I.ArrowDown:return m.preventDefault(),m.stopPropagation(),e.comboboxState===1&&r.openCombobox(),o.nextFrame(()=>{var c;return(c=e.inputRef.current)==null?void 0:c.focus({preventScroll:!0})});case I.ArrowUp:return m.preventDefault(),m.stopPropagation(),e.comboboxState===1&&(r.openCombobox(),o.nextFrame(()=>{e.value||r.goToOption(R.Last)})),o.nextFrame(()=>{var c;return(c=e.inputRef.current)==null?void 0:c.focus({preventScroll:!0})});case I.Escape:return e.comboboxState!==0?void 0:(m.preventDefault(),e.optionsRef.current&&!e.optionsPropsRef.current.static&&m.stopPropagation(),r.closeCombobox(),o.nextFrame(()=>{var c;return(c=e.inputRef.current)==null?void 0:c.focus({preventScroll:!0})}));default:return}}),A=x(m=>{if(Se(m.currentTarget))return m.preventDefault();e.comboboxState===0?r.closeCombobox():(m.preventDefault(),r.openCombobox()),o.nextFrame(()=>{var c;return(c=e.inputRef.current)==null?void 0:c.focus({preventScroll:!0})})}),O=ne(()=>{if(e.labelId)return[e.labelId,n].join(" ")},[e.labelId,n]),C=M(()=>({open:e.comboboxState===0,disabled:e.disabled,value:e.value}),[e]),f={ref:l,id:n,type:ve(t,e.buttonRef),tabIndex:-1,"aria-haspopup":"listbox","aria-controls":(g=e.optionsRef.current)==null?void 0:g.id,"aria-expanded":e.comboboxState===0,"aria-labelledby":O,disabled:e.disabled,onClick:A,onKeyDown:i};return X({ourProps:f,theirProps:d,slot:C,defaultTag:$e,name:"Combobox.Button"})}let Qe="label";function Ye(t,a){let e=Q(),{id:r=`headlessui-combobox-label-${e}`,...l}=t,b=J("Combobox.Label"),n=Z("Combobox.Label"),d=Y(b.labelRef,a);k(()=>n.registerLabel(r),[r]);let o=x(()=>{var O;return(O=b.inputRef.current)==null?void 0:O.focus({preventScroll:!0})}),i=M(()=>({open:b.comboboxState===0,disabled:b.disabled}),[b]);return X({ourProps:{ref:d,id:r,onClick:o},theirProps:l,slot:i,defaultTag:Qe,name:"Combobox.Label"})}let Ze="ul",ze=fe.RenderStrategy|fe.Static;function eo(t,a){let e=Q(),{id:r=`headlessui-combobox-options-${e}`,hold:l=!1,...b}=t,n=J("Combobox.Options"),d=Y(n.optionsRef,a),o=Fe(),i=(()=>o!==null?(o&oe.Open)===oe.Open:n.comboboxState===0)();k(()=>{var f;n.optionsPropsRef.current.static=(f=t.static)!=null?f:!1},[n.optionsPropsRef,t.static]),k(()=>{n.optionsPropsRef.current.hold=l},[n.optionsPropsRef,l]),Pe({container:n.optionsRef.current,enabled:n.comboboxState===0,accept(f){return f.getAttribute("role")==="option"?NodeFilter.FILTER_REJECT:f.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(f){f.setAttribute("role","none")}});let A=ne(()=>{var f,g;return(g=n.labelId)!=null?g:(f=n.buttonRef.current)==null?void 0:f.id},[n.labelId,n.buttonRef.current]),O=M(()=>({open:n.comboboxState===0}),[n]),C={"aria-labelledby":A,role:"listbox","aria-multiselectable":n.mode===1?!0:void 0,id:r,ref:d};return X({ourProps:C,theirProps:b,slot:O,defaultTag:Ze,features:ze,visible:i,name:"Combobox.Options"})}let oo="li";function to(t,a){var H,p;let e=Q(),{id:r=`headlessui-combobox-option-${e}`,disabled:l=!1,value:b,...n}=t,d=J("Combobox.Option"),o=Z("Combobox.Option"),i=d.activeOptionIndex!==null?d.options[d.activeOptionIndex].id===r:!1,A=d.isSelected(b),O=S(null),C=ye({disabled:l,value:b,domRef:O,textValue:(p=(H=O.current)==null?void 0:H.textContent)==null?void 0:p.toLowerCase()}),f=Y(a,O),g=x(()=>o.selectOption(r));k(()=>o.registerOption(r,C),[C,r]);let m=S(!d.__demoMode);k(()=>{if(!d.__demoMode)return;let y=de();return y.requestAnimationFrame(()=>{m.current=!0}),y.dispose},[]),k(()=>{if(d.comboboxState!==0||!i||!m.current||d.activationTrigger===0)return;let y=de();return y.requestAnimationFrame(()=>{var E,B;(B=(E=O.current)==null?void 0:E.scrollIntoView)==null||B.call(E,{block:"nearest"})}),y.dispose},[O,i,d.comboboxState,d.activationTrigger,d.activeOptionIndex]);let c=x(y=>{if(l)return y.preventDefault();g(),d.mode===0&&o.closeCombobox(),Be()||requestAnimationFrame(()=>{var E;return(E=d.inputRef.current)==null?void 0:E.focus()})}),D=x(()=>{if(l)return o.goToOption(R.Nothing);o.goToOption(R.Specific,r)}),_=he(),w=x(y=>_.update(y)),U=x(y=>{_.wasMoved(y)&&(l||i||o.goToOption(R.Specific,r,0))}),N=x(y=>{_.wasMoved(y)&&(l||i&&(d.optionsPropsRef.current.hold||o.goToOption(R.Nothing)))}),K=M(()=>({active:i,selected:A,disabled:l}),[i,A,l]);return X({ourProps:{id:r,ref:f,role:"option",tabIndex:l===!0?void 0:-1,"aria-disabled":l===!0?!0:void 0,"aria-selected":A,disabled:void 0,onClick:c,onFocus:D,onPointerEnter:w,onMouseEnter:w,onPointerMove:U,onMouseMove:U,onPointerLeave:N,onMouseLeave:N},theirProps:n,slot:K,defaultTag:oo,name:"Combobox.Option"})}let no=G(Je),ro=G(qe),ao=G(We),lo=G(Ye),io=G(eo),uo=G(to),qo=Object.assign(no,{Input:ao,Button:ro,Label:lo,Options:io,Option:uo});export{qo as Combobox}; |
@@ -1,1 +0,1 @@ | ||
import g,{createContext as fe,createRef as ge,useCallback as X,useContext as j,useEffect as I,useMemo as R,useReducer as Te,useRef as K,useState as ce}from"react";import{match as w}from'../../utils/match.js';import{forwardRefWithAs as v,render as O,Features as V}from'../../utils/render.js';import{useSyncRefs as b}from'../../hooks/use-sync-refs.js';import{Keys as De}from'../keyboard.js';import{isDisabledReactIssue7711 as me}from'../../utils/bugs.js';import{useId as h}from'../../hooks/use-id.js';import{FocusTrap as L}from'../../components/focus-trap/focus-trap.js';import{Portal as B}from'../../components/portal/portal.js';import{ForcePortalRoot as G}from'../../internal/portal-force-root.js';import{Description as Pe,useDescriptions as ye}from'../description/description.js';import{useOpenClosed as Ee,State as _}from'../../internal/open-closed.js';import{useServerHandoffComplete as Ae}from'../../hooks/use-server-handoff-complete.js';import{StackProvider as Re,StackMessage as q}from'../../internal/stack-context.js';import{useOutsideClick as Ce}from'../../hooks/use-outside-click.js';import{useOwnerDocument as ve}from'../../hooks/use-owner.js';import{useEventListener as Oe}from'../../hooks/use-event-listener.js';import{Hidden as be,Features as he}from'../../internal/hidden.js';import{useEvent as C}from'../../hooks/use-event.js';import{useDocumentOverflowLockedEffect as Le}from'../../hooks/document-overflow/use-document-overflow.js';import{useInert as z}from'../../hooks/use-inert.js';var Se=(o=>(o[o.Open=0]="Open",o[o.Closed=1]="Closed",o))(Se||{}),Fe=(e=>(e[e.SetTitleId=0]="SetTitleId",e))(Fe||{});let ke={[0](t,e){return t.titleId===e.id?t:{...t,titleId:e.id}}},M=fe(null);M.displayName="DialogContext";function S(t){let e=j(M);if(e===null){let o=new Error(`<${t} /> is missing a parent <Dialog /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,S),o}return e}function xe(t,e,o=()=>[document.body]){Le(t,e,s=>{var n;return{containers:[...(n=s.containers)!=null?n:[],o]}})}function _e(t,e){return w(e.type,ke,t,e)}let Me="div",He=V.RenderStrategy|V.Static;function Ie(t,e){let o=h(),{id:s=`headlessui-dialog-${o}`,open:n,onClose:l,initialFocus:d,__demoMode:c=!1,...D}=t,[P,F]=ce(0),i=Ee();n===void 0&&i!==null&&(n=(i&_.Open)===_.Open);let m=K(null),Q=b(m,e),y=K(null),p=ve(m),U=t.hasOwnProperty("open")||i!==null,N=t.hasOwnProperty("onClose");if(!U&&!N)throw new Error("You have to provide an `open` and an `onClose` prop to the `Dialog` component.");if(!U)throw new Error("You provided an `onClose` prop to the `Dialog`, but forgot an `open` prop.");if(!N)throw new Error("You provided an `open` prop to the `Dialog`, but forgot an `onClose` prop.");if(typeof n!="boolean")throw new Error(`You provided an \`open\` prop to the \`Dialog\`, but the value is not a boolean. Received: ${n}`);if(typeof l!="function")throw new Error(`You provided an \`onClose\` prop to the \`Dialog\`, but the value is not a function. Received: ${l}`);let u=n?0:1,[E,Z]=Te(_e,{titleId:null,descriptionId:null,panelRef:ge()}),A=C(()=>l(!1)),Y=C(r=>Z({type:0,id:r})),k=Ae()?c?!1:u===0:!1,x=P>1,$=j(M)!==null,ee=x?"parent":"leaf",W=i!==null?(i&_.Closing)===_.Closing:!1,te=(()=>$||W?!1:k)(),oe=X(()=>{var r,f;return(f=Array.from((r=p==null?void 0:p.querySelectorAll("body > *"))!=null?r:[]).find(a=>a.id==="headlessui-portal-root"?!1:a.contains(y.current)&&a instanceof HTMLElement))!=null?f:null},[y]);z(oe,te);let re=(()=>x?!0:k)(),ne=X(()=>{var r,f;return(f=Array.from((r=p==null?void 0:p.querySelectorAll("[data-headlessui-portal]"))!=null?r:[]).find(a=>a.contains(y.current)&&a instanceof HTMLElement))!=null?f:null},[y]);z(ne,re);let H=C(()=>{var f,a;return[...Array.from((f=p==null?void 0:p.querySelectorAll("html > *, body > *, [data-headlessui-portal]"))!=null?f:[]).filter(T=>!(T===document.body||T===document.head||!(T instanceof HTMLElement)||T.contains(y.current)||E.panelRef.current&&T.contains(E.panelRef.current))),(a=E.panelRef.current)!=null?a:m.current]}),le=(()=>!(!k||x))();Ce(()=>H(),A,le);let ae=(()=>!(x||u!==0))();Oe(p==null?void 0:p.defaultView,"keydown",r=>{ae&&(r.defaultPrevented||r.key===De.Escape&&(r.preventDefault(),r.stopPropagation(),A()))});let ie=(()=>!(W||u!==0||$))();xe(p,ie,H),I(()=>{if(u!==0||!m.current)return;let r=new ResizeObserver(f=>{for(let a of f){let T=a.target.getBoundingClientRect();T.x===0&&T.y===0&&T.width===0&&T.height===0&&A()}});return r.observe(m.current),()=>r.disconnect()},[u,m,A]);let[se,pe]=ye(),de=R(()=>[{dialogState:u,close:A,setTitleId:Y},E],[u,E,A,Y]),J=R(()=>({open:u===0}),[u]),ue={ref:Q,id:s,role:"dialog","aria-modal":u===0?!0:void 0,"aria-labelledby":E.titleId,"aria-describedby":se};return g.createElement(Re,{type:"Dialog",enabled:u===0,element:m,onUpdate:C((r,f)=>{f==="Dialog"&&w(r,{[q.Add]:()=>F(a=>a+1),[q.Remove]:()=>F(a=>a-1)})})},g.createElement(G,{force:!0},g.createElement(B,null,g.createElement(M.Provider,{value:de},g.createElement(B.Group,{target:m},g.createElement(G,{force:!1},g.createElement(pe,{slot:J,name:"Dialog.Description"},g.createElement(L,{initialFocus:d,containers:H,features:k?w(ee,{parent:L.features.RestoreFocus,leaf:L.features.All&~L.features.FocusLock}):L.features.None},O({ourProps:ue,theirProps:D,slot:J,defaultTag:Me,features:He,visible:u===0,name:"Dialog"})))))))),g.createElement(be,{features:he.Hidden,ref:y}))}let we="div";function Be(t,e){let o=h(),{id:s=`headlessui-dialog-overlay-${o}`,...n}=t,[{dialogState:l,close:d}]=S("Dialog.Overlay"),c=b(e),D=C(i=>{if(i.target===i.currentTarget){if(me(i.currentTarget))return i.preventDefault();i.preventDefault(),i.stopPropagation(),d()}}),P=R(()=>({open:l===0}),[l]);return O({ourProps:{ref:c,id:s,"aria-hidden":!0,onClick:D},theirProps:n,slot:P,defaultTag:we,name:"Dialog.Overlay"})}let Ge="div";function Ue(t,e){let o=h(),{id:s=`headlessui-dialog-backdrop-${o}`,...n}=t,[{dialogState:l},d]=S("Dialog.Backdrop"),c=b(e);I(()=>{if(d.panelRef.current===null)throw new Error("A <Dialog.Backdrop /> component is being used, but a <Dialog.Panel /> component is missing.")},[d.panelRef]);let D=R(()=>({open:l===0}),[l]);return g.createElement(G,{force:!0},g.createElement(B,null,O({ourProps:{ref:c,id:s,"aria-hidden":!0},theirProps:n,slot:D,defaultTag:Ge,name:"Dialog.Backdrop"})))}let Ne="div";function Ye(t,e){let o=h(),{id:s=`headlessui-dialog-panel-${o}`,...n}=t,[{dialogState:l},d]=S("Dialog.Panel"),c=b(e,d.panelRef),D=R(()=>({open:l===0}),[l]),P=C(i=>{i.stopPropagation()});return O({ourProps:{ref:c,id:s,onClick:P},theirProps:n,slot:D,defaultTag:Ne,name:"Dialog.Panel"})}let $e="h2";function We(t,e){let o=h(),{id:s=`headlessui-dialog-title-${o}`,...n}=t,[{dialogState:l,setTitleId:d}]=S("Dialog.Title"),c=b(e);I(()=>(d(s),()=>d(null)),[s,d]);let D=R(()=>({open:l===0}),[l]);return O({ourProps:{ref:c,id:s},theirProps:n,slot:D,defaultTag:$e,name:"Dialog.Title"})}let Je=v(Ie),Xe=v(Ue),je=v(Ye),Ke=v(Be),Ve=v(We),St=Object.assign(Je,{Backdrop:Xe,Panel:je,Overlay:Ke,Title:Ve,Description:Pe});export{St as Dialog}; | ||
import u,{createContext as ce,createRef as De,useCallback as j,useContext as K,useEffect as w,useMemo as y,useReducer as me,useRef as Pe,useState as ye}from"react";import{match as B}from'../../utils/match.js';import{forwardRefWithAs as E,render as A,Features as V}from'../../utils/render.js';import{useSyncRefs as R}from'../../hooks/use-sync-refs.js';import{Keys as Ee}from'../keyboard.js';import{isDisabledReactIssue7711 as Ae}from'../../utils/bugs.js';import{useId as C}from'../../hooks/use-id.js';import{FocusTrap as v}from'../../components/focus-trap/focus-trap.js';import{Portal as H,useNestedPortals as Re}from'../../components/portal/portal.js';import{ForcePortalRoot as G}from'../../internal/portal-force-root.js';import{Description as Ce,useDescriptions as ve}from'../description/description.js';import{useOpenClosed as Oe,State as _}from'../../internal/open-closed.js';import{useServerHandoffComplete as be}from'../../hooks/use-server-handoff-complete.js';import{StackProvider as he,StackMessage as q}from'../../internal/stack-context.js';import{useOutsideClick as Se}from'../../hooks/use-outside-click.js';import{useOwnerDocument as Le}from'../../hooks/use-owner.js';import{useEventListener as Fe}from'../../hooks/use-event-listener.js';import{useEvent as O}from'../../hooks/use-event.js';import{useDocumentOverflowLockedEffect as ke}from'../../hooks/document-overflow/use-document-overflow.js';import{useInert as z}from'../../hooks/use-inert.js';import{useRootContainers as xe}from'../../hooks/use-root-containers.js';var _e=(o=>(o[o.Open=0]="Open",o[o.Closed=1]="Closed",o))(_e||{}),Ie=(e=>(e[e.SetTitleId=0]="SetTitleId",e))(Ie||{});let Me={[0](t,e){return t.titleId===e.id?t:{...t,titleId:e.id}}},I=ce(null);I.displayName="DialogContext";function b(t){let e=K(I);if(e===null){let o=new Error(`<${t} /> is missing a parent <Dialog /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,b),o}return e}function we(t,e,o=()=>[document.body]){ke(t,e,i=>{var n;return{containers:[...(n=i.containers)!=null?n:[],o]}})}function Be(t,e){return B(e.type,Me,t,e)}let He="div",Ge=V.RenderStrategy|V.Static;function Ne(t,e){var X;let o=C(),{id:i=`headlessui-dialog-${o}`,open:n,onClose:l,initialFocus:s,__demoMode:g=!1,...T}=t,[m,h]=ye(0),a=Oe();n===void 0&&a!==null&&(n=(a&_.Open)===_.Open);let D=Pe(null),Q=R(D,e),f=Le(D),N=t.hasOwnProperty("open")||a!==null,U=t.hasOwnProperty("onClose");if(!N&&!U)throw new Error("You have to provide an `open` and an `onClose` prop to the `Dialog` component.");if(!N)throw new Error("You provided an `onClose` prop to the `Dialog`, but forgot an `open` prop.");if(!U)throw new Error("You provided an `open` prop to the `Dialog`, but forgot an `onClose` prop.");if(typeof n!="boolean")throw new Error(`You provided an \`open\` prop to the \`Dialog\`, but the value is not a boolean. Received: ${n}`);if(typeof l!="function")throw new Error(`You provided an \`onClose\` prop to the \`Dialog\`, but the value is not a function. Received: ${l}`);let p=n?0:1,[S,Z]=me(Be,{titleId:null,descriptionId:null,panelRef:De()}),P=O(()=>l(!1)),W=O(r=>Z({type:0,id:r})),L=be()?g?!1:p===0:!1,F=m>1,Y=K(I)!==null,[ee,te]=Re(),{resolveContainers:M,mainTreeNodeRef:k,MainTreeNode:oe}=xe({portals:ee,defaultContainers:[(X=S.panelRef.current)!=null?X:D.current]}),re=F?"parent":"leaf",$=a!==null?(a&_.Closing)===_.Closing:!1,ne=(()=>Y||$?!1:L)(),le=j(()=>{var r,c;return(c=Array.from((r=f==null?void 0:f.querySelectorAll("body > *"))!=null?r:[]).find(d=>d.id==="headlessui-portal-root"?!1:d.contains(k.current)&&d instanceof HTMLElement))!=null?c:null},[k]);z(le,ne);let ae=(()=>F?!0:L)(),ie=j(()=>{var r,c;return(c=Array.from((r=f==null?void 0:f.querySelectorAll("[data-headlessui-portal]"))!=null?r:[]).find(d=>d.contains(k.current)&&d instanceof HTMLElement))!=null?c:null},[k]);z(ie,ae);let se=(()=>!(!L||F))();Se(M,P,se);let pe=(()=>!(F||p!==0))();Fe(f==null?void 0:f.defaultView,"keydown",r=>{pe&&(r.defaultPrevented||r.key===Ee.Escape&&(r.preventDefault(),r.stopPropagation(),P()))});let de=(()=>!($||p!==0||Y))();we(f,de,M),w(()=>{if(p!==0||!D.current)return;let r=new ResizeObserver(c=>{for(let d of c){let x=d.target.getBoundingClientRect();x.x===0&&x.y===0&&x.width===0&&x.height===0&&P()}});return r.observe(D.current),()=>r.disconnect()},[p,D,P]);let[ue,fe]=ve(),ge=y(()=>[{dialogState:p,close:P,setTitleId:W},S],[p,S,P,W]),J=y(()=>({open:p===0}),[p]),Te={ref:Q,id:i,role:"dialog","aria-modal":p===0?!0:void 0,"aria-labelledby":S.titleId,"aria-describedby":ue};return u.createElement(he,{type:"Dialog",enabled:p===0,element:D,onUpdate:O((r,c)=>{c==="Dialog"&&B(r,{[q.Add]:()=>h(d=>d+1),[q.Remove]:()=>h(d=>d-1)})})},u.createElement(G,{force:!0},u.createElement(H,null,u.createElement(I.Provider,{value:ge},u.createElement(H.Group,{target:D},u.createElement(G,{force:!1},u.createElement(fe,{slot:J,name:"Dialog.Description"},u.createElement(v,{initialFocus:s,containers:M,features:L?B(re,{parent:v.features.RestoreFocus,leaf:v.features.All&~v.features.FocusLock}):v.features.None},u.createElement(te,null,A({ourProps:Te,theirProps:T,slot:J,defaultTag:He,features:Ge,visible:p===0,name:"Dialog"}))))))))),u.createElement(oe,null))}let Ue="div";function We(t,e){let o=C(),{id:i=`headlessui-dialog-overlay-${o}`,...n}=t,[{dialogState:l,close:s}]=b("Dialog.Overlay"),g=R(e),T=O(a=>{if(a.target===a.currentTarget){if(Ae(a.currentTarget))return a.preventDefault();a.preventDefault(),a.stopPropagation(),s()}}),m=y(()=>({open:l===0}),[l]);return A({ourProps:{ref:g,id:i,"aria-hidden":!0,onClick:T},theirProps:n,slot:m,defaultTag:Ue,name:"Dialog.Overlay"})}let Ye="div";function $e(t,e){let o=C(),{id:i=`headlessui-dialog-backdrop-${o}`,...n}=t,[{dialogState:l},s]=b("Dialog.Backdrop"),g=R(e);w(()=>{if(s.panelRef.current===null)throw new Error("A <Dialog.Backdrop /> component is being used, but a <Dialog.Panel /> component is missing.")},[s.panelRef]);let T=y(()=>({open:l===0}),[l]);return u.createElement(G,{force:!0},u.createElement(H,null,A({ourProps:{ref:g,id:i,"aria-hidden":!0},theirProps:n,slot:T,defaultTag:Ye,name:"Dialog.Backdrop"})))}let Je="div";function Xe(t,e){let o=C(),{id:i=`headlessui-dialog-panel-${o}`,...n}=t,[{dialogState:l},s]=b("Dialog.Panel"),g=R(e,s.panelRef),T=y(()=>({open:l===0}),[l]),m=O(a=>{a.stopPropagation()});return A({ourProps:{ref:g,id:i,onClick:m},theirProps:n,slot:T,defaultTag:Je,name:"Dialog.Panel"})}let je="h2";function Ke(t,e){let o=C(),{id:i=`headlessui-dialog-title-${o}`,...n}=t,[{dialogState:l,setTitleId:s}]=b("Dialog.Title"),g=R(e);w(()=>(s(i),()=>s(null)),[i,s]);let T=y(()=>({open:l===0}),[l]);return A({ourProps:{ref:g,id:i},theirProps:n,slot:T,defaultTag:je,name:"Dialog.Title"})}let Ve=E(Ne),qe=E($e),ze=E(Xe),Qe=E(We),Ze=E(Ke),_t=Object.assign(Ve,{Backdrop:qe,Panel:ze,Overlay:Qe,Title:Ze,Description:Ce});export{_t as Dialog}; |
@@ -1,1 +0,1 @@ | ||
import E,{Fragment as F,createContext as C,useContext as I,useEffect as h,useMemo as S,useReducer as N,useRef as g}from"react";import{match as x}from'../../utils/match.js';import{forwardRefWithAs as L,render as O,Features as U}from'../../utils/render.js';import{optionalRef as K,useSyncRefs as B}from'../../hooks/use-sync-refs.js';import{useId as _}from'../../hooks/use-id.js';import{Keys as m}from'../keyboard.js';import{isDisabledReactIssue7711 as G}from'../../utils/bugs.js';import{OpenClosedProvider as j,State as R,useOpenClosed as W}from'../../internal/open-closed.js';import{useResolveButtonType as $}from'../../hooks/use-resolve-button-type.js';import{getOwnerDocument as J}from'../../utils/owner.js';import{useEvent as A}from'../../hooks/use-event.js';import{startTransition as X}from'../../utils/start-transition.js';var q=(o=>(o[o.Open=0]="Open",o[o.Closed=1]="Closed",o))(q||{}),z=(t=>(t[t.ToggleDisclosure=0]="ToggleDisclosure",t[t.CloseDisclosure=1]="CloseDisclosure",t[t.SetButtonId=2]="SetButtonId",t[t.SetPanelId=3]="SetPanelId",t[t.LinkPanel=4]="LinkPanel",t[t.UnlinkPanel=5]="UnlinkPanel",t))(z||{});let Q={[0]:e=>({...e,disclosureState:x(e.disclosureState,{[0]:1,[1]:0})}),[1]:e=>e.disclosureState===1?e:{...e,disclosureState:1},[4](e){return e.linkedPanel===!0?e:{...e,linkedPanel:!0}},[5](e){return e.linkedPanel===!1?e:{...e,linkedPanel:!1}},[2](e,n){return e.buttonId===n.buttonId?e:{...e,buttonId:n.buttonId}},[3](e,n){return e.panelId===n.panelId?e:{...e,panelId:n.panelId}}},k=C(null);k.displayName="DisclosureContext";function M(e){let n=I(k);if(n===null){let o=new Error(`<${e} /> is missing a parent <Disclosure /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,M),o}return n}let v=C(null);v.displayName="DisclosureAPIContext";function w(e){let n=I(v);if(n===null){let o=new Error(`<${e} /> is missing a parent <Disclosure /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,w),o}return n}let H=C(null);H.displayName="DisclosurePanelContext";function V(){return I(H)}function Y(e,n){return x(n.type,Q,e,n)}let Z=F;function ee(e,n){let{defaultOpen:o=!1,...u}=e,T=g(null),l=B(n,K(a=>{T.current=a},e.as===void 0||e.as===F)),t=g(null),f=g(null),s=N(Y,{disclosureState:o?0:1,linkedPanel:!1,buttonRef:f,panelRef:t,buttonId:null,panelId:null}),[{disclosureState:i,buttonId:c},D]=s,d=A(a=>{D({type:1});let r=J(T);if(!r||!c)return;let p=(()=>a?a instanceof HTMLElement?a:a.current instanceof HTMLElement?a.current:r.getElementById(c):r.getElementById(c))();p==null||p.focus()}),P=S(()=>({close:d}),[d]),b=S(()=>({open:i===0,close:d}),[i,d]),y={ref:l};return E.createElement(k.Provider,{value:s},E.createElement(v.Provider,{value:P},E.createElement(j,{value:x(i,{[0]:R.Open,[1]:R.Closed})},O({ourProps:y,theirProps:u,slot:b,defaultTag:Z,name:"Disclosure"}))))}let te="button";function ne(e,n){let o=_(),{id:u=`headlessui-disclosure-button-${o}`,...T}=e,[l,t]=M("Disclosure.Button"),f=V(),s=f===null?!1:f===l.panelId,i=g(null),c=B(i,n,s?null:l.buttonRef);h(()=>{if(!s)return t({type:2,buttonId:u}),()=>{t({type:2,buttonId:null})}},[u,t,s]);let D=A(r=>{var p;if(s){if(l.disclosureState===1)return;switch(r.key){case m.Space:case m.Enter:r.preventDefault(),r.stopPropagation(),t({type:0}),(p=l.buttonRef.current)==null||p.focus();break}}else switch(r.key){case m.Space:case m.Enter:r.preventDefault(),r.stopPropagation(),t({type:0});break}}),d=A(r=>{switch(r.key){case m.Space:r.preventDefault();break}}),P=A(r=>{var p;G(r.currentTarget)||e.disabled||(s?(t({type:0}),(p=l.buttonRef.current)==null||p.focus()):t({type:0}))}),b=S(()=>({open:l.disclosureState===0}),[l]),y=$(e,i),a=s?{ref:c,type:y,onKeyDown:D,onClick:P}:{ref:c,id:u,type:y,"aria-expanded":e.disabled?void 0:l.disclosureState===0,"aria-controls":l.linkedPanel?l.panelId:void 0,onKeyDown:D,onKeyUp:d,onClick:P};return O({ourProps:a,theirProps:T,slot:b,defaultTag:te,name:"Disclosure.Button"})}let le="div",oe=U.RenderStrategy|U.Static;function re(e,n){let o=_(),{id:u=`headlessui-disclosure-panel-${o}`,...T}=e,[l,t]=M("Disclosure.Panel"),{close:f}=w("Disclosure.Panel"),s=B(n,l.panelRef,P=>{X(()=>t({type:P?4:5}))});h(()=>(t({type:3,panelId:u}),()=>{t({type:3,panelId:null})}),[u,t]);let i=W(),c=(()=>i!==null?(i&R.Open)===R.Open:l.disclosureState===0)(),D=S(()=>({open:l.disclosureState===0,close:f}),[l,f]),d={ref:s,id:u};return E.createElement(H.Provider,{value:l.panelId},O({ourProps:d,theirProps:T,slot:D,defaultTag:le,features:oe,visible:c,name:"Disclosure.Panel"}))}let se=L(ee),ue=L(ne),ie=L(re),ve=Object.assign(se,{Button:ue,Panel:ie});export{ve as Disclosure}; | ||
import E,{Fragment as F,createContext as C,useContext as I,useEffect as h,useMemo as S,useReducer as N,useRef as g}from"react";import{match as x}from'../../utils/match.js';import{forwardRefWithAs as L,render as O,Features as U}from'../../utils/render.js';import{optionalRef as K,useSyncRefs as B}from'../../hooks/use-sync-refs.js';import{useId as _}from'../../hooks/use-id.js';import{Keys as m}from'../keyboard.js';import{isDisabledReactIssue7711 as G}from'../../utils/bugs.js';import{OpenClosedProvider as j,State as R,useOpenClosed as W}from'../../internal/open-closed.js';import{useResolveButtonType as $}from'../../hooks/use-resolve-button-type.js';import{getOwnerDocument as J}from'../../utils/owner.js';import{useEvent as A}from'../../hooks/use-event.js';import{startTransition as X}from'../../utils/start-transition.js';var q=(o=>(o[o.Open=0]="Open",o[o.Closed=1]="Closed",o))(q||{}),z=(t=>(t[t.ToggleDisclosure=0]="ToggleDisclosure",t[t.CloseDisclosure=1]="CloseDisclosure",t[t.SetButtonId=2]="SetButtonId",t[t.SetPanelId=3]="SetPanelId",t[t.LinkPanel=4]="LinkPanel",t[t.UnlinkPanel=5]="UnlinkPanel",t))(z||{});let Q={[0]:e=>({...e,disclosureState:x(e.disclosureState,{[0]:1,[1]:0})}),[1]:e=>e.disclosureState===1?e:{...e,disclosureState:1},[4](e){return e.linkedPanel===!0?e:{...e,linkedPanel:!0}},[5](e){return e.linkedPanel===!1?e:{...e,linkedPanel:!1}},[2](e,n){return e.buttonId===n.buttonId?e:{...e,buttonId:n.buttonId}},[3](e,n){return e.panelId===n.panelId?e:{...e,panelId:n.panelId}}},k=C(null);k.displayName="DisclosureContext";function M(e){let n=I(k);if(n===null){let o=new Error(`<${e} /> is missing a parent <Disclosure /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,M),o}return n}let v=C(null);v.displayName="DisclosureAPIContext";function w(e){let n=I(v);if(n===null){let o=new Error(`<${e} /> is missing a parent <Disclosure /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,w),o}return n}let H=C(null);H.displayName="DisclosurePanelContext";function V(){return I(H)}function Y(e,n){return x(n.type,Q,e,n)}let Z=F;function ee(e,n){let{defaultOpen:o=!1,...u}=e,T=g(null),l=B(n,K(a=>{T.current=a},e.as===void 0||e.as===F)),t=g(null),f=g(null),s=N(Y,{disclosureState:o?0:1,linkedPanel:!1,buttonRef:f,panelRef:t,buttonId:null,panelId:null}),[{disclosureState:i,buttonId:c},D]=s,d=A(a=>{D({type:1});let r=J(T);if(!r||!c)return;let p=(()=>a?a instanceof HTMLElement?a:a.current instanceof HTMLElement?a.current:r.getElementById(c):r.getElementById(c))();p==null||p.focus()}),P=S(()=>({close:d}),[d]),b=S(()=>({open:i===0,close:d}),[i,d]),y={ref:l};return E.createElement(k.Provider,{value:s},E.createElement(v.Provider,{value:P},E.createElement(j,{value:x(i,{[0]:R.Open,[1]:R.Closed})},O({ourProps:y,theirProps:u,slot:b,defaultTag:Z,name:"Disclosure"}))))}let te="button";function ne(e,n){let o=_(),{id:u=`headlessui-disclosure-button-${o}`,...T}=e,[l,t]=M("Disclosure.Button"),f=V(),s=f===null?!1:f===l.panelId,i=g(null),c=B(i,n,s?null:l.buttonRef);h(()=>{if(!s)return t({type:2,buttonId:u}),()=>{t({type:2,buttonId:null})}},[u,t,s]);let D=A(r=>{var p;if(s){if(l.disclosureState===1)return;switch(r.key){case m.Space:case m.Enter:r.preventDefault(),r.stopPropagation(),t({type:0}),(p=l.buttonRef.current)==null||p.focus();break}}else switch(r.key){case m.Space:case m.Enter:r.preventDefault(),r.stopPropagation(),t({type:0});break}}),d=A(r=>{switch(r.key){case m.Space:r.preventDefault();break}}),P=A(r=>{var p;G(r.currentTarget)||e.disabled||(s?(t({type:0}),(p=l.buttonRef.current)==null||p.focus()):t({type:0}))}),b=S(()=>({open:l.disclosureState===0}),[l]),y=$(e,i),a=s?{ref:c,type:y,onKeyDown:D,onClick:P}:{ref:c,id:u,type:y,"aria-expanded":l.disclosureState===0,"aria-controls":l.linkedPanel?l.panelId:void 0,onKeyDown:D,onKeyUp:d,onClick:P};return O({ourProps:a,theirProps:T,slot:b,defaultTag:te,name:"Disclosure.Button"})}let le="div",oe=U.RenderStrategy|U.Static;function re(e,n){let o=_(),{id:u=`headlessui-disclosure-panel-${o}`,...T}=e,[l,t]=M("Disclosure.Panel"),{close:f}=w("Disclosure.Panel"),s=B(n,l.panelRef,P=>{X(()=>t({type:P?4:5}))});h(()=>(t({type:3,panelId:u}),()=>{t({type:3,panelId:null})}),[u,t]);let i=W(),c=(()=>i!==null?(i&R.Open)===R.Open:l.disclosureState===0)(),D=S(()=>({open:l.disclosureState===0,close:f}),[l,f]),d={ref:s,id:u};return E.createElement(H.Provider,{value:l.panelId},O({ourProps:d,theirProps:T,slot:D,defaultTag:le,features:oe,visible:c,name:"Disclosure.Panel"}))}let se=L(ee),ue=L(ne),ie=L(re),ve=Object.assign(se,{Button:ue,Panel:ie});export{ve as Disclosure}; |
@@ -1,1 +0,1 @@ | ||
import L,{useEffect as U,useRef as d}from"react";import{forwardRefWithAs as N,render as I}from'../../utils/render.js';import{useServerHandoffComplete as x}from'../../hooks/use-server-handoff-complete.js';import{useSyncRefs as w}from'../../hooks/use-sync-refs.js';import{Features as g,Hidden as k}from'../../internal/hidden.js';import{focusElement as f,focusIn as M,Focus as p,FocusResult as G}from'../../utils/focus-management.js';import{match as A}from'../../utils/match.js';import{useEvent as C}from'../../hooks/use-event.js';import{useTabDirection as K,Direction as b}from'../../hooks/use-tab-direction.js';import{useIsMounted as O}from'../../hooks/use-is-mounted.js';import{useOwnerDocument as W}from'../../hooks/use-owner.js';import{useEventListener as V}from'../../hooks/use-event-listener.js';import{microTask as F}from'../../utils/micro-task.js';import{useWatch as y}from'../../hooks/use-watch.js';import{useDisposables as q}from'../../hooks/use-disposables.js';import{onDocumentReady as D}from'../../utils/document-ready.js';function P(t){if(!t)return new Set;if(typeof t=="function")return new Set(t());let n=new Set;for(let e of t.current)e.current instanceof HTMLElement&&n.add(e.current);return n}let J="div";var h=(r=>(r[r.None=1]="None",r[r.InitialFocus=2]="InitialFocus",r[r.TabLock=4]="TabLock",r[r.FocusLock=8]="FocusLock",r[r.RestoreFocus=16]="RestoreFocus",r[r.All=30]="All",r))(h||{});function X(t,n){let e=d(null),o=w(e,n),{initialFocus:u,containers:i,features:r=30,...l}=t;x()||(r=1);let m=W(e);Y({ownerDocument:m},Boolean(r&16));let c=Z({ownerDocument:m,container:e,initialFocus:u},Boolean(r&2));$({ownerDocument:m,container:e,containers:i,previousActiveElement:c},Boolean(r&8));let v=K(),R=C(s=>{let T=e.current;if(!T)return;(B=>B())(()=>{A(v.current,{[b.Forwards]:()=>{M(T,p.First,{skipElements:[s.relatedTarget]})},[b.Backwards]:()=>{M(T,p.Last,{skipElements:[s.relatedTarget]})}})})}),_=q(),H=d(!1),j={ref:o,onKeyDown(s){s.key=="Tab"&&(H.current=!0,_.requestAnimationFrame(()=>{H.current=!1}))},onBlur(s){let T=P(i);e.current instanceof HTMLElement&&T.add(e.current);let E=s.relatedTarget;E instanceof HTMLElement&&E.dataset.headlessuiFocusGuard!=="true"&&(S(T,E)||(H.current?M(e.current,A(v.current,{[b.Forwards]:()=>p.Next,[b.Backwards]:()=>p.Previous})|p.WrapAround,{relativeTo:s.target}):s.target instanceof HTMLElement&&f(s.target)))}};return L.createElement(L.Fragment,null,Boolean(r&4)&&L.createElement(k,{as:"button",type:"button","data-headlessui-focus-guard":!0,onFocus:R,features:g.Focusable}),I({ourProps:j,theirProps:l,defaultTag:J,name:"FocusTrap"}),Boolean(r&4)&&L.createElement(k,{as:"button",type:"button","data-headlessui-focus-guard":!0,onFocus:R,features:g.Focusable}))}let z=N(X),Re=Object.assign(z,{features:h}),a=[];D(()=>{function t(n){n.target instanceof HTMLElement&&n.target!==document.body&&a[0]!==n.target&&(a.unshift(n.target),a=a.filter(e=>e!=null&&e.isConnected),a.splice(10))}window.addEventListener("click",t,{capture:!0}),window.addEventListener("mousedown",t,{capture:!0}),window.addEventListener("focus",t,{capture:!0}),document.body.addEventListener("click",t,{capture:!0}),document.body.addEventListener("mousedown",t,{capture:!0}),document.body.addEventListener("focus",t,{capture:!0})});function Q(t=!0){let n=d(a.slice());return y(([e],[o])=>{o===!0&&e===!1&&F(()=>{n.current.splice(0)}),o===!1&&e===!0&&(n.current=a.slice())},[t,a,n]),C(()=>{var e;return(e=n.current.find(o=>o!=null&&o.isConnected))!=null?e:null})}function Y({ownerDocument:t},n){let e=Q(n);y(()=>{n||(t==null?void 0:t.activeElement)===(t==null?void 0:t.body)&&f(e())},[n]);let o=d(!1);U(()=>(o.current=!1,()=>{o.current=!0,F(()=>{o.current&&f(e())})}),[])}function Z({ownerDocument:t,container:n,initialFocus:e},o){let u=d(null),i=O();return y(()=>{if(!o)return;let r=n.current;r&&F(()=>{if(!i.current)return;let l=t==null?void 0:t.activeElement;if(e!=null&&e.current){if((e==null?void 0:e.current)===l){u.current=l;return}}else if(r.contains(l)){u.current=l;return}e!=null&&e.current?f(e.current):M(r,p.First)===G.Error&&console.warn("There are no focusable elements inside the <FocusTrap />"),u.current=t==null?void 0:t.activeElement})},[o]),u}function $({ownerDocument:t,container:n,containers:e,previousActiveElement:o},u){let i=O();V(t==null?void 0:t.defaultView,"focus",r=>{if(!u||!i.current)return;let l=P(e);n.current instanceof HTMLElement&&l.add(n.current);let m=o.current;if(!m)return;let c=r.target;c&&c instanceof HTMLElement?S(l,c)?(o.current=c,f(c)):(r.preventDefault(),r.stopPropagation(),f(m)):f(o.current)},!0)}function S(t,n){for(let e of t)if(e.contains(n))return!0;return!1}export{Re as FocusTrap}; | ||
import E,{useRef as L}from"react";import{forwardRefWithAs as U,render as N}from'../../utils/render.js';import{useServerHandoffComplete as I}from'../../hooks/use-server-handoff-complete.js';import{useSyncRefs as x}from'../../hooks/use-sync-refs.js';import{Features as R,Hidden as g}from'../../internal/hidden.js';import{focusElement as f,focusIn as M,Focus as p,FocusResult as w}from'../../utils/focus-management.js';import{match as k}from'../../utils/match.js';import{useEvent as A}from'../../hooks/use-event.js';import{useTabDirection as G,Direction as H}from'../../hooks/use-tab-direction.js';import{useIsMounted as C}from'../../hooks/use-is-mounted.js';import{useOwnerDocument as K}from'../../hooks/use-owner.js';import{useEventListener as W}from'../../hooks/use-event-listener.js';import{microTask as O}from'../../utils/micro-task.js';import{useWatch as F}from'../../hooks/use-watch.js';import{useDisposables as V}from'../../hooks/use-disposables.js';import{onDocumentReady as q}from'../../utils/document-ready.js';import{useOnUnmount as D}from'../../hooks/use-on-unmount.js';function P(t){if(!t)return new Set;if(typeof t=="function")return new Set(t());let r=new Set;for(let e of t.current)e.current instanceof HTMLElement&&r.add(e.current);return r}let J="div";var h=(n=>(n[n.None=1]="None",n[n.InitialFocus=2]="InitialFocus",n[n.TabLock=4]="TabLock",n[n.FocusLock=8]="FocusLock",n[n.RestoreFocus=16]="RestoreFocus",n[n.All=30]="All",n))(h||{});function X(t,r){let e=L(null),o=x(e,r),{initialFocus:u,containers:i,features:n=30,...l}=t;I()||(n=1);let m=K(e);Y({ownerDocument:m},Boolean(n&16));let c=Z({ownerDocument:m,container:e,initialFocus:u},Boolean(n&2));$({ownerDocument:m,container:e,containers:i,previousActiveElement:c},Boolean(n&8));let v=G(),y=A(s=>{let T=e.current;if(!T)return;(B=>B())(()=>{k(v.current,{[H.Forwards]:()=>{M(T,p.First,{skipElements:[s.relatedTarget]})},[H.Backwards]:()=>{M(T,p.Last,{skipElements:[s.relatedTarget]})}})})}),_=V(),b=L(!1),j={ref:o,onKeyDown(s){s.key=="Tab"&&(b.current=!0,_.requestAnimationFrame(()=>{b.current=!1}))},onBlur(s){let T=P(i);e.current instanceof HTMLElement&&T.add(e.current);let d=s.relatedTarget;d instanceof HTMLElement&&d.dataset.headlessuiFocusGuard!=="true"&&(S(T,d)||(b.current?M(e.current,k(v.current,{[H.Forwards]:()=>p.Next,[H.Backwards]:()=>p.Previous})|p.WrapAround,{relativeTo:s.target}):s.target instanceof HTMLElement&&f(s.target)))}};return E.createElement(E.Fragment,null,Boolean(n&4)&&E.createElement(g,{as:"button",type:"button","data-headlessui-focus-guard":!0,onFocus:y,features:R.Focusable}),N({ourProps:j,theirProps:l,defaultTag:J,name:"FocusTrap"}),Boolean(n&4)&&E.createElement(g,{as:"button",type:"button","data-headlessui-focus-guard":!0,onFocus:y,features:R.Focusable}))}let z=U(X),ge=Object.assign(z,{features:h}),a=[];q(()=>{function t(r){r.target instanceof HTMLElement&&r.target!==document.body&&a[0]!==r.target&&(a.unshift(r.target),a=a.filter(e=>e!=null&&e.isConnected),a.splice(10))}window.addEventListener("click",t,{capture:!0}),window.addEventListener("mousedown",t,{capture:!0}),window.addEventListener("focus",t,{capture:!0}),document.body.addEventListener("click",t,{capture:!0}),document.body.addEventListener("mousedown",t,{capture:!0}),document.body.addEventListener("focus",t,{capture:!0})});function Q(t=!0){let r=L(a.slice());return F(([e],[o])=>{o===!0&&e===!1&&O(()=>{r.current.splice(0)}),o===!1&&e===!0&&(r.current=a.slice())},[t,a,r]),A(()=>{var e;return(e=r.current.find(o=>o!=null&&o.isConnected))!=null?e:null})}function Y({ownerDocument:t},r){let e=Q(r);F(()=>{r||(t==null?void 0:t.activeElement)===(t==null?void 0:t.body)&&f(e())},[r]),D(()=>{r&&f(e())})}function Z({ownerDocument:t,container:r,initialFocus:e},o){let u=L(null),i=C();return F(()=>{if(!o)return;let n=r.current;n&&O(()=>{if(!i.current)return;let l=t==null?void 0:t.activeElement;if(e!=null&&e.current){if((e==null?void 0:e.current)===l){u.current=l;return}}else if(n.contains(l)){u.current=l;return}e!=null&&e.current?f(e.current):M(n,p.First)===w.Error&&console.warn("There are no focusable elements inside the <FocusTrap />"),u.current=t==null?void 0:t.activeElement})},[o]),u}function $({ownerDocument:t,container:r,containers:e,previousActiveElement:o},u){let i=C();W(t==null?void 0:t.defaultView,"focus",n=>{if(!u||!i.current)return;let l=P(e);r.current instanceof HTMLElement&&l.add(r.current);let m=o.current;if(!m)return;let c=n.target;c&&c instanceof HTMLElement?S(l,c)?(o.current=c,f(c)):(n.preventDefault(),n.stopPropagation(),f(m)):f(o.current)},!0)}function S(t,r){for(let e of t)if(e.contains(r))return!0;return!1}export{ge as FocusTrap}; |
@@ -1,1 +0,1 @@ | ||
import G,{Fragment as xe,createContext as Y,createRef as ye,useCallback as ge,useContext as Z,useEffect as ee,useMemo as D,useReducer as Le,useRef as I}from"react";import{useDisposables as N}from'../../hooks/use-disposables.js';import{useId as j}from'../../hooks/use-id.js';import{useIsoMorphicEffect as V}from'../../hooks/use-iso-morphic-effect.js';import{useComputed as te}from'../../hooks/use-computed.js';import{useSyncRefs as k}from'../../hooks/use-sync-refs.js';import{Features as oe,forwardRefWithAs as w,render as _,compact as Oe}from'../../utils/render.js';import{match as C}from'../../utils/match.js';import{disposables as W}from'../../utils/disposables.js';import{Keys as g}from'../keyboard.js';import{Focus as A,calculateActiveIndex as me}from'../../utils/calculate-active-index.js';import{isDisabledReactIssue7711 as Re}from'../../utils/bugs.js';import{isFocusableElement as ve,FocusableMode as Ae,sortByDomNode as Se}from'../../utils/focus-management.js';import{useOpenClosed as Pe,State as K,OpenClosedProvider as Ee}from'../../internal/open-closed.js';import{useResolveButtonType as he}from'../../hooks/use-resolve-button-type.js';import{useOutsideClick as De}from'../../hooks/use-outside-click.js';import{Hidden as Ie,Features as Ce}from'../../internal/hidden.js';import{objectToFormEntries as Fe}from'../../utils/form.js';import{getOwnerDocument as Me}from'../../utils/owner.js';import{useEvent as f}from'../../hooks/use-event.js';import{useControllable as ke}from'../../hooks/use-controllable.js';import{useLatestValue as we}from'../../hooks/use-latest-value.js';import{useTrackedPointer as _e}from'../../hooks/use-tracked-pointer.js';var Ue=(o=>(o[o.Open=0]="Open",o[o.Closed=1]="Closed",o))(Ue||{}),Be=(o=>(o[o.Single=0]="Single",o[o.Multi=1]="Multi",o))(Be||{}),He=(o=>(o[o.Pointer=0]="Pointer",o[o.Other=1]="Other",o))(He||{}),Ge=(i=>(i[i.OpenListbox=0]="OpenListbox",i[i.CloseListbox=1]="CloseListbox",i[i.GoToOption=2]="GoToOption",i[i.Search=3]="Search",i[i.ClearSearch=4]="ClearSearch",i[i.RegisterOption=5]="RegisterOption",i[i.UnregisterOption=6]="UnregisterOption",i[i.RegisterLabel=7]="RegisterLabel",i))(Ge||{});function X(e,a=o=>o){let o=e.activeOptionIndex!==null?e.options[e.activeOptionIndex]:null,r=Se(a(e.options.slice()),t=>t.dataRef.current.domRef.current),l=o?r.indexOf(o):null;return l===-1&&(l=null),{options:r,activeOptionIndex:l}}let Ne={[1](e){return e.dataRef.current.disabled||e.listboxState===1?e:{...e,activeOptionIndex:null,listboxState:1}},[0](e){if(e.dataRef.current.disabled||e.listboxState===0)return e;let a=e.activeOptionIndex,{isSelected:o}=e.dataRef.current,r=e.options.findIndex(l=>o(l.dataRef.current.value));return r!==-1&&(a=r),{...e,listboxState:0,activeOptionIndex:a}},[2](e,a){var l;if(e.dataRef.current.disabled||e.listboxState===1)return e;let o=X(e),r=me(a,{resolveItems:()=>o.options,resolveActiveIndex:()=>o.activeOptionIndex,resolveId:t=>t.id,resolveDisabled:t=>t.dataRef.current.disabled});return{...e,...o,searchQuery:"",activeOptionIndex:r,activationTrigger:(l=a.trigger)!=null?l:1}},[3]:(e,a)=>{if(e.dataRef.current.disabled||e.listboxState===1)return e;let r=e.searchQuery!==""?0:1,l=e.searchQuery+a.value.toLowerCase(),p=(e.activeOptionIndex!==null?e.options.slice(e.activeOptionIndex+r).concat(e.options.slice(0,e.activeOptionIndex+r)):e.options).find(i=>{var b;return!i.dataRef.current.disabled&&((b=i.dataRef.current.textValue)==null?void 0:b.startsWith(l))}),u=p?e.options.indexOf(p):-1;return u===-1||u===e.activeOptionIndex?{...e,searchQuery:l}:{...e,searchQuery:l,activeOptionIndex:u,activationTrigger:1}},[4](e){return e.dataRef.current.disabled||e.listboxState===1||e.searchQuery===""?e:{...e,searchQuery:""}},[5]:(e,a)=>{let o={id:a.id,dataRef:a.dataRef},r=X(e,l=>[...l,o]);return e.activeOptionIndex===null&&e.dataRef.current.isSelected(a.dataRef.current.value)&&(r.activeOptionIndex=r.options.indexOf(o)),{...e,...r}},[6]:(e,a)=>{let o=X(e,r=>{let l=r.findIndex(t=>t.id===a.id);return l!==-1&&r.splice(l,1),r});return{...e,...o,activationTrigger:1}},[7]:(e,a)=>({...e,labelId:a.id})},$=Y(null);$.displayName="ListboxActionsContext";function U(e){let a=Z($);if(a===null){let o=new Error(`<${e} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,U),o}return a}let z=Y(null);z.displayName="ListboxDataContext";function B(e){let a=Z(z);if(a===null){let o=new Error(`<${e} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,B),o}return a}function je(e,a){return C(a.type,Ne,e,a)}let Ve=xe;function Ke(e,a){let{value:o,defaultValue:r,form:l,name:t,onChange:p,by:u=(s,d)=>s===d,disabled:i=!1,horizontal:b=!1,multiple:R=!1,...m}=e;const P=b?"horizontal":"vertical";let E=k(a),[L=R?[]:void 0,v]=ke(o,p,r),[c,n]=Le(je,{dataRef:ye(),listboxState:1,options:[],searchQuery:"",labelId:null,activeOptionIndex:null,activationTrigger:1}),x=I({static:!1,hold:!1}),h=I(null),Q=I(null),J=I(null),y=f(typeof u=="string"?(s,d)=>{let O=u;return(s==null?void 0:s[O])===(d==null?void 0:d[O])}:u),S=ge(s=>C(T.mode,{[1]:()=>L.some(d=>y(d,s)),[0]:()=>y(L,s)}),[L]),T=D(()=>({...c,value:L,disabled:i,mode:R?1:0,orientation:P,compare:y,isSelected:S,optionsPropsRef:x,labelRef:h,buttonRef:Q,optionsRef:J}),[L,i,R,c]);V(()=>{c.dataRef.current=T},[T]),De([T.buttonRef,T.optionsRef],(s,d)=>{var O;n({type:1}),ve(d,Ae.Loose)||(s.preventDefault(),(O=T.buttonRef.current)==null||O.focus())},T.listboxState===0);let ne=D(()=>({open:T.listboxState===0,disabled:i,value:L}),[T,i,L]),ie=f(s=>{let d=T.options.find(O=>O.id===s);d&&F(d.dataRef.current.value)}),re=f(()=>{if(T.activeOptionIndex!==null){let{dataRef:s,id:d}=T.options[T.activeOptionIndex];F(s.current.value),n({type:2,focus:A.Specific,id:d})}}),ae=f(()=>n({type:0})),le=f(()=>n({type:1})),se=f((s,d,O)=>s===A.Specific?n({type:2,focus:A.Specific,id:d,trigger:O}):n({type:2,focus:s,trigger:O})),pe=f((s,d)=>(n({type:5,id:s,dataRef:d}),()=>n({type:6,id:s}))),ue=f(s=>(n({type:7,id:s}),()=>n({type:7,id:null}))),F=f(s=>C(T.mode,{[0](){return v==null?void 0:v(s)},[1](){let d=T.value.slice(),O=d.findIndex(M=>y(M,s));return O===-1?d.push(s):d.splice(O,1),v==null?void 0:v(d)}})),de=f(s=>n({type:3,value:s})),ce=f(()=>n({type:4})),fe=D(()=>({onChange:F,registerOption:pe,registerLabel:ue,goToOption:se,closeListbox:le,openListbox:ae,selectActiveOption:re,selectOption:ie,search:de,clearSearch:ce}),[]),Te={ref:E},H=I(null),be=N();return ee(()=>{H.current&&r!==void 0&&be.addEventListener(H.current,"reset",()=>{F(r)})},[H,F]),G.createElement($.Provider,{value:fe},G.createElement(z.Provider,{value:T},G.createElement(Ee,{value:C(T.listboxState,{[0]:K.Open,[1]:K.Closed})},t!=null&&L!=null&&Fe({[t]:L}).map(([s,d],O)=>G.createElement(Ie,{features:Ce.Hidden,ref:O===0?M=>{var q;H.current=(q=M==null?void 0:M.closest("form"))!=null?q:null}:void 0,...Oe({key:s,as:"input",type:"hidden",hidden:!0,readOnly:!0,form:l,name:s,value:d})})),_({ourProps:Te,theirProps:m,slot:ne,defaultTag:Ve,name:"Listbox"}))))}let Qe="button";function We(e,a){var v;let o=j(),{id:r=`headlessui-listbox-button-${o}`,...l}=e,t=B("Listbox.Button"),p=U("Listbox.Button"),u=k(t.buttonRef,a),i=N(),b=f(c=>{switch(c.key){case g.Space:case g.Enter:case g.ArrowDown:c.preventDefault(),p.openListbox(),i.nextFrame(()=>{t.value||p.goToOption(A.First)});break;case g.ArrowUp:c.preventDefault(),p.openListbox(),i.nextFrame(()=>{t.value||p.goToOption(A.Last)});break}}),R=f(c=>{switch(c.key){case g.Space:c.preventDefault();break}}),m=f(c=>{if(Re(c.currentTarget))return c.preventDefault();t.listboxState===0?(p.closeListbox(),i.nextFrame(()=>{var n;return(n=t.buttonRef.current)==null?void 0:n.focus({preventScroll:!0})})):(c.preventDefault(),p.openListbox())}),P=te(()=>{if(t.labelId)return[t.labelId,r].join(" ")},[t.labelId,r]),E=D(()=>({open:t.listboxState===0,disabled:t.disabled,value:t.value}),[t]),L={ref:u,id:r,type:he(e,t.buttonRef),"aria-haspopup":"listbox","aria-controls":(v=t.optionsRef.current)==null?void 0:v.id,"aria-expanded":t.disabled?void 0:t.listboxState===0,"aria-labelledby":P,disabled:t.disabled,onKeyDown:b,onKeyUp:R,onClick:m};return _({ourProps:L,theirProps:l,slot:E,defaultTag:Qe,name:"Listbox.Button"})}let Xe="label";function $e(e,a){let o=j(),{id:r=`headlessui-listbox-label-${o}`,...l}=e,t=B("Listbox.Label"),p=U("Listbox.Label"),u=k(t.labelRef,a);V(()=>p.registerLabel(r),[r]);let i=f(()=>{var m;return(m=t.buttonRef.current)==null?void 0:m.focus({preventScroll:!0})}),b=D(()=>({open:t.listboxState===0,disabled:t.disabled}),[t]);return _({ourProps:{ref:u,id:r,onClick:i},theirProps:l,slot:b,defaultTag:Xe,name:"Listbox.Label"})}let ze="ul",Je=oe.RenderStrategy|oe.Static;function qe(e,a){var c;let o=j(),{id:r=`headlessui-listbox-options-${o}`,...l}=e,t=B("Listbox.Options"),p=U("Listbox.Options"),u=k(t.optionsRef,a),i=N(),b=N(),R=Pe(),m=(()=>R!==null?(R&K.Open)===K.Open:t.listboxState===0)();ee(()=>{var x;let n=t.optionsRef.current;n&&t.listboxState===0&&n!==((x=Me(n))==null?void 0:x.activeElement)&&n.focus({preventScroll:!0})},[t.listboxState,t.optionsRef]);let P=f(n=>{switch(b.dispose(),n.key){case g.Space:if(t.searchQuery!=="")return n.preventDefault(),n.stopPropagation(),p.search(n.key);case g.Enter:if(n.preventDefault(),n.stopPropagation(),t.activeOptionIndex!==null){let{dataRef:x}=t.options[t.activeOptionIndex];p.onChange(x.current.value)}t.mode===0&&(p.closeListbox(),W().nextFrame(()=>{var x;return(x=t.buttonRef.current)==null?void 0:x.focus({preventScroll:!0})}));break;case C(t.orientation,{vertical:g.ArrowDown,horizontal:g.ArrowRight}):return n.preventDefault(),n.stopPropagation(),p.goToOption(A.Next);case C(t.orientation,{vertical:g.ArrowUp,horizontal:g.ArrowLeft}):return n.preventDefault(),n.stopPropagation(),p.goToOption(A.Previous);case g.Home:case g.PageUp:return n.preventDefault(),n.stopPropagation(),p.goToOption(A.First);case g.End:case g.PageDown:return n.preventDefault(),n.stopPropagation(),p.goToOption(A.Last);case g.Escape:return n.preventDefault(),n.stopPropagation(),p.closeListbox(),i.nextFrame(()=>{var x;return(x=t.buttonRef.current)==null?void 0:x.focus({preventScroll:!0})});case g.Tab:n.preventDefault(),n.stopPropagation();break;default:n.key.length===1&&(p.search(n.key),b.setTimeout(()=>p.clearSearch(),350));break}}),E=te(()=>{var n,x,h;return(h=(n=t.labelRef.current)==null?void 0:n.id)!=null?h:(x=t.buttonRef.current)==null?void 0:x.id},[t.labelRef.current,t.buttonRef.current]),L=D(()=>({open:t.listboxState===0}),[t]),v={"aria-activedescendant":t.activeOptionIndex===null||(c=t.options[t.activeOptionIndex])==null?void 0:c.id,"aria-multiselectable":t.mode===1?!0:void 0,"aria-labelledby":E,"aria-orientation":t.orientation,id:r,onKeyDown:P,role:"listbox",tabIndex:0,ref:u};return _({ourProps:v,theirProps:l,slot:L,defaultTag:ze,features:Je,visible:m,name:"Listbox.Options"})}let Ye="li";function Ze(e,a){let o=j(),{id:r=`headlessui-listbox-option-${o}`,disabled:l=!1,value:t,...p}=e,u=B("Listbox.Option"),i=U("Listbox.Option"),b=u.activeOptionIndex!==null?u.options[u.activeOptionIndex].id===r:!1,R=u.isSelected(t),m=I(null),P=we({disabled:l,value:t,domRef:m,get textValue(){var y,S;return(S=(y=m.current)==null?void 0:y.textContent)==null?void 0:S.toLowerCase()}}),E=k(a,m);V(()=>{if(u.listboxState!==0||!b||u.activationTrigger===0)return;let y=W();return y.requestAnimationFrame(()=>{var S,T;(T=(S=m.current)==null?void 0:S.scrollIntoView)==null||T.call(S,{block:"nearest"})}),y.dispose},[m,b,u.listboxState,u.activationTrigger,u.activeOptionIndex]),V(()=>i.registerOption(r,P),[P,r]);let L=f(y=>{if(l)return y.preventDefault();i.onChange(t),u.mode===0&&(i.closeListbox(),W().nextFrame(()=>{var S;return(S=u.buttonRef.current)==null?void 0:S.focus({preventScroll:!0})}))}),v=f(()=>{if(l)return i.goToOption(A.Nothing);i.goToOption(A.Specific,r)}),c=_e(),n=f(y=>c.update(y)),x=f(y=>{c.wasMoved(y)&&(l||b||i.goToOption(A.Specific,r,0))}),h=f(y=>{c.wasMoved(y)&&(l||b&&i.goToOption(A.Nothing))}),Q=D(()=>({active:b,selected:R,disabled:l}),[b,R,l]);return _({ourProps:{id:r,ref:E,role:"option",tabIndex:l===!0?void 0:-1,"aria-disabled":l===!0?!0:void 0,"aria-selected":R,disabled:void 0,onClick:L,onFocus:v,onPointerEnter:n,onMouseEnter:n,onPointerMove:x,onMouseMove:x,onPointerLeave:h,onMouseLeave:h},theirProps:p,slot:Q,defaultTag:Ye,name:"Listbox.Option"})}let et=w(Ke),tt=w(We),ot=w($e),nt=w(qe),it=w(Ze),Ht=Object.assign(et,{Button:tt,Label:ot,Options:nt,Option:it});export{Ht as Listbox}; | ||
import N,{Fragment as xe,createContext as Z,createRef as ye,useCallback as ge,useContext as ee,useEffect as te,useMemo as h,useReducer as Le,useRef as D}from"react";import{useDisposables as j}from'../../hooks/use-disposables.js';import{useId as V}from'../../hooks/use-id.js';import{useIsoMorphicEffect as K}from'../../hooks/use-iso-morphic-effect.js';import{useComputed as oe}from'../../hooks/use-computed.js';import{useSyncRefs as M}from'../../hooks/use-sync-refs.js';import{Features as ne,forwardRefWithAs as k,render as w,compact as Oe}from'../../utils/render.js';import{match as I}from'../../utils/match.js';import{disposables as $}from'../../utils/disposables.js';import{Keys as g}from'../keyboard.js';import{Focus as v,calculateActiveIndex as me}from'../../utils/calculate-active-index.js';import{isDisabledReactIssue7711 as Re}from'../../utils/bugs.js';import{isFocusableElement as ve,FocusableMode as Ae,sortByDomNode as Se}from'../../utils/focus-management.js';import{useOpenClosed as Pe,State as Q,OpenClosedProvider as Ee}from'../../internal/open-closed.js';import{useResolveButtonType as he}from'../../hooks/use-resolve-button-type.js';import{useOutsideClick as De}from'../../hooks/use-outside-click.js';import{Hidden as Ie,Features as Ce}from'../../internal/hidden.js';import{objectToFormEntries as Fe}from'../../utils/form.js';import{getOwnerDocument as Me}from'../../utils/owner.js';import{useEvent as f}from'../../hooks/use-event.js';import{useControllable as ke}from'../../hooks/use-controllable.js';import{useLatestValue as we}from'../../hooks/use-latest-value.js';import{useTrackedPointer as _e}from'../../hooks/use-tracked-pointer.js';import{useTextValue as Ue}from'../../hooks/use-text-value.js';var Be=(n=>(n[n.Open=0]="Open",n[n.Closed=1]="Closed",n))(Be||{}),He=(n=>(n[n.Single=0]="Single",n[n.Multi=1]="Multi",n))(He||{}),Ge=(n=>(n[n.Pointer=0]="Pointer",n[n.Other=1]="Other",n))(Ge||{}),Ne=(i=>(i[i.OpenListbox=0]="OpenListbox",i[i.CloseListbox=1]="CloseListbox",i[i.GoToOption=2]="GoToOption",i[i.Search=3]="Search",i[i.ClearSearch=4]="ClearSearch",i[i.RegisterOption=5]="RegisterOption",i[i.UnregisterOption=6]="UnregisterOption",i[i.RegisterLabel=7]="RegisterLabel",i))(Ne||{});function z(e,a=n=>n){let n=e.activeOptionIndex!==null?e.options[e.activeOptionIndex]:null,r=Se(a(e.options.slice()),t=>t.dataRef.current.domRef.current),l=n?r.indexOf(n):null;return l===-1&&(l=null),{options:r,activeOptionIndex:l}}let je={[1](e){return e.dataRef.current.disabled||e.listboxState===1?e:{...e,activeOptionIndex:null,listboxState:1}},[0](e){if(e.dataRef.current.disabled||e.listboxState===0)return e;let a=e.activeOptionIndex,{isSelected:n}=e.dataRef.current,r=e.options.findIndex(l=>n(l.dataRef.current.value));return r!==-1&&(a=r),{...e,listboxState:0,activeOptionIndex:a}},[2](e,a){var l;if(e.dataRef.current.disabled||e.listboxState===1)return e;let n=z(e),r=me(a,{resolveItems:()=>n.options,resolveActiveIndex:()=>n.activeOptionIndex,resolveId:t=>t.id,resolveDisabled:t=>t.dataRef.current.disabled});return{...e,...n,searchQuery:"",activeOptionIndex:r,activationTrigger:(l=a.trigger)!=null?l:1}},[3]:(e,a)=>{if(e.dataRef.current.disabled||e.listboxState===1)return e;let r=e.searchQuery!==""?0:1,l=e.searchQuery+a.value.toLowerCase(),p=(e.activeOptionIndex!==null?e.options.slice(e.activeOptionIndex+r).concat(e.options.slice(0,e.activeOptionIndex+r)):e.options).find(i=>{var b;return!i.dataRef.current.disabled&&((b=i.dataRef.current.textValue)==null?void 0:b.startsWith(l))}),u=p?e.options.indexOf(p):-1;return u===-1||u===e.activeOptionIndex?{...e,searchQuery:l}:{...e,searchQuery:l,activeOptionIndex:u,activationTrigger:1}},[4](e){return e.dataRef.current.disabled||e.listboxState===1||e.searchQuery===""?e:{...e,searchQuery:""}},[5]:(e,a)=>{let n={id:a.id,dataRef:a.dataRef},r=z(e,l=>[...l,n]);return e.activeOptionIndex===null&&e.dataRef.current.isSelected(a.dataRef.current.value)&&(r.activeOptionIndex=r.options.indexOf(n)),{...e,...r}},[6]:(e,a)=>{let n=z(e,r=>{let l=r.findIndex(t=>t.id===a.id);return l!==-1&&r.splice(l,1),r});return{...e,...n,activationTrigger:1}},[7]:(e,a)=>({...e,labelId:a.id})},J=Z(null);J.displayName="ListboxActionsContext";function _(e){let a=ee(J);if(a===null){let n=new Error(`<${e} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(n,_),n}return a}let q=Z(null);q.displayName="ListboxDataContext";function U(e){let a=ee(q);if(a===null){let n=new Error(`<${e} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(n,U),n}return a}function Ve(e,a){return I(a.type,je,e,a)}let Ke=xe;function Qe(e,a){let{value:n,defaultValue:r,form:l,name:t,onChange:p,by:u=(s,c)=>s===c,disabled:i=!1,horizontal:b=!1,multiple:R=!1,...m}=e;const P=b?"horizontal":"vertical";let S=M(a),[L=R?[]:void 0,y]=ke(n,p,r),[T,o]=Le(Ve,{dataRef:ye(),listboxState:1,options:[],searchQuery:"",labelId:null,activeOptionIndex:null,activationTrigger:1}),x=D({static:!1,hold:!1}),E=D(null),B=D(null),W=D(null),C=f(typeof u=="string"?(s,c)=>{let O=u;return(s==null?void 0:s[O])===(c==null?void 0:c[O])}:u),A=ge(s=>I(d.mode,{[1]:()=>L.some(c=>C(c,s)),[0]:()=>C(L,s)}),[L]),d=h(()=>({...T,value:L,disabled:i,mode:R?1:0,orientation:P,compare:C,isSelected:A,optionsPropsRef:x,labelRef:E,buttonRef:B,optionsRef:W}),[L,i,R,T]);K(()=>{T.dataRef.current=d},[d]),De([d.buttonRef,d.optionsRef],(s,c)=>{var O;o({type:1}),ve(c,Ae.Loose)||(s.preventDefault(),(O=d.buttonRef.current)==null||O.focus())},d.listboxState===0);let H=h(()=>({open:d.listboxState===0,disabled:i,value:L}),[d,i,L]),ie=f(s=>{let c=d.options.find(O=>O.id===s);c&&X(c.dataRef.current.value)}),re=f(()=>{if(d.activeOptionIndex!==null){let{dataRef:s,id:c}=d.options[d.activeOptionIndex];X(s.current.value),o({type:2,focus:v.Specific,id:c})}}),ae=f(()=>o({type:0})),le=f(()=>o({type:1})),se=f((s,c,O)=>s===v.Specific?o({type:2,focus:v.Specific,id:c,trigger:O}):o({type:2,focus:s,trigger:O})),pe=f((s,c)=>(o({type:5,id:s,dataRef:c}),()=>o({type:6,id:s}))),ue=f(s=>(o({type:7,id:s}),()=>o({type:7,id:null}))),X=f(s=>I(d.mode,{[0](){return y==null?void 0:y(s)},[1](){let c=d.value.slice(),O=c.findIndex(F=>C(F,s));return O===-1?c.push(s):c.splice(O,1),y==null?void 0:y(c)}})),de=f(s=>o({type:3,value:s})),ce=f(()=>o({type:4})),fe=h(()=>({onChange:X,registerOption:pe,registerLabel:ue,goToOption:se,closeListbox:le,openListbox:ae,selectActiveOption:re,selectOption:ie,search:de,clearSearch:ce}),[]),Te={ref:S},G=D(null),be=j();return te(()=>{G.current&&r!==void 0&&be.addEventListener(G.current,"reset",()=>{y==null||y(r)})},[G,y]),N.createElement(J.Provider,{value:fe},N.createElement(q.Provider,{value:d},N.createElement(Ee,{value:I(d.listboxState,{[0]:Q.Open,[1]:Q.Closed})},t!=null&&L!=null&&Fe({[t]:L}).map(([s,c],O)=>N.createElement(Ie,{features:Ce.Hidden,ref:O===0?F=>{var Y;G.current=(Y=F==null?void 0:F.closest("form"))!=null?Y:null}:void 0,...Oe({key:s,as:"input",type:"hidden",hidden:!0,readOnly:!0,form:l,name:s,value:c})})),w({ourProps:Te,theirProps:m,slot:H,defaultTag:Ke,name:"Listbox"}))))}let We="button";function Xe(e,a){var y;let n=V(),{id:r=`headlessui-listbox-button-${n}`,...l}=e,t=U("Listbox.Button"),p=_("Listbox.Button"),u=M(t.buttonRef,a),i=j(),b=f(T=>{switch(T.key){case g.Space:case g.Enter:case g.ArrowDown:T.preventDefault(),p.openListbox(),i.nextFrame(()=>{t.value||p.goToOption(v.First)});break;case g.ArrowUp:T.preventDefault(),p.openListbox(),i.nextFrame(()=>{t.value||p.goToOption(v.Last)});break}}),R=f(T=>{switch(T.key){case g.Space:T.preventDefault();break}}),m=f(T=>{if(Re(T.currentTarget))return T.preventDefault();t.listboxState===0?(p.closeListbox(),i.nextFrame(()=>{var o;return(o=t.buttonRef.current)==null?void 0:o.focus({preventScroll:!0})})):(T.preventDefault(),p.openListbox())}),P=oe(()=>{if(t.labelId)return[t.labelId,r].join(" ")},[t.labelId,r]),S=h(()=>({open:t.listboxState===0,disabled:t.disabled,value:t.value}),[t]),L={ref:u,id:r,type:he(e,t.buttonRef),"aria-haspopup":"listbox","aria-controls":(y=t.optionsRef.current)==null?void 0:y.id,"aria-expanded":t.listboxState===0,"aria-labelledby":P,disabled:t.disabled,onKeyDown:b,onKeyUp:R,onClick:m};return w({ourProps:L,theirProps:l,slot:S,defaultTag:We,name:"Listbox.Button"})}let $e="label";function ze(e,a){let n=V(),{id:r=`headlessui-listbox-label-${n}`,...l}=e,t=U("Listbox.Label"),p=_("Listbox.Label"),u=M(t.labelRef,a);K(()=>p.registerLabel(r),[r]);let i=f(()=>{var m;return(m=t.buttonRef.current)==null?void 0:m.focus({preventScroll:!0})}),b=h(()=>({open:t.listboxState===0,disabled:t.disabled}),[t]);return w({ourProps:{ref:u,id:r,onClick:i},theirProps:l,slot:b,defaultTag:$e,name:"Listbox.Label"})}let Je="ul",qe=ne.RenderStrategy|ne.Static;function Ye(e,a){var T;let n=V(),{id:r=`headlessui-listbox-options-${n}`,...l}=e,t=U("Listbox.Options"),p=_("Listbox.Options"),u=M(t.optionsRef,a),i=j(),b=j(),R=Pe(),m=(()=>R!==null?(R&Q.Open)===Q.Open:t.listboxState===0)();te(()=>{var x;let o=t.optionsRef.current;o&&t.listboxState===0&&o!==((x=Me(o))==null?void 0:x.activeElement)&&o.focus({preventScroll:!0})},[t.listboxState,t.optionsRef]);let P=f(o=>{switch(b.dispose(),o.key){case g.Space:if(t.searchQuery!=="")return o.preventDefault(),o.stopPropagation(),p.search(o.key);case g.Enter:if(o.preventDefault(),o.stopPropagation(),t.activeOptionIndex!==null){let{dataRef:x}=t.options[t.activeOptionIndex];p.onChange(x.current.value)}t.mode===0&&(p.closeListbox(),$().nextFrame(()=>{var x;return(x=t.buttonRef.current)==null?void 0:x.focus({preventScroll:!0})}));break;case I(t.orientation,{vertical:g.ArrowDown,horizontal:g.ArrowRight}):return o.preventDefault(),o.stopPropagation(),p.goToOption(v.Next);case I(t.orientation,{vertical:g.ArrowUp,horizontal:g.ArrowLeft}):return o.preventDefault(),o.stopPropagation(),p.goToOption(v.Previous);case g.Home:case g.PageUp:return o.preventDefault(),o.stopPropagation(),p.goToOption(v.First);case g.End:case g.PageDown:return o.preventDefault(),o.stopPropagation(),p.goToOption(v.Last);case g.Escape:return o.preventDefault(),o.stopPropagation(),p.closeListbox(),i.nextFrame(()=>{var x;return(x=t.buttonRef.current)==null?void 0:x.focus({preventScroll:!0})});case g.Tab:o.preventDefault(),o.stopPropagation();break;default:o.key.length===1&&(p.search(o.key),b.setTimeout(()=>p.clearSearch(),350));break}}),S=oe(()=>{var o,x,E;return(E=(o=t.labelRef.current)==null?void 0:o.id)!=null?E:(x=t.buttonRef.current)==null?void 0:x.id},[t.labelRef.current,t.buttonRef.current]),L=h(()=>({open:t.listboxState===0}),[t]),y={"aria-activedescendant":t.activeOptionIndex===null||(T=t.options[t.activeOptionIndex])==null?void 0:T.id,"aria-multiselectable":t.mode===1?!0:void 0,"aria-labelledby":S,"aria-orientation":t.orientation,id:r,onKeyDown:P,role:"listbox",tabIndex:0,ref:u};return w({ourProps:y,theirProps:l,slot:L,defaultTag:Je,features:qe,visible:m,name:"Listbox.Options"})}let Ze="li";function et(e,a){let n=V(),{id:r=`headlessui-listbox-option-${n}`,disabled:l=!1,value:t,...p}=e,u=U("Listbox.Option"),i=_("Listbox.Option"),b=u.activeOptionIndex!==null?u.options[u.activeOptionIndex].id===r:!1,R=u.isSelected(t),m=D(null),P=Ue(m),S=we({disabled:l,value:t,domRef:m,get textValue(){return P()}}),L=M(a,m);K(()=>{if(u.listboxState!==0||!b||u.activationTrigger===0)return;let A=$();return A.requestAnimationFrame(()=>{var d,H;(H=(d=m.current)==null?void 0:d.scrollIntoView)==null||H.call(d,{block:"nearest"})}),A.dispose},[m,b,u.listboxState,u.activationTrigger,u.activeOptionIndex]),K(()=>i.registerOption(r,S),[S,r]);let y=f(A=>{if(l)return A.preventDefault();i.onChange(t),u.mode===0&&(i.closeListbox(),$().nextFrame(()=>{var d;return(d=u.buttonRef.current)==null?void 0:d.focus({preventScroll:!0})}))}),T=f(()=>{if(l)return i.goToOption(v.Nothing);i.goToOption(v.Specific,r)}),o=_e(),x=f(A=>o.update(A)),E=f(A=>{o.wasMoved(A)&&(l||b||i.goToOption(v.Specific,r,0))}),B=f(A=>{o.wasMoved(A)&&(l||b&&i.goToOption(v.Nothing))}),W=h(()=>({active:b,selected:R,disabled:l}),[b,R,l]);return w({ourProps:{id:r,ref:L,role:"option",tabIndex:l===!0?void 0:-1,"aria-disabled":l===!0?!0:void 0,"aria-selected":R,disabled:void 0,onClick:y,onFocus:T,onPointerEnter:x,onMouseEnter:x,onPointerMove:E,onMouseMove:E,onPointerLeave:B,onMouseLeave:B},theirProps:p,slot:W,defaultTag:Ze,name:"Listbox.Option"})}let tt=k(Qe),ot=k(Xe),nt=k(ze),it=k(Ye),rt=k(et),Nt=Object.assign(tt,{Button:ot,Label:nt,Options:it,Option:rt});export{Nt as Listbox}; |
@@ -11,3 +11,5 @@ import React, { ElementType, Ref } from 'react'; | ||
} | ||
export type MenuProps<TTag extends ElementType> = Props<TTag, MenuRenderPropArg>; | ||
export type MenuProps<TTag extends ElementType> = Props<TTag, MenuRenderPropArg, never, { | ||
__demoMode?: boolean; | ||
}>; | ||
declare function MenuFn<TTag extends ElementType = typeof DEFAULT_MENU_TAG>(props: MenuProps<TTag>, ref: Ref<HTMLElement>): JSX.Element; | ||
@@ -14,0 +16,0 @@ declare let DEFAULT_BUTTON_TAG: "button"; |
@@ -1,1 +0,1 @@ | ||
import B,{Fragment as G,createContext as V,createRef as N,useContext as X,useEffect as $,useMemo as P,useReducer as q,useRef as H}from"react";import{match as K}from'../../utils/match.js';import{forwardRefWithAs as v,render as x,Features as j}from'../../utils/render.js';import{disposables as L}from'../../utils/disposables.js';import{useDisposables as Q}from'../../hooks/use-disposables.js';import{useIsoMorphicEffect as h}from'../../hooks/use-iso-morphic-effect.js';import{useSyncRefs as D}from'../../hooks/use-sync-refs.js';import{useId as k}from'../../hooks/use-id.js';import{Keys as d}from'../keyboard.js';import{Focus as y,calculateActiveIndex as z}from'../../utils/calculate-active-index.js';import{isDisabledReactIssue7711 as Y}from'../../utils/bugs.js';import{isFocusableElement as Z,FocusableMode as ee,sortByDomNode as te,Focus as W,focusFrom as ne,restoreFocusIfNecessary as J}from'../../utils/focus-management.js';import{useOutsideClick as re}from'../../hooks/use-outside-click.js';import{useTreeWalker as oe}from'../../hooks/use-tree-walker.js';import{useOpenClosed as ae,State as C,OpenClosedProvider as se}from'../../internal/open-closed.js';import{useResolveButtonType as ie}from'../../hooks/use-resolve-button-type.js';import{useOwnerDocument as ue}from'../../hooks/use-owner.js';import{useEvent as T}from'../../hooks/use-event.js';import{useTrackedPointer as le}from'../../hooks/use-tracked-pointer.js';var pe=(r=>(r[r.Open=0]="Open",r[r.Closed=1]="Closed",r))(pe||{}),ce=(r=>(r[r.Pointer=0]="Pointer",r[r.Other=1]="Other",r))(ce||{}),me=(a=>(a[a.OpenMenu=0]="OpenMenu",a[a.CloseMenu=1]="CloseMenu",a[a.GoToItem=2]="GoToItem",a[a.Search=3]="Search",a[a.ClearSearch=4]="ClearSearch",a[a.RegisterItem=5]="RegisterItem",a[a.UnregisterItem=6]="UnregisterItem",a))(me||{});function w(e,u=r=>r){let r=e.activeItemIndex!==null?e.items[e.activeItemIndex]:null,i=te(u(e.items.slice()),t=>t.dataRef.current.domRef.current),s=r?i.indexOf(r):null;return s===-1&&(s=null),{items:i,activeItemIndex:s}}let de={[1](e){return e.menuState===1?e:{...e,activeItemIndex:null,menuState:1}},[0](e){return e.menuState===0?e:{...e,menuState:0}},[2]:(e,u)=>{var s;let r=w(e),i=z(u,{resolveItems:()=>r.items,resolveActiveIndex:()=>r.activeItemIndex,resolveId:t=>t.id,resolveDisabled:t=>t.dataRef.current.disabled});return{...e,...r,searchQuery:"",activeItemIndex:i,activationTrigger:(s=u.trigger)!=null?s:1}},[3]:(e,u)=>{let i=e.searchQuery!==""?0:1,s=e.searchQuery+u.value.toLowerCase(),o=(e.activeItemIndex!==null?e.items.slice(e.activeItemIndex+i).concat(e.items.slice(0,e.activeItemIndex+i)):e.items).find(l=>{var m;return((m=l.dataRef.current.textValue)==null?void 0:m.startsWith(s))&&!l.dataRef.current.disabled}),a=o?e.items.indexOf(o):-1;return a===-1||a===e.activeItemIndex?{...e,searchQuery:s}:{...e,searchQuery:s,activeItemIndex:a,activationTrigger:1}},[4](e){return e.searchQuery===""?e:{...e,searchQuery:"",searchActiveItemIndex:null}},[5]:(e,u)=>{let r=w(e,i=>[...i,{id:u.id,dataRef:u.dataRef}]);return{...e,...r}},[6]:(e,u)=>{let r=w(e,i=>{let s=i.findIndex(t=>t.id===u.id);return s!==-1&&i.splice(s,1),i});return{...e,...r,activationTrigger:1}}},U=V(null);U.displayName="MenuContext";function F(e){let u=X(U);if(u===null){let r=new Error(`<${e} /> is missing a parent <Menu /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,F),r}return u}function fe(e,u){return K(u.type,de,e,u)}let Te=G;function ye(e,u){let r=q(fe,{menuState:1,buttonRef:N(),itemsRef:N(),items:[],searchQuery:"",activeItemIndex:null,activationTrigger:1}),[{menuState:i,itemsRef:s,buttonRef:t},o]=r,a=D(u);re([t,s],(g,A)=>{var I;o({type:1}),Z(A,ee.Loose)||(g.preventDefault(),(I=t.current)==null||I.focus())},i===0);let l=T(()=>{o({type:1})}),m=P(()=>({open:i===0,close:l}),[i,l]),M=e,f={ref:a};return B.createElement(U.Provider,{value:r},B.createElement(se,{value:K(i,{[0]:C.Open,[1]:C.Closed})},x({ourProps:f,theirProps:M,slot:m,defaultTag:Te,name:"Menu"})))}let Ie="button";function Me(e,u){var I;let r=k(),{id:i=`headlessui-menu-button-${r}`,...s}=e,[t,o]=F("Menu.Button"),a=D(t.buttonRef,u),l=Q(),m=T(p=>{switch(p.key){case d.Space:case d.Enter:case d.ArrowDown:p.preventDefault(),p.stopPropagation(),o({type:0}),l.nextFrame(()=>o({type:2,focus:y.First}));break;case d.ArrowUp:p.preventDefault(),p.stopPropagation(),o({type:0}),l.nextFrame(()=>o({type:2,focus:y.Last}));break}}),M=T(p=>{switch(p.key){case d.Space:p.preventDefault();break}}),f=T(p=>{if(Y(p.currentTarget))return p.preventDefault();e.disabled||(t.menuState===0?(o({type:1}),l.nextFrame(()=>{var R;return(R=t.buttonRef.current)==null?void 0:R.focus({preventScroll:!0})})):(p.preventDefault(),o({type:0})))}),g=P(()=>({open:t.menuState===0}),[t]),A={ref:a,id:i,type:ie(e,t.buttonRef),"aria-haspopup":"menu","aria-controls":(I=t.itemsRef.current)==null?void 0:I.id,"aria-expanded":e.disabled?void 0:t.menuState===0,onKeyDown:m,onKeyUp:M,onClick:f};return x({ourProps:A,theirProps:s,slot:g,defaultTag:Ie,name:"Menu.Button"})}let ge="div",Re=j.RenderStrategy|j.Static;function Ae(e,u){var R,E;let r=k(),{id:i=`headlessui-menu-items-${r}`,...s}=e,[t,o]=F("Menu.Items"),a=D(t.itemsRef,u),l=ue(t.itemsRef),m=Q(),M=ae(),f=(()=>M!==null?(M&C.Open)===C.Open:t.menuState===0)();$(()=>{let n=t.itemsRef.current;n&&t.menuState===0&&n!==(l==null?void 0:l.activeElement)&&n.focus({preventScroll:!0})},[t.menuState,t.itemsRef,l]),oe({container:t.itemsRef.current,enabled:t.menuState===0,accept(n){return n.getAttribute("role")==="menuitem"?NodeFilter.FILTER_REJECT:n.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(n){n.setAttribute("role","none")}});let g=T(n=>{var S,O;switch(m.dispose(),n.key){case d.Space:if(t.searchQuery!=="")return n.preventDefault(),n.stopPropagation(),o({type:3,value:n.key});case d.Enter:if(n.preventDefault(),n.stopPropagation(),o({type:1}),t.activeItemIndex!==null){let{dataRef:c}=t.items[t.activeItemIndex];(O=(S=c.current)==null?void 0:S.domRef.current)==null||O.click()}J(t.buttonRef.current);break;case d.ArrowDown:return n.preventDefault(),n.stopPropagation(),o({type:2,focus:y.Next});case d.ArrowUp:return n.preventDefault(),n.stopPropagation(),o({type:2,focus:y.Previous});case d.Home:case d.PageUp:return n.preventDefault(),n.stopPropagation(),o({type:2,focus:y.First});case d.End:case d.PageDown:return n.preventDefault(),n.stopPropagation(),o({type:2,focus:y.Last});case d.Escape:n.preventDefault(),n.stopPropagation(),o({type:1}),L().nextFrame(()=>{var c;return(c=t.buttonRef.current)==null?void 0:c.focus({preventScroll:!0})});break;case d.Tab:n.preventDefault(),n.stopPropagation(),o({type:1}),L().nextFrame(()=>{ne(t.buttonRef.current,n.shiftKey?W.Previous:W.Next)});break;default:n.key.length===1&&(o({type:3,value:n.key}),m.setTimeout(()=>o({type:4}),350));break}}),A=T(n=>{switch(n.key){case d.Space:n.preventDefault();break}}),I=P(()=>({open:t.menuState===0}),[t]),p={"aria-activedescendant":t.activeItemIndex===null||(R=t.items[t.activeItemIndex])==null?void 0:R.id,"aria-labelledby":(E=t.buttonRef.current)==null?void 0:E.id,id:i,onKeyDown:g,onKeyUp:A,role:"menu",tabIndex:0,ref:a};return x({ourProps:p,theirProps:s,slot:I,defaultTag:ge,features:Re,visible:f,name:"Menu.Items"})}let be=G;function Ee(e,u){let r=k(),{id:i=`headlessui-menu-item-${r}`,disabled:s=!1,...t}=e,[o,a]=F("Menu.Item"),l=o.activeItemIndex!==null?o.items[o.activeItemIndex].id===i:!1,m=H(null),M=D(u,m);h(()=>{if(o.menuState!==0||!l||o.activationTrigger===0)return;let c=L();return c.requestAnimationFrame(()=>{var b,_;(_=(b=m.current)==null?void 0:b.scrollIntoView)==null||_.call(b,{block:"nearest"})}),c.dispose},[m,l,o.menuState,o.activationTrigger,o.activeItemIndex]);let f=H({disabled:s,domRef:m});h(()=>{f.current.disabled=s},[f,s]),h(()=>{var c,b;f.current.textValue=(b=(c=m.current)==null?void 0:c.textContent)==null?void 0:b.toLowerCase()},[f,m]),h(()=>(a({type:5,id:i,dataRef:f}),()=>a({type:6,id:i})),[f,i]);let g=T(()=>{a({type:1})}),A=T(c=>{if(s)return c.preventDefault();a({type:1}),J(o.buttonRef.current)}),I=T(()=>{if(s)return a({type:2,focus:y.Nothing});a({type:2,focus:y.Specific,id:i})}),p=le(),R=T(c=>p.update(c)),E=T(c=>{p.wasMoved(c)&&(s||l||a({type:2,focus:y.Specific,id:i,trigger:0}))}),n=T(c=>{p.wasMoved(c)&&(s||l&&a({type:2,focus:y.Nothing}))}),S=P(()=>({active:l,disabled:s,close:g}),[l,s,g]);return x({ourProps:{id:i,ref:M,role:"menuitem",tabIndex:s===!0?void 0:-1,"aria-disabled":s===!0?!0:void 0,disabled:void 0,onClick:A,onFocus:I,onPointerEnter:R,onMouseEnter:R,onPointerMove:E,onMouseMove:E,onPointerLeave:n,onMouseLeave:n},theirProps:t,slot:S,defaultTag:be,name:"Menu.Item"})}let Se=v(ye),Pe=v(Me),ve=v(Ae),xe=v(Ee),ot=Object.assign(Se,{Button:Pe,Items:ve,Item:xe});export{ot as Menu}; | ||
import G,{Fragment as N,createContext as X,createRef as H,useContext as $,useEffect as q,useMemo as x,useReducer as z,useRef as K}from"react";import{match as j}from'../../utils/match.js';import{forwardRefWithAs as h,render as D,Features as Q}from'../../utils/render.js';import{disposables as _}from'../../utils/disposables.js';import{useDisposables as W}from'../../hooks/use-disposables.js';import{useIsoMorphicEffect as L}from'../../hooks/use-iso-morphic-effect.js';import{useSyncRefs as F}from'../../hooks/use-sync-refs.js';import{useId as k}from'../../hooks/use-id.js';import{Keys as c}from'../keyboard.js';import{Focus as y,calculateActiveIndex as Y}from'../../utils/calculate-active-index.js';import{isDisabledReactIssue7711 as Z}from'../../utils/bugs.js';import{isFocusableElement as ee,FocusableMode as te,sortByDomNode as ne,Focus as V,focusFrom as re,restoreFocusIfNecessary as J}from'../../utils/focus-management.js';import{useOutsideClick as oe}from'../../hooks/use-outside-click.js';import{useTreeWalker as ae}from'../../hooks/use-tree-walker.js';import{useOpenClosed as se,State as C,OpenClosedProvider as ie}from'../../internal/open-closed.js';import{useResolveButtonType as ue}from'../../hooks/use-resolve-button-type.js';import{useOwnerDocument as le}from'../../hooks/use-owner.js';import{useEvent as d}from'../../hooks/use-event.js';import{useTrackedPointer as pe}from'../../hooks/use-tracked-pointer.js';import{useTextValue as ce}from'../../hooks/use-text-value.js';var me=(r=>(r[r.Open=0]="Open",r[r.Closed=1]="Closed",r))(me||{}),de=(r=>(r[r.Pointer=0]="Pointer",r[r.Other=1]="Other",r))(de||{}),fe=(a=>(a[a.OpenMenu=0]="OpenMenu",a[a.CloseMenu=1]="CloseMenu",a[a.GoToItem=2]="GoToItem",a[a.Search=3]="Search",a[a.ClearSearch=4]="ClearSearch",a[a.RegisterItem=5]="RegisterItem",a[a.UnregisterItem=6]="UnregisterItem",a))(fe||{});function w(e,u=r=>r){let r=e.activeItemIndex!==null?e.items[e.activeItemIndex]:null,i=ne(u(e.items.slice()),t=>t.dataRef.current.domRef.current),s=r?i.indexOf(r):null;return s===-1&&(s=null),{items:i,activeItemIndex:s}}let Te={[1](e){return e.menuState===1?e:{...e,activeItemIndex:null,menuState:1}},[0](e){return e.menuState===0?e:{...e,__demoMode:!1,menuState:0}},[2]:(e,u)=>{var s;let r=w(e),i=Y(u,{resolveItems:()=>r.items,resolveActiveIndex:()=>r.activeItemIndex,resolveId:t=>t.id,resolveDisabled:t=>t.dataRef.current.disabled});return{...e,...r,searchQuery:"",activeItemIndex:i,activationTrigger:(s=u.trigger)!=null?s:1}},[3]:(e,u)=>{let i=e.searchQuery!==""?0:1,s=e.searchQuery+u.value.toLowerCase(),o=(e.activeItemIndex!==null?e.items.slice(e.activeItemIndex+i).concat(e.items.slice(0,e.activeItemIndex+i)):e.items).find(l=>{var m;return((m=l.dataRef.current.textValue)==null?void 0:m.startsWith(s))&&!l.dataRef.current.disabled}),a=o?e.items.indexOf(o):-1;return a===-1||a===e.activeItemIndex?{...e,searchQuery:s}:{...e,searchQuery:s,activeItemIndex:a,activationTrigger:1}},[4](e){return e.searchQuery===""?e:{...e,searchQuery:"",searchActiveItemIndex:null}},[5]:(e,u)=>{let r=w(e,i=>[...i,{id:u.id,dataRef:u.dataRef}]);return{...e,...r}},[6]:(e,u)=>{let r=w(e,i=>{let s=i.findIndex(t=>t.id===u.id);return s!==-1&&i.splice(s,1),i});return{...e,...r,activationTrigger:1}}},U=X(null);U.displayName="MenuContext";function O(e){let u=$(U);if(u===null){let r=new Error(`<${e} /> is missing a parent <Menu /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,O),r}return u}function ye(e,u){return j(u.type,Te,e,u)}let Ie=N;function Me(e,u){let{__demoMode:r=!1,...i}=e,s=z(ye,{__demoMode:r,menuState:r?0:1,buttonRef:H(),itemsRef:H(),items:[],searchQuery:"",activeItemIndex:null,activationTrigger:1}),[{menuState:t,itemsRef:o,buttonRef:a},l]=s,m=F(u);oe([a,o],(g,R)=>{var p;l({type:1}),ee(R,te.Loose)||(g.preventDefault(),(p=a.current)==null||p.focus())},t===0);let I=d(()=>{l({type:1})}),A=x(()=>({open:t===0,close:I}),[t,I]),f={ref:m};return G.createElement(U.Provider,{value:s},G.createElement(ie,{value:j(t,{[0]:C.Open,[1]:C.Closed})},D({ourProps:f,theirProps:i,slot:A,defaultTag:Ie,name:"Menu"})))}let ge="button";function Re(e,u){var R;let r=k(),{id:i=`headlessui-menu-button-${r}`,...s}=e,[t,o]=O("Menu.Button"),a=F(t.buttonRef,u),l=W(),m=d(p=>{switch(p.key){case c.Space:case c.Enter:case c.ArrowDown:p.preventDefault(),p.stopPropagation(),o({type:0}),l.nextFrame(()=>o({type:2,focus:y.First}));break;case c.ArrowUp:p.preventDefault(),p.stopPropagation(),o({type:0}),l.nextFrame(()=>o({type:2,focus:y.Last}));break}}),I=d(p=>{switch(p.key){case c.Space:p.preventDefault();break}}),A=d(p=>{if(Z(p.currentTarget))return p.preventDefault();e.disabled||(t.menuState===0?(o({type:1}),l.nextFrame(()=>{var M;return(M=t.buttonRef.current)==null?void 0:M.focus({preventScroll:!0})})):(p.preventDefault(),o({type:0})))}),f=x(()=>({open:t.menuState===0}),[t]),g={ref:a,id:i,type:ue(e,t.buttonRef),"aria-haspopup":"menu","aria-controls":(R=t.itemsRef.current)==null?void 0:R.id,"aria-expanded":t.menuState===0,onKeyDown:m,onKeyUp:I,onClick:A};return D({ourProps:g,theirProps:s,slot:f,defaultTag:ge,name:"Menu.Button"})}let Ae="div",be=Q.RenderStrategy|Q.Static;function Ee(e,u){var M,b;let r=k(),{id:i=`headlessui-menu-items-${r}`,...s}=e,[t,o]=O("Menu.Items"),a=F(t.itemsRef,u),l=le(t.itemsRef),m=W(),I=se(),A=(()=>I!==null?(I&C.Open)===C.Open:t.menuState===0)();q(()=>{let n=t.itemsRef.current;n&&t.menuState===0&&n!==(l==null?void 0:l.activeElement)&&n.focus({preventScroll:!0})},[t.menuState,t.itemsRef,l]),ae({container:t.itemsRef.current,enabled:t.menuState===0,accept(n){return n.getAttribute("role")==="menuitem"?NodeFilter.FILTER_REJECT:n.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(n){n.setAttribute("role","none")}});let f=d(n=>{var E,P;switch(m.dispose(),n.key){case c.Space:if(t.searchQuery!=="")return n.preventDefault(),n.stopPropagation(),o({type:3,value:n.key});case c.Enter:if(n.preventDefault(),n.stopPropagation(),o({type:1}),t.activeItemIndex!==null){let{dataRef:S}=t.items[t.activeItemIndex];(P=(E=S.current)==null?void 0:E.domRef.current)==null||P.click()}J(t.buttonRef.current);break;case c.ArrowDown:return n.preventDefault(),n.stopPropagation(),o({type:2,focus:y.Next});case c.ArrowUp:return n.preventDefault(),n.stopPropagation(),o({type:2,focus:y.Previous});case c.Home:case c.PageUp:return n.preventDefault(),n.stopPropagation(),o({type:2,focus:y.First});case c.End:case c.PageDown:return n.preventDefault(),n.stopPropagation(),o({type:2,focus:y.Last});case c.Escape:n.preventDefault(),n.stopPropagation(),o({type:1}),_().nextFrame(()=>{var S;return(S=t.buttonRef.current)==null?void 0:S.focus({preventScroll:!0})});break;case c.Tab:n.preventDefault(),n.stopPropagation(),o({type:1}),_().nextFrame(()=>{re(t.buttonRef.current,n.shiftKey?V.Previous:V.Next)});break;default:n.key.length===1&&(o({type:3,value:n.key}),m.setTimeout(()=>o({type:4}),350));break}}),g=d(n=>{switch(n.key){case c.Space:n.preventDefault();break}}),R=x(()=>({open:t.menuState===0}),[t]),p={"aria-activedescendant":t.activeItemIndex===null||(M=t.items[t.activeItemIndex])==null?void 0:M.id,"aria-labelledby":(b=t.buttonRef.current)==null?void 0:b.id,id:i,onKeyDown:f,onKeyUp:g,role:"menu",tabIndex:0,ref:a};return D({ourProps:p,theirProps:s,slot:R,defaultTag:Ae,features:be,visible:A,name:"Menu.Items"})}let Se=N;function Pe(e,u){let r=k(),{id:i=`headlessui-menu-item-${r}`,disabled:s=!1,...t}=e,[o,a]=O("Menu.Item"),l=o.activeItemIndex!==null?o.items[o.activeItemIndex].id===i:!1,m=K(null),I=F(u,m);L(()=>{if(o.__demoMode||o.menuState!==0||!l||o.activationTrigger===0)return;let T=_();return T.requestAnimationFrame(()=>{var v,B;(B=(v=m.current)==null?void 0:v.scrollIntoView)==null||B.call(v,{block:"nearest"})}),T.dispose},[o.__demoMode,m,l,o.menuState,o.activationTrigger,o.activeItemIndex]);let A=ce(m),f=K({disabled:s,domRef:m,get textValue(){return A()}});L(()=>{f.current.disabled=s},[f,s]),L(()=>(a({type:5,id:i,dataRef:f}),()=>a({type:6,id:i})),[f,i]);let g=d(()=>{a({type:1})}),R=d(T=>{if(s)return T.preventDefault();a({type:1}),J(o.buttonRef.current)}),p=d(()=>{if(s)return a({type:2,focus:y.Nothing});a({type:2,focus:y.Specific,id:i})}),M=pe(),b=d(T=>M.update(T)),n=d(T=>{M.wasMoved(T)&&(s||l||a({type:2,focus:y.Specific,id:i,trigger:0}))}),E=d(T=>{M.wasMoved(T)&&(s||l&&a({type:2,focus:y.Nothing}))}),P=x(()=>({active:l,disabled:s,close:g}),[l,s,g]);return D({ourProps:{id:i,ref:I,role:"menuitem",tabIndex:s===!0?void 0:-1,"aria-disabled":s===!0?!0:void 0,disabled:void 0,onClick:R,onFocus:p,onPointerEnter:b,onMouseEnter:b,onPointerMove:n,onMouseMove:n,onPointerLeave:E,onMouseLeave:E},theirProps:t,slot:P,defaultTag:Se,name:"Menu.Item"})}let ve=h(Me),xe=h(Re),he=h(Ee),De=h(Pe),it=Object.assign(ve,{Button:xe,Items:he,Item:De});export{it as Menu}; |
@@ -10,3 +10,5 @@ import React, { ElementType, MutableRefObject, Ref, MouseEventHandler } from 'react'; | ||
} | ||
export type PopoverProps<TTag extends ElementType> = Props<TTag, PopoverRenderPropArg>; | ||
export type PopoverProps<TTag extends ElementType> = Props<TTag, PopoverRenderPropArg, never, { | ||
__demoMode?: boolean; | ||
}>; | ||
declare function PopoverFn<TTag extends ElementType = typeof DEFAULT_POPOVER_TAG>(props: PopoverProps<TTag>, ref: Ref<HTMLElement>): JSX.Element; | ||
@@ -13,0 +15,0 @@ declare let DEFAULT_BUTTON_TAG: "button"; |
@@ -1,1 +0,1 @@ | ||
import I,{createContext as X,createRef as ue,useContext as Y,useEffect as q,useMemo as D,useReducer as me,useRef as V,useState as ie}from"react";import{match as _}from'../../utils/match.js';import{forwardRefWithAs as $,render as J,Features as z}from'../../utils/render.js';import{optionalRef as ye,useSyncRefs as U}from'../../hooks/use-sync-refs.js';import{useId as K}from'../../hooks/use-id.js';import{Keys as k}from'../keyboard.js';import{isDisabledReactIssue7711 as fe}from'../../utils/bugs.js';import{getFocusableElements as ee,Focus as h,focusIn as w,isFocusableElement as Ee,FocusableMode as ge,FocusResult as te}from'../../utils/focus-management.js';import{OpenClosedProvider as be,State as W,useOpenClosed as Pe}from'../../internal/open-closed.js';import{useResolveButtonType as Se}from'../../hooks/use-resolve-button-type.js';import{useOutsideClick as Ae}from'../../hooks/use-outside-click.js';import{getOwnerDocument as Re}from'../../utils/owner.js';import{useOwnerDocument as oe}from'../../hooks/use-owner.js';import{useEventListener as Oe}from'../../hooks/use-event-listener.js';import{Hidden as re,Features as ne}from'../../internal/hidden.js';import{useEvent as b}from'../../hooks/use-event.js';import{useTabDirection as de,Direction as H}from'../../hooks/use-tab-direction.js';import'../../utils/micro-task.js';import{useLatestValue as ce}from'../../hooks/use-latest-value.js';import{useIsoMorphicEffect as Ce}from'../../hooks/use-iso-morphic-effect.js';var Fe=(s=>(s[s.Open=0]="Open",s[s.Closed=1]="Closed",s))(Fe||{}),Ie=(t=>(t[t.TogglePopover=0]="TogglePopover",t[t.ClosePopover=1]="ClosePopover",t[t.SetButton=2]="SetButton",t[t.SetButtonId=3]="SetButtonId",t[t.SetPanel=4]="SetPanel",t[t.SetPanelId=5]="SetPanelId",t))(Ie||{});let xe={[0]:o=>({...o,popoverState:_(o.popoverState,{[0]:1,[1]:0})}),[1](o){return o.popoverState===1?o:{...o,popoverState:1}},[2](o,l){return o.button===l.button?o:{...o,button:l.button}},[3](o,l){return o.buttonId===l.buttonId?o:{...o,buttonId:l.buttonId}},[4](o,l){return o.panel===l.panel?o:{...o,panel:l.panel}},[5](o,l){return o.panelId===l.panelId?o:{...o,panelId:l.panelId}}},le=X(null);le.displayName="PopoverContext";function Q(o){let l=Y(le);if(l===null){let s=new Error(`<${o} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(s,Q),s}return l}let ae=X(null);ae.displayName="PopoverAPIContext";function pe(o){let l=Y(ae);if(l===null){let s=new Error(`<${o} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(s,pe),s}return l}let se=X(null);se.displayName="PopoverGroupContext";function ve(){return Y(se)}let Z=X(null);Z.displayName="PopoverPanelContext";function Le(){return Y(Z)}function Me(o,l){return _(l.type,xe,o,l)}let Be="div";function De(o,l){var B;let s=V(null),R=U(l,ye(e=>{s.current=e})),C=V([]),r=me(Me,{popoverState:1,buttons:C,button:null,buttonId:null,panel:null,panelId:null,beforePanelSentinel:ue(),afterPanelSentinel:ue()}),[{popoverState:t,button:a,buttonId:v,panel:f,panelId:F,beforePanelSentinel:T,afterPanelSentinel:d},i]=r,p=oe((B=s.current)!=null?B:a),P=D(()=>{if(!a||!f)return!1;for(let N of document.querySelectorAll("body > *"))if(Number(N==null?void 0:N.contains(a))^Number(N==null?void 0:N.contains(f)))return!0;let e=ee(),n=e.indexOf(a),A=(n+e.length-1)%e.length,g=(n+1)%e.length,G=e[A],Te=e[g];return!f.contains(G)&&!f.contains(Te)},[a,f]),S=ce(v),y=ce(F),x=D(()=>({buttonId:S,panelId:y,close:()=>i({type:1})}),[S,y,i]),O=ve(),L=O==null?void 0:O.registerPopover,j=b(()=>{var e;return(e=O==null?void 0:O.isFocusWithinPopoverGroup())!=null?e:(p==null?void 0:p.activeElement)&&((a==null?void 0:a.contains(p.activeElement))||(f==null?void 0:f.contains(p.activeElement)))});q(()=>L==null?void 0:L(x),[L,x]),Oe(p==null?void 0:p.defaultView,"focus",e=>{var n,A,g,G;t===0&&(j()||a&&f&&e.target!==window&&((A=(n=T.current)==null?void 0:n.contains)!=null&&A.call(n,e.target)||(G=(g=d.current)==null?void 0:g.contains)!=null&&G.call(g,e.target)||i({type:1})))},!0),Ae([a,f],(e,n)=>{i({type:1}),Ee(n,ge.Loose)||(e.preventDefault(),a==null||a.focus())},t===0);let M=b(e=>{i({type:1});let n=(()=>e?e instanceof HTMLElement?e:"current"in e&&e.current instanceof HTMLElement?e.current:a:a)();n==null||n.focus()}),u=D(()=>({close:M,isPortalled:P}),[M,P]),m=D(()=>({open:t===0,close:M}),[t,M]),E=o,c={ref:R};return I.createElement(Z.Provider,{value:null},I.createElement(le.Provider,{value:r},I.createElement(ae.Provider,{value:u},I.createElement(be,{value:_(t,{[0]:W.Open,[1]:W.Closed})},J({ourProps:c,theirProps:E,slot:m,defaultTag:Be,name:"Popover"})))))}let he="button";function He(o,l){let s=K(),{id:R=`headlessui-popover-button-${s}`,...C}=o,[r,t]=Q("Popover.Button"),{isPortalled:a}=pe("Popover.Button"),v=V(null),f=`headlessui-focus-sentinel-${K()}`,F=ve(),T=F==null?void 0:F.closeOthers,i=Le()!==null;q(()=>{if(!i)return t({type:3,buttonId:R}),()=>{t({type:3,buttonId:null})}},[i,R,t]);let[p]=ie(()=>Symbol()),P=U(v,l,i?null:e=>{if(e)r.buttons.current.push(p);else{let n=r.buttons.current.indexOf(p);n!==-1&&r.buttons.current.splice(n,1)}r.buttons.current.length>1&&console.warn("You are already using a <Popover.Button /> but only 1 <Popover.Button /> is supported."),e&&t({type:2,button:e})}),S=U(v,l),y=oe(v),x=b(e=>{var n,A,g;if(i){if(r.popoverState===1)return;switch(e.key){case k.Space:case k.Enter:e.preventDefault(),(A=(n=e.target).click)==null||A.call(n),t({type:1}),(g=r.button)==null||g.focus();break}}else switch(e.key){case k.Space:case k.Enter:e.preventDefault(),e.stopPropagation(),r.popoverState===1&&(T==null||T(r.buttonId)),t({type:0});break;case k.Escape:if(r.popoverState!==0)return T==null?void 0:T(r.buttonId);if(!v.current||y!=null&&y.activeElement&&!v.current.contains(y.activeElement))return;e.preventDefault(),e.stopPropagation(),t({type:1});break}}),O=b(e=>{i||e.key===k.Space&&e.preventDefault()}),L=b(e=>{var n,A;fe(e.currentTarget)||o.disabled||(i?(t({type:1}),(n=r.button)==null||n.focus()):(e.preventDefault(),e.stopPropagation(),r.popoverState===1&&(T==null||T(r.buttonId)),t({type:0}),(A=r.button)==null||A.focus()))}),j=b(e=>{e.preventDefault(),e.stopPropagation()}),M=r.popoverState===0,u=D(()=>({open:M}),[M]),m=Se(o,v),E=i?{ref:S,type:m,onKeyDown:x,onClick:L}:{ref:P,id:r.buttonId,type:m,"aria-expanded":o.disabled?void 0:r.popoverState===0,"aria-controls":r.panel?r.panelId:void 0,onKeyDown:x,onKeyUp:O,onClick:L,onMouseDown:j},c=de(),B=b(()=>{let e=r.panel;if(!e)return;function n(){_(c.current,{[H.Forwards]:()=>w(e,h.First),[H.Backwards]:()=>w(e,h.Last)})===te.Error&&w(ee().filter(g=>g.dataset.headlessuiFocusGuard!=="true"),_(c.current,{[H.Forwards]:h.Next,[H.Backwards]:h.Previous}),{relativeTo:r.button})}n()});return I.createElement(I.Fragment,null,J({ourProps:E,theirProps:C,slot:u,defaultTag:he,name:"Popover.Button"}),M&&!i&&a&&I.createElement(re,{id:f,features:ne.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:B}))}let Ge="div",_e=z.RenderStrategy|z.Static;function ke(o,l){let s=K(),{id:R=`headlessui-popover-overlay-${s}`,...C}=o,[{popoverState:r},t]=Q("Popover.Overlay"),a=U(l),v=Pe(),f=(()=>v!==null?(v&W.Open)===W.Open:r===0)(),F=b(i=>{if(fe(i.currentTarget))return i.preventDefault();t({type:1})}),T=D(()=>({open:r===0}),[r]);return J({ourProps:{ref:a,id:R,"aria-hidden":!0,onClick:F},theirProps:C,slot:T,defaultTag:Ge,features:_e,visible:f,name:"Popover.Overlay"})}let we="div",Ne=z.RenderStrategy|z.Static;function Ue(o,l){let s=K(),{id:R=`headlessui-popover-panel-${s}`,focus:C=!1,...r}=o,[t,a]=Q("Popover.Panel"),{close:v,isPortalled:f}=pe("Popover.Panel"),F=`headlessui-focus-sentinel-before-${K()}`,T=`headlessui-focus-sentinel-after-${K()}`,d=V(null),i=U(d,l,u=>{a({type:4,panel:u})}),p=oe(d);Ce(()=>(a({type:5,panelId:R}),()=>{a({type:5,panelId:null})}),[R,a]);let P=Pe(),S=(()=>P!==null?(P&W.Open)===W.Open:t.popoverState===0)(),y=b(u=>{var m;switch(u.key){case k.Escape:if(t.popoverState!==0||!d.current||p!=null&&p.activeElement&&!d.current.contains(p.activeElement))return;u.preventDefault(),u.stopPropagation(),a({type:1}),(m=t.button)==null||m.focus();break}});q(()=>{var u;o.static||t.popoverState===1&&((u=o.unmount)==null||u)&&a({type:4,panel:null})},[t.popoverState,o.unmount,o.static,a]),q(()=>{if(!C||t.popoverState!==0||!d.current)return;let u=p==null?void 0:p.activeElement;d.current.contains(u)||w(d.current,h.First)},[C,d,t.popoverState]);let x=D(()=>({open:t.popoverState===0,close:v}),[t,v]),O={ref:i,id:R,onKeyDown:y,onBlur:C&&t.popoverState===0?u=>{var E,c,B,e,n;let m=u.relatedTarget;m&&d.current&&((E=d.current)!=null&&E.contains(m)||(a({type:1}),((B=(c=t.beforePanelSentinel.current)==null?void 0:c.contains)!=null&&B.call(c,m)||(n=(e=t.afterPanelSentinel.current)==null?void 0:e.contains)!=null&&n.call(e,m))&&m.focus({preventScroll:!0})))}:void 0,tabIndex:-1},L=de(),j=b(()=>{let u=d.current;if(!u)return;function m(){_(L.current,{[H.Forwards]:()=>{var c;w(u,h.First)===te.Error&&((c=t.afterPanelSentinel.current)==null||c.focus())},[H.Backwards]:()=>{var E;(E=t.button)==null||E.focus({preventScroll:!0})}})}m()}),M=b(()=>{let u=d.current;if(!u)return;function m(){_(L.current,{[H.Forwards]:()=>{var A;if(!t.button)return;let E=ee(),c=E.indexOf(t.button),B=E.slice(0,c+1),n=[...E.slice(c+1),...B];for(let g of n.slice())if(g.dataset.headlessuiFocusGuard==="true"||(A=t.panel)!=null&&A.contains(g)){let G=n.indexOf(g);G!==-1&&n.splice(G,1)}w(n,h.First,{sorted:!1})},[H.Backwards]:()=>{var c;w(u,h.Previous)===te.Error&&((c=t.button)==null||c.focus())}})}m()});return I.createElement(Z.Provider,{value:R},S&&f&&I.createElement(re,{id:F,ref:t.beforePanelSentinel,features:ne.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:j}),J({ourProps:O,theirProps:r,slot:x,defaultTag:we,features:Ne,visible:S,name:"Popover.Panel"}),S&&f&&I.createElement(re,{id:T,ref:t.afterPanelSentinel,features:ne.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:M}))}let Ke="div";function We(o,l){let s=V(null),R=U(s,l),[C,r]=ie([]),t=b(p=>{r(P=>{let S=P.indexOf(p);if(S!==-1){let y=P.slice();return y.splice(S,1),y}return P})}),a=b(p=>(r(P=>[...P,p]),()=>t(p))),v=b(()=>{var S;let p=Re(s);if(!p)return!1;let P=p.activeElement;return(S=s.current)!=null&&S.contains(P)?!0:C.some(y=>{var x,O;return((x=p.getElementById(y.buttonId.current))==null?void 0:x.contains(P))||((O=p.getElementById(y.panelId.current))==null?void 0:O.contains(P))})}),f=b(p=>{for(let P of C)P.buttonId.current!==p&&P.close()}),F=D(()=>({registerPopover:a,unregisterPopover:t,isFocusWithinPopoverGroup:v,closeOthers:f}),[a,t,v,f]),T=D(()=>({}),[]),d=o,i={ref:R};return I.createElement(se.Provider,{value:F},J({ourProps:i,theirProps:d,slot:T,defaultTag:Ke,name:"Popover.Group"}))}let je=$(De),Ve=$(He),$e=$(ke),Je=$(Ue),Xe=$(We),Lt=Object.assign(je,{Button:Ve,Overlay:$e,Panel:Je,Group:Xe});export{Lt as Popover}; | ||
import A,{createContext as Q,createRef as de,useContext as Z,useEffect as ee,useMemo as _,useReducer as ge,useRef as J,useState as ce}from"react";import{match as k}from'../../utils/match.js';import{forwardRefWithAs as X,render as Y,Features as te}from'../../utils/render.js';import{optionalRef as Se,useSyncRefs as j}from'../../hooks/use-sync-refs.js';import{useId as V}from'../../hooks/use-id.js';import{Keys as w}from'../keyboard.js';import{isDisabledReactIssue7711 as ve}from'../../utils/bugs.js';import{getFocusableElements as ne,Focus as G,focusIn as U,isFocusableElement as Ae,FocusableMode as Re,FocusResult as le}from'../../utils/focus-management.js';import{OpenClosedProvider as Oe,State as $,useOpenClosed as Te}from'../../internal/open-closed.js';import{useResolveButtonType as Ce}from'../../hooks/use-resolve-button-type.js';import{useOutsideClick as Me}from'../../hooks/use-outside-click.js';import{getOwnerDocument as Fe}from'../../utils/owner.js';import{useOwnerDocument as ae}from'../../hooks/use-owner.js';import{useEventListener as Ie}from'../../hooks/use-event-listener.js';import{Hidden as pe,Features as se}from'../../internal/hidden.js';import{useEvent as g}from'../../hooks/use-event.js';import{useTabDirection as me,Direction as N}from'../../hooks/use-tab-direction.js';import'../../utils/micro-task.js';import{useLatestValue as ye}from'../../hooks/use-latest-value.js';import{useIsoMorphicEffect as xe}from'../../hooks/use-iso-morphic-effect.js';import{useMainTreeNode as Le,useRootContainers as Be}from'../../hooks/use-root-containers.js';import{useNestedPortals as De}from'../../components/portal/portal.js';var he=(u=>(u[u.Open=0]="Open",u[u.Closed=1]="Closed",u))(he||{}),He=(e=>(e[e.TogglePopover=0]="TogglePopover",e[e.ClosePopover=1]="ClosePopover",e[e.SetButton=2]="SetButton",e[e.SetButtonId=3]="SetButtonId",e[e.SetPanel=4]="SetPanel",e[e.SetPanelId=5]="SetPanelId",e))(He||{});let _e={[0]:t=>{let o={...t,popoverState:k(t.popoverState,{[0]:1,[1]:0})};return o.popoverState===0&&(o.__demoMode=!1),o},[1](t){return t.popoverState===1?t:{...t,popoverState:1}},[2](t,o){return t.button===o.button?t:{...t,button:o.button}},[3](t,o){return t.buttonId===o.buttonId?t:{...t,buttonId:o.buttonId}},[4](t,o){return t.panel===o.panel?t:{...t,panel:o.panel}},[5](t,o){return t.panelId===o.panelId?t:{...t,panelId:o.panelId}}},ue=Q(null);ue.displayName="PopoverContext";function oe(t){let o=Z(ue);if(o===null){let u=new Error(`<${t} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(u,oe),u}return o}let ie=Q(null);ie.displayName="PopoverAPIContext";function fe(t){let o=Z(ie);if(o===null){let u=new Error(`<${t} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(u,fe),u}return o}let Pe=Q(null);Pe.displayName="PopoverGroupContext";function Ee(){return Z(Pe)}let re=Q(null);re.displayName="PopoverPanelContext";function Ge(){return Z(re)}function Ne(t,o){return k(o.type,_e,t,o)}let ke="div";function we(t,o){var D;let{__demoMode:u=!1,...R}=t,O=J(null),n=j(o,Se(l=>{O.current=l})),e=J([]),v=ge(Ne,{__demoMode:u,popoverState:u?0:1,buttons:e,button:null,buttonId:null,panel:null,panelId:null,beforePanelSentinel:de(),afterPanelSentinel:de()}),[{popoverState:P,button:s,buttonId:I,panel:p,panelId:T,beforePanelSentinel:m,afterPanelSentinel:S},i]=v,a=ae((D=O.current)!=null?D:s),E=_(()=>{if(!s||!p)return!1;for(let K of document.querySelectorAll("body > *"))if(Number(K==null?void 0:K.contains(s))^Number(K==null?void 0:K.contains(p)))return!0;let l=ne(),F=l.indexOf(s),q=(F+l.length-1)%l.length,W=(F+1)%l.length,z=l[q],be=l[W];return!p.contains(z)&&!p.contains(be)},[s,p]),C=ye(I),H=ye(T),x=_(()=>({buttonId:C,panelId:H,close:()=>i({type:1})}),[C,H,i]),M=Ee(),h=M==null?void 0:M.registerPopover,f=g(()=>{var l;return(l=M==null?void 0:M.isFocusWithinPopoverGroup())!=null?l:(a==null?void 0:a.activeElement)&&((s==null?void 0:s.contains(a.activeElement))||(p==null?void 0:p.contains(a.activeElement)))});ee(()=>h==null?void 0:h(x),[h,x]);let[y,b]=De(),d=Be({mainTreeNodeRef:M==null?void 0:M.mainTreeNodeRef,portals:y,defaultContainers:[s,p]});Ie(a==null?void 0:a.defaultView,"focus",l=>{var F,q,W,z;l.target!==window&&l.target instanceof HTMLElement&&P===0&&(f()||s&&p&&(d.contains(l.target)||(q=(F=m.current)==null?void 0:F.contains)!=null&&q.call(F,l.target)||(z=(W=S.current)==null?void 0:W.contains)!=null&&z.call(W,l.target)||i({type:1})))},!0),Me(d.resolveContainers,(l,F)=>{i({type:1}),Ae(F,Re.Loose)||(l.preventDefault(),s==null||s.focus())},P===0);let L=g(l=>{i({type:1});let F=(()=>l?l instanceof HTMLElement?l:"current"in l&&l.current instanceof HTMLElement?l.current:s:s)();F==null||F.focus()}),r=_(()=>({close:L,isPortalled:E}),[L,E]),c=_(()=>({open:P===0,close:L}),[P,L]),B={ref:n};return A.createElement(re.Provider,{value:null},A.createElement(ue.Provider,{value:v},A.createElement(ie.Provider,{value:r},A.createElement(Oe,{value:k(P,{[0]:$.Open,[1]:$.Closed})},A.createElement(b,null,Y({ourProps:B,theirProps:R,slot:c,defaultTag:ke,name:"Popover"}),A.createElement(d.MainTreeNode,null))))))}let Ue="button";function We(t,o){let u=V(),{id:R=`headlessui-popover-button-${u}`,...O}=t,[n,e]=oe("Popover.Button"),{isPortalled:v}=fe("Popover.Button"),P=J(null),s=`headlessui-focus-sentinel-${V()}`,I=Ee(),p=I==null?void 0:I.closeOthers,m=Ge()!==null;ee(()=>{if(!m)return e({type:3,buttonId:R}),()=>{e({type:3,buttonId:null})}},[m,R,e]);let[S]=ce(()=>Symbol()),i=j(P,o,m?null:r=>{if(r)n.buttons.current.push(S);else{let c=n.buttons.current.indexOf(S);c!==-1&&n.buttons.current.splice(c,1)}n.buttons.current.length>1&&console.warn("You are already using a <Popover.Button /> but only 1 <Popover.Button /> is supported."),r&&e({type:2,button:r})}),a=j(P,o),E=ae(P),C=g(r=>{var c,B,D;if(m){if(n.popoverState===1)return;switch(r.key){case w.Space:case w.Enter:r.preventDefault(),(B=(c=r.target).click)==null||B.call(c),e({type:1}),(D=n.button)==null||D.focus();break}}else switch(r.key){case w.Space:case w.Enter:r.preventDefault(),r.stopPropagation(),n.popoverState===1&&(p==null||p(n.buttonId)),e({type:0});break;case w.Escape:if(n.popoverState!==0)return p==null?void 0:p(n.buttonId);if(!P.current||E!=null&&E.activeElement&&!P.current.contains(E.activeElement))return;r.preventDefault(),r.stopPropagation(),e({type:1});break}}),H=g(r=>{m||r.key===w.Space&&r.preventDefault()}),x=g(r=>{var c,B;ve(r.currentTarget)||t.disabled||(m?(e({type:1}),(c=n.button)==null||c.focus()):(r.preventDefault(),r.stopPropagation(),n.popoverState===1&&(p==null||p(n.buttonId)),e({type:0}),(B=n.button)==null||B.focus()))}),M=g(r=>{r.preventDefault(),r.stopPropagation()}),h=n.popoverState===0,f=_(()=>({open:h}),[h]),y=Ce(t,P),b=m?{ref:a,type:y,onKeyDown:C,onClick:x}:{ref:i,id:n.buttonId,type:y,"aria-expanded":n.popoverState===0,"aria-controls":n.panel?n.panelId:void 0,onKeyDown:C,onKeyUp:H,onClick:x,onMouseDown:M},d=me(),L=g(()=>{let r=n.panel;if(!r)return;function c(){k(d.current,{[N.Forwards]:()=>U(r,G.First),[N.Backwards]:()=>U(r,G.Last)})===le.Error&&U(ne().filter(D=>D.dataset.headlessuiFocusGuard!=="true"),k(d.current,{[N.Forwards]:G.Next,[N.Backwards]:G.Previous}),{relativeTo:n.button})}c()});return A.createElement(A.Fragment,null,Y({ourProps:b,theirProps:O,slot:f,defaultTag:Ue,name:"Popover.Button"}),h&&!m&&v&&A.createElement(pe,{id:s,features:se.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:L}))}let Ke="div",je=te.RenderStrategy|te.Static;function Ve(t,o){let u=V(),{id:R=`headlessui-popover-overlay-${u}`,...O}=t,[{popoverState:n},e]=oe("Popover.Overlay"),v=j(o),P=Te(),s=(()=>P!==null?(P&$.Open)===$.Open:n===0)(),I=g(m=>{if(ve(m.currentTarget))return m.preventDefault();e({type:1})}),p=_(()=>({open:n===0}),[n]);return Y({ourProps:{ref:v,id:R,"aria-hidden":!0,onClick:I},theirProps:O,slot:p,defaultTag:Ke,features:je,visible:s,name:"Popover.Overlay"})}let $e="div",Je=te.RenderStrategy|te.Static;function Xe(t,o){let u=V(),{id:R=`headlessui-popover-panel-${u}`,focus:O=!1,...n}=t,[e,v]=oe("Popover.Panel"),{close:P,isPortalled:s}=fe("Popover.Panel"),I=`headlessui-focus-sentinel-before-${V()}`,p=`headlessui-focus-sentinel-after-${V()}`,T=J(null),m=j(T,o,f=>{v({type:4,panel:f})}),S=ae(T);xe(()=>(v({type:5,panelId:R}),()=>{v({type:5,panelId:null})}),[R,v]);let i=Te(),a=(()=>i!==null?(i&$.Open)===$.Open:e.popoverState===0)(),E=g(f=>{var y;switch(f.key){case w.Escape:if(e.popoverState!==0||!T.current||S!=null&&S.activeElement&&!T.current.contains(S.activeElement))return;f.preventDefault(),f.stopPropagation(),v({type:1}),(y=e.button)==null||y.focus();break}});ee(()=>{var f;t.static||e.popoverState===1&&((f=t.unmount)==null||f)&&v({type:4,panel:null})},[e.popoverState,t.unmount,t.static,v]),ee(()=>{if(e.__demoMode||!O||e.popoverState!==0||!T.current)return;let f=S==null?void 0:S.activeElement;T.current.contains(f)||U(T.current,G.First)},[e.__demoMode,O,T,e.popoverState]);let C=_(()=>({open:e.popoverState===0,close:P}),[e,P]),H={ref:m,id:R,onKeyDown:E,onBlur:O&&e.popoverState===0?f=>{var b,d,L,r,c;let y=f.relatedTarget;y&&T.current&&((b=T.current)!=null&&b.contains(y)||(v({type:1}),((L=(d=e.beforePanelSentinel.current)==null?void 0:d.contains)!=null&&L.call(d,y)||(c=(r=e.afterPanelSentinel.current)==null?void 0:r.contains)!=null&&c.call(r,y))&&y.focus({preventScroll:!0})))}:void 0,tabIndex:-1},x=me(),M=g(()=>{let f=T.current;if(!f)return;function y(){k(x.current,{[N.Forwards]:()=>{var d;U(f,G.First)===le.Error&&((d=e.afterPanelSentinel.current)==null||d.focus())},[N.Backwards]:()=>{var b;(b=e.button)==null||b.focus({preventScroll:!0})}})}y()}),h=g(()=>{let f=T.current;if(!f)return;function y(){k(x.current,{[N.Forwards]:()=>{var B;if(!e.button)return;let b=ne(),d=b.indexOf(e.button),L=b.slice(0,d+1),c=[...b.slice(d+1),...L];for(let D of c.slice())if(D.dataset.headlessuiFocusGuard==="true"||(B=e.panel)!=null&&B.contains(D)){let l=c.indexOf(D);l!==-1&&c.splice(l,1)}U(c,G.First,{sorted:!1})},[N.Backwards]:()=>{var d;U(f,G.Previous)===le.Error&&((d=e.button)==null||d.focus())}})}y()});return A.createElement(re.Provider,{value:R},a&&s&&A.createElement(pe,{id:I,ref:e.beforePanelSentinel,features:se.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:M}),Y({ourProps:H,theirProps:n,slot:C,defaultTag:$e,features:Je,visible:a,name:"Popover.Panel"}),a&&s&&A.createElement(pe,{id:p,ref:e.afterPanelSentinel,features:se.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:h}))}let Ye="div";function qe(t,o){let u=J(null),R=j(u,o),[O,n]=ce([]),e=Le(),v=g(i=>{n(a=>{let E=a.indexOf(i);if(E!==-1){let C=a.slice();return C.splice(E,1),C}return a})}),P=g(i=>(n(a=>[...a,i]),()=>v(i))),s=g(()=>{var E;let i=Fe(u);if(!i)return!1;let a=i.activeElement;return(E=u.current)!=null&&E.contains(a)?!0:O.some(C=>{var H,x;return((H=i.getElementById(C.buttonId.current))==null?void 0:H.contains(a))||((x=i.getElementById(C.panelId.current))==null?void 0:x.contains(a))})}),I=g(i=>{for(let a of O)a.buttonId.current!==i&&a.close()}),p=_(()=>({registerPopover:P,unregisterPopover:v,isFocusWithinPopoverGroup:s,closeOthers:I,mainTreeNodeRef:e.mainTreeNodeRef}),[P,v,s,I,e.mainTreeNodeRef]),T=_(()=>({}),[]),m=t,S={ref:R};return A.createElement(Pe.Provider,{value:p},Y({ourProps:S,theirProps:m,slot:T,defaultTag:Ye,name:"Popover.Group"}),A.createElement(e.MainTreeNode,null))}let ze=X(we),Qe=X(We),Ze=X(Ve),et=X(Xe),tt=X(qe),kt=Object.assign(ze,{Button:Qe,Overlay:Ze,Panel:et,Group:tt});export{kt as Popover}; |
@@ -20,2 +20,5 @@ import React, { ElementType, MutableRefObject, Ref } from 'react'; | ||
declare function GroupFn<TTag extends ElementType = typeof DEFAULT_GROUP_TAG>(props: PortalGroupProps<TTag>, ref: Ref<HTMLElement>): JSX.Element; | ||
export declare function useNestedPortals(): readonly [React.MutableRefObject<HTMLElement[]>, ({ children }: { | ||
children: React.ReactNode; | ||
}) => JSX.Element]; | ||
interface ComponentPortal extends HasDisplayName { | ||
@@ -22,0 +25,0 @@ <TTag extends ElementType = typeof DEFAULT_PORTAL_TAG>(props: PortalProps<TTag> & RefProp<typeof PortalFn>): JSX.Element; |
@@ -1,1 +0,1 @@ | ||
import A,{Fragment as i,createContext as G,useContext as L,useEffect as s,useRef as T,useState as m}from"react";import{createPortal as x}from"react-dom";import{forwardRefWithAs as P,render as d}from'../../utils/render.js';import{useIsoMorphicEffect as b}from'../../hooks/use-iso-morphic-effect.js';import{usePortalRoot as h}from'../../internal/portal-force-root.js';import{useServerHandoffComplete as C}from'../../hooks/use-server-handoff-complete.js';import{optionalRef as v,useSyncRefs as R}from'../../hooks/use-sync-refs.js';import{useOwnerDocument as g}from'../../hooks/use-owner.js';import{microTask as M}from'../../utils/micro-task.js';import{env as E}from'../../utils/env.js';function H(u){let a=h(),o=L(c),e=g(u),[l,n]=m(()=>{if(!a&&o!==null||E.isServer)return null;let t=e==null?void 0:e.getElementById("headlessui-portal-root");if(t)return t;if(e===null)return null;let r=e.createElement("div");return r.setAttribute("id","headlessui-portal-root"),e.body.appendChild(r)});return s(()=>{l!==null&&(e!=null&&e.body.contains(l)||e==null||e.body.appendChild(l))},[l,e]),s(()=>{a||o!==null&&n(o.current)},[o,n,a]),l}let O=i;function _(u,a){let o=u,e=T(null),l=R(v(p=>{e.current=p}),a),n=g(e),t=H(e),[r]=m(()=>{var p;return E.isServer?null:(p=n==null?void 0:n.createElement("div"))!=null?p:null}),y=C(),f=T(!1);return b(()=>{if(f.current=!1,!(!t||!r))return t.contains(r)||(r.setAttribute("data-headlessui-portal",""),t.appendChild(r)),()=>{f.current=!0,M(()=>{var p;f.current&&(!t||!r||(r instanceof Node&&t.contains(r)&&t.removeChild(r),t.childNodes.length<=0&&((p=t.parentElement)==null||p.removeChild(t))))})}},[t,r]),y?!t||!r?null:x(d({ourProps:{ref:l},theirProps:o,defaultTag:O,name:"Portal"}),r):null}let F=i,c=G(null);function U(u,a){let{target:o,...e}=u,n={ref:R(a)};return A.createElement(c.Provider,{value:o},d({ourProps:n,theirProps:e,defaultTag:F,name:"Popover.Group"}))}let S=P(_),j=P(U),te=Object.assign(S,{Group:j});export{te as Portal}; | ||
import T,{Fragment as P,createContext as m,useContext as s,useEffect as d,useRef as g,useState as R,useMemo as E}from"react";import{createPortal as H}from"react-dom";import{forwardRefWithAs as c,render as y}from'../../utils/render.js';import{useIsoMorphicEffect as x}from'../../hooks/use-iso-morphic-effect.js';import{usePortalRoot as b}from'../../internal/portal-force-root.js';import{useServerHandoffComplete as h}from'../../hooks/use-server-handoff-complete.js';import{optionalRef as O,useSyncRefs as L}from'../../hooks/use-sync-refs.js';import{useOnUnmount as _}from'../../hooks/use-on-unmount.js';import{useOwnerDocument as A}from'../../hooks/use-owner.js';import{env as G}from'../../utils/env.js';import{useEvent as M}from'../../hooks/use-event.js';function F(p){let l=b(),n=s(v),e=A(p),[a,o]=R(()=>{if(!l&&n!==null||G.isServer)return null;let t=e==null?void 0:e.getElementById("headlessui-portal-root");if(t)return t;if(e===null)return null;let r=e.createElement("div");return r.setAttribute("id","headlessui-portal-root"),e.body.appendChild(r)});return d(()=>{a!==null&&(e!=null&&e.body.contains(a)||e==null||e.body.appendChild(a))},[a,e]),d(()=>{l||n!==null&&o(n.current)},[n,o,l]),a}let U=P;function N(p,l){let n=p,e=g(null),a=L(O(u=>{e.current=u}),l),o=A(e),t=F(e),[r]=R(()=>{var u;return G.isServer?null:(u=o==null?void 0:o.createElement("div"))!=null?u:null}),i=s(f),C=h();return x(()=>{!t||!r||t.contains(r)||(r.setAttribute("data-headlessui-portal",""),t.appendChild(r))},[t,r]),x(()=>{if(r&&i)return i.register(r)},[i,r]),_(()=>{var u;!t||!r||(r instanceof Node&&t.contains(r)&&t.removeChild(r),t.childNodes.length<=0&&((u=t.parentElement)==null||u.removeChild(t)))}),C?!t||!r?null:H(y({ourProps:{ref:a},theirProps:n,defaultTag:U,name:"Portal"}),r):null}let S=P,v=m(null);function j(p,l){let{target:n,...e}=p,o={ref:L(l)};return T.createElement(v.Provider,{value:n},y({ourProps:o,theirProps:e,defaultTag:S,name:"Popover.Group"}))}let f=m(null);function ae(){let p=s(f),l=g([]),n=M(o=>(l.current.push(o),p&&p.register(o),()=>e(o))),e=M(o=>{let t=l.current.indexOf(o);t!==-1&&l.current.splice(t,1),p&&p.unregister(o)}),a=E(()=>({register:n,unregister:e,portals:l}),[n,e,l]);return[l,E(()=>function({children:t}){return T.createElement(f.Provider,{value:a},t)},[a])]}let D=c(N),I=c(j),pe=Object.assign(D,{Group:I});export{pe as Portal,ae as useNestedPortals}; |
@@ -1,1 +0,1 @@ | ||
import _,{Fragment as ne,createContext as V,useContext as Q,useMemo as F,useReducer as re,useRef as K}from"react";import{render as w,Features as Y,forwardRefWithAs as v}from'../../utils/render.js';import{useId as Z}from'../../hooks/use-id.js';import{match as G}from'../../utils/match.js';import{Keys as P}from'../../components/keyboard.js';import{focusIn as h,Focus as g,sortByDomNode as H,FocusResult as k}from'../../utils/focus-management.js';import{useIsoMorphicEffect as O}from'../../hooks/use-iso-morphic-effect.js';import{useSyncRefs as U}from'../../hooks/use-sync-refs.js';import{useResolveButtonType as ae}from'../../hooks/use-resolve-button-type.js';import{useLatestValue as J}from'../../hooks/use-latest-value.js';import{FocusSentinel as le}from'../../internal/focus-sentinel.js';import{useEvent as D}from'../../hooks/use-event.js';import{microTask as oe}from'../../utils/micro-task.js';import{Hidden as se}from'../../internal/hidden.js';import{getOwnerDocument as ie}from'../../utils/owner.js';import{StableCollection as pe,useStableCollectionIndex as ee}from'../../utils/stable-collection.js';var ue=(t=>(t[t.Forwards=0]="Forwards",t[t.Backwards=1]="Backwards",t))(ue||{}),Te=(o=>(o[o.Less=-1]="Less",o[o.Equal=0]="Equal",o[o.Greater=1]="Greater",o))(Te||{}),de=(r=>(r[r.SetSelectedIndex=0]="SetSelectedIndex",r[r.RegisterTab=1]="RegisterTab",r[r.UnregisterTab=2]="UnregisterTab",r[r.RegisterPanel=3]="RegisterPanel",r[r.UnregisterPanel=4]="UnregisterPanel",r))(de||{});let ce={[0](e,n){var u;let t=H(e.tabs,T=>T.current),o=H(e.panels,T=>T.current),s=t.filter(T=>{var l;return!((l=T.current)!=null&&l.hasAttribute("disabled"))}),r={...e,tabs:t,panels:o};if(n.index<0||n.index>t.length-1){let T=G(Math.sign(n.index-e.selectedIndex),{[-1]:()=>1,[0]:()=>G(Math.sign(n.index),{[-1]:()=>0,[0]:()=>0,[1]:()=>1}),[1]:()=>0});return s.length===0?r:{...r,selectedIndex:G(T,{[0]:()=>t.indexOf(s[0]),[1]:()=>t.indexOf(s[s.length-1])})}}let i=t.slice(0,n.index),b=[...t.slice(n.index),...i].find(T=>s.includes(T));if(!b)return r;let c=(u=t.indexOf(b))!=null?u:e.selectedIndex;return c===-1&&(c=e.selectedIndex),{...r,selectedIndex:c}},[1](e,n){var r;if(e.tabs.includes(n.tab))return e;let t=e.tabs[e.selectedIndex],o=H([...e.tabs,n.tab],i=>i.current),s=(r=o.indexOf(t))!=null?r:e.selectedIndex;return s===-1&&(s=e.selectedIndex),{...e,tabs:o,selectedIndex:s}},[2](e,n){return{...e,tabs:e.tabs.filter(t=>t!==n.tab)}},[3](e,n){return e.panels.includes(n.panel)?e:{...e,panels:H([...e.panels,n.panel],t=>t.current)}},[4](e,n){return{...e,panels:e.panels.filter(t=>t!==n.panel)}}},X=V(null);X.displayName="TabsDataContext";function M(e){let n=Q(X);if(n===null){let t=new Error(`<${e} /> is missing a parent <Tab.Group /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(t,M),t}return n}let $=V(null);$.displayName="TabsActionsContext";function q(e){let n=Q($);if(n===null){let t=new Error(`<${e} /> is missing a parent <Tab.Group /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(t,q),t}return n}function fe(e,n){return G(n.type,ce,e,n)}let be=ne;function me(e,n){let{defaultIndex:t=0,vertical:o=!1,manual:s=!1,onChange:r,selectedIndex:i=null,...R}=e;const b=o?"vertical":"horizontal",c=s?"manual":"auto";let u=i!==null,T=U(n),[l,d]=re(fe,{selectedIndex:i!=null?i:t,tabs:[],panels:[]}),y=F(()=>({selectedIndex:l.selectedIndex}),[l.selectedIndex]),m=J(r||(()=>{})),x=J(l.tabs),E=F(()=>({orientation:b,activation:c,...l}),[b,c,l]),S=D(p=>(d({type:1,tab:p}),()=>d({type:2,tab:p}))),A=D(p=>(d({type:3,panel:p}),()=>d({type:4,panel:p}))),L=D(p=>{C.current!==p&&m.current(p),u||d({type:0,index:p})}),C=J(u?e.selectedIndex:l.selectedIndex),N=F(()=>({registerTab:S,registerPanel:A,change:L}),[]);O(()=>{d({type:0,index:i!=null?i:t})},[i]),O(()=>{if(C.current===void 0||l.tabs.length<=0)return;let p=H(l.tabs,a=>a.current);p.some((a,f)=>l.tabs[f]!==a)&&L(p.indexOf(l.tabs[C.current]))});let B={ref:T};return _.createElement(pe,null,_.createElement($.Provider,{value:N},_.createElement(X.Provider,{value:E},E.tabs.length<=0&&_.createElement(le,{onFocus:()=>{var p,I;for(let a of x.current)if(((p=a.current)==null?void 0:p.tabIndex)===0)return(I=a.current)==null||I.focus(),!0;return!1}}),w({ourProps:B,theirProps:R,slot:y,defaultTag:be,name:"Tabs"}))))}let Pe="div";function ge(e,n){let{orientation:t,selectedIndex:o}=M("Tab.List"),s=U(n);return w({ourProps:{ref:s,role:"tablist","aria-orientation":t},theirProps:e,slot:{selectedIndex:o},defaultTag:Pe,name:"Tabs.List"})}let ye="button";function xe(e,n){var p,I;let t=Z(),{id:o=`headlessui-tabs-tab-${t}`,...s}=e,{orientation:r,activation:i,selectedIndex:R,tabs:b,panels:c}=M("Tab"),u=q("Tab"),T=M("Tab"),l=K(null),d=U(l,n);O(()=>u.registerTab(l),[u,l]);let y=ee("tabs"),m=b.indexOf(l);m===-1&&(m=y);let x=m===R,E=D(a=>{var j;let f=a();if(f===k.Success&&i==="auto"){let W=(j=ie(l))==null?void 0:j.activeElement,z=T.tabs.findIndex(te=>te.current===W);z!==-1&&u.change(z)}return f}),S=D(a=>{let f=b.map(W=>W.current).filter(Boolean);if(a.key===P.Space||a.key===P.Enter){a.preventDefault(),a.stopPropagation(),u.change(m);return}switch(a.key){case P.Home:case P.PageUp:return a.preventDefault(),a.stopPropagation(),E(()=>h(f,g.First));case P.End:case P.PageDown:return a.preventDefault(),a.stopPropagation(),E(()=>h(f,g.Last))}if(E(()=>G(r,{vertical(){return a.key===P.ArrowUp?h(f,g.Previous|g.WrapAround):a.key===P.ArrowDown?h(f,g.Next|g.WrapAround):k.Error},horizontal(){return a.key===P.ArrowLeft?h(f,g.Previous|g.WrapAround):a.key===P.ArrowRight?h(f,g.Next|g.WrapAround):k.Error}}))===k.Success)return a.preventDefault()}),A=K(!1),L=D(()=>{var a;A.current||(A.current=!0,(a=l.current)==null||a.focus(),u.change(m),oe(()=>{A.current=!1}))}),C=D(a=>{a.preventDefault()}),N=F(()=>({selected:x}),[x]),B={ref:d,onKeyDown:S,onMouseDown:C,onClick:L,id:o,role:"tab",type:ae(e,l),"aria-controls":(I=(p=c[m])==null?void 0:p.current)==null?void 0:I.id,"aria-selected":x,tabIndex:x?0:-1};return w({ourProps:B,theirProps:s,slot:N,defaultTag:ye,name:"Tabs.Tab"})}let Ee="div";function Ae(e,n){let{selectedIndex:t}=M("Tab.Panels"),o=U(n),s=F(()=>({selectedIndex:t}),[t]);return w({ourProps:{ref:o},theirProps:e,slot:s,defaultTag:Ee,name:"Tabs.Panels"})}let Re="div",Le=Y.RenderStrategy|Y.Static;function De(e,n){var E,S,A,L;let t=Z(),{id:o=`headlessui-tabs-panel-${t}`,tabIndex:s=0,...r}=e,{selectedIndex:i,tabs:R,panels:b}=M("Tab.Panel"),c=q("Tab.Panel"),u=K(null),T=U(u,n);O(()=>c.registerPanel(u),[c,u]);let l=ee("panels"),d=b.indexOf(u);d===-1&&(d=l);let y=d===i,m=F(()=>({selected:y}),[y]),x={ref:T,id:o,role:"tabpanel","aria-labelledby":(S=(E=R[d])==null?void 0:E.current)==null?void 0:S.id,tabIndex:y?s:-1};return!y&&((A=r.unmount)==null||A)&&!((L=r.static)!=null&&L)?_.createElement(se,{as:"span",...x}):w({ourProps:x,theirProps:r,slot:m,defaultTag:Re,features:Le,visible:y,name:"Tabs.Panel"})}let Se=v(xe),Ie=v(me),Fe=v(ge),he=v(Ae),Me=v(De),rt=Object.assign(Se,{Group:Ie,List:Fe,Panels:he,Panel:Me});export{rt as Tab}; | ||
import _,{Fragment as ne,createContext as V,useContext as Q,useMemo as F,useReducer as re,useRef as K}from"react";import{render as w,Features as Y,forwardRefWithAs as v}from'../../utils/render.js';import{useId as Z}from'../../hooks/use-id.js';import{match as G}from'../../utils/match.js';import{Keys as P}from'../../components/keyboard.js';import{focusIn as h,Focus as x,sortByDomNode as H,FocusResult as k}from'../../utils/focus-management.js';import{useIsoMorphicEffect as O}from'../../hooks/use-iso-morphic-effect.js';import{useSyncRefs as U}from'../../hooks/use-sync-refs.js';import{useResolveButtonType as ae}from'../../hooks/use-resolve-button-type.js';import{useLatestValue as J}from'../../hooks/use-latest-value.js';import{FocusSentinel as le}from'../../internal/focus-sentinel.js';import{useEvent as S}from'../../hooks/use-event.js';import{microTask as oe}from'../../utils/micro-task.js';import{Hidden as se}from'../../internal/hidden.js';import{getOwnerDocument as ie}from'../../utils/owner.js';import{StableCollection as pe,useStableCollectionIndex as ee}from'../../utils/stable-collection.js';var ue=(t=>(t[t.Forwards=0]="Forwards",t[t.Backwards=1]="Backwards",t))(ue||{}),Te=(o=>(o[o.Less=-1]="Less",o[o.Equal=0]="Equal",o[o.Greater=1]="Greater",o))(Te||{}),de=(r=>(r[r.SetSelectedIndex=0]="SetSelectedIndex",r[r.RegisterTab=1]="RegisterTab",r[r.UnregisterTab=2]="UnregisterTab",r[r.RegisterPanel=3]="RegisterPanel",r[r.UnregisterPanel=4]="UnregisterPanel",r))(de||{});let ce={[0](e,n){var u;let t=H(e.tabs,T=>T.current),o=H(e.panels,T=>T.current),s=t.filter(T=>{var l;return!((l=T.current)!=null&&l.hasAttribute("disabled"))}),r={...e,tabs:t,panels:o};if(n.index<0||n.index>t.length-1){let T=G(Math.sign(n.index-e.selectedIndex),{[-1]:()=>1,[0]:()=>G(Math.sign(n.index),{[-1]:()=>0,[0]:()=>0,[1]:()=>1}),[1]:()=>0});if(s.length===0)return r;let l=G(T,{[0]:()=>t.indexOf(s[0]),[1]:()=>t.indexOf(s[s.length-1])});return{...r,selectedIndex:l===-1?e.selectedIndex:l}}let i=t.slice(0,n.index),b=[...t.slice(n.index),...i].find(T=>s.includes(T));if(!b)return r;let c=(u=t.indexOf(b))!=null?u:e.selectedIndex;return c===-1&&(c=e.selectedIndex),{...r,selectedIndex:c}},[1](e,n){var r;if(e.tabs.includes(n.tab))return e;let t=e.tabs[e.selectedIndex],o=H([...e.tabs,n.tab],i=>i.current),s=(r=o.indexOf(t))!=null?r:e.selectedIndex;return s===-1&&(s=e.selectedIndex),{...e,tabs:o,selectedIndex:s}},[2](e,n){return{...e,tabs:e.tabs.filter(t=>t!==n.tab)}},[3](e,n){return e.panels.includes(n.panel)?e:{...e,panels:H([...e.panels,n.panel],t=>t.current)}},[4](e,n){return{...e,panels:e.panels.filter(t=>t!==n.panel)}}},X=V(null);X.displayName="TabsDataContext";function M(e){let n=Q(X);if(n===null){let t=new Error(`<${e} /> is missing a parent <Tab.Group /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(t,M),t}return n}let $=V(null);$.displayName="TabsActionsContext";function q(e){let n=Q($);if(n===null){let t=new Error(`<${e} /> is missing a parent <Tab.Group /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(t,q),t}return n}function fe(e,n){return G(n.type,ce,e,n)}let be=ne;function me(e,n){let{defaultIndex:t=0,vertical:o=!1,manual:s=!1,onChange:r,selectedIndex:i=null,...R}=e;const b=o?"vertical":"horizontal",c=s?"manual":"auto";let u=i!==null,T=U(n),[l,d]=re(fe,{selectedIndex:i!=null?i:t,tabs:[],panels:[]}),g=F(()=>({selectedIndex:l.selectedIndex}),[l.selectedIndex]),m=J(r||(()=>{})),y=J(l.tabs),E=F(()=>({orientation:b,activation:c,...l}),[b,c,l]),I=S(p=>(d({type:1,tab:p}),()=>d({type:2,tab:p}))),A=S(p=>(d({type:3,panel:p}),()=>d({type:4,panel:p}))),L=S(p=>{C.current!==p&&m.current(p),u||d({type:0,index:p})}),C=J(u?e.selectedIndex:l.selectedIndex),N=F(()=>({registerTab:I,registerPanel:A,change:L}),[]);O(()=>{d({type:0,index:i!=null?i:t})},[i]),O(()=>{if(C.current===void 0||l.tabs.length<=0)return;let p=H(l.tabs,a=>a.current);p.some((a,f)=>l.tabs[f]!==a)&&L(p.indexOf(l.tabs[C.current]))});let B={ref:T};return _.createElement(pe,null,_.createElement($.Provider,{value:N},_.createElement(X.Provider,{value:E},E.tabs.length<=0&&_.createElement(le,{onFocus:()=>{var p,D;for(let a of y.current)if(((p=a.current)==null?void 0:p.tabIndex)===0)return(D=a.current)==null||D.focus(),!0;return!1}}),w({ourProps:B,theirProps:R,slot:g,defaultTag:be,name:"Tabs"}))))}let Pe="div";function xe(e,n){let{orientation:t,selectedIndex:o}=M("Tab.List"),s=U(n);return w({ourProps:{ref:s,role:"tablist","aria-orientation":t},theirProps:e,slot:{selectedIndex:o},defaultTag:Pe,name:"Tabs.List"})}let ge="button";function ye(e,n){var p,D;let t=Z(),{id:o=`headlessui-tabs-tab-${t}`,...s}=e,{orientation:r,activation:i,selectedIndex:R,tabs:b,panels:c}=M("Tab"),u=q("Tab"),T=M("Tab"),l=K(null),d=U(l,n);O(()=>u.registerTab(l),[u,l]);let g=ee("tabs"),m=b.indexOf(l);m===-1&&(m=g);let y=m===R,E=S(a=>{var j;let f=a();if(f===k.Success&&i==="auto"){let W=(j=ie(l))==null?void 0:j.activeElement,z=T.tabs.findIndex(te=>te.current===W);z!==-1&&u.change(z)}return f}),I=S(a=>{let f=b.map(W=>W.current).filter(Boolean);if(a.key===P.Space||a.key===P.Enter){a.preventDefault(),a.stopPropagation(),u.change(m);return}switch(a.key){case P.Home:case P.PageUp:return a.preventDefault(),a.stopPropagation(),E(()=>h(f,x.First));case P.End:case P.PageDown:return a.preventDefault(),a.stopPropagation(),E(()=>h(f,x.Last))}if(E(()=>G(r,{vertical(){return a.key===P.ArrowUp?h(f,x.Previous|x.WrapAround):a.key===P.ArrowDown?h(f,x.Next|x.WrapAround):k.Error},horizontal(){return a.key===P.ArrowLeft?h(f,x.Previous|x.WrapAround):a.key===P.ArrowRight?h(f,x.Next|x.WrapAround):k.Error}}))===k.Success)return a.preventDefault()}),A=K(!1),L=S(()=>{var a;A.current||(A.current=!0,(a=l.current)==null||a.focus({preventScroll:!0}),u.change(m),oe(()=>{A.current=!1}))}),C=S(a=>{a.preventDefault()}),N=F(()=>({selected:y}),[y]),B={ref:d,onKeyDown:I,onMouseDown:C,onClick:L,id:o,role:"tab",type:ae(e,l),"aria-controls":(D=(p=c[m])==null?void 0:p.current)==null?void 0:D.id,"aria-selected":y,tabIndex:y?0:-1};return w({ourProps:B,theirProps:s,slot:N,defaultTag:ge,name:"Tabs.Tab"})}let Ee="div";function Ae(e,n){let{selectedIndex:t}=M("Tab.Panels"),o=U(n),s=F(()=>({selectedIndex:t}),[t]);return w({ourProps:{ref:o},theirProps:e,slot:s,defaultTag:Ee,name:"Tabs.Panels"})}let Re="div",Le=Y.RenderStrategy|Y.Static;function Se(e,n){var E,I,A,L;let t=Z(),{id:o=`headlessui-tabs-panel-${t}`,tabIndex:s=0,...r}=e,{selectedIndex:i,tabs:R,panels:b}=M("Tab.Panel"),c=q("Tab.Panel"),u=K(null),T=U(u,n);O(()=>c.registerPanel(u),[c,u]);let l=ee("panels"),d=b.indexOf(u);d===-1&&(d=l);let g=d===i,m=F(()=>({selected:g}),[g]),y={ref:T,id:o,role:"tabpanel","aria-labelledby":(I=(E=R[d])==null?void 0:E.current)==null?void 0:I.id,tabIndex:g?s:-1};return!g&&((A=r.unmount)==null||A)&&!((L=r.static)!=null&&L)?_.createElement(se,{as:"span",...y}):w({ourProps:y,theirProps:r,slot:m,defaultTag:Re,features:Le,visible:g,name:"Tabs.Panel"})}let Ie=v(ye),De=v(me),Fe=v(xe),he=v(Ae),Me=v(Se),rt=Object.assign(Ie,{Group:De,List:Fe,Panels:he,Panel:Me});export{rt as Tab}; |
@@ -1,1 +0,1 @@ | ||
import d,{Fragment as K,createContext as Q,useContext as J,useEffect as P,useMemo as Y,useRef as f,useState as X}from"react";import{Features as de,forwardRefWithAs as W,render as Z,RenderStrategy as E}from'../../utils/render.js';import{OpenClosedProvider as fe,State as b,useOpenClosed as $}from'../../internal/open-closed.js';import{match as D}from'../../utils/match.js';import{useIsMounted as pe}from'../../hooks/use-is-mounted.js';import{useIsoMorphicEffect as me}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as V}from'../../hooks/use-latest-value.js';import{useServerHandoffComplete as ee}from'../../hooks/use-server-handoff-complete.js';import{useSyncRefs as te}from'../../hooks/use-sync-refs.js';import{useTransition as ce}from'../../hooks/use-transition.js';import{useEvent as R}from'../../hooks/use-event.js';import{useDisposables as he}from'../../hooks/use-disposables.js';import{classNames as ve}from'../../utils/class-names.js';import{useFlags as ge}from'../../hooks/use-flags.js';function S(n=""){return n.split(" ").filter(t=>t.trim().length>1)}let A=Q(null);A.displayName="TransitionContext";var Ce=(r=>(r.Visible="visible",r.Hidden="hidden",r))(Ce||{});function Ee(){let n=J(A);if(n===null)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");return n}function be(){let n=J(I);if(n===null)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");return n}let I=Q(null);I.displayName="NestingContext";function _(n){return"children"in n?_(n.children):n.current.filter(({el:t})=>t.current!==null).filter(({state:t})=>t==="visible").length>0}function ne(n,t){let r=V(n),o=f([]),y=pe(),N=he(),p=R((s,e=E.Hidden)=>{let a=o.current.findIndex(({el:i})=>i===s);a!==-1&&(D(e,{[E.Unmount](){o.current.splice(a,1)},[E.Hidden](){o.current[a].state="hidden"}}),N.microTask(()=>{var i;!_(o)&&y.current&&((i=r.current)==null||i.call(r))}))}),x=R(s=>{let e=o.current.find(({el:a})=>a===s);return e?e.state!=="visible"&&(e.state="visible"):o.current.push({el:s,state:"visible"}),()=>p(s,E.Unmount)}),m=f([]),c=f(Promise.resolve()),u=f({enter:[],leave:[],idle:[]}),h=R((s,e,a)=>{m.current.splice(0),t&&(t.chains.current[e]=t.chains.current[e].filter(([i])=>i!==s)),t==null||t.chains.current[e].push([s,new Promise(i=>{m.current.push(i)})]),t==null||t.chains.current[e].push([s,new Promise(i=>{Promise.all(u.current[e].map(([l,T])=>T)).then(()=>i())})]),e==="enter"?c.current=c.current.then(()=>t==null?void 0:t.wait.current).then(()=>a(e)):a(e)}),v=R((s,e,a)=>{Promise.all(u.current[e].splice(0).map(([i,l])=>l)).then(()=>{var i;(i=m.current.shift())==null||i()}).then(()=>a(e))});return Y(()=>({children:o,register:x,unregister:p,onStart:h,onStop:v,wait:c,chains:u}),[x,p,o,h,v,u,c])}function Se(){}let xe=["beforeEnter","afterEnter","beforeLeave","afterLeave"];function re(n){var r;let t={};for(let o of xe)t[o]=(r=n[o])!=null?r:Se;return t}function Pe(n){let t=f(re(n));return P(()=>{t.current=re(n)},[n]),t}let Re="div",ie=de.RenderStrategy;function ye(n,t){let{beforeEnter:r,afterEnter:o,beforeLeave:y,afterLeave:N,enter:p,enterFrom:x,enterTo:m,entered:c,leave:u,leaveFrom:h,leaveTo:v,...s}=n,e=f(null),a=te(e,t),i=s.unmount?E.Unmount:E.Hidden,{show:l,appear:T,initial:se}=Ee(),[g,M]=X(l?"visible":"hidden"),z=be(),{register:F,unregister:L}=z,U=f(null);P(()=>F(e),[F,e]),P(()=>{if(i===E.Hidden&&e.current){if(l&&g!=="visible"){M("visible");return}return D(g,{["hidden"]:()=>L(e),["visible"]:()=>F(e)})}},[g,e,F,L,l,i]);let j=V({enter:S(p),enterFrom:S(x),enterTo:S(m),entered:S(c),leave:S(u),leaveFrom:S(h),leaveTo:S(v)}),w=Pe({beforeEnter:r,afterEnter:o,beforeLeave:y,afterLeave:N}),k=ee();P(()=>{if(k&&g==="visible"&&e.current===null)throw new Error("Did you forget to passthrough the `ref` to the actual DOM node?")},[e,g,k]);let G=se&&!T,ae=(()=>!k||G||U.current===l?"idle":l?"enter":"leave")(),H=ge(0),le=R(C=>D(C,{enter:()=>{H.addFlag(b.Opening),w.current.beforeEnter()},leave:()=>{H.addFlag(b.Closing),w.current.beforeLeave()},idle:()=>{}})),ue=R(C=>D(C,{enter:()=>{H.removeFlag(b.Opening),w.current.afterEnter()},leave:()=>{H.removeFlag(b.Closing),w.current.afterLeave()},idle:()=>{}})),O=ne(()=>{M("hidden"),L(e)},z);ce({container:e,classes:j,direction:ae,onStart:V(C=>{O.onStart(e,C,le)}),onStop:V(C=>{O.onStop(e,C,ue),C==="leave"&&!_(O)&&(M("hidden"),L(e))})}),P(()=>{G&&(i===E.Hidden?U.current=null:U.current=l)},[l,G,g]);let B=s,Te={ref:a};return T&&l&&(B={...B,className:ve(s.className,...j.current.enter,...j.current.enterFrom)}),d.createElement(I.Provider,{value:O},d.createElement(fe,{value:D(g,{["visible"]:b.Open,["hidden"]:b.Closed})|H.flags},Z({ourProps:Te,theirProps:B,defaultTag:Re,features:ie,visible:g==="visible",name:"Transition.Child"})))}function Ne(n,t){let{show:r,appear:o=!1,unmount:y,...N}=n,p=f(null),x=te(p,t);ee();let m=$();if(r===void 0&&m!==null&&(r=(m&b.Open)===b.Open),![!0,!1].includes(r))throw new Error("A <Transition /> is used but it is missing a `show={true | false}` prop.");let[c,u]=X(r?"visible":"hidden"),h=ne(()=>{u("hidden")}),[v,s]=X(!0),e=f([r]);me(()=>{v!==!1&&e.current[e.current.length-1]!==r&&(e.current.push(r),s(!1))},[e,r]);let a=Y(()=>({show:r,appear:o,initial:v}),[r,o,v]);P(()=>{if(r)u("visible");else if(!_(h))u("hidden");else{let l=p.current;if(!l)return;let T=l.getBoundingClientRect();T.x===0&&T.y===0&&T.width===0&&T.height===0&&u("hidden")}},[r,h]);let i={unmount:y};return d.createElement(I.Provider,{value:h},d.createElement(A.Provider,{value:a},Z({ourProps:{...i,as:K,children:d.createElement(oe,{ref:x,...i,...N})},theirProps:{},defaultTag:K,features:ie,visible:c==="visible",name:"Transition"})))}function He(n,t){let r=J(A)!==null,o=$()!==null;return d.createElement(d.Fragment,null,!r&&o?d.createElement(q,{ref:t,...n}):d.createElement(oe,{ref:t,...n}))}let q=W(Ne),oe=W(ye),De=W(He),tt=Object.assign(q,{Child:De,Root:q});export{tt as Transition}; | ||
import m,{Fragment as Y,createContext as Z,useContext as B,useEffect as F,useMemo as $,useRef as C,useState as J}from"react";import{Features as ce,forwardRefWithAs as X,render as ee,RenderStrategy as N}from'../../utils/render.js';import{OpenClosedProvider as pe,State as E,useOpenClosed as te}from'../../internal/open-closed.js';import{match as L}from'../../utils/match.js';import{useIsMounted as he}from'../../hooks/use-is-mounted.js';import{useIsoMorphicEffect as ve}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as I}from'../../hooks/use-latest-value.js';import{useServerHandoffComplete as ne}from'../../hooks/use-server-handoff-complete.js';import{useSyncRefs as re}from'../../hooks/use-sync-refs.js';import{useTransition as ge}from'../../hooks/use-transition.js';import{useEvent as b}from'../../hooks/use-event.js';import{useDisposables as Ce}from'../../hooks/use-disposables.js';import{classNames as ie}from'../../utils/class-names.js';import{useFlags as Ee}from'../../hooks/use-flags.js';function S(t=""){return t.split(" ").filter(n=>n.trim().length>1)}let _=Z(null);_.displayName="TransitionContext";var be=(r=>(r.Visible="visible",r.Hidden="hidden",r))(be||{});function Se(){let t=B(_);if(t===null)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");return t}function Ne(){let t=B(M);if(t===null)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");return t}let M=Z(null);M.displayName="NestingContext";function U(t){return"children"in t?U(t.children):t.current.filter(({el:n})=>n.current!==null).filter(({state:n})=>n==="visible").length>0}function oe(t,n){let r=I(t),s=C([]),y=he(),D=Ce(),c=b((i,e=N.Hidden)=>{let a=s.current.findIndex(({el:o})=>o===i);a!==-1&&(L(e,{[N.Unmount](){s.current.splice(a,1)},[N.Hidden](){s.current[a].state="hidden"}}),D.microTask(()=>{var o;!U(s)&&y.current&&((o=r.current)==null||o.call(r))}))}),x=b(i=>{let e=s.current.find(({el:a})=>a===i);return e?e.state!=="visible"&&(e.state="visible"):s.current.push({el:i,state:"visible"}),()=>c(i,N.Unmount)}),p=C([]),h=C(Promise.resolve()),u=C({enter:[],leave:[],idle:[]}),v=b((i,e,a)=>{p.current.splice(0),n&&(n.chains.current[e]=n.chains.current[e].filter(([o])=>o!==i)),n==null||n.chains.current[e].push([i,new Promise(o=>{p.current.push(o)})]),n==null||n.chains.current[e].push([i,new Promise(o=>{Promise.all(u.current[e].map(([f,P])=>P)).then(()=>o())})]),e==="enter"?h.current=h.current.then(()=>n==null?void 0:n.wait.current).then(()=>a(e)):a(e)}),d=b((i,e,a)=>{Promise.all(u.current[e].splice(0).map(([o,f])=>f)).then(()=>{var o;(o=p.current.shift())==null||o()}).then(()=>a(e))});return $(()=>({children:s,register:x,unregister:c,onStart:v,onStop:d,wait:h,chains:u}),[x,c,s,v,d,u,h])}function xe(){}let Pe=["beforeEnter","afterEnter","beforeLeave","afterLeave"];function se(t){var r;let n={};for(let s of Pe)n[s]=(r=t[s])!=null?r:xe;return n}function Re(t){let n=C(se(t));return F(()=>{n.current=se(t)},[t]),n}let ye="div",ae=ce.RenderStrategy;function De(t,n){var K,Q;let{beforeEnter:r,afterEnter:s,beforeLeave:y,afterLeave:D,enter:c,enterFrom:x,enterTo:p,entered:h,leave:u,leaveFrom:v,leaveTo:d,...i}=t,e=C(null),a=re(e,n),o=(K=i.unmount)==null||K?N.Unmount:N.Hidden,{show:f,appear:P,initial:T}=Se(),[l,j]=J(f?"visible":"hidden"),q=Ne(),{register:O,unregister:V}=q;F(()=>O(e),[O,e]),F(()=>{if(o===N.Hidden&&e.current){if(f&&l!=="visible"){j("visible");return}return L(l,{["hidden"]:()=>V(e),["visible"]:()=>O(e)})}},[l,e,O,V,f,o]);let k=I({base:S(i.className),enter:S(c),enterFrom:S(x),enterTo:S(p),entered:S(h),leave:S(u),leaveFrom:S(v),leaveTo:S(d)}),w=Re({beforeEnter:r,afterEnter:s,beforeLeave:y,afterLeave:D}),G=ne();F(()=>{if(G&&l==="visible"&&e.current===null)throw new Error("Did you forget to passthrough the `ref` to the actual DOM node?")},[e,l,G]);let ue=T&&!P,z=P&&f&&T,Te=(()=>!G||ue?"idle":f?"enter":"leave")(),H=Ee(0),de=b(g=>L(g,{enter:()=>{H.addFlag(E.Opening),w.current.beforeEnter()},leave:()=>{H.addFlag(E.Closing),w.current.beforeLeave()},idle:()=>{}})),fe=b(g=>L(g,{enter:()=>{H.removeFlag(E.Opening),w.current.afterEnter()},leave:()=>{H.removeFlag(E.Closing),w.current.afterLeave()},idle:()=>{}})),A=oe(()=>{j("hidden"),V(e)},q);ge({immediate:z,container:e,classes:k,direction:Te,onStart:I(g=>{A.onStart(e,g,de)}),onStop:I(g=>{A.onStop(e,g,fe),g==="leave"&&!U(A)&&(j("hidden"),V(e))})});let R=i,me={ref:a};return z?R={...R,className:ie(i.className,...k.current.enter,...k.current.enterFrom)}:(R.className=ie(i.className,(Q=e.current)==null?void 0:Q.className),R.className===""&&delete R.className),m.createElement(M.Provider,{value:A},m.createElement(pe,{value:L(l,{["visible"]:E.Open,["hidden"]:E.Closed})|H.flags},ee({ourProps:me,theirProps:R,defaultTag:ye,features:ae,visible:l==="visible",name:"Transition.Child"})))}function He(t,n){let{show:r,appear:s=!1,unmount:y=!0,...D}=t,c=C(null),x=re(c,n);ne();let p=te();if(r===void 0&&p!==null&&(r=(p&E.Open)===E.Open),![!0,!1].includes(r))throw new Error("A <Transition /> is used but it is missing a `show={true | false}` prop.");let[h,u]=J(r?"visible":"hidden"),v=oe(()=>{u("hidden")}),[d,i]=J(!0),e=C([r]);ve(()=>{d!==!1&&e.current[e.current.length-1]!==r&&(e.current.push(r),i(!1))},[e,r]);let a=$(()=>({show:r,appear:s,initial:d}),[r,s,d]);F(()=>{if(r)u("visible");else if(!U(v))u("hidden");else{let T=c.current;if(!T)return;let l=T.getBoundingClientRect();l.x===0&&l.y===0&&l.width===0&&l.height===0&&u("hidden")}},[r,v]);let o={unmount:y},f=b(()=>{var T;d&&i(!1),(T=t.beforeEnter)==null||T.call(t)}),P=b(()=>{var T;d&&i(!1),(T=t.beforeLeave)==null||T.call(t)});return m.createElement(M.Provider,{value:v},m.createElement(_.Provider,{value:a},ee({ourProps:{...o,as:Y,children:m.createElement(le,{ref:x,...o,...D,beforeEnter:f,beforeLeave:P})},theirProps:{},defaultTag:Y,features:ae,visible:h==="visible",name:"Transition"})))}function Fe(t,n){let r=B(_)!==null,s=te()!==null;return m.createElement(m.Fragment,null,!r&&s?m.createElement(W,{ref:n,...t}):m.createElement(le,{ref:n,...t}))}let W=X(He),le=X(De),Le=X(Fe),tt=Object.assign(W,{Child:Le,Root:W});export{tt as Transition}; |
export declare function transition(node: HTMLElement, classes: { | ||
base: string[]; | ||
enter: string[]; | ||
@@ -3,0 +4,0 @@ enterFrom: string[]; |
@@ -1,1 +0,1 @@ | ||
import{once as T}from'../../../utils/once.js';import{disposables as g}from'../../../utils/disposables.js';import{match as s}from'../../../utils/match.js';function d(t,...e){t&&e.length>0&&t.classList.add(...e)}function v(t,...e){t&&e.length>0&&t.classList.remove(...e)}function F(t,e){let n=g();if(!t)return n.dispose;let{transitionDuration:m,transitionDelay:o}=getComputedStyle(t),[u,p]=[m,o].map(a=>{let[r=0]=a.split(",").filter(Boolean).map(i=>i.includes("ms")?parseFloat(i):parseFloat(i)*1e3).sort((i,f)=>f-i);return r}),l=u+p;if(l!==0){n.group(r=>{r.setTimeout(()=>{e(),r.dispose()},l),r.addEventListener(t,"transitionrun",i=>{i.target===i.currentTarget&&r.dispose()})});let a=n.addEventListener(t,"transitionend",r=>{r.target===r.currentTarget&&(e(),a())})}else e();return n.add(()=>e()),n.dispose}function y(t,e,n,m){let o=n?"enter":"leave",u=g(),p=m!==void 0?T(m):()=>{};o==="enter"&&(t.removeAttribute("hidden"),t.style.display="");let l=s(o,{enter:()=>e.enter,leave:()=>e.leave}),a=s(o,{enter:()=>e.enterTo,leave:()=>e.leaveTo}),r=s(o,{enter:()=>e.enterFrom,leave:()=>e.leaveFrom});return v(t,...e.enter,...e.enterTo,...e.enterFrom,...e.leave,...e.leaveFrom,...e.leaveTo,...e.entered),d(t,...l,...r),u.nextFrame(()=>{v(t,...r),d(t,...a),F(t,()=>(v(t,...l),d(t,...e.entered),p()))}),u.dispose}export{y as transition}; | ||
import{once as s}from'../../../utils/once.js';import{disposables as f}from'../../../utils/disposables.js';import{match as d}from'../../../utils/match.js';function g(t,...e){t&&e.length>0&&t.classList.add(...e)}function v(t,...e){t&&e.length>0&&t.classList.remove(...e)}function b(t,e){let n=f();if(!t)return n.dispose;let{transitionDuration:m,transitionDelay:a}=getComputedStyle(t),[u,p]=[m,a].map(l=>{let[r=0]=l.split(",").filter(Boolean).map(i=>i.includes("ms")?parseFloat(i):parseFloat(i)*1e3).sort((i,T)=>T-i);return r}),o=u+p;if(o!==0){n.group(r=>{r.setTimeout(()=>{e(),r.dispose()},o),r.addEventListener(t,"transitionrun",i=>{i.target===i.currentTarget&&r.dispose()})});let l=n.addEventListener(t,"transitionend",r=>{r.target===r.currentTarget&&(e(),l())})}else e();return n.add(()=>e()),n.dispose}function M(t,e,n,m){let a=n?"enter":"leave",u=f(),p=m!==void 0?s(m):()=>{};a==="enter"&&(t.removeAttribute("hidden"),t.style.display="");let o=d(a,{enter:()=>e.enter,leave:()=>e.leave}),l=d(a,{enter:()=>e.enterTo,leave:()=>e.leaveTo}),r=d(a,{enter:()=>e.enterFrom,leave:()=>e.leaveFrom});return v(t,...e.base,...e.enter,...e.enterTo,...e.enterFrom,...e.leave,...e.leaveFrom,...e.leaveTo,...e.entered),g(t,...e.base,...o,...r),u.nextFrame(()=>{v(t,...e.base,...o,...r),g(t,...e.base,...o,...l),b(t,()=>(v(t,...e.base,...o),g(t,...e.base,...e.entered),p()))}),u.dispose}export{M as transition}; |
@@ -1,1 +0,1 @@ | ||
import"client-only";export*from'./components/combobox/combobox.js';export*from'./components/dialog/dialog.js';export*from'./components/disclosure/disclosure.js';export*from'./components/focus-trap/focus-trap.js';export*from'./components/listbox/listbox.js';export*from'./components/menu/menu.js';export*from'./components/popover/popover.js';export*from'./components/portal/portal.js';export*from'./components/radio-group/radio-group.js';export*from'./components/switch/switch.js';export*from'./components/tabs/tabs.js';export*from'./components/transitions/transition.js'; | ||
import"client-only";export*from'./components/combobox/combobox.js';export*from'./components/dialog/dialog.js';export*from'./components/disclosure/disclosure.js';export*from'./components/focus-trap/focus-trap.js';export*from'./components/listbox/listbox.js';export*from'./components/menu/menu.js';export*from'./components/popover/popover.js';export*from'./components/radio-group/radio-group.js';export*from'./components/switch/switch.js';export*from'./components/tabs/tabs.js';export*from'./components/transitions/transition.js';import{Portal as d}from'./components/portal/portal.js';export{d as Portal}; |
@@ -1,1 +0,1 @@ | ||
import{isIOS as f}from'../../utils/platform.js';function p(){if(!f())return{};let o;return{before(){o=window.pageYOffset},after({doc:r,d:l,meta:s}){function i(e){return s.containers.flatMap(t=>t()).some(t=>t.contains(e))}l.style(r.body,"marginTop",`-${o}px`),window.scrollTo(0,0);let n=null;l.addEventListener(r,"click",e=>{if(e.target instanceof HTMLElement)try{let t=e.target.closest("a");if(!t)return;let{hash:c}=new URL(t.href),a=r.querySelector(c);a&&!i(a)&&(n=a)}catch{}},!0),l.addEventListener(r,"touchmove",e=>{e.target instanceof HTMLElement&&!i(e.target)&&e.preventDefault()},{passive:!1}),l.add(()=>{window.scrollTo(0,window.pageYOffset+o),n&&n.isConnected&&(n.scrollIntoView({block:"nearest"}),n=null)})}}}export{p as handleIOSLocking}; | ||
import{disposables as m}from'../../utils/disposables.js';import{isIOS as f}from'../../utils/platform.js';function T(){if(!f())return{};let l;return{before(){l=window.pageYOffset},after({doc:o,d:t,meta:s}){function i(n){return s.containers.flatMap(e=>e()).some(e=>e.contains(n))}t.microTask(()=>{if(window.getComputedStyle(o.documentElement).scrollBehavior!=="auto"){let e=m();e.style(o.documentElement,"scroll-behavior","auto"),t.add(()=>t.microTask(()=>e.dispose()))}t.style(o.body,"marginTop",`-${l}px`),window.scrollTo(0,0);let n=null;t.addEventListener(o,"click",e=>{if(e.target instanceof HTMLElement)try{let r=e.target.closest("a");if(!r)return;let{hash:c}=new URL(r.href),a=o.querySelector(c);a&&!i(a)&&(n=a)}catch{}},!0),t.addEventListener(o,"touchmove",e=>{e.target instanceof HTMLElement&&!i(e.target)&&e.preventDefault()},{passive:!1}),t.add(()=>{window.scrollTo(0,window.pageYOffset+l),n&&n.isConnected&&(n.scrollIntoView({block:"nearest"}),n=null)})})}}}export{T as handleIOSLocking}; |
@@ -5,3 +5,3 @@ import { MutableRefObject } from 'react'; | ||
type ContainerInput = Container | ContainerCollection; | ||
export declare function useOutsideClick(containers: ContainerInput | (() => ContainerInput), cb: (event: MouseEvent | PointerEvent | FocusEvent, target: HTMLElement) => void, enabled?: boolean): void; | ||
export declare function useOutsideClick(containers: ContainerInput | (() => ContainerInput), cb: (event: MouseEvent | PointerEvent | FocusEvent | TouchEvent, target: HTMLElement) => void, enabled?: boolean): void; | ||
export {}; |
@@ -1,1 +0,1 @@ | ||
import{useEffect as d,useRef as s}from"react";import{FocusableMode as p,isFocusableElement as C}from'../utils/focus-management.js';import{useDocumentEvent as a}from'./use-document-event.js';function L(m,E,c=!0){let i=s(!1);d(()=>{requestAnimationFrame(()=>{i.current=c})},[c]);function f(e,o){if(!i.current||e.defaultPrevented)return;let l=function r(t){return typeof t=="function"?r(t()):Array.isArray(t)||t instanceof Set?t:[t]}(m),n=o(e);if(n!==null&&n.getRootNode().contains(n)){for(let r of l){if(r===null)continue;let t=r instanceof HTMLElement?r:r.current;if(t!=null&&t.contains(n)||e.composed&&e.composedPath().includes(t))return}return!C(n,p.Loose)&&n.tabIndex!==-1&&e.preventDefault(),E(e,n)}}let u=s(null);a("mousedown",e=>{var o,l;i.current&&(u.current=((l=(o=e.composedPath)==null?void 0:o.call(e))==null?void 0:l[0])||e.target)},!0),a("click",e=>{u.current&&(f(e,()=>u.current),u.current=null)},!0),a("blur",e=>f(e,()=>window.document.activeElement instanceof HTMLIFrameElement?window.document.activeElement:null),!0)}export{L as useOutsideClick}; | ||
import{useEffect as d,useRef as f}from"react";import{FocusableMode as p,isFocusableElement as C}from'../utils/focus-management.js';import{useDocumentEvent as l}from'./use-document-event.js';import{useWindowEvent as M}from'./use-window-event.js';function h(s,m,a=!0){let i=f(!1);d(()=>{requestAnimationFrame(()=>{i.current=a})},[a]);function c(e,r){if(!i.current||e.defaultPrevented)return;let t=r(e);if(t===null||!t.getRootNode().contains(t)||!t.isConnected)return;let E=function u(n){return typeof n=="function"?u(n()):Array.isArray(n)||n instanceof Set?n:[n]}(s);for(let u of E){if(u===null)continue;let n=u instanceof HTMLElement?u:u.current;if(n!=null&&n.contains(t)||e.composed&&e.composedPath().includes(n))return}return!C(t,p.Loose)&&t.tabIndex!==-1&&e.preventDefault(),m(e,t)}let o=f(null);l("pointerdown",e=>{var r,t;i.current&&(o.current=((t=(r=e.composedPath)==null?void 0:r.call(e))==null?void 0:t[0])||e.target)},!0),l("mousedown",e=>{var r,t;i.current&&(o.current=((t=(r=e.composedPath)==null?void 0:r.call(e))==null?void 0:t[0])||e.target)},!0),l("click",e=>{o.current&&(c(e,()=>o.current),o.current=null)},!0),l("touchend",e=>c(e,()=>e.target instanceof HTMLElement?e.target:null),!0),M("blur",e=>c(e,()=>window.document.activeElement instanceof HTMLIFrameElement?window.document.activeElement:null),!0)}export{h as useOutsideClick}; |
@@ -1,1 +0,1 @@ | ||
import{useState as r,useEffect as o}from"react";import{env as t}from'../utils/env.js';function l(){let[e,f]=r(t.isHandoffComplete);return e&&t.isHandoffComplete===!1&&f(!1),o(()=>{e!==!0&&f(!0)},[e]),o(()=>t.handoff(),[]),e}export{l as useServerHandoffComplete}; | ||
import*as t from"react";import{env as f}from'../utils/env.js';function s(){let r=typeof document=="undefined";return"useSyncExternalStore"in t?(o=>o.useSyncExternalStore)(t)(()=>()=>{},()=>!1,()=>!r):!1}function l(){let r=s(),[e,n]=t.useState(f.isHandoffComplete);return e&&f.isHandoffComplete===!1&&n(!1),t.useEffect(()=>{e!==!0&&n(!0)},[e]),t.useEffect(()=>f.handoff(),[]),r?!1:e}export{l as useServerHandoffComplete}; |
import { MutableRefObject } from 'react'; | ||
interface TransitionArgs { | ||
immediate: boolean; | ||
container: MutableRefObject<HTMLElement | null>; | ||
classes: MutableRefObject<{ | ||
base: string[]; | ||
enter: string[]; | ||
@@ -17,3 +19,3 @@ enterFrom: string[]; | ||
} | ||
export declare function useTransition({ container, direction, classes, onStart, onStop }: TransitionArgs): void; | ||
export declare function useTransition({ immediate, container, direction, classes, onStart, onStop, }: TransitionArgs): void; | ||
export {}; |
@@ -1,1 +0,1 @@ | ||
import{transition as d}from'../components/transitions/utils/transition.js';import{disposables as l}from'../utils/disposables.js';import{useDisposables as f}from'./use-disposables.js';import{useIsMounted as m}from'./use-is-mounted.js';import{useIsoMorphicEffect as p}from'./use-iso-morphic-effect.js';import{useLatestValue as b}from'./use-latest-value.js';function D({container:i,direction:t,classes:o,onStart:s,onStop:u}){let a=m(),c=f(),r=b(t);p(()=>{let e=l();c.add(e.dispose);let n=i.current;if(n&&r.current!=="idle"&&a.current)return e.dispose(),s.current(r.current),e.add(d(n,o.current,r.current==="enter",()=>{e.dispose(),u.current(r.current)})),e.dispose},[t])}export{D as useTransition}; | ||
import{transition as f}from'../components/transitions/utils/transition.js';import{disposables as m}from'../utils/disposables.js';import{useDisposables as p}from'./use-disposables.js';import{useIsMounted as b}from'./use-is-mounted.js';import{useIsoMorphicEffect as o}from'./use-iso-morphic-effect.js';import{useLatestValue as g}from'./use-latest-value.js';function E({immediate:t,container:s,direction:n,classes:u,onStart:a,onStop:c}){let l=b(),d=p(),e=g(n);o(()=>{t&&(e.current="enter")},[t]),o(()=>{let r=m();d.add(r.dispose);let i=s.current;if(i&&e.current!=="idle"&&l.current)return r.dispose(),a.current(e.current),r.add(f(i,u.current,e.current==="enter",()=>{r.dispose(),c.current(e.current)})),r.dispose},[n])}export{E as useTransition}; |
@@ -9,3 +9,2 @@ import 'client-only'; | ||
export * from './components/popover/popover.js'; | ||
export * from './components/portal/portal.js'; | ||
export * from './components/radio-group/radio-group.js'; | ||
@@ -15,1 +14,2 @@ export * from './components/switch/switch.js'; | ||
export * from './components/transitions/transition.js'; | ||
export { Portal } from './components/portal/portal.js'; |
@@ -1,1 +0,1 @@ | ||
import"client-only";export*from'./components/combobox/combobox.js';export*from'./components/dialog/dialog.js';export*from'./components/disclosure/disclosure.js';export*from'./components/focus-trap/focus-trap.js';export*from'./components/listbox/listbox.js';export*from'./components/menu/menu.js';export*from'./components/popover/popover.js';export*from'./components/portal/portal.js';export*from'./components/radio-group/radio-group.js';export*from'./components/switch/switch.js';export*from'./components/tabs/tabs.js';export*from'./components/transitions/transition.js'; | ||
import"client-only";export*from'./components/combobox/combobox.js';export*from'./components/dialog/dialog.js';export*from'./components/disclosure/disclosure.js';export*from'./components/focus-trap/focus-trap.js';export*from'./components/listbox/listbox.js';export*from'./components/menu/menu.js';export*from'./components/popover/popover.js';export*from'./components/radio-group/radio-group.js';export*from'./components/switch/switch.js';export*from'./components/tabs/tabs.js';export*from'./components/transitions/transition.js';import{Portal as d}from'./components/portal/portal.js';export{d as Portal}; |
@@ -1,1 +0,1 @@ | ||
import i,{useState as s}from"react";import{Hidden as c,Features as l}from'./hidden.js';function p({onFocus:n}){let[r,o]=s(!0);return r?i.createElement(c,{as:"button",type:"button",features:l.Focusable,onFocus:a=>{a.preventDefault();let e,u=50;function t(){if(u--<=0){e&&cancelAnimationFrame(e);return}if(n()){o(!1),cancelAnimationFrame(e);return}e=requestAnimationFrame(t)}e=requestAnimationFrame(t)}}):null}export{p as FocusSentinel}; | ||
import s,{useState as c}from"react";import{useIsMounted as m}from'../hooks/use-is-mounted.js';import{Hidden as f,Features as l}from'./hidden.js';function A({onFocus:n}){let[r,o]=c(!0),u=m();return r?s.createElement(f,{as:"button",type:"button",features:l.Focusable,onFocus:a=>{a.preventDefault();let e,i=50;function t(){if(i--<=0){e&&cancelAnimationFrame(e);return}if(n()){if(cancelAnimationFrame(e),!u.current)return;o(!1);return}e=requestAnimationFrame(t)}e=requestAnimationFrame(t)}}):null}export{A as FocusSentinel}; |
@@ -1,1 +0,1 @@ | ||
function e(...n){return n.filter(Boolean).join(" ")}export{e as classNames}; | ||
function t(...r){return Array.from(new Set(r.flatMap(n=>typeof n=="string"?n.split(" "):[]))).filter(Boolean).join(" ")}export{t as classNames}; |
type Entries = [string, string][]; | ||
export declare function objectToFormEntries(source?: Record<string, any>, parentKey?: string | null, entries?: Entries): Entries; | ||
export declare function attemptSubmit(element: HTMLElement): void; | ||
export declare function attemptSubmit(elementInForm: HTMLElement): void; | ||
export {}; |
@@ -1,1 +0,1 @@ | ||
function e(n={},r=null,t=[]){for(let[i,o]of Object.entries(n))f(t,s(r,i),o);return t}function s(n,r){return n?n+"["+r+"]":r}function f(n,r,t){if(Array.isArray(t))for(let[i,o]of t.entries())f(n,s(r,i.toString()),o);else t instanceof Date?n.push([r,t.toISOString()]):typeof t=="boolean"?n.push([r,t?"1":"0"]):typeof t=="string"?n.push([r,t]):typeof t=="number"?n.push([r,`${t}`]):t==null?n.push([r,""]):e(t,r,n)}function p(n){var t;let r=(t=n==null?void 0:n.form)!=null?t:n.closest("form");if(r){for(let i of r.elements)if(i.tagName==="INPUT"&&i.type==="submit"||i.tagName==="BUTTON"&&i.type==="submit"||i.nodeName==="INPUT"&&i.type==="image"){i.click();return}}}export{p as attemptSubmit,e as objectToFormEntries}; | ||
function e(i={},s=null,t=[]){for(let[r,n]of Object.entries(i))o(t,f(s,r),n);return t}function f(i,s){return i?i+"["+s+"]":s}function o(i,s,t){if(Array.isArray(t))for(let[r,n]of t.entries())o(i,f(s,r.toString()),n);else t instanceof Date?i.push([s,t.toISOString()]):typeof t=="boolean"?i.push([s,t?"1":"0"]):typeof t=="string"?i.push([s,t]):typeof t=="number"?i.push([s,`${t}`]):t==null?i.push([s,""]):e(t,s,i)}function p(i){var t,r;let s=(t=i==null?void 0:i.form)!=null?t:i.closest("form");if(s){for(let n of s.elements)if(n!==i&&(n.tagName==="INPUT"&&n.type==="submit"||n.tagName==="BUTTON"&&n.type==="submit"||n.nodeName==="INPUT"&&n.type==="image")){n.click();return}(r=s.requestSubmit)==null||r.call(s)}}export{p as attemptSubmit,e as objectToFormEntries}; |
{ | ||
"name": "@headlessui/react", | ||
"version": "1.7.14", | ||
"version": "1.7.17", | ||
"description": "A set of completely unstyled, fully accessible UI components for React, designed to integrate beautifully with Tailwind CSS.", | ||
@@ -14,5 +14,5 @@ "main": "dist/index.cjs", | ||
"exports": { | ||
"types": "./dist/index.d.ts", | ||
"import": "./dist/headlessui.esm.js", | ||
"require": "./dist/index.cjs", | ||
"types": "./dist/index.d.ts" | ||
"require": "./dist/index.cjs" | ||
}, | ||
@@ -19,0 +19,0 @@ "type": "module", |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
161
9357
533396
1