@headlessui/react
Advanced tools
Comparing version 0.0.0-insiders.1ee4cfd to 0.0.0-insiders.1f1e290
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as S}from"@react-aria/focus";import{useHover as W}from"@react-aria/interactions";import i,{useCallback as N,useMemo as V,useState as w}from"react";import{useActivePress as J}from'../../hooks/use-active-press.js';import{useControllable as $}from'../../hooks/use-controllable.js';import{useDefaultValue as j}from'../../hooks/use-default-value.js';import{useDisposables as q}from'../../hooks/use-disposables.js';import{useEvent as n}from'../../hooks/use-event.js';import{useId as z}from'../../hooks/use-id.js';import{useDisabled as Q}from'../../internal/disabled.js';import{FormFields as Y}from'../../internal/form-fields.js';import{useProvidedId as Z}from'../../internal/id.js';import{isDisabledReactIssue7711 as ee}from'../../utils/bugs.js';import{attemptSubmit as oe}from'../../utils/form.js';import{forwardRefWithAs as te,mergeProps as re,render as ae}from'../../utils/render.js';import{useDescribedBy as le}from'../description/description.js';import{Keys as y}from'../keyboard.js';import{useLabelledBy as ne}from'../label/label.js';let se="span";function ie(T,h){let C=z(),k=Z(),x=Q(),{id:g=k||`headlessui-checkbox-${C}`,disabled:o=x||!1,autoFocus:s=!1,checked:E,defaultChecked:v,onChange:P,name:d,value:D,form:R,indeterminate:l=!1,...A}=T,r=j(v),[a,t]=$(E,P,r!=null?r:!1),F=ne(),K=le(),_=q(),[p,c]=w(!1),m=n(()=>{c(!0),t==null||t(!a),_.nextFrame(()=>{c(!1)})}),H=n(e=>{if(ee(e.currentTarget))return e.preventDefault();e.preventDefault(),m()}),B=n(e=>{e.key===y.Space?(e.preventDefault(),m()):e.key===y.Enter&&oe(e.currentTarget)}),L=n(e=>e.preventDefault()),{isFocusVisible:u,focusProps:I}=S({autoFocus:s}),{isHovered:f,hoverProps:M}=W({isDisabled:o}),{pressed:b,pressProps:U}=J({disabled:o}),O=re({ref:h,id:g,role:"checkbox","aria-checked":l?"mixed":a?"true":"false","aria-labelledby":F,"aria-describedby":K,"aria-disabled":o?!0:void 0,indeterminate:l?"true":void 0,tabIndex:0,onKeyUp:o?void 0:B,onKeyPress:o?void 0:L,onClick:o?void 0:H},I,M,U),X=V(()=>({checked:a,disabled:o,hover:f,focus:u,active:b,indeterminate:l,changing:p,autofocus:s}),[a,l,o,f,u,b,p,s]),G=N(()=>{if(r!==void 0)return t==null?void 0:t(r)},[t,r]);return i.createElement(i.Fragment,null,d!=null&&i.createElement(Y,{disabled:o,data:{[d]:D||"on"},overrides:{type:"checkbox",checked:a},form:R,onReset:G}),ae({ourProps:O,theirProps:A,slot:X,defaultTag:se,name:"Checkbox"}))}let Re=te(ie);export{Re as Checkbox}; | ||
"use client";import{useFocusRing as S}from"@react-aria/focus";import{useHover as W}from"@react-aria/interactions";import i,{useCallback as N,useMemo as V,useState as w}from"react";import{useActivePress as J}from'../../hooks/use-active-press.js';import{useControllable as $}from'../../hooks/use-controllable.js';import{useDefaultValue as j}from'../../hooks/use-default-value.js';import{useDisposables as q}from'../../hooks/use-disposables.js';import{useEvent as l}from'../../hooks/use-event.js';import{useId as z}from'../../hooks/use-id.js';import{useDisabled as Q}from'../../internal/disabled.js';import{FormFields as Y}from'../../internal/form-fields.js';import{useProvidedId as Z}from'../../internal/id.js';import{isDisabledReactIssue7711 as ee}from'../../utils/bugs.js';import{attemptSubmit as oe}from'../../utils/form.js';import{forwardRefWithAs as te,mergeProps as re,render as ae}from'../../utils/render.js';import{useDescribedBy as ne}from'../description/description.js';import{Keys as y}from'../keyboard.js';import{useLabelledBy as le}from'../label/label.js';let se="span";function ie(T,h){let C=z(),k=Z(),x=Q(),{id:g=k||`headlessui-checkbox-${C}`,disabled:e=x||!1,autoFocus:s=!1,checked:E,defaultChecked:v,onChange:P,name:d,value:D,form:R,indeterminate:n=!1,...A}=T,r=j(v),[a,t]=$(E,P,r!=null?r:!1),F=le(),K=ne(),_=q(),[p,c]=w(!1),u=l(()=>{c(!0),t==null||t(!a),_.nextFrame(()=>{c(!1)})}),H=l(o=>{if(ee(o.currentTarget))return o.preventDefault();o.preventDefault(),u()}),B=l(o=>{o.key===y.Space?(o.preventDefault(),u()):o.key===y.Enter&&oe(o.currentTarget)}),L=l(o=>o.preventDefault()),{isFocusVisible:m,focusProps:I}=S({autoFocus:s}),{isHovered:f,hoverProps:M}=W({isDisabled:e}),{pressed:b,pressProps:U}=J({disabled:e}),O=re({ref:h,id:g,role:"checkbox","aria-checked":n?"mixed":a?"true":"false","aria-labelledby":F,"aria-describedby":K,"aria-disabled":e?!0:void 0,indeterminate:n?"true":void 0,tabIndex:e?void 0:0,onKeyUp:e?void 0:B,onKeyPress:e?void 0:L,onClick:e?void 0:H},I,M,U),X=V(()=>({checked:a,disabled:e,hover:f,focus:m,active:b,indeterminate:n,changing:p,autofocus:s}),[a,n,e,f,m,b,p,s]),G=N(()=>{if(r!==void 0)return t==null?void 0:t(r)},[t,r]);return i.createElement(i.Fragment,null,d!=null&&i.createElement(Y,{disabled:e,data:{[d]:D||"on"},overrides:{type:"checkbox",checked:a},form:R,onReset:G}),ae({ourProps:O,theirProps:A,slot:X,defaultTag:se,name:"Checkbox"}))}let Re=te(ie);export{Re as Checkbox}; |
import React, { type ElementType, type Ref } from 'react'; | ||
import { type ByComparator } from '../../hooks/use-by-comparator.js'; | ||
import { type TransitionData } from '../../hooks/use-transition.js'; | ||
import { type AnchorProps } from '../../internal/floating.js'; | ||
@@ -73,3 +74,3 @@ import type { EnsureArray, Props } from '../../types.js'; | ||
option: unknown; | ||
}; | ||
} & TransitionData; | ||
type OptionsPropsWeControl = 'aria-labelledby' | 'aria-multiselectable' | 'role' | 'tabIndex'; | ||
@@ -82,2 +83,3 @@ declare let OptionsRenderFeatures: number; | ||
modal?: boolean; | ||
transition?: boolean; | ||
}>; | ||
@@ -84,0 +86,0 @@ declare function OptionsFn<TTag extends ElementType = typeof DEFAULT_OPTIONS_TAG>(props: ComboboxOptionsProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; |
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as Ce}from"@react-aria/focus";import{useHover as ye}from"@react-aria/interactions";import{useVirtualizer as Be}from"@tanstack/react-virtual";import B,{Fragment as Re,createContext as ce,createRef as ke,useCallback as Se,useContext as fe,useMemo as j,useReducer as Ne,useRef as K,useState as Pe}from"react";import{useActivePress as Ue}from'../../hooks/use-active-press.js';import{useByComparator as He}from'../../hooks/use-by-comparator.js';import{useControllable as Ge}from'../../hooks/use-controllable.js';import{useDefaultValue as je}from'../../hooks/use-default-value.js';import{useDisposables as Ie}from'../../hooks/use-disposables.js';import{useElementSize as Ae}from'../../hooks/use-element-size.js';import{useEvent as T}from'../../hooks/use-event.js';import{useFrameDebounce as Ke}from'../../hooks/use-frame-debounce.js';import{useId as le}from'../../hooks/use-id.js';import{useInertOthers as We}from'../../hooks/use-inert-others.js';import{useIsoMorphicEffect as $}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as ze}from'../../hooks/use-latest-value.js';import{useOnDisappear as $e}from'../../hooks/use-on-disappear.js';import{useOutsideClick as Xe}from'../../hooks/use-outside-click.js';import{useOwnerDocument as Ee}from'../../hooks/use-owner.js';import{useRefocusableInput as _e}from'../../hooks/use-refocusable-input.js';import{useResolveButtonType as Je}from'../../hooks/use-resolve-button-type.js';import{useScrollLock as qe}from'../../hooks/use-scroll-lock.js';import{useSyncRefs as ue}from'../../hooks/use-sync-refs.js';import{useTrackedPointer as Ye}from'../../hooks/use-tracked-pointer.js';import{useTreeWalker as Qe}from'../../hooks/use-tree-walker.js';import{useWatch as Fe}from'../../hooks/use-watch.js';import{useDisabled as Ze}from'../../internal/disabled.js';import{FloatingProvider as eo,useFloatingPanel as oo,useFloatingPanelProps as to,useFloatingReference as no,useResolvedAnchor as ro}from'../../internal/floating.js';import{FormFields as io}from'../../internal/form-fields.js';import{useProvidedId as ao}from'../../internal/id.js';import{OpenClosedProvider as lo,State as pe,useOpenClosed as uo}from'../../internal/open-closed.js';import{history as he}from'../../utils/active-element-history.js';import{isDisabledReactIssue7711 as po}from'../../utils/bugs.js';import{Focus as R,calculateActiveIndex as De}from'../../utils/calculate-active-index.js';import{disposables as Me}from'../../utils/disposables.js';import{sortByDomNode as so}from'../../utils/focus-management.js';import{match as Y}from'../../utils/match.js';import{isMobile as bo}from'../../utils/platform.js';import{RenderFeatures as Ve,forwardRefWithAs as Z,mergeProps as me,render as ee}from'../../utils/render.js';import{useDescribedBy as co}from'../description/description.js';import{Keys as M}from'../keyboard.js';import{Label as fo,useLabelledBy as xe,useLabels as mo}from'../label/label.js';import{MouseButton as Le}from'../mouse.js';import{Portal as xo}from'../portal/portal.js';var To=(e=>(e[e.Open=0]="Open",e[e.Closed=1]="Closed",e))(To||{}),go=(e=>(e[e.Single=0]="Single",e[e.Multi=1]="Multi",e))(go||{}),vo=(t=>(t[t.Pointer=0]="Pointer",t[t.Focus=1]="Focus",t[t.Other=2]="Other",t))(vo||{}),Oo=(i=>(i[i.OpenCombobox=0]="OpenCombobox",i[i.CloseCombobox=1]="CloseCombobox",i[i.GoToOption=2]="GoToOption",i[i.RegisterOption=3]="RegisterOption",i[i.UnregisterOption=4]="UnregisterOption",i[i.SetActivationTrigger=5]="SetActivationTrigger",i[i.UpdateVirtualConfiguration=6]="UpdateVirtualConfiguration",i))(Oo||{});function Te(o,r=e=>e){let e=o.activeOptionIndex!==null?o.options[o.activeOptionIndex]:null,t=r(o.options.slice()),c=t.length>0&&t[0].dataRef.current.order!==null?t.sort((d,i)=>d.dataRef.current.order-i.dataRef.current.order):so(t,d=>d.dataRef.current.domRef.current),s=e?c.indexOf(e):null;return s===-1&&(s=null),{options:c,activeOptionIndex:s}}let Co={[1](o){var r;return(r=o.dataRef.current)!=null&&r.disabled||o.comboboxState===1?o:{...o,activeOptionIndex:null,comboboxState:1,activationTrigger:2,__demoMode:!1}},[0](o){var r,e;if((r=o.dataRef.current)!=null&&r.disabled||o.comboboxState===0)return o;if((e=o.dataRef.current)!=null&&e.value){let t=o.dataRef.current.calculateIndex(o.dataRef.current.value);if(t!==-1)return{...o,activeOptionIndex:t,comboboxState:0,__demoMode:!1}}return{...o,comboboxState:0,__demoMode:!1}},[2](o,r){var s,d,i,m,n;if((s=o.dataRef.current)!=null&&s.disabled||(d=o.dataRef.current)!=null&&d.optionsRef.current&&!((i=o.dataRef.current)!=null&&i.optionsPropsRef.current.static)&&o.comboboxState===1)return o;if(o.virtual){let{options:p,disabled:f}=o.virtual,_=r.focus===R.Specific?r.idx:De(r,{resolveItems:()=>p,resolveActiveIndex:()=>{var u,x;return(x=(u=o.activeOptionIndex)!=null?u:p.findIndex(V=>!f(V)))!=null?x:null},resolveDisabled:f,resolveId(){throw new Error("Function not implemented.")}}),F=(m=r.trigger)!=null?m:2;return o.activeOptionIndex===_&&o.activationTrigger===F?o:{...o,activeOptionIndex:_,activationTrigger:F,__demoMode:!1}}let e=Te(o);if(e.activeOptionIndex===null){let p=e.options.findIndex(f=>!f.dataRef.current.disabled);p!==-1&&(e.activeOptionIndex=p)}let t=r.focus===R.Specific?r.idx:De(r,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:p=>p.id,resolveDisabled:p=>p.dataRef.current.disabled}),c=(n=r.trigger)!=null?n:2;return o.activeOptionIndex===t&&o.activationTrigger===c?o:{...o,...e,activeOptionIndex:t,activationTrigger:c,__demoMode:!1}},[3]:(o,r)=>{var s,d,i;if((s=o.dataRef.current)!=null&&s.virtual)return{...o,options:[...o.options,r.payload]};let e=r.payload,t=Te(o,m=>(m.push(e),m));o.activeOptionIndex===null&&(d=o.dataRef.current)!=null&&d.isSelected(r.payload.dataRef.current.value)&&(t.activeOptionIndex=t.options.indexOf(e));let c={...o,...t,activationTrigger:2};return(i=o.dataRef.current)!=null&&i.__demoMode&&o.dataRef.current.value===void 0&&(c.activeOptionIndex=0),c},[4]:(o,r)=>{var t;if((t=o.dataRef.current)!=null&&t.virtual)return{...o,options:o.options.filter(c=>c.id!==r.id)};let e=Te(o,c=>{let s=c.findIndex(d=>d.id===r.id);return s!==-1&&c.splice(s,1),c});return{...o,...e,activationTrigger:2}},[5]:(o,r)=>o.activationTrigger===r.trigger?o:{...o,activationTrigger:r.trigger},[6]:(o,r)=>{var t,c;if(o.virtual===null)return{...o,virtual:{options:r.options,disabled:(t=r.disabled)!=null?t:()=>!1}};if(o.virtual.options===r.options&&o.virtual.disabled===r.disabled)return o;let e=o.activeOptionIndex;if(o.activeOptionIndex!==null){let s=r.options.indexOf(o.virtual.options[o.activeOptionIndex]);s!==-1?e=s:e=null}return{...o,activeOptionIndex:e,virtual:{options:r.options,disabled:(c=r.disabled)!=null?c:()=>!1}}}},ge=ce(null);ge.displayName="ComboboxActionsContext";function oe(o){let r=fe(ge);if(r===null){let e=new Error(`<${o} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,oe),e}return r}let we=ce(null);function yo(o){let r=Q("VirtualProvider"),{options:e}=r.virtual,[t,c]=j(()=>{let n=r.optionsRef.current;if(!n)return[0,0];let p=window.getComputedStyle(n);return[parseFloat(p.paddingBlockStart||p.paddingTop),parseFloat(p.paddingBlockEnd||p.paddingBottom)]},[r.optionsRef.current]),s=Be({scrollPaddingStart:t,scrollPaddingEnd:c,count:e.length,estimateSize(){return 40},getScrollElement(){var n;return(n=r.optionsRef.current)!=null?n:null},overscan:12}),[d,i]=Pe(0);$(()=>{i(n=>n+1)},[e]);let m=s.getVirtualItems();return m.length===0?null:B.createElement(we.Provider,{value:s},B.createElement("div",{style:{position:"relative",width:"100%",height:`${s.getTotalSize()}px`},ref:n=>{if(n){if(typeof process!="undefined"&&process.env.JEST_WORKER_ID!==void 0||r.activationTrigger===0)return;r.activeOptionIndex!==null&&e.length>r.activeOptionIndex&&s.scrollToIndex(r.activeOptionIndex)}}},m.map(n=>{var p;return B.createElement(Re,{key:n.key},B.cloneElement((p=o.children)==null?void 0:p.call(o,{option:e[n.index],open:r.comboboxState===0}),{key:`${d}-${n.key}`,"data-index":n.index,"aria-setsize":e.length,"aria-posinset":n.index+1,style:{position:"absolute",top:0,left:0,transform:`translateY(${n.start}px)`,overflowAnchor:"none"}}))})))}let se=ce(null);se.displayName="ComboboxDataContext";function Q(o){let r=fe(se);if(r===null){let e=new Error(`<${o} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,Q),e}return r}function Ro(o,r){return Y(r.type,Co,o,r)}let So=Re;function Po(o,r){var G,ve;let e=Ze(),{value:t,defaultValue:c,onChange:s,form:d,name:i,by:m,disabled:n=e||!1,onClose:p,__demoMode:f=!1,multiple:_=!1,immediate:F=!1,virtual:u=null,nullable:x,...V}=o,S=je(c),[O=_?[]:void 0,C]=Ge(t,s,S),[P,I]=Ne(Ro,{dataRef:ke(),comboboxState:f?0:1,options:[],virtual:u?{options:u.options,disabled:(G=u.disabled)!=null?G:()=>!1}:null,activeOptionIndex:null,activationTrigger:2,__demoMode:f}),D=K(!1),k=K({static:!1,hold:!1}),v=K(null),W=K(null),X=K(null),h=He(m),U=T(b=>u?m===null?u.options.indexOf(b):u.options.findIndex(g=>h(g,b)):P.options.findIndex(g=>h(g.dataRef.current.value,b))),A=Se(b=>Y(a.mode,{[1]:()=>O.some(g=>h(g,b)),[0]:()=>h(O,b)}),[O]),J=T(b=>P.activeOptionIndex===U(b)),a=j(()=>({...P,immediate:F,optionsPropsRef:k,inputRef:v,buttonRef:W,optionsRef:X,value:O,defaultValue:S,disabled:n,mode:_?1:0,virtual:u?P.virtual:null,get activeOptionIndex(){if(D.current&&P.activeOptionIndex===null&&(u?u.options.length>0:P.options.length>0)){if(u){let g=u.options.findIndex(H=>{var ae,Oe;return!((Oe=(ae=u.disabled)==null?void 0:ae.call(u,H))!=null&&Oe)});if(g!==-1)return g}let b=P.options.findIndex(g=>!g.dataRef.current.disabled);if(b!==-1)return b}return P.activeOptionIndex},calculateIndex:U,compare:h,isSelected:A,isActive:J}),[O,S,n,_,f,P,u]);$(()=>{var b;u&&I({type:6,options:u.options,disabled:(b=u.disabled)!=null?b:null})},[u,u==null?void 0:u.options,u==null?void 0:u.disabled]),$(()=>{P.dataRef.current=a},[a]);let z=a.comboboxState===0;Xe(z,[a.buttonRef,a.inputRef,a.optionsRef],()=>L.closeCombobox());let de=j(()=>{var b,g,H;return{open:a.comboboxState===0,disabled:n,activeIndex:a.activeOptionIndex,activeOption:a.activeOptionIndex===null?null:a.virtual?a.virtual.options[(b=a.activeOptionIndex)!=null?b:0]:(H=(g=a.options[a.activeOptionIndex])==null?void 0:g.dataRef.current.value)!=null?H:null,value:O}},[a,n,O]),be=T(()=>{if(a.activeOptionIndex!==null){if(a.virtual)q(a.virtual.options[a.activeOptionIndex]);else{let{dataRef:b}=a.options[a.activeOptionIndex];q(b.current.value)}L.goToOption(R.Specific,a.activeOptionIndex)}}),te=T(()=>{I({type:0}),D.current=!0}),ne=T(()=>{I({type:1}),D.current=!1,p==null||p()}),re=T((b,g,H)=>(D.current=!1,b===R.Specific?I({type:2,focus:R.Specific,idx:g,trigger:H}):I({type:2,focus:b,trigger:H}))),ie=T((b,g)=>(I({type:3,payload:{id:b,dataRef:g}}),()=>{a.isActive(g.current.value)&&(D.current=!0),I({type:4,id:b})})),q=T(b=>Y(a.mode,{[0](){return C==null?void 0:C(b)},[1](){let g=a.value.slice(),H=g.findIndex(ae=>h(ae,b));return H===-1?g.push(b):g.splice(H,1),C==null?void 0:C(g)}})),l=T(b=>{I({type:5,trigger:b})}),L=j(()=>({onChange:q,registerOption:ie,goToOption:re,closeCombobox:ne,openCombobox:te,setActivationTrigger:l,selectActiveOption:be}),[]),[E,N]=mo(),y=r===null?{}:{ref:r},w=Se(()=>{if(S!==void 0)return C==null?void 0:C(S)},[C,S]);return B.createElement(N,{value:E,props:{htmlFor:(ve=a.inputRef.current)==null?void 0:ve.id},slot:{open:a.comboboxState===0,disabled:n}},B.createElement(eo,null,B.createElement(ge.Provider,{value:L},B.createElement(se.Provider,{value:a},B.createElement(lo,{value:Y(a.comboboxState,{[0]:pe.Open,[1]:pe.Closed})},i!=null&&B.createElement(io,{disabled:n,data:O!=null?{[i]:O}:{},form:d,onReset:w}),ee({ourProps:y,theirProps:V,slot:de,defaultTag:So,name:"Combobox"}))))))}let Io="input";function Ao(o,r){var te,ne,re,ie,q;let e=Q("Combobox.Input"),t=oe("Combobox.Input"),c=le(),s=ao(),{id:d=s||`headlessui-combobox-input-${c}`,onChange:i,displayValue:m,disabled:n=e.disabled||!1,autoFocus:p=!1,type:f="text",..._}=o,F=ue(e.inputRef,r,no()),u=Ee(e.inputRef),x=K(!1),V=Ie(),S=T(()=>{t.onChange(null),e.optionsRef.current&&(e.optionsRef.current.scrollTop=0),t.goToOption(R.Nothing)}),O=j(()=>{var l;return typeof m=="function"&&e.value!==void 0?(l=m(e.value))!=null?l:"":typeof e.value=="string"?e.value:""},[e.value,m]);Fe(([l,L],[E,N])=>{if(x.current)return;let y=e.inputRef.current;y&&((N===0&&L===1||l!==E)&&(y.value=l),requestAnimationFrame(()=>{if(x.current||!y||(u==null?void 0:u.activeElement)!==y)return;let{selectionStart:w,selectionEnd:G}=y;Math.abs((G!=null?G:0)-(w!=null?w:0))===0&&w===0&&y.setSelectionRange(y.value.length,y.value.length)}))},[O,e.comboboxState,u]),Fe(([l],[L])=>{if(l===0&&L===1){if(x.current)return;let E=e.inputRef.current;if(!E)return;let N=E.value,{selectionStart:y,selectionEnd:w,selectionDirection:G}=E;E.value="",E.value=N,G!==null?E.setSelectionRange(y,w,G):E.setSelectionRange(y,w)}},[e.comboboxState]);let C=K(!1),P=T(()=>{C.current=!0}),I=T(()=>{V.nextFrame(()=>{C.current=!1})}),D=Ke(),k=T(l=>{switch(x.current=!0,D(()=>{x.current=!1}),l.key){case M.Enter:if(x.current=!1,e.comboboxState!==0||C.current)return;if(l.preventDefault(),l.stopPropagation(),e.activeOptionIndex===null){t.closeCombobox();return}t.selectActiveOption(),e.mode===0&&t.closeCombobox();break;case M.ArrowDown:return x.current=!1,l.preventDefault(),l.stopPropagation(),Y(e.comboboxState,{[0]:()=>t.goToOption(R.Next),[1]:()=>t.openCombobox()});case M.ArrowUp:return x.current=!1,l.preventDefault(),l.stopPropagation(),Y(e.comboboxState,{[0]:()=>t.goToOption(R.Previous),[1]:()=>{t.openCombobox(),V.nextFrame(()=>{e.value||t.goToOption(R.Last)})}});case M.Home:if(l.shiftKey)break;return x.current=!1,l.preventDefault(),l.stopPropagation(),t.goToOption(R.First);case M.PageUp:return x.current=!1,l.preventDefault(),l.stopPropagation(),t.goToOption(R.First);case M.End:if(l.shiftKey)break;return x.current=!1,l.preventDefault(),l.stopPropagation(),t.goToOption(R.Last);case M.PageDown:return x.current=!1,l.preventDefault(),l.stopPropagation(),t.goToOption(R.Last);case M.Escape:return x.current=!1,e.comboboxState!==0?void 0:(l.preventDefault(),e.optionsRef.current&&!e.optionsPropsRef.current.static&&l.stopPropagation(),e.mode===0&&e.value===null&&S(),t.closeCombobox());case M.Tab:if(x.current=!1,e.comboboxState!==0)return;e.mode===0&&e.activationTrigger!==1&&t.selectActiveOption(),t.closeCombobox();break}}),v=T(l=>{i==null||i(l),e.mode===0&&l.target.value===""&&S(),t.openCombobox()}),W=T(l=>{var E,N,y;let L=(E=l.relatedTarget)!=null?E:he.find(w=>w!==l.currentTarget);if(x.current=!1,!((N=e.optionsRef.current)!=null&&N.contains(L))&&!((y=e.buttonRef.current)!=null&&y.contains(L))&&e.comboboxState===0)return l.preventDefault(),e.mode===0&&e.value===null&&S(),t.closeCombobox()}),X=T(l=>{var E,N,y;let L=(E=l.relatedTarget)!=null?E:he.find(w=>w!==l.currentTarget);(N=e.buttonRef.current)!=null&&N.contains(L)||(y=e.optionsRef.current)!=null&&y.contains(L)||e.disabled||e.immediate&&e.comboboxState!==0&&(t.openCombobox(),V.nextFrame(()=>{t.setActivationTrigger(1)}))}),h=xe(),U=co(),{isFocused:A,focusProps:J}=Ce({autoFocus:p}),{isHovered:a,hoverProps:z}=ye({isDisabled:n}),de=j(()=>({open:e.comboboxState===0,disabled:n,hover:a,focus:A,autofocus:p}),[e,a,A,p,n]),be=me({ref:F,id:d,role:"combobox",type:f,"aria-controls":(te=e.optionsRef.current)==null?void 0:te.id,"aria-expanded":e.comboboxState===0,"aria-activedescendant":e.activeOptionIndex===null?void 0:e.virtual?(ne=e.options.find(l=>!l.dataRef.current.disabled&&e.compare(l.dataRef.current.value,e.virtual.options[e.activeOptionIndex])))==null?void 0:ne.id:(re=e.options[e.activeOptionIndex])==null?void 0:re.id,"aria-labelledby":h,"aria-describedby":U,"aria-autocomplete":"list",defaultValue:(q=(ie=o.defaultValue)!=null?ie:e.defaultValue!==void 0?m==null?void 0:m(e.defaultValue):null)!=null?q:e.defaultValue,disabled:n||void 0,autoFocus:p,onCompositionStart:P,onCompositionEnd:I,onKeyDown:k,onChange:v,onFocus:X,onBlur:W},J,z);return ee({ourProps:be,theirProps:_,slot:de,defaultTag:Io,name:"Combobox.Input"})}let Eo="button";function _o(o,r){var k;let e=Q("Combobox.Button"),t=oe("Combobox.Button"),c=ue(e.buttonRef,r),s=le(),{id:d=`headlessui-combobox-button-${s}`,disabled:i=e.disabled||!1,autoFocus:m=!1,...n}=o,p=Ie(),f=_e(e.inputRef),_=T(v=>{switch(v.key){case M.Space:case M.Enter:return v.preventDefault(),v.stopPropagation(),e.comboboxState===1&&t.openCombobox(),p.nextFrame(()=>f());case M.ArrowDown:return v.preventDefault(),v.stopPropagation(),e.comboboxState===1&&(t.openCombobox(),p.nextFrame(()=>{e.value||t.goToOption(R.First)})),p.nextFrame(()=>f());case M.ArrowUp:return v.preventDefault(),v.stopPropagation(),e.comboboxState===1&&(t.openCombobox(),p.nextFrame(()=>{e.value||t.goToOption(R.Last)})),p.nextFrame(()=>f());case M.Escape:return e.comboboxState!==0?void 0:(v.preventDefault(),e.optionsRef.current&&!e.optionsPropsRef.current.static&&v.stopPropagation(),t.closeCombobox(),p.nextFrame(()=>f()));default:return}}),F=T(v=>{v.preventDefault(),!po(v.currentTarget)&&(v.button===Le.Left&&(e.comboboxState===0?t.closeCombobox():t.openCombobox()),f())}),u=xe([d]),{isFocusVisible:x,focusProps:V}=Ce({autoFocus:m}),{isHovered:S,hoverProps:O}=ye({isDisabled:i}),{pressed:C,pressProps:P}=Ue({disabled:i}),I=j(()=>({open:e.comboboxState===0,active:C||e.comboboxState===0,disabled:i,value:e.value,hover:S,focus:x}),[e,S,x,C,i]),D=me({ref:c,id:d,type:Je(o,e.buttonRef),tabIndex:-1,"aria-haspopup":"listbox","aria-controls":(k=e.optionsRef.current)==null?void 0:k.id,"aria-expanded":e.comboboxState===0,"aria-labelledby":u,disabled:i||void 0,autoFocus:m,onMouseDown:F,onKeyDown:_},V,O,P);return ee({ourProps:D,theirProps:n,slot:I,defaultTag:Eo,name:"Combobox.Button"})}let Fo="div",ho=Ve.RenderStrategy|Ve.Static;function Do(o,r){var U;let e=le(),{id:t=`headlessui-combobox-options-${e}`,hold:c=!1,anchor:s,portal:d=!1,modal:i=!0,...m}=o,n=Q("Combobox.Options"),p=oe("Combobox.Options"),f=ro(s);f&&(d=!0);let[_,F]=oo(f),u=to(),x=ue(n.optionsRef,r,f?_:null),V=Ee(n.optionsRef),S=uo(),O=(()=>S!==null?(S&pe.Open)===pe.Open:n.comboboxState===0)();$e(O,n.inputRef,p.closeCombobox);let C=n.__demoMode?!1:i&&n.comboboxState===0;qe(C,V);let P=n.__demoMode?!1:i&&n.comboboxState===0;We(P,{allowed:T(()=>[n.inputRef.current,n.buttonRef.current,n.optionsRef.current])}),$(()=>{var A;n.optionsPropsRef.current.static=(A=o.static)!=null?A:!1},[n.optionsPropsRef,o.static]),$(()=>{n.optionsPropsRef.current.hold=c},[n.optionsPropsRef,c]),Qe(n.comboboxState===0,{container:n.optionsRef.current,accept(A){return A.getAttribute("role")==="option"?NodeFilter.FILTER_REJECT:A.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(A){A.setAttribute("role","none")}});let I=xe([(U=n.buttonRef.current)==null?void 0:U.id]),D=j(()=>({open:n.comboboxState===0,option:void 0}),[n]),k=T(()=>{p.setActivationTrigger(0)}),v=me(f?u():{},{"aria-labelledby":I,role:"listbox","aria-multiselectable":n.mode===1?!0:void 0,id:t,ref:x,style:{...F,"--input-width":Ae(n.inputRef,!0).width,"--button-width":Ae(n.buttonRef,!0).width},onWheel:k});n.virtual&&O&&Object.assign(m,{children:B.createElement(yo,null,m.children)});let[W,X]=Pe(n.value);n.value!==W&&n.comboboxState===0&&n.mode!==1&&X(n.value);let h=T(A=>n.compare(W,A));return B.createElement(xo,{enabled:d?o.static||O:!1},B.createElement(se.Provider,{value:n.mode===1?n:{...n,isSelected:h}},ee({ourProps:v,theirProps:m,slot:D,defaultTag:Fo,features:ho,visible:O,name:"Combobox.Options"})))}let Mo="div";function Vo(o,r){var h,U,A,J;let e=Q("Combobox.Option"),t=oe("Combobox.Option"),c=le(),{id:s=`headlessui-combobox-option-${c}`,value:d,disabled:i=(A=(U=(h=e.virtual)==null?void 0:h.disabled)==null?void 0:U.call(h,d))!=null?A:!1,order:m=null,...n}=o,p=_e(e.inputRef),f=e.virtual?e.activeOptionIndex===e.calculateIndex(d):e.activeOptionIndex===null?!1:((J=e.options[e.activeOptionIndex])==null?void 0:J.id)===s,_=e.isSelected(d),F=K(null),u=ze({disabled:i,value:d,domRef:F,order:m}),x=fe(we),V=ue(r,F,x?x.measureElement:null),S=T(()=>t.onChange(d));$(()=>t.registerOption(s,u),[u,s]);let O=K(!(e.virtual||e.__demoMode));$(()=>{if(!e.virtual&&!e.__demoMode)return Me().requestAnimationFrame(()=>{O.current=!0})},[e.virtual,e.__demoMode]),$(()=>{if(O.current&&e.comboboxState===0&&f&&e.activationTrigger!==0)return Me().requestAnimationFrame(()=>{var a,z;(z=(a=F.current)==null?void 0:a.scrollIntoView)==null||z.call(a,{block:"nearest"})})},[F,f,e.comboboxState,e.activationTrigger,e.activeOptionIndex]);let C=T(a=>{a.preventDefault(),a.button===Le.Left&&(i||(S(),bo()||requestAnimationFrame(()=>p()),e.mode===0&&t.closeCombobox()))}),P=T(()=>{if(i)return t.goToOption(R.Nothing);let a=e.calculateIndex(d);t.goToOption(R.Specific,a)}),I=Ye(),D=T(a=>I.update(a)),k=T(a=>{if(!I.wasMoved(a)||i||f)return;let z=e.calculateIndex(d);t.goToOption(R.Specific,z,0)}),v=T(a=>{I.wasMoved(a)&&(i||f&&(e.optionsPropsRef.current.hold||t.goToOption(R.Nothing)))}),W=j(()=>({active:f,focus:f,selected:_,disabled:i}),[f,_,i]);return ee({ourProps:{id:s,ref:V,role:"option",tabIndex:i===!0?void 0:-1,"aria-disabled":i===!0?!0:void 0,"aria-selected":_,disabled:void 0,onMouseDown:C,onFocus:P,onPointerEnter:D,onMouseEnter:D,onPointerMove:k,onMouseMove:k,onPointerLeave:v,onMouseLeave:v},theirProps:n,slot:W,defaultTag:Mo,name:"Combobox.Option"})}let Lo=Z(Po),wo=Z(_o),Bo=Z(Ao),ko=fo,No=Z(Do),Uo=Z(Vo),Dt=Object.assign(Lo,{Input:Bo,Button:wo,Label:ko,Options:No,Option:Uo});export{Dt as Combobox,wo as ComboboxButton,Bo as ComboboxInput,ko as ComboboxLabel,Uo as ComboboxOption,No as ComboboxOptions}; | ||
"use client";import{useFocusRing as ye}from"@react-aria/focus";import{useHover as Ce}from"@react-aria/interactions";import{useVirtualizer as ke}from"@tanstack/react-virtual";import D,{Fragment as Re,createContext as be,createRef as Ne,useCallback as Se,useContext as fe,useMemo as z,useReducer as Ue,useRef as $,useState as He}from"react";import{flushSync as Z}from"react-dom";import{useActivePress as Ge}from'../../hooks/use-active-press.js';import{useByComparator as je}from'../../hooks/use-by-comparator.js';import{useControllable as ze}from'../../hooks/use-controllable.js';import{useDefaultValue as Ke}from'../../hooks/use-default-value.js';import{useDisposables as We}from'../../hooks/use-disposables.js';import{useElementSize as Pe}from'../../hooks/use-element-size.js';import{useEvent as m}from'../../hooks/use-event.js';import{useId as pe}from'../../hooks/use-id.js';import{useInertOthers as $e}from'../../hooks/use-inert-others.js';import{useIsoMorphicEffect as X}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as Xe}from'../../hooks/use-latest-value.js';import{useOnDisappear as Je}from'../../hooks/use-on-disappear.js';import{useOutsideClick as qe}from'../../hooks/use-outside-click.js';import{useOwnerDocument as Ie}from'../../hooks/use-owner.js';import{useRefocusableInput as Ae}from'../../hooks/use-refocusable-input.js';import{useResolveButtonType as Ye}from'../../hooks/use-resolve-button-type.js';import{useScrollLock as Qe}from'../../hooks/use-scroll-lock.js';import{useSyncRefs as se}from'../../hooks/use-sync-refs.js';import{useTrackedPointer as Ze}from'../../hooks/use-tracked-pointer.js';import{useTransition as eo}from'../../hooks/use-transition.js';import{useTreeWalker as oo}from'../../hooks/use-tree-walker.js';import{useWatch as Ee}from'../../hooks/use-watch.js';import{useDisabled as to}from'../../internal/disabled.js';import{FloatingProvider as no,useFloatingPanel as ro,useFloatingPanelProps as io,useFloatingReference as ao,useResolvedAnchor as lo}from'../../internal/floating.js';import{FormFields as uo}from'../../internal/form-fields.js';import{Frozen as po,useFrozenData as _e}from'../../internal/frozen.js';import{useProvidedId as so}from'../../internal/id.js';import{OpenClosedProvider as bo,State as de,useOpenClosed as fo}from'../../internal/open-closed.js';import{history as he}from'../../utils/active-element-history.js';import{isDisabledReactIssue7711 as co}from'../../utils/bugs.js';import{Focus as I,calculateActiveIndex as De}from'../../utils/calculate-active-index.js';import{disposables as Me}from'../../utils/disposables.js';import{sortByDomNode as mo}from'../../utils/focus-management.js';import{match as ee}from'../../utils/match.js';import{isMobile as To}from'../../utils/platform.js';import{RenderFeatures as Fe,forwardRefWithAs as te,mergeProps as ce,render as ne}from'../../utils/render.js';import{useDescribedBy as xo}from'../description/description.js';import{Keys as V}from'../keyboard.js';import{Label as go,useLabelledBy as me,useLabels as vo}from'../label/label.js';import{MouseButton as Ve}from'../mouse.js';import{Portal as Oo}from'../portal/portal.js';var yo=(e=>(e[e.Open=0]="Open",e[e.Closed=1]="Closed",e))(yo||{}),Co=(e=>(e[e.Single=0]="Single",e[e.Multi=1]="Multi",e))(Co||{}),Ro=(t=>(t[t.Pointer=0]="Pointer",t[t.Focus=1]="Focus",t[t.Other=2]="Other",t))(Ro||{}),So=(u=>(u[u.OpenCombobox=0]="OpenCombobox",u[u.CloseCombobox=1]="CloseCombobox",u[u.GoToOption=2]="GoToOption",u[u.SetTyping=3]="SetTyping",u[u.RegisterOption=4]="RegisterOption",u[u.UnregisterOption=5]="UnregisterOption",u[u.SetActivationTrigger=6]="SetActivationTrigger",u[u.UpdateVirtualConfiguration=7]="UpdateVirtualConfiguration",u))(So||{});function Te(o,r=e=>e){let e=o.activeOptionIndex!==null?o.options[o.activeOptionIndex]:null,t=r(o.options.slice()),c=t.length>0&&t[0].dataRef.current.order!==null?t.sort((f,s)=>f.dataRef.current.order-s.dataRef.current.order):mo(t,f=>f.dataRef.current.domRef.current),d=e?c.indexOf(e):null;return d===-1&&(d=null),{options:c,activeOptionIndex:d}}let Po={[1](o){var r;return(r=o.dataRef.current)!=null&&r.disabled||o.comboboxState===1?o:{...o,activeOptionIndex:null,comboboxState:1,isTyping:!1,activationTrigger:2,__demoMode:!1}},[0](o){var r,e;if((r=o.dataRef.current)!=null&&r.disabled||o.comboboxState===0)return o;if((e=o.dataRef.current)!=null&&e.value){let t=o.dataRef.current.calculateIndex(o.dataRef.current.value);if(t!==-1)return{...o,activeOptionIndex:t,comboboxState:0,__demoMode:!1}}return{...o,comboboxState:0,__demoMode:!1}},[3](o,r){return o.isTyping===r.isTyping?o:{...o,isTyping:r.isTyping}},[2](o,r){var d,f,s,u,a;if((d=o.dataRef.current)!=null&&d.disabled||(f=o.dataRef.current)!=null&&f.optionsRef.current&&!((s=o.dataRef.current)!=null&&s.optionsPropsRef.current.static)&&o.comboboxState===1)return o;if(o.virtual){let{options:n,disabled:T}=o.virtual,C=r.focus===I.Specific?r.idx:De(r,{resolveItems:()=>n,resolveActiveIndex:()=>{var p,w;return(w=(p=o.activeOptionIndex)!=null?p:n.findIndex(M=>!T(M)))!=null?w:null},resolveDisabled:T,resolveId(){throw new Error("Function not implemented.")}}),_=(u=r.trigger)!=null?u:2;return o.activeOptionIndex===C&&o.activationTrigger===_?o:{...o,activeOptionIndex:C,activationTrigger:_,isTyping:!1,__demoMode:!1}}let e=Te(o);if(e.activeOptionIndex===null){let n=e.options.findIndex(T=>!T.dataRef.current.disabled);n!==-1&&(e.activeOptionIndex=n)}let t=r.focus===I.Specific?r.idx:De(r,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:n=>n.id,resolveDisabled:n=>n.dataRef.current.disabled}),c=(a=r.trigger)!=null?a:2;return o.activeOptionIndex===t&&o.activationTrigger===c?o:{...o,...e,isTyping:!1,activeOptionIndex:t,activationTrigger:c,__demoMode:!1}},[4]:(o,r)=>{var d,f,s;if((d=o.dataRef.current)!=null&&d.virtual)return{...o,options:[...o.options,r.payload]};let e=r.payload,t=Te(o,u=>(u.push(e),u));o.activeOptionIndex===null&&(f=o.dataRef.current)!=null&&f.isSelected(r.payload.dataRef.current.value)&&(t.activeOptionIndex=t.options.indexOf(e));let c={...o,...t,activationTrigger:2};return(s=o.dataRef.current)!=null&&s.__demoMode&&o.dataRef.current.value===void 0&&(c.activeOptionIndex=0),c},[5]:(o,r)=>{var t;if((t=o.dataRef.current)!=null&&t.virtual)return{...o,options:o.options.filter(c=>c.id!==r.id)};let e=Te(o,c=>{let d=c.findIndex(f=>f.id===r.id);return d!==-1&&c.splice(d,1),c});return{...o,...e,activationTrigger:2}},[6]:(o,r)=>o.activationTrigger===r.trigger?o:{...o,activationTrigger:r.trigger},[7]:(o,r)=>{var t,c;if(o.virtual===null)return{...o,virtual:{options:r.options,disabled:(t=r.disabled)!=null?t:()=>!1}};if(o.virtual.options===r.options&&o.virtual.disabled===r.disabled)return o;let e=o.activeOptionIndex;if(o.activeOptionIndex!==null){let d=r.options.indexOf(o.virtual.options[o.activeOptionIndex]);d!==-1?e=d:e=null}return{...o,activeOptionIndex:e,virtual:{options:r.options,disabled:(c=r.disabled)!=null?c:()=>!1}}}},xe=be(null);xe.displayName="ComboboxActionsContext";function re(o){let r=fe(xe);if(r===null){let e=new Error(`<${o} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,re),e}return r}let Le=be(null);function Io(o){let r=oe("VirtualProvider"),{options:e}=r.virtual,[t,c]=z(()=>{let a=r.optionsRef.current;if(!a)return[0,0];let n=window.getComputedStyle(a);return[parseFloat(n.paddingBlockStart||n.paddingTop),parseFloat(n.paddingBlockEnd||n.paddingBottom)]},[r.optionsRef.current]),d=ke({scrollPaddingStart:t,scrollPaddingEnd:c,count:e.length,estimateSize(){return 40},getScrollElement(){var a;return(a=r.optionsRef.current)!=null?a:null},overscan:12}),[f,s]=He(0);X(()=>{s(a=>a+1)},[e]);let u=d.getVirtualItems();return u.length===0?null:D.createElement(Le.Provider,{value:d},D.createElement("div",{style:{position:"relative",width:"100%",height:`${d.getTotalSize()}px`},ref:a=>{if(a){if(typeof process!="undefined"&&process.env.JEST_WORKER_ID!==void 0||r.activationTrigger===0)return;r.activeOptionIndex!==null&&e.length>r.activeOptionIndex&&d.scrollToIndex(r.activeOptionIndex)}}},u.map(a=>{var n;return D.createElement(Re,{key:a.key},D.cloneElement((n=o.children)==null?void 0:n.call(o,{...o.slot,option:e[a.index]}),{key:`${f}-${a.key}`,"data-index":a.index,"aria-setsize":e.length,"aria-posinset":a.index+1,style:{position:"absolute",top:0,left:0,transform:`translateY(${a.start}px)`,overflowAnchor:"none"}}))})))}let ie=be(null);ie.displayName="ComboboxDataContext";function oe(o){let r=fe(ie);if(r===null){let e=new Error(`<${o} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,oe),e}return r}function Ao(o,r){return ee(r.type,Po,o,r)}let Eo=Re;function _o(o,r){var ge,ve;let e=to(),{value:t,defaultValue:c,onChange:d,form:f,name:s,by:u,disabled:a=e||!1,onClose:n,__demoMode:T=!1,multiple:C=!1,immediate:_=!1,virtual:p=null,nullable:w,...M}=o,F=Ke(c),[v=C?[]:void 0,y]=ze(t,d,F),[R,S]=Ue(Ao,{dataRef:Ne(),comboboxState:T?0:1,isTyping:!1,options:[],virtual:p?{options:p.options,disabled:(ge=p.disabled)!=null?ge:()=>!1}:null,activeOptionIndex:null,activationTrigger:2,__demoMode:T}),h=$(!1),O=$({static:!1,hold:!1}),G=$(null),J=$(null),Q=$(null),A=je(u),B=m(b=>p?u===null?p.options.indexOf(b):p.options.findIndex(g=>A(g,b)):R.options.findIndex(g=>A(g.dataRef.current.value,b))),k=Se(b=>ee(i.mode,{[1]:()=>v.some(g=>A(g,b)),[0]:()=>A(v,b)}),[v]),K=m(b=>R.activeOptionIndex===B(b)),i=z(()=>({...R,immediate:_,optionsPropsRef:O,inputRef:G,buttonRef:J,optionsRef:Q,value:v,defaultValue:F,disabled:a,mode:C?1:0,virtual:p?R.virtual:null,get activeOptionIndex(){if(h.current&&R.activeOptionIndex===null&&(p?p.options.length>0:R.options.length>0)){if(p){let g=p.options.findIndex(j=>{var ue,Oe;return!((Oe=(ue=p.disabled)==null?void 0:ue.call(p,j))!=null&&Oe)});if(g!==-1)return g}let b=R.options.findIndex(g=>!g.dataRef.current.disabled);if(b!==-1)return b}return R.activeOptionIndex},calculateIndex:B,compare:A,isSelected:k,isActive:K}),[v,F,a,C,T,R,p]);X(()=>{var b;p&&S({type:7,options:p.options,disabled:(b=p.disabled)!=null?b:null})},[p,p==null?void 0:p.options,p==null?void 0:p.disabled]),X(()=>{R.dataRef.current=i},[i]);let N=i.comboboxState===0;qe(N,[i.buttonRef,i.inputRef,i.optionsRef],()=>x.closeCombobox());let q=z(()=>{var b,g,j;return{open:i.comboboxState===0,disabled:a,activeIndex:i.activeOptionIndex,activeOption:i.activeOptionIndex===null?null:i.virtual?i.virtual.options[(b=i.activeOptionIndex)!=null?b:0]:(j=(g=i.options[i.activeOptionIndex])==null?void 0:g.dataRef.current.value)!=null?j:null,value:v}},[i,a,v]),Y=m(()=>{if(i.activeOptionIndex!==null){if(x.setIsTyping(!1),i.virtual)P(i.virtual.options[i.activeOptionIndex]);else{let{dataRef:b}=i.options[i.activeOptionIndex];P(b.current.value)}x.goToOption(I.Specific,i.activeOptionIndex)}}),E=m(()=>{S({type:0}),h.current=!0}),ae=m(()=>{S({type:1}),h.current=!1,n==null||n()}),le=m(b=>{S({type:3,isTyping:b})}),l=m((b,g,j)=>(h.current=!1,b===I.Specific?S({type:2,focus:I.Specific,idx:g,trigger:j}):S({type:2,focus:b,trigger:j}))),U=m((b,g)=>(S({type:4,payload:{id:b,dataRef:g}}),()=>{i.isActive(g.current.value)&&(h.current=!0),S({type:5,id:b})})),P=m(b=>ee(i.mode,{[0](){return y==null?void 0:y(b)},[1](){let g=i.value.slice(),j=g.findIndex(ue=>A(ue,b));return j===-1?g.push(b):g.splice(j,1),y==null?void 0:y(g)}})),H=m(b=>{S({type:6,trigger:b})}),x=z(()=>({onChange:P,registerOption:U,goToOption:l,setIsTyping:le,closeCombobox:ae,openCombobox:E,setActivationTrigger:H,selectActiveOption:Y}),[]),[L,W]=vo(),we=r===null?{}:{ref:r},Be=Se(()=>{if(F!==void 0)return y==null?void 0:y(F)},[y,F]);return D.createElement(W,{value:L,props:{htmlFor:(ve=i.inputRef.current)==null?void 0:ve.id},slot:{open:i.comboboxState===0,disabled:a}},D.createElement(no,null,D.createElement(xe.Provider,{value:x},D.createElement(ie.Provider,{value:i},D.createElement(bo,{value:ee(i.comboboxState,{[0]:de.Open,[1]:de.Closed})},s!=null&&D.createElement(uo,{disabled:a,data:v!=null?{[s]:v}:{},form:f,onReset:Be}),ne({ourProps:we,theirProps:M,slot:q,defaultTag:Eo,name:"Combobox"}))))))}let ho="input";function Do(o,r){var q,Y,E,ae,le;let e=oe("Combobox.Input"),t=re("Combobox.Input"),c=pe(),d=so(),{id:f=d||`headlessui-combobox-input-${c}`,onChange:s,displayValue:u,disabled:a=e.disabled||!1,autoFocus:n=!1,type:T="text",...C}=o,_=se(e.inputRef,r,ao()),p=Ie(e.inputRef),w=We(),M=m(()=>{t.onChange(null),e.optionsRef.current&&(e.optionsRef.current.scrollTop=0),t.goToOption(I.Nothing)}),F=z(()=>{var l;return typeof u=="function"&&e.value!==void 0?(l=u(e.value))!=null?l:"":typeof e.value=="string"?e.value:""},[e.value,u]);Ee(([l,U],[P,H])=>{if(e.isTyping)return;let x=e.inputRef.current;x&&((H===0&&U===1||l!==P)&&(x.value=l),requestAnimationFrame(()=>{if(e.isTyping||!x||(p==null?void 0:p.activeElement)!==x)return;let{selectionStart:L,selectionEnd:W}=x;Math.abs((W!=null?W:0)-(L!=null?L:0))===0&&L===0&&x.setSelectionRange(x.value.length,x.value.length)}))},[F,e.comboboxState,p,e.isTyping]),Ee(([l],[U])=>{if(l===0&&U===1){if(e.isTyping)return;let P=e.inputRef.current;if(!P)return;let H=P.value,{selectionStart:x,selectionEnd:L,selectionDirection:W}=P;P.value="",P.value=H,W!==null?P.setSelectionRange(x,L,W):P.setSelectionRange(x,L)}},[e.comboboxState]);let v=$(!1),y=m(()=>{v.current=!0}),R=m(()=>{w.nextFrame(()=>{v.current=!1})}),S=m(l=>{switch(t.setIsTyping(!0),l.key){case V.Enter:if(e.comboboxState!==0||v.current)return;if(l.preventDefault(),l.stopPropagation(),e.activeOptionIndex===null){t.closeCombobox();return}t.selectActiveOption(),e.mode===0&&t.closeCombobox();break;case V.ArrowDown:return l.preventDefault(),l.stopPropagation(),ee(e.comboboxState,{[0]:()=>t.goToOption(I.Next),[1]:()=>t.openCombobox()});case V.ArrowUp:return l.preventDefault(),l.stopPropagation(),ee(e.comboboxState,{[0]:()=>t.goToOption(I.Previous),[1]:()=>{Z(()=>t.openCombobox()),e.value||t.goToOption(I.Last)}});case V.Home:if(l.shiftKey)break;return l.preventDefault(),l.stopPropagation(),t.goToOption(I.First);case V.PageUp:return l.preventDefault(),l.stopPropagation(),t.goToOption(I.First);case V.End:if(l.shiftKey)break;return l.preventDefault(),l.stopPropagation(),t.goToOption(I.Last);case V.PageDown:return l.preventDefault(),l.stopPropagation(),t.goToOption(I.Last);case V.Escape:return e.comboboxState!==0?void 0:(l.preventDefault(),e.optionsRef.current&&!e.optionsPropsRef.current.static&&l.stopPropagation(),e.mode===0&&e.value===null&&M(),t.closeCombobox());case V.Tab:if(e.comboboxState!==0)return;e.mode===0&&e.activationTrigger!==1&&t.selectActiveOption(),t.closeCombobox();break}}),h=m(l=>{s==null||s(l),e.mode===0&&l.target.value===""&&M(),t.openCombobox()}),O=m(l=>{var P,H,x;let U=(P=l.relatedTarget)!=null?P:he.find(L=>L!==l.currentTarget);if(!((H=e.optionsRef.current)!=null&&H.contains(U))&&!((x=e.buttonRef.current)!=null&&x.contains(U))&&e.comboboxState===0)return l.preventDefault(),e.mode===0&&e.value===null&&M(),t.closeCombobox()}),G=m(l=>{var P,H,x;let U=(P=l.relatedTarget)!=null?P:he.find(L=>L!==l.currentTarget);(H=e.buttonRef.current)!=null&&H.contains(U)||(x=e.optionsRef.current)!=null&&x.contains(U)||e.disabled||e.immediate&&e.comboboxState!==0&&(Z(()=>t.openCombobox()),t.setActivationTrigger(1))}),J=me(),Q=xo(),{isFocused:A,focusProps:B}=ye({autoFocus:n}),{isHovered:k,hoverProps:K}=Ce({isDisabled:a}),i=z(()=>({open:e.comboboxState===0,disabled:a,hover:k,focus:A,autofocus:n}),[e,k,A,n,a]),N=ce({ref:_,id:f,role:"combobox",type:T,"aria-controls":(q=e.optionsRef.current)==null?void 0:q.id,"aria-expanded":e.comboboxState===0,"aria-activedescendant":e.activeOptionIndex===null?void 0:e.virtual?(Y=e.options.find(l=>!l.dataRef.current.disabled&&e.compare(l.dataRef.current.value,e.virtual.options[e.activeOptionIndex])))==null?void 0:Y.id:(E=e.options[e.activeOptionIndex])==null?void 0:E.id,"aria-labelledby":J,"aria-describedby":Q,"aria-autocomplete":"list",defaultValue:(le=(ae=o.defaultValue)!=null?ae:e.defaultValue!==void 0?u==null?void 0:u(e.defaultValue):null)!=null?le:e.defaultValue,disabled:a||void 0,autoFocus:n,onCompositionStart:y,onCompositionEnd:R,onKeyDown:S,onChange:h,onFocus:G,onBlur:O},B,K);return ne({ourProps:N,theirProps:C,slot:i,defaultTag:ho,name:"Combobox.Input"})}let Mo="button";function Fo(o,r){var h;let e=oe("Combobox.Button"),t=re("Combobox.Button"),c=se(e.buttonRef,r),d=pe(),{id:f=`headlessui-combobox-button-${d}`,disabled:s=e.disabled||!1,autoFocus:u=!1,...a}=o,n=Ae(e.inputRef),T=m(O=>{switch(O.key){case V.Space:case V.Enter:O.preventDefault(),O.stopPropagation(),e.comboboxState===1&&Z(()=>t.openCombobox()),n();return;case V.ArrowDown:O.preventDefault(),O.stopPropagation(),e.comboboxState===1&&(Z(()=>t.openCombobox()),e.value||t.goToOption(I.First)),n();return;case V.ArrowUp:O.preventDefault(),O.stopPropagation(),e.comboboxState===1&&(Z(()=>t.openCombobox()),e.value||t.goToOption(I.Last)),n();return;case V.Escape:if(e.comboboxState!==0)return;O.preventDefault(),e.optionsRef.current&&!e.optionsPropsRef.current.static&&O.stopPropagation(),Z(()=>t.closeCombobox()),n();return;default:return}}),C=m(O=>{O.preventDefault(),!co(O.currentTarget)&&(O.button===Ve.Left&&(e.comboboxState===0?t.closeCombobox():t.openCombobox()),n())}),_=me([f]),{isFocusVisible:p,focusProps:w}=ye({autoFocus:u}),{isHovered:M,hoverProps:F}=Ce({isDisabled:s}),{pressed:v,pressProps:y}=Ge({disabled:s}),R=z(()=>({open:e.comboboxState===0,active:v||e.comboboxState===0,disabled:s,value:e.value,hover:M,focus:p}),[e,M,p,v,s]),S=ce({ref:c,id:f,type:Ye(o,e.buttonRef),tabIndex:-1,"aria-haspopup":"listbox","aria-controls":(h=e.optionsRef.current)==null?void 0:h.id,"aria-expanded":e.comboboxState===0,"aria-labelledby":_,disabled:s||void 0,autoFocus:u,onMouseDown:C,onKeyDown:T},w,F,y);return ne({ourProps:S,theirProps:a,slot:R,defaultTag:Mo,name:"Combobox.Button"})}let Vo="div",Lo=Fe.RenderStrategy|Fe.Static;function wo(o,r){var N,q,Y;let e=pe(),{id:t=`headlessui-combobox-options-${e}`,hold:c=!1,anchor:d,portal:f=!1,modal:s=!0,transition:u=!1,...a}=o,n=oe("Combobox.Options"),T=re("Combobox.Options"),C=lo(d);C&&(f=!0);let[_,p]=ro(C),w=io(),M=se(n.optionsRef,r,C?_:null),F=Ie(n.optionsRef),v=fo(),[y,R]=eo(u,n.optionsRef,v!==null?(v&de.Open)===de.Open:n.comboboxState===0);Je(y,n.inputRef,T.closeCombobox);let S=n.__demoMode?!1:s&&n.comboboxState===0;Qe(S,F);let h=n.__demoMode?!1:s&&n.comboboxState===0;$e(h,{allowed:m(()=>[n.inputRef.current,n.buttonRef.current,n.optionsRef.current])}),X(()=>{var E;n.optionsPropsRef.current.static=(E=o.static)!=null?E:!1},[n.optionsPropsRef,o.static]),X(()=>{n.optionsPropsRef.current.hold=c},[n.optionsPropsRef,c]),oo(n.comboboxState===0,{container:n.optionsRef.current,accept(E){return E.getAttribute("role")==="option"?NodeFilter.FILTER_REJECT:E.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(E){E.setAttribute("role","none")}});let O=me([(N=n.buttonRef.current)==null?void 0:N.id]),G=z(()=>({open:n.comboboxState===0,option:void 0,...R}),[n.comboboxState,R]),J=m(()=>{T.setActivationTrigger(0)}),Q=m(E=>{E.preventDefault(),T.setActivationTrigger(0)}),A=ce(C?w():{},{"aria-labelledby":O,role:"listbox","aria-multiselectable":n.mode===1?!0:void 0,id:t,ref:M,style:{...a.style,...p,"--input-width":Pe(n.inputRef,!0).width,"--button-width":Pe(n.buttonRef,!0).width},onWheel:n.activationTrigger===0?void 0:J,onMouseDown:Q}),B=y&&n.comboboxState===1,k=_e(B,(q=n.virtual)==null?void 0:q.options),K=_e(B,n.value),i=m(E=>n.compare(K,E));if(n.virtual){if(k===void 0)throw new Error("Missing `options` in virtual mode");Object.assign(a,{children:D.createElement(ie.Provider,{value:k!==n.virtual.options?{...n,virtual:{...n.virtual,options:k}}:n},D.createElement(Io,{slot:G},a.children))})}return D.createElement(Oo,{enabled:f?o.static||y:!1},D.createElement(ie.Provider,{value:n.mode===1?n:{...n,isSelected:i}},ne({ourProps:A,theirProps:{...a,children:D.createElement(po,{freeze:B},typeof a.children=="function"?(Y=a.children)==null?void 0:Y.call(a,G):a.children)},slot:G,defaultTag:Vo,features:Lo,visible:y,name:"Combobox.Options"})))}let Bo="div";function ko(o,r){var A,B,k,K;let e=oe("Combobox.Option"),t=re("Combobox.Option"),c=pe(),{id:d=`headlessui-combobox-option-${c}`,value:f,disabled:s=(k=(B=(A=e.virtual)==null?void 0:A.disabled)==null?void 0:B.call(A,f))!=null?k:!1,order:u=null,...a}=o,n=Ae(e.inputRef),T=e.virtual?e.activeOptionIndex===e.calculateIndex(f):e.activeOptionIndex===null?!1:((K=e.options[e.activeOptionIndex])==null?void 0:K.id)===d,C=e.isSelected(f),_=$(null),p=Xe({disabled:s,value:f,domRef:_,order:u}),w=fe(Le),M=se(r,_,w?w.measureElement:null),F=m(()=>{t.setIsTyping(!1),t.onChange(f)});X(()=>t.registerOption(d,p),[p,d]);let v=$(!(e.virtual||e.__demoMode));X(()=>{if(!e.virtual&&!e.__demoMode)return Me().requestAnimationFrame(()=>{v.current=!0})},[e.virtual,e.__demoMode]),X(()=>{if(v.current&&e.comboboxState===0&&T&&e.activationTrigger!==0)return Me().requestAnimationFrame(()=>{var i,N;(N=(i=_.current)==null?void 0:i.scrollIntoView)==null||N.call(i,{block:"nearest"})})},[_,T,e.comboboxState,e.activationTrigger,e.activeOptionIndex]);let y=m(i=>{i.preventDefault(),i.button===Ve.Left&&(s||(F(),To()||requestAnimationFrame(()=>n()),e.mode===0&&t.closeCombobox()))}),R=m(()=>{if(s)return t.goToOption(I.Nothing);let i=e.calculateIndex(f);t.goToOption(I.Specific,i)}),S=Ze(),h=m(i=>S.update(i)),O=m(i=>{if(!S.wasMoved(i)||s||T)return;let N=e.calculateIndex(f);t.goToOption(I.Specific,N,0)}),G=m(i=>{S.wasMoved(i)&&(s||T&&(e.optionsPropsRef.current.hold||t.goToOption(I.Nothing)))}),J=z(()=>({active:T,focus:T,selected:C,disabled:s}),[T,C,s]);return ne({ourProps:{id:d,ref:M,role:"option",tabIndex:s===!0?void 0:-1,"aria-disabled":s===!0?!0:void 0,"aria-selected":C,disabled:void 0,onMouseDown:y,onFocus:R,onPointerEnter:h,onMouseEnter:h,onPointerMove:O,onMouseMove:O,onPointerLeave:G,onMouseLeave:G},theirProps:a,slot:J,defaultTag:Bo,name:"Combobox.Option"})}let No=te(_o),Uo=te(Fo),Ho=te(Do),Go=go,jo=te(wo),zo=te(ko),kt=Object.assign(No,{Input:Ho,Button:Uo,Label:Go,Options:jo,Option:zo});export{kt as Combobox,Uo as ComboboxButton,Ho as ComboboxInput,Go as ComboboxLabel,zo as ComboboxOption,jo as ComboboxOptions}; |
@@ -17,2 +17,3 @@ import React, { type ElementType, type MutableRefObject, type Ref } from 'react'; | ||
autoFocus?: boolean; | ||
transition?: boolean; | ||
__demoMode?: boolean; | ||
@@ -25,4 +26,14 @@ }>; | ||
}; | ||
export type DialogPanelProps<TTag extends ElementType = typeof DEFAULT_PANEL_TAG> = Props<TTag, PanelRenderPropArg>; | ||
declare function PanelFn<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(props: DialogPanelProps<TTag>, ref: Ref<HTMLElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null; | ||
export type DialogPanelProps<TTag extends ElementType = typeof DEFAULT_PANEL_TAG> = Props<TTag, PanelRenderPropArg, never, { | ||
transition?: boolean; | ||
}>; | ||
declare function PanelFn<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(props: DialogPanelProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; | ||
declare let DEFAULT_BACKDROP_TAG: "div"; | ||
type BackdropRenderPropArg = { | ||
open: boolean; | ||
}; | ||
export type DialogBackdropProps<TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG> = Props<TTag, BackdropRenderPropArg, never, { | ||
transition?: boolean; | ||
}>; | ||
declare function BackdropFn<TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG>(props: DialogBackdropProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; | ||
declare let DEFAULT_TITLE_TAG: "h2"; | ||
@@ -40,2 +51,5 @@ type TitleRenderPropArg = { | ||
} | ||
export interface _internal_ComponentDialogBackdrop extends HasDisplayName { | ||
<TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG>(props: DialogBackdropProps<TTag> & RefProp<typeof BackdropFn>): JSX.Element; | ||
} | ||
export interface _internal_ComponentDialogTitle extends HasDisplayName { | ||
@@ -47,2 +61,3 @@ <TTag extends ElementType = typeof DEFAULT_TITLE_TAG>(props: DialogTitleProps<TTag> & RefProp<typeof TitleFn>): JSX.Element; | ||
export declare let DialogPanel: _internal_ComponentDialogPanel; | ||
export declare let DialogBackdrop: _internal_ComponentDialogBackdrop; | ||
export declare let DialogTitle: _internal_ComponentDialogTitle; | ||
@@ -49,0 +64,0 @@ /** @deprecated use `<Description>` instead of `<DialogDescription>` */ |
@@ -1,1 +0,1 @@ | ||
"use client";import l,{createContext as me,createRef as ce,useContext as Y,useEffect as De,useMemo as F,useReducer as Pe,useRef as J,useState as ye}from"react";import{useEvent as c}from'../../hooks/use-event.js';import{useEventListener as Ee}from'../../hooks/use-event-listener.js';import{useId as x}from'../../hooks/use-id.js';import{useInertOthers as Ce}from'../../hooks/use-inert-others.js';import{useIsTouchDevice as Ae}from'../../hooks/use-is-touch-device.js';import{useOnDisappear as _e}from'../../hooks/use-on-disappear.js';import{useOutsideClick as Fe}from'../../hooks/use-outside-click.js';import{useOwnerDocument as be}from'../../hooks/use-owner.js';import{useRootContainers as Re}from'../../hooks/use-root-containers.js';import{useScrollLock as ve}from'../../hooks/use-scroll-lock.js';import{useServerHandoffComplete as Se}from'../../hooks/use-server-handoff-complete.js';import{useSyncRefs as L}from'../../hooks/use-sync-refs.js';import{CloseProvider as he}from'../../internal/close-provider.js';import{HoistFormFields as xe}from'../../internal/form-fields.js';import{State as b,useOpenClosed as Le}from'../../internal/open-closed.js';import{ForcePortalRoot as X}from'../../internal/portal-force-root.js';import{StackMessage as B,StackProvider as Oe}from'../../internal/stack-context.js';import{match as O}from'../../utils/match.js';import{RenderFeatures as K,forwardRefWithAs as I,render as w}from'../../utils/render.js';import{Description as V,useDescriptions as Ie}from'../description/description.js';import{FocusTrap as we,FocusTrapFeatures as T}from'../focus-trap/focus-trap.js';import{Keys as Me}from'../keyboard.js';import{Portal as q,useNestedPortals as Ge}from'../portal/portal.js';var He=(r=>(r[r.Open=0]="Open",r[r.Closed=1]="Closed",r))(He||{}),Ne=(t=>(t[t.SetTitleId=0]="SetTitleId",t))(Ne||{});let ke={[0](o,t){return o.titleId===t.id?o:{...o,titleId:t.id}}},R=me(null);R.displayName="DialogContext";function M(o){let t=Y(R);if(t===null){let r=new Error(`<${o} /> is missing a parent <Dialog /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,M),r}return t}function Ue(o,t){return O(t.type,ke,o,t)}let $e="div",je=K.RenderStrategy|K.Static;function We(o,t){let r=x(),{id:u=`headlessui-dialog-${r}`,open:i,onClose:s,initialFocus:d,role:n="dialog",autoFocus:D=!0,__demoMode:f=!1,...G}=o,[v,H]=ye(0),N=J(!1);n=function(){return n==="dialog"||n==="alertdialog"?n:(N.current||(N.current=!0,console.warn(`Invalid role [${n}] passed to <Dialog />. Only \`dialog\` and and \`alertdialog\` are supported. Using \`dialog\` instead.`)),"dialog")}();let P=Le();i===void 0&&P!==null&&(i=(P&b.Open)===b.Open);let p=J(null),z=L(p,t),y=be(p),k=o.hasOwnProperty("open")||P!==null,U=o.hasOwnProperty("onClose");if(!k&&!U)throw new Error("You have to provide an `open` and an `onClose` prop to the `Dialog` component.");if(!k)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 i!="boolean")throw new Error(`You provided an \`open\` prop to the \`Dialog\`, but the value is not a boolean. Received: ${i}`);if(typeof s!="function")throw new Error(`You provided an \`onClose\` prop to the \`Dialog\`, but the value is not a function. Received: ${s}`);let a=i?0:1,[E,Q]=Pe(Ue,{titleId:null,descriptionId:null,panelRef:ce()}),m=c(()=>s(!1)),$=c(e=>Q({type:0,id:e})),C=Se()?a===0:!1,A=v>1,Z=Y(R)!==null,[ee,te]=Ge(),oe={get current(){var e;return(e=E.panelRef.current)!=null?e:p.current}},{resolveContainers:S,mainTreeNodeRef:re,MainTreeNode:le}=Re({portals:ee,defaultContainers:[oe]}),ne=A?"parent":"leaf",j=P!==null?(P&b.Closing)===b.Closing:!1,ae=(()=>f||A||j?!1:C)();Ce(ae,{allowed:c(()=>{var e,g;return[(g=(e=p.current)==null?void 0:e.closest("[data-headlessui-portal]"))!=null?g:null]}),disallowed:c(()=>{var e,g;return[(g=(e=re.current)==null?void 0:e.closest("body > *:not(#headlessui-portal-root)"))!=null?g:null]})});let ie=(()=>!(!C||A))();Fe(ie,S,e=>{e.preventDefault(),m()});let se=(()=>!(A||a!==0))();Ee(y==null?void 0:y.defaultView,"keydown",e=>{se&&(e.defaultPrevented||e.key===Me.Escape&&(e.preventDefault(),e.stopPropagation(),document.activeElement&&"blur"in document.activeElement&&typeof document.activeElement.blur=="function"&&document.activeElement.blur(),m()))});let pe=(()=>!(j||a!==0||Z))();ve(pe,y,S),_e(C,p,m);let[ue,de]=Ie(),fe=F(()=>[{dialogState:a,close:m,setTitleId:$},E],[a,E,m,$]),W=F(()=>({open:a===0}),[a]),ge={ref:z,id:u,role:n,tabIndex:-1,"aria-modal":f?void 0:a===0?!0:void 0,"aria-labelledby":E.titleId,"aria-describedby":ue},Te=!Ae(),_=C?O(ne,{parent:T.RestoreFocus,leaf:T.All&~T.FocusLock}):T.None;return D&&(_|=T.AutoFocus),Te||(_&=~T.InitialFocus),f&&(_=T.None),l.createElement(Oe,{type:"Dialog",enabled:a===0,element:p,onUpdate:c((e,g)=>{g==="Dialog"&&O(e,{[B.Add]:()=>H(h=>h+1),[B.Remove]:()=>H(h=>h-1)})})},l.createElement(X,{force:!0},l.createElement(q,null,l.createElement(R.Provider,{value:fe},l.createElement(q.Group,{target:p},l.createElement(X,{force:!1},l.createElement(de,{slot:W,name:"Dialog.Description"},l.createElement(te,null,l.createElement(we,{initialFocus:d,initialFocusFallback:f?void 0:p,containers:S,features:_},l.createElement(he,{value:m},w({ourProps:ge,theirProps:G,slot:W,defaultTag:$e,features:je,visible:a===0,name:"Dialog"})))))))))),l.createElement(xe,null,l.createElement(le,null)))}let Ye="div";function Je(o,t){let r=x(),{id:u=`headlessui-dialog-panel-${r}`,...i}=o,[{dialogState:s},d]=M("Dialog.Panel"),n=L(t,d.panelRef),D=F(()=>({open:s===0}),[s]),f=c(v=>{v.stopPropagation()});return w({ourProps:{ref:n,id:u,onClick:f},theirProps:i,slot:D,defaultTag:Ye,name:"Dialog.Panel"})}let Xe="h2";function Be(o,t){let r=x(),{id:u=`headlessui-dialog-title-${r}`,...i}=o,[{dialogState:s,setTitleId:d}]=M("Dialog.Title"),n=L(t);De(()=>(d(u),()=>d(null)),[u,d]);let D=F(()=>({open:s===0}),[s]);return w({ourProps:{ref:n,id:u},theirProps:i,slot:D,defaultTag:Xe,name:"Dialog.Title"})}let Ke=I(We),Ve=I(Je),qe=I(Be),At=V,_t=Object.assign(Ke,{Panel:Ve,Title:qe,Description:V});export{_t as Dialog,At as DialogDescription,Ve as DialogPanel,qe as DialogTitle}; | ||
"use client";import n,{Fragment as H,createContext as re,createRef as le,useContext as ae,useEffect as ie,useMemo as y,useReducer as pe,useRef as B}from"react";import{useEscape as se}from'../../hooks/use-escape.js';import{useEvent as E}from'../../hooks/use-event.js';import{useId as h}from'../../hooks/use-id.js';import{useInertOthers as de}from'../../hooks/use-inert-others.js';import{useIsTouchDevice as ue}from'../../hooks/use-is-touch-device.js';import{useOnDisappear as Te}from'../../hooks/use-on-disappear.js';import{useOutsideClick as fe}from'../../hooks/use-outside-click.js';import{useOwnerDocument as ge}from'../../hooks/use-owner.js';import{useRootContainers as me}from'../../hooks/use-root-containers.js';import{useScrollLock as ce}from'../../hooks/use-scroll-lock.js';import{useServerHandoffComplete as De}from'../../hooks/use-server-handoff-complete.js';import{useSyncRefs as S}from'../../hooks/use-sync-refs.js';import{CloseProvider as Pe}from'../../internal/close-provider.js';import{HoistFormFields as ye}from'../../internal/form-fields.js';import{ResetOpenClosedProvider as Ee,State as R,useOpenClosed as U}from'../../internal/open-closed.js';import{ForcePortalRoot as N}from'../../internal/portal-force-root.js';import{match as Ae}from'../../utils/match.js';import{RenderFeatures as W,forwardRefWithAs as A,render as v}from'../../utils/render.js';import{Description as $,useDescriptions as _e}from'../description/description.js';import{FocusTrap as Ce,FocusTrapFeatures as _}from'../focus-trap/focus-trap.js';import{Portal as Fe,PortalGroup as be,useNestedPortals as Re}from'../portal/portal.js';import{Transition as ve,TransitionChild as j}from'../transition/transition.js';var xe=(o=>(o[o.Open=0]="Open",o[o.Closed=1]="Closed",o))(xe||{}),Le=(t=>(t[t.SetTitleId=0]="SetTitleId",t))(Le||{});let Oe={[0](e,t){return e.titleId===t.id?e:{...e,titleId:t.id}}},I=re(null);I.displayName="DialogContext";function x(e){let t=ae(I);if(t===null){let o=new Error(`<${e} /> is missing a parent <Dialog /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,x),o}return t}function he(e,t){return Ae(t.type,Oe,e,t)}let Y=A(function(t,o){let a=h(),{id:i=`headlessui-dialog-${a}`,open:l,onClose:p,initialFocus:d,role:s="dialog",autoFocus:C=!0,__demoMode:f=!1,...G}=t,L=B(!1);s=function(){return s==="dialog"||s==="alertdialog"?s:(L.current||(L.current=!0,console.warn(`Invalid role [${s}] passed to <Dialog />. Only \`dialog\` and and \`alertdialog\` are supported. Using \`dialog\` instead.`)),"dialog")}();let g=U();l===void 0&&g!==null&&(l=(g&R.Open)===R.Open);let u=B(null),J=S(u,o),F=ge(u),T=l?0:1,[b,K]=pe(he,{titleId:null,descriptionId:null,panelRef:le()}),m=E(()=>p(!1)),k=E(r=>K({type:0,id:r})),c=De()?T===0:!1,[X,V]=Re(),q={get current(){var r;return(r=b.panelRef.current)!=null?r:u.current}},{resolveContainers:O,mainTreeNodeRef:z,MainTreeNode:Q}=me({portals:X,defaultContainers:[q]}),M=g!==null?(g&R.Closing)===R.Closing:!1;de(f||M?!1:c,{allowed:E(()=>{var r,P;return[(P=(r=u.current)==null?void 0:r.closest("[data-headlessui-portal]"))!=null?P:null]}),disallowed:E(()=>{var r,P;return[(P=(r=z.current)==null?void 0:r.closest("body > *:not(#headlessui-portal-root)"))!=null?P:null]})}),fe(c,O,r=>{r.preventDefault(),m()}),se(c,F==null?void 0:F.defaultView,r=>{r.preventDefault(),r.stopPropagation(),document.activeElement&&"blur"in document.activeElement&&typeof document.activeElement.blur=="function"&&document.activeElement.blur(),m()}),ce(f||M?!1:c,F,O),Te(c,u,m);let[Z,ee]=_e(),te=y(()=>[{dialogState:T,close:m,setTitleId:k},b],[T,b,m,k]),w=y(()=>({open:T===0}),[T]),oe={ref:J,id:i,role:s,tabIndex:-1,"aria-modal":f?void 0:T===0?!0:void 0,"aria-labelledby":b.titleId,"aria-describedby":Z},ne=!ue(),D=_.None;return c&&!f&&(D|=_.RestoreFocus,D|=_.TabLock,C&&(D|=_.AutoFocus),ne&&(D|=_.InitialFocus)),n.createElement(Ee,null,n.createElement(N,{force:!0},n.createElement(Fe,null,n.createElement(I.Provider,{value:te},n.createElement(be,{target:u},n.createElement(N,{force:!1},n.createElement(ee,{slot:w},n.createElement(V,null,n.createElement(Ce,{initialFocus:d,initialFocusFallback:u,containers:O,features:D},n.createElement(Pe,{value:m},v({ourProps:oe,theirProps:G,slot:w,defaultTag:Se,features:Ie,visible:T===0,name:"Dialog"})))))))))),n.createElement(ye,null,n.createElement(Q,null)))}),Se="div",Ie=W.RenderStrategy|W.Static;function Ge(e,t){let{transition:o=!1,open:a,...i}=e,l=U(),p=e.hasOwnProperty("open")||l!==null,d=e.hasOwnProperty("onClose");if(!p&&!d)throw new Error("You have to provide an `open` and an `onClose` prop to the `Dialog` component.");if(!p)throw new Error("You provided an `onClose` prop to the `Dialog`, but forgot an `open` prop.");if(!d)throw new Error("You provided an `open` prop to the `Dialog`, but forgot an `onClose` prop.");if(!l&&typeof e.open!="boolean")throw new Error(`You provided an \`open\` prop to the \`Dialog\`, but the value is not a boolean. Received: ${e.open}`);if(typeof e.onClose!="function")throw new Error(`You provided an \`onClose\` prop to the \`Dialog\`, but the value is not a function. Received: ${e.onClose}`);return!(l!==null)&&a!==void 0&&!i.static?n.createElement(ve,{show:a,transition:o,unmount:i.unmount},n.createElement(Y,{ref:t,...i})):n.createElement(Y,{ref:t,open:a,...i})}let ke="div";function Me(e,t){let o=h(),{id:a=`headlessui-dialog-panel-${o}`,transition:i=!1,...l}=e,[{dialogState:p},d]=x("Dialog.Panel"),s=S(t,d.panelRef),C=y(()=>({open:p===0}),[p]),f=E(g=>{g.stopPropagation()});return n.createElement(i?j:H,null,v({ourProps:{ref:s,id:a,onClick:f},theirProps:l,slot:C,defaultTag:ke,name:"Dialog.Panel"}))}let we="div";function He(e,t){let{transition:o=!1,...a}=e,[{dialogState:i}]=x("Dialog.Backdrop"),l=y(()=>({open:i===0}),[i]);return n.createElement(o?j:H,null,v({ourProps:{ref:t,"aria-hidden":!0},theirProps:a,slot:l,defaultTag:we,name:"Dialog.Backdrop"}))}let Be="h2";function Ue(e,t){let o=h(),{id:a=`headlessui-dialog-title-${o}`,...i}=e,[{dialogState:l,setTitleId:p}]=x("Dialog.Title"),d=S(t);ie(()=>(p(a),()=>p(null)),[a,p]);let s=y(()=>({open:l===0}),[l]);return v({ourProps:{ref:d,id:a},theirProps:i,slot:s,defaultTag:Be,name:"Dialog.Title"})}let Ne=A(Ge),We=A(Me),ct=A(He),$e=A(Ue),Dt=$,Pt=Object.assign(Ne,{Panel:We,Title:$e,Description:$});export{Pt as Dialog,ct as DialogBackdrop,Dt as DialogDescription,We as DialogPanel,$e as DialogTitle}; |
import React, { type ElementType, type MutableRefObject, type Ref } from 'react'; | ||
import { type TransitionData } from '../../hooks/use-transition.js'; | ||
import type { Props } from '../../types.js'; | ||
@@ -35,6 +36,8 @@ import { type HasDisplayName, type PropsForFeatures, type RefProp } from '../../utils/render.js'; | ||
close: (focusableElement?: HTMLElement | MutableRefObject<HTMLElement | null>) => void; | ||
}; | ||
} & TransitionData; | ||
type DisclosurePanelPropsWeControl = never; | ||
declare let PanelRenderFeatures: number; | ||
export type DisclosurePanelProps<TTag extends ElementType = typeof DEFAULT_PANEL_TAG> = Props<TTag, PanelRenderPropArg, DisclosurePanelPropsWeControl, PropsForFeatures<typeof PanelRenderFeatures>>; | ||
export type DisclosurePanelProps<TTag extends ElementType = typeof DEFAULT_PANEL_TAG> = Props<TTag, PanelRenderPropArg, DisclosurePanelPropsWeControl, { | ||
transition?: boolean; | ||
} & PropsForFeatures<typeof PanelRenderFeatures>>; | ||
declare function PanelFn<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(props: DisclosurePanelProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; | ||
@@ -41,0 +44,0 @@ export interface _internal_ComponentDisclosure extends HasDisplayName { |
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as Q}from"@react-aria/focus";import{useHover as Y}from"@react-aria/interactions";import g,{Fragment as K,createContext as x,useContext as L,useEffect as j,useMemo as b,useReducer as Z,useRef as R}from"react";import{useActivePress as ee}from'../../hooks/use-active-press.js';import{useEvent as A}from'../../hooks/use-event.js';import{useId as W}from'../../hooks/use-id.js';import{useResolveButtonType as te}from'../../hooks/use-resolve-button-type.js';import{optionalRef as ne,useSyncRefs as v}from'../../hooks/use-sync-refs.js';import{CloseProvider as oe}from'../../internal/close-provider.js';import{OpenClosedProvider as le,State as C,useOpenClosed as re}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as se}from'../../utils/bugs.js';import{match as O}from'../../utils/match.js';import{getOwnerDocument as ue}from'../../utils/owner.js';import{RenderFeatures as $,forwardRefWithAs as _,mergeProps as J,render as B,useMergeRefsFn as X}from'../../utils/render.js';import{startTransition as ie}from'../../utils/start-transition.js';import{Keys as S}from'../keyboard.js';var ae=(o=>(o[o.Open=0]="Open",o[o.Closed=1]="Closed",o))(ae||{}),pe=(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))(pe||{});let ce={[0]:e=>({...e,disclosureState:O(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}}},M=x(null);M.displayName="DisclosureContext";function F(e){let n=L(M);if(n===null){let o=new Error(`<${e} /> is missing a parent <Disclosure /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,F),o}return n}let k=x(null);k.displayName="DisclosureAPIContext";function V(e){let n=L(k);if(n===null){let o=new Error(`<${e} /> is missing a parent <Disclosure /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,V),o}return n}let H=x(null);H.displayName="DisclosurePanelContext";function de(){return L(H)}function fe(e,n){return O(n.type,ce,e,n)}let Te=K;function De(e,n){let{defaultOpen:o=!1,...d}=e,u=R(null),r=v(n,ne(c=>{u.current=c},e.as===void 0||e.as===K)),t=R(null),l=R(null),i=Z(fe,{disclosureState:o?0:1,linkedPanel:!1,buttonRef:l,panelRef:t,buttonId:null,panelId:null}),[{disclosureState:f,buttonId:s},T]=i,p=A(c=>{T({type:1});let P=ue(u);if(!P||!s)return;let y=(()=>c?c instanceof HTMLElement?c:c.current instanceof HTMLElement?c.current:P.getElementById(s):P.getElementById(s))();y==null||y.focus()}),m=b(()=>({close:p}),[p]),D=b(()=>({open:f===0,close:p}),[f,p]),I={ref:r};return g.createElement(M.Provider,{value:i},g.createElement(k.Provider,{value:m},g.createElement(oe,{value:p},g.createElement(le,{value:O(f,{[0]:C.Open,[1]:C.Closed})},B({ourProps:I,theirProps:d,slot:D,defaultTag:Te,name:"Disclosure"})))))}let Pe="button";function ye(e,n){let o=W(),{id:d=`headlessui-disclosure-button-${o}`,disabled:u=!1,autoFocus:r=!1,...t}=e,[l,i]=F("Disclosure.Button"),f=de(),s=f===null?!1:f===l.panelId,T=R(null),p=v(T,n,s?null:l.buttonRef),m=X();j(()=>{if(!s)return i({type:2,buttonId:d}),()=>{i({type:2,buttonId:null})}},[d,i,s]);let D=A(a=>{var E;if(s){if(l.disclosureState===1)return;switch(a.key){case S.Space:case S.Enter:a.preventDefault(),a.stopPropagation(),i({type:0}),(E=l.buttonRef.current)==null||E.focus();break}}else switch(a.key){case S.Space:case S.Enter:a.preventDefault(),a.stopPropagation(),i({type:0});break}}),I=A(a=>{switch(a.key){case S.Space:a.preventDefault();break}}),c=A(a=>{var E;se(a.currentTarget)||u||(s?(i({type:0}),(E=l.buttonRef.current)==null||E.focus()):i({type:0}))}),{isFocusVisible:P,focusProps:y}=Q({autoFocus:r}),{isHovered:U,hoverProps:h}=Y({isDisabled:u}),{pressed:N,pressProps:w}=ee({disabled:u}),q=b(()=>({open:l.disclosureState===0,hover:U,active:N,disabled:u,focus:P,autofocus:r}),[l,U,N,P,u,r]),G=te(e,T),z=s?J({ref:p,type:G,disabled:u||void 0,autoFocus:r,onKeyDown:D,onClick:c},y,h,w):J({ref:p,id:d,type:G,"aria-expanded":l.disclosureState===0,"aria-controls":l.linkedPanel?l.panelId:void 0,disabled:u||void 0,autoFocus:r,onKeyDown:D,onKeyUp:I,onClick:c},y,h,w);return B({mergeRefs:m,ourProps:z,theirProps:t,slot:q,defaultTag:Pe,name:"Disclosure.Button"})}let me="div",Ee=$.RenderStrategy|$.Static;function ge(e,n){let o=W(),{id:d=`headlessui-disclosure-panel-${o}`,...u}=e,[r,t]=F("Disclosure.Panel"),{close:l}=V("Disclosure.Panel"),i=X(),f=v(n,r.panelRef,D=>{ie(()=>t({type:D?4:5}))});j(()=>(t({type:3,panelId:d}),()=>{t({type:3,panelId:null})}),[d,t]);let s=re(),T=(()=>s!==null?(s&C.Open)===C.Open:r.disclosureState===0)(),p=b(()=>({open:r.disclosureState===0,close:l}),[r,l]),m={ref:f,id:d};return g.createElement(H.Provider,{value:r.panelId},B({mergeRefs:i,ourProps:m,theirProps:u,slot:p,defaultTag:me,features:Ee,visible:T,name:"Disclosure.Panel"}))}let Se=_(De),be=_(ye),Re=_(ge),we=Object.assign(Se,{Button:be,Panel:Re});export{we as Disclosure,be as DisclosureButton,Re as DisclosurePanel}; | ||
"use client";import{useFocusRing as Q}from"@react-aria/focus";import{useHover as Y}from"@react-aria/interactions";import E,{Fragment as K,createContext as x,useContext as L,useEffect as j,useMemo as b,useReducer as Z,useRef as A}from"react";import{useActivePress as ee}from'../../hooks/use-active-press.js';import{useEvent as C}from'../../hooks/use-event.js';import{useId as W}from'../../hooks/use-id.js';import{useResolveButtonType as te}from'../../hooks/use-resolve-button-type.js';import{optionalRef as ne,useSyncRefs as v}from'../../hooks/use-sync-refs.js';import{useTransition as oe}from'../../hooks/use-transition.js';import{CloseProvider as re}from'../../internal/close-provider.js';import{OpenClosedProvider as le,ResetOpenClosedProvider as se,State as I,useOpenClosed as ie}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as ae}from'../../utils/bugs.js';import{match as O}from'../../utils/match.js';import{getOwnerDocument as ue}from'../../utils/owner.js';import{RenderFeatures as $,forwardRefWithAs as _,mergeProps as J,render as B,useMergeRefsFn as X}from'../../utils/render.js';import{startTransition as pe}from'../../utils/start-transition.js';import{Keys as R}from'../keyboard.js';var ce=(r=>(r[r.Open=0]="Open",r[r.Closed=1]="Closed",r))(ce||{}),de=(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))(de||{});let fe={[0]:e=>({...e,disclosureState:O(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}}},M=x(null);M.displayName="DisclosureContext";function F(e){let n=L(M);if(n===null){let r=new Error(`<${e} /> is missing a parent <Disclosure /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,F),r}return n}let k=x(null);k.displayName="DisclosureAPIContext";function V(e){let n=L(k);if(n===null){let r=new Error(`<${e} /> is missing a parent <Disclosure /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,V),r}return n}let H=x(null);H.displayName="DisclosurePanelContext";function Te(){return L(H)}function De(e,n){return O(n.type,fe,e,n)}let Pe=K;function ye(e,n){let{defaultOpen:r=!1,...c}=e,s=A(null),d=v(n,ne(a=>{s.current=a},e.as===void 0||e.as===K)),t=A(null),o=A(null),l=Z(De,{disclosureState:r?0:1,linkedPanel:!1,buttonRef:o,panelRef:t,buttonId:null,panelId:null}),[{disclosureState:f,buttonId:i},T]=l,p=C(a=>{T({type:1});let y=ue(s);if(!y||!i)return;let m=(()=>a?a instanceof HTMLElement?a:a.current instanceof HTMLElement?a.current:y.getElementById(i):y.getElementById(i))();m==null||m.focus()}),D=b(()=>({close:p}),[p]),P=b(()=>({open:f===0,close:p}),[f,p]),g={ref:d};return E.createElement(M.Provider,{value:l},E.createElement(k.Provider,{value:D},E.createElement(re,{value:p},E.createElement(le,{value:O(f,{[0]:I.Open,[1]:I.Closed})},B({ourProps:g,theirProps:c,slot:P,defaultTag:Pe,name:"Disclosure"})))))}let me="button";function Ee(e,n){let r=W(),{id:c=`headlessui-disclosure-button-${r}`,disabled:s=!1,autoFocus:d=!1,...t}=e,[o,l]=F("Disclosure.Button"),f=Te(),i=f===null?!1:f===o.panelId,T=A(null),p=v(T,n,i?null:o.buttonRef),D=X();j(()=>{if(!i)return l({type:2,buttonId:c}),()=>{l({type:2,buttonId:null})}},[c,l,i]);let P=C(u=>{var S;if(i){if(o.disclosureState===1)return;switch(u.key){case R.Space:case R.Enter:u.preventDefault(),u.stopPropagation(),l({type:0}),(S=o.buttonRef.current)==null||S.focus();break}}else switch(u.key){case R.Space:case R.Enter:u.preventDefault(),u.stopPropagation(),l({type:0});break}}),g=C(u=>{switch(u.key){case R.Space:u.preventDefault();break}}),a=C(u=>{var S;ae(u.currentTarget)||s||(i?(l({type:0}),(S=o.buttonRef.current)==null||S.focus()):l({type:0}))}),{isFocusVisible:y,focusProps:m}=Q({autoFocus:d}),{isHovered:U,hoverProps:h}=Y({isDisabled:s}),{pressed:N,pressProps:w}=ee({disabled:s}),q=b(()=>({open:o.disclosureState===0,hover:U,active:N,disabled:s,focus:y,autofocus:d}),[o,U,N,y,s,d]),G=te(e,T),z=i?J({ref:p,type:G,disabled:s||void 0,autoFocus:d,onKeyDown:P,onClick:a},m,h,w):J({ref:p,id:c,type:G,"aria-expanded":o.disclosureState===0,"aria-controls":o.linkedPanel?o.panelId:void 0,disabled:s||void 0,autoFocus:d,onKeyDown:P,onKeyUp:g,onClick:a},m,h,w);return B({mergeRefs:D,ourProps:z,theirProps:t,slot:q,defaultTag:me,name:"Disclosure.Button"})}let ge="div",Se=$.RenderStrategy|$.Static;function Re(e,n){let r=W(),{id:c=`headlessui-disclosure-panel-${r}`,transition:s=!1,...d}=e,[t,o]=F("Disclosure.Panel"),{close:l}=V("Disclosure.Panel"),f=X(),i=v(n,t.panelRef,a=>{pe(()=>o({type:a?4:5}))});j(()=>(o({type:3,panelId:c}),()=>{o({type:3,panelId:null})}),[c,o]);let T=ie(),[p,D]=oe(s,t.panelRef,T!==null?(T&I.Open)===I.Open:t.disclosureState===0),P=b(()=>({open:t.disclosureState===0,close:l,...D}),[t.disclosureState,l,D]),g={ref:i,id:c};return E.createElement(se,null,E.createElement(H.Provider,{value:t.panelId},B({mergeRefs:f,ourProps:g,theirProps:d,slot:P,defaultTag:ge,features:Se,visible:p,name:"Disclosure.Panel"})))}let be=_(ye),Ae=_(Ee),Ce=_(Re),je=Object.assign(be,{Button:Ae,Panel:Ce});export{je as Disclosure,Ae as DisclosureButton,Ce as DisclosurePanel}; |
@@ -8,15 +8,13 @@ import React, { type ElementType, type MutableRefObject, type Ref } from 'react'; | ||
/** No features enabled for the focus trap. */ | ||
None = 1, | ||
None = 0, | ||
/** Ensure that we move focus initially into the container. */ | ||
InitialFocus = 2, | ||
InitialFocus = 1, | ||
/** Ensure that pressing `Tab` and `Shift+Tab` is trapped within the container. */ | ||
TabLock = 4, | ||
TabLock = 2, | ||
/** Ensure that programmatically moving focus outside of the container is disallowed. */ | ||
FocusLock = 8, | ||
FocusLock = 4, | ||
/** Ensure that we restore the focus when unmounting the focus trap. */ | ||
RestoreFocus = 16, | ||
RestoreFocus = 8, | ||
/** Initial focus should look for the `data-autofocus` */ | ||
AutoFocus = 32, | ||
/** Enable all features. */ | ||
All = 30 | ||
AutoFocus = 16 | ||
} | ||
@@ -23,0 +21,0 @@ type FocusTrapRenderPropArg = {}; |
@@ -1,1 +0,1 @@ | ||
"use client";import d,{useRef as L}from"react";import{useDisposables as I}from'../../hooks/use-disposables.js';import{useEvent as g}from'../../hooks/use-event.js';import{useEventListener as G}from'../../hooks/use-event-listener.js';import{useIsMounted as v}from'../../hooks/use-is-mounted.js';import{useOnUnmount as W}from'../../hooks/use-on-unmount.js';import{useOwnerDocument as k}from'../../hooks/use-owner.js';import{useServerHandoffComplete as K}from'../../hooks/use-server-handoff-complete.js';import{useSyncRefs as V}from'../../hooks/use-sync-refs.js';import{Direction as M,useTabDirection as q}from'../../hooks/use-tab-direction.js';import{useWatch as y}from'../../hooks/use-watch.js';import{Hidden as F,HiddenFeatures as P}from'../../internal/hidden.js';import{history as R}from'../../utils/active-element-history.js';import{Focus as T,FocusResult as O,focusElement as f,focusIn as i}from'../../utils/focus-management.js';import{match as C}from'../../utils/match.js';import{microTask as _}from'../../utils/micro-task.js';import{forwardRefWithAs as J,render as X}from'../../utils/render.js';function S(t){if(!t)return new Set;if(typeof t=="function")return new Set(t());let o=new Set;for(let e of t.current)e.current instanceof HTMLElement&&o.add(e.current);return o}let z="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.AutoFocus=32]="AutoFocus",r[r.All=30]="All",r))(h||{});function Q(t,o){let e=L(null),n=V(e,o),{initialFocus:c,initialFocusFallback:p,containers:u,features:r=30,...l}=t;K()||(r=1);let s=k(e);$({ownerDocument:s},!!(r&16));let U=D({ownerDocument:s,container:e,initialFocus:c,initialFocusFallback:p},r);w({ownerDocument:s,container:e,containers:u,previousActiveElement:U},!!(r&8));let b=q(),A=g(a=>{let m=e.current;if(!m)return;(N=>N())(()=>{C(b.current,{[M.Forwards]:()=>{i(m,T.First,{skipElements:[a.relatedTarget,p]})},[M.Backwards]:()=>{i(m,T.Last,{skipElements:[a.relatedTarget,p]})}})})}),B=I(),H=L(!1),x={ref:n,onKeyDown(a){a.key=="Tab"&&(H.current=!0,B.requestAnimationFrame(()=>{H.current=!1}))},onBlur(a){if(!(r&8))return;let m=S(u);e.current instanceof HTMLElement&&m.add(e.current);let E=a.relatedTarget;E instanceof HTMLElement&&E.dataset.headlessuiFocusGuard!=="true"&&(j(m,E)||(H.current?i(e.current,C(b.current,{[M.Forwards]:()=>T.Next,[M.Backwards]:()=>T.Previous})|T.WrapAround,{relativeTo:a.target}):a.target instanceof HTMLElement&&f(a.target)))}};return d.createElement(d.Fragment,null,!!(r&4)&&d.createElement(F,{as:"button",type:"button","data-headlessui-focus-guard":!0,onFocus:A,features:P.Focusable}),X({ourProps:x,theirProps:l,defaultTag:z,name:"FocusTrap"}),!!(r&4)&&d.createElement(F,{as:"button",type:"button","data-headlessui-focus-guard":!0,onFocus:A,features:P.Focusable}))}let Y=J(Q),Le=Object.assign(Y,{features:h});function Z(t=!0){let o=L(R.slice());return y(([e],[n])=>{n===!0&&e===!1&&_(()=>{o.current.splice(0)}),n===!1&&e===!0&&(o.current=R.slice())},[t,R,o]),g(()=>{var e;return(e=o.current.find(n=>n!=null&&n.isConnected))!=null?e:null})}function $({ownerDocument:t},o){let e=Z(o);y(()=>{o||(t==null?void 0:t.activeElement)===(t==null?void 0:t.body)&&f(e())},[o]),W(()=>{o&&f(e())})}function D({ownerDocument:t,container:o,initialFocus:e,initialFocusFallback:n},c){let p=!!(c&2),u=L(null),r=v();return y(()=>{if(!p){n!=null&&n.current&&f(n.current);return}let l=o.current;l&&_(()=>{if(!r.current)return;let s=t==null?void 0:t.activeElement;if(e!=null&&e.current){if((e==null?void 0:e.current)===s){u.current=s;return}}else if(l.contains(s)){u.current=s;return}if(e!=null&&e.current)f(e.current);else{if(c&32){if(i(l,T.First|T.AutoFocus)!==O.Error)return}else if(i(l,T.First)!==O.Error)return;if(n!=null&&n.current&&(f(n.current),(t==null?void 0:t.activeElement)===n.current))return;console.warn("There are no focusable elements inside the <FocusTrap />")}u.current=t==null?void 0:t.activeElement})},[n,p,c]),u}function w({ownerDocument:t,container:o,containers:e,previousActiveElement:n},c){let p=v();G(t==null?void 0:t.defaultView,"focus",u=>{if(!c||!p.current)return;let r=S(e);o.current instanceof HTMLElement&&r.add(o.current);let l=n.current;if(!l)return;let s=u.target;s&&s instanceof HTMLElement?j(r,s)?(n.current=s,f(s)):(u.preventDefault(),u.stopPropagation(),f(l)):f(n.current)},!0)}function j(t,o){for(let e of t)if(e.contains(o))return!0;return!1}export{Le as FocusTrap,h as FocusTrapFeatures}; | ||
"use client";import L,{useRef as M}from"react";import{useDisposables as G}from'../../hooks/use-disposables.js';import{useEvent as A}from'../../hooks/use-event.js';import{useEventListener as W}from'../../hooks/use-event-listener.js';import{useIsMounted as P}from'../../hooks/use-is-mounted.js';import{useIsTopLayer as O}from'../../hooks/use-is-top-layer.js';import{useOnUnmount as K}from'../../hooks/use-on-unmount.js';import{useOwnerDocument as V}from'../../hooks/use-owner.js';import{useServerHandoffComplete as q}from'../../hooks/use-server-handoff-complete.js';import{useSyncRefs as J}from'../../hooks/use-sync-refs.js';import{Direction as H,useTabDirection as X}from'../../hooks/use-tab-direction.js';import{useWatch as y}from'../../hooks/use-watch.js';import{Hidden as C,HiddenFeatures as _}from'../../internal/hidden.js';import{history as b}from'../../utils/active-element-history.js';import{Focus as T,FocusResult as S,focusElement as p,focusIn as E}from'../../utils/focus-management.js';import{match as h}from'../../utils/match.js';import{microTask as j}from'../../utils/micro-task.js';import{forwardRefWithAs as z,render as Q}from'../../utils/render.js';function U(o){if(!o)return new Set;if(typeof o=="function")return new Set(o());let e=new Set;for(let t of o.current)t.current instanceof HTMLElement&&e.add(t.current);return e}let Y="div";var x=(n=>(n[n.None=0]="None",n[n.InitialFocus=1]="InitialFocus",n[n.TabLock=2]="TabLock",n[n.FocusLock=4]="FocusLock",n[n.RestoreFocus=8]="RestoreFocus",n[n.AutoFocus=16]="AutoFocus",n))(x||{});function Z(o,e){let t=M(null),r=J(t,e),{initialFocus:s,initialFocusFallback:a,containers:n,features:u=15,...f}=o;q()||(u=0);let l=V(t);w(u,{ownerDocument:l});let i=ee(u,{ownerDocument:l,container:t,initialFocus:s,initialFocusFallback:a});te(u,{ownerDocument:l,container:t,containers:n,previousActiveElement:i});let R=X(),g=A(c=>{let m=t.current;if(!m)return;(B=>B())(()=>{h(R.current,{[H.Forwards]:()=>{E(m,T.First,{skipElements:[c.relatedTarget,a]})},[H.Backwards]:()=>{E(m,T.Last,{skipElements:[c.relatedTarget,a]})}})})}),v=O(!!(u&2),"focus-trap#tab-lock"),N=G(),F=M(!1),k={ref:r,onKeyDown(c){c.key=="Tab"&&(F.current=!0,N.requestAnimationFrame(()=>{F.current=!1}))},onBlur(c){if(!(u&4))return;let m=U(n);t.current instanceof HTMLElement&&m.add(t.current);let d=c.relatedTarget;d instanceof HTMLElement&&d.dataset.headlessuiFocusGuard!=="true"&&(I(m,d)||(F.current?E(t.current,h(R.current,{[H.Forwards]:()=>T.Next,[H.Backwards]:()=>T.Previous})|T.WrapAround,{relativeTo:c.target}):c.target instanceof HTMLElement&&p(c.target)))}};return L.createElement(L.Fragment,null,v&&L.createElement(C,{as:"button",type:"button","data-headlessui-focus-guard":!0,onFocus:g,features:_.Focusable}),Q({ourProps:k,theirProps:f,defaultTag:Y,name:"FocusTrap"}),v&&L.createElement(C,{as:"button",type:"button","data-headlessui-focus-guard":!0,onFocus:g,features:_.Focusable}))}let $=z(Z),Fe=Object.assign($,{features:x});function D(o=!0){let e=M(b.slice());return y(([t],[r])=>{r===!0&&t===!1&&j(()=>{e.current.splice(0)}),r===!1&&t===!0&&(e.current=b.slice())},[o,b,e]),A(()=>{var t;return(t=e.current.find(r=>r!=null&&r.isConnected))!=null?t:null})}function w(o,{ownerDocument:e}){let t=!!(o&8),r=D(t);y(()=>{t||(e==null?void 0:e.activeElement)===(e==null?void 0:e.body)&&p(r())},[t]),K(()=>{t&&p(r())})}function ee(o,{ownerDocument:e,container:t,initialFocus:r,initialFocusFallback:s}){let a=M(null),n=O(!!(o&1),"focus-trap#initial-focus"),u=P();return y(()=>{if(o===0)return;if(!n){s!=null&&s.current&&p(s.current);return}let f=t.current;f&&j(()=>{if(!u.current)return;let l=e==null?void 0:e.activeElement;if(r!=null&&r.current){if((r==null?void 0:r.current)===l){a.current=l;return}}else if(f.contains(l)){a.current=l;return}if(r!=null&&r.current)p(r.current);else{if(o&16){if(E(f,T.First|T.AutoFocus)!==S.Error)return}else if(E(f,T.First)!==S.Error)return;if(s!=null&&s.current&&(p(s.current),(e==null?void 0:e.activeElement)===s.current))return;console.warn("There are no focusable elements inside the <FocusTrap />")}a.current=e==null?void 0:e.activeElement})},[s,n,o]),a}function te(o,{ownerDocument:e,container:t,containers:r,previousActiveElement:s}){let a=P(),n=!!(o&4);W(e==null?void 0:e.defaultView,"focus",u=>{if(!n||!a.current)return;let f=U(r);t.current instanceof HTMLElement&&f.add(t.current);let l=s.current;if(!l)return;let i=u.target;i&&i instanceof HTMLElement?I(f,i)?(s.current=i,p(i)):(u.preventDefault(),u.stopPropagation(),p(l)):p(s.current)},!0)}function I(o,e){for(let t of o)if(t.contains(e))return!0;return!1}export{Fe as FocusTrap,x as FocusTrapFeatures}; |
import React, { type ElementType, type Ref } from 'react'; | ||
import { type ByComparator } from '../../hooks/use-by-comparator.js'; | ||
import { type TransitionData } from '../../hooks/use-transition.js'; | ||
import { type AnchorPropsWithSelection } from '../../internal/floating.js'; | ||
@@ -50,3 +51,3 @@ import type { Props } from '../../types.js'; | ||
open: boolean; | ||
}; | ||
} & TransitionData; | ||
type OptionsPropsWeControl = 'aria-activedescendant' | 'aria-labelledby' | 'aria-multiselectable' | 'aria-orientation' | 'role' | 'tabIndex'; | ||
@@ -58,2 +59,3 @@ declare let OptionsRenderFeatures: number; | ||
modal?: boolean; | ||
transition?: boolean; | ||
} & PropsForFeatures<typeof OptionsRenderFeatures>>; | ||
@@ -60,0 +62,0 @@ declare function OptionsFn<TTag extends ElementType = typeof DEFAULT_OPTIONS_TAG>(props: ListboxOptionsProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; |
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as Ae}from"@react-aria/focus";import{useHover as Ee}from"@react-aria/interactions";import D,{Fragment as ce,createContext as ne,createRef as he,useCallback as fe,useContext as ie,useEffect as be,useMemo as U,useReducer as De,useRef as V,useState as _e}from"react";import{useActivePress as Ie}from'../../hooks/use-active-press.js';import{useByComparator as Ce}from'../../hooks/use-by-comparator.js';import{useComputed as Fe}from'../../hooks/use-computed.js';import{useControllable as Me}from'../../hooks/use-controllable.js';import{useDefaultValue as we}from'../../hooks/use-default-value.js';import{useDidElementMove as Be}from'../../hooks/use-did-element-move.js';import{useDisposables as J}from'../../hooks/use-disposables.js';import{useElementSize as ke}from'../../hooks/use-element-size.js';import{useEvent as f}from'../../hooks/use-event.js';import{useId as re}from'../../hooks/use-id.js';import{useInertOthers as Ue}from'../../hooks/use-inert-others.js';import{useIsoMorphicEffect as le}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as Ne}from'../../hooks/use-latest-value.js';import{useOnDisappear as Ge}from'../../hooks/use-on-disappear.js';import{useOutsideClick as Ve}from'../../hooks/use-outside-click.js';import{useOwnerDocument as He}from'../../hooks/use-owner.js';import{useResolveButtonType as Ke}from'../../hooks/use-resolve-button-type.js';import{useScrollLock as je}from'../../hooks/use-scroll-lock.js';import{useSyncRefs as K}from'../../hooks/use-sync-refs.js';import{useTextValue as ze}from'../../hooks/use-text-value.js';import{useTrackedPointer as We}from'../../hooks/use-tracked-pointer.js';import{useDisabled as Qe}from'../../internal/disabled.js';import{FloatingProvider as Xe,useFloatingPanel as Je,useFloatingPanelProps as $e,useFloatingReference as qe,useFloatingReferenceProps as Ye,useResolvedAnchor as Ze}from'../../internal/floating.js';import{FormFields as et}from'../../internal/form-fields.js';import{useProvidedId as tt}from'../../internal/id.js';import{OpenClosedProvider as ot,State as $,useOpenClosed as nt}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as it}from'../../utils/bugs.js';import{Focus as m,calculateActiveIndex as ae}from'../../utils/calculate-active-index.js';import{disposables as se}from'../../utils/disposables.js';import{FocusableMode as rt,isFocusableElement as lt,sortByDomNode as at}from'../../utils/focus-management.js';import{attemptSubmit as st}from'../../utils/form.js';import{match as H}from'../../utils/match.js';import{getOwnerDocument as pt}from'../../utils/owner.js';import{RenderFeatures as Te,forwardRefWithAs as j,mergeProps as xe,render as z}from'../../utils/render.js';import{useDescribedBy as ut}from'../description/description.js';import{Keys as L}from'../keyboard.js';import{Label as dt,useLabelledBy as ct,useLabels as ft}from'../label/label.js';import{Portal as bt}from'../portal/portal.js';var Tt=(o=>(o[o.Open=0]="Open",o[o.Closed=1]="Closed",o))(Tt||{}),xt=(o=>(o[o.Single=0]="Single",o[o.Multi=1]="Multi",o))(xt||{}),mt=(o=>(o[o.Pointer=0]="Pointer",o[o.Other=1]="Other",o))(mt||{}),Ot=(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))(Ot||{});function pe(e,l=o=>o){let o=e.activeOptionIndex!==null?e.options[e.activeOptionIndex]:null,n=at(l(e.options.slice()),T=>T.dataRef.current.domRef.current),p=o?n.indexOf(o):null;return p===-1&&(p=null),{options:n,activeOptionIndex:p}}let yt={[1](e){return e.dataRef.current.disabled||e.listboxState===1?e:{...e,activeOptionIndex:null,listboxState:1,__demoMode:!1}},[0](e){if(e.dataRef.current.disabled||e.listboxState===0)return e;let l=e.activeOptionIndex,{isSelected:o}=e.dataRef.current,n=e.options.findIndex(p=>o(p.dataRef.current.value));return n!==-1&&(l=n),{...e,listboxState:0,activeOptionIndex:l,__demoMode:!1}},[2](e,l){var T,O,i,a,t;if(e.dataRef.current.disabled||e.listboxState===1)return e;let o={...e,searchQuery:"",activationTrigger:(T=l.trigger)!=null?T:1,__demoMode:!1};if(l.focus===m.Nothing)return{...o,activeOptionIndex:null};if(l.focus===m.Specific)return{...o,activeOptionIndex:e.options.findIndex(r=>r.id===l.id)};if(l.focus===m.Previous){let r=e.activeOptionIndex;if(r!==null){let R=e.options[r].dataRef.current.domRef,c=ae(l,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:d=>d.id,resolveDisabled:d=>d.dataRef.current.disabled});if(c!==null){let d=e.options[c].dataRef.current.domRef;if(((O=R.current)==null?void 0:O.previousElementSibling)===d.current||((i=d.current)==null?void 0:i.previousElementSibling)===null)return{...o,activeOptionIndex:c}}}}else if(l.focus===m.Next){let r=e.activeOptionIndex;if(r!==null){let R=e.options[r].dataRef.current.domRef,c=ae(l,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:d=>d.id,resolveDisabled:d=>d.dataRef.current.disabled});if(c!==null){let d=e.options[c].dataRef.current.domRef;if(((a=R.current)==null?void 0:a.nextElementSibling)===d.current||((t=d.current)==null?void 0:t.nextElementSibling)===null)return{...o,activeOptionIndex:c}}}}let n=pe(e),p=ae(l,{resolveItems:()=>n.options,resolveActiveIndex:()=>n.activeOptionIndex,resolveId:r=>r.id,resolveDisabled:r=>r.dataRef.current.disabled});return{...o,...n,activeOptionIndex:p}},[3]:(e,l)=>{if(e.dataRef.current.disabled||e.listboxState===1)return e;let n=e.searchQuery!==""?0:1,p=e.searchQuery+l.value.toLowerCase(),O=(e.activeOptionIndex!==null?e.options.slice(e.activeOptionIndex+n).concat(e.options.slice(0,e.activeOptionIndex+n)):e.options).find(a=>{var t;return!a.dataRef.current.disabled&&((t=a.dataRef.current.textValue)==null?void 0:t.startsWith(p))}),i=O?e.options.indexOf(O):-1;return i===-1||i===e.activeOptionIndex?{...e,searchQuery:p}:{...e,searchQuery:p,activeOptionIndex:i,activationTrigger:1}},[4](e){return e.dataRef.current.disabled||e.listboxState===1||e.searchQuery===""?e:{...e,searchQuery:""}},[5]:(e,l)=>{let o={id:l.id,dataRef:l.dataRef},n=pe(e,p=>[...p,o]);return e.activeOptionIndex===null&&e.dataRef.current.isSelected(l.dataRef.current.value)&&(n.activeOptionIndex=n.options.indexOf(o)),{...e,...n}},[6]:(e,l)=>{let o=pe(e,n=>{let p=n.findIndex(T=>T.id===l.id);return p!==-1&&n.splice(p,1),n});return{...e,...o,activationTrigger:1}}},ue=ne(null);ue.displayName="ListboxActionsContext";function q(e){let l=ie(ue);if(l===null){let o=new Error(`<${e} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,q),o}return l}let Y=ne(null);Y.displayName="ListboxDataContext";function W(e){let l=ie(Y);if(l===null){let o=new Error(`<${e} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,W),o}return l}function vt(e,l){return H(l.type,yt,e,l)}let gt=ce;function Lt(e,l){var de;let o=Qe(),{value:n,defaultValue:p,form:T,name:O,onChange:i,by:a,invalid:t=!1,disabled:r=o||!1,horizontal:R=!1,multiple:c=!1,__demoMode:d=!1,...M}=e;const B=R?"horizontal":"vertical";let h=K(l),_=we(p),[S=c?[]:void 0,y]=Me(n,i,_),[I,v]=De(vt,{dataRef:he(),listboxState:d?0:1,options:[],searchQuery:"",activeOptionIndex:null,activationTrigger:1,optionsVisible:!1,__demoMode:d}),k=V({static:!1,hold:!1}),w=V(null),x=V(null),A=V(new Map),E=Ce(a),N=fe(b=>H(u.mode,{[1]:()=>S.some(g=>E(g,b)),[0]:()=>E(S,b)}),[S]),u=U(()=>({...I,value:S,disabled:r,invalid:t,mode:c?1:0,orientation:B,compare:E,isSelected:N,optionsPropsRef:k,buttonRef:w,optionsRef:x,listRef:A}),[S,r,t,c,I,A]);le(()=>{I.dataRef.current=u},[u]);let G=u.listboxState===0;Ve(G,[u.buttonRef,u.optionsRef],(b,g)=>{var C;v({type:1}),lt(g,rt.Loose)||(b.preventDefault(),(C=u.buttonRef.current)==null||C.focus())});let Z=U(()=>({open:u.listboxState===0,disabled:r,invalid:t,value:S}),[u,r,S,t]),Q=f(b=>{let g=u.options.find(C=>C.id===b);g&&oe(g.dataRef.current.value)}),ee=f(()=>{if(u.activeOptionIndex!==null){let{dataRef:b,id:g}=u.options[u.activeOptionIndex];oe(b.current.value),v({type:2,focus:m.Specific,id:g})}}),te=f(()=>v({type:0})),X=f(()=>v({type:1})),s=J(),P=f((b,g,C)=>{s.dispose(),s.microTask(()=>b===m.Specific?v({type:2,focus:m.Specific,id:g,trigger:C}):v({type:2,focus:b,trigger:C}))}),F=f((b,g)=>(v({type:5,id:b,dataRef:g}),()=>v({type:6,id:b}))),oe=f(b=>H(u.mode,{[0](){return y==null?void 0:y(b)},[1](){let g=u.value.slice(),C=g.findIndex(Pe=>E(Pe,b));return C===-1?g.push(b):g.splice(C,1),y==null?void 0:y(g)}})),Oe=f(b=>v({type:3,value:b})),ye=f(()=>v({type:4})),ve=U(()=>({onChange:oe,registerOption:F,goToOption:P,closeListbox:X,openListbox:te,selectActiveOption:ee,selectOption:Q,search:Oe,clearSearch:ye}),[]),[ge,Le]=ft({inherit:!0}),Se={ref:h},Re=fe(()=>{if(_!==void 0)return y==null?void 0:y(_)},[y,_]);return D.createElement(Le,{value:ge,props:{htmlFor:(de=u.buttonRef.current)==null?void 0:de.id},slot:{open:u.listboxState===0,disabled:r}},D.createElement(Xe,null,D.createElement(ue.Provider,{value:ve},D.createElement(Y.Provider,{value:u},D.createElement(ot,{value:H(u.listboxState,{[0]:$.Open,[1]:$.Closed})},O!=null&&S!=null&&D.createElement(et,{disabled:r,data:{[O]:S},form:T,onReset:Re}),z({ourProps:Se,theirProps:M,slot:Z,defaultTag:gt,name:"Listbox"}))))))}let St="button";function Rt(e,l){var N;let o=W("Listbox.Button"),n=q("Listbox.Button"),p=re(),T=tt(),{id:O=T||`headlessui-listbox-button-${p}`,disabled:i=o.disabled||!1,autoFocus:a=!1,...t}=e,r=K(o.buttonRef,l,qe()),R=Ye(),c=J(),d=f(u=>{switch(u.key){case L.Enter:st(u.currentTarget);break;case L.Space:case L.ArrowDown:u.preventDefault(),n.openListbox(),c.nextFrame(()=>{o.value||n.goToOption(m.First)});break;case L.ArrowUp:u.preventDefault(),n.openListbox(),c.nextFrame(()=>{o.value||n.goToOption(m.Last)});break}}),M=f(u=>{switch(u.key){case L.Space:u.preventDefault();break}}),B=f(u=>{if(it(u.currentTarget))return u.preventDefault();o.listboxState===0?(n.closeListbox(),c.nextFrame(()=>{var G;return(G=o.buttonRef.current)==null?void 0:G.focus({preventScroll:!0})})):(u.preventDefault(),n.openListbox())}),h=f(u=>u.preventDefault()),_=ct([O]),S=ut(),{isFocusVisible:y,focusProps:I}=Ae({autoFocus:a}),{isHovered:v,hoverProps:k}=Ee({isDisabled:i}),{pressed:w,pressProps:x}=Ie({disabled:i}),A=U(()=>({open:o.listboxState===0,active:w||o.listboxState===0,disabled:i,invalid:o.invalid,value:o.value,hover:v,focus:y,autofocus:a}),[o.listboxState,o.value,i,v,y,w,o.invalid,a]),E=xe(R(),{ref:r,id:O,type:Ke(e,o.buttonRef),"aria-haspopup":"listbox","aria-controls":(N=o.optionsRef.current)==null?void 0:N.id,"aria-expanded":o.listboxState===0,"aria-labelledby":_,"aria-describedby":S,disabled:i||void 0,autoFocus:a,onKeyDown:d,onKeyUp:M,onKeyPress:h,onClick:B},I,k,x);return z({ourProps:E,theirProps:t,slot:A,defaultTag:St,name:"Listbox.Button"})}let me=ne(!1),Pt="div",At=Te.RenderStrategy|Te.Static;function Et(e,l){var X;let o=re(),{id:n=`headlessui-listbox-options-${o}`,anchor:p,portal:T=!1,modal:O=!0,...i}=e,a=Ze(p);a&&(T=!0);let t=W("Listbox.Options"),r=q("Listbox.Options"),R=He(t.optionsRef),c=nt(),d=(()=>c!==null?(c&$.Open)===$.Open:t.listboxState===0)();Ge(d,t.buttonRef,r.closeListbox);let M=t.__demoMode?!1:O&&t.listboxState===0;je(M,R);let B=t.__demoMode?!1:O&&t.listboxState===0;Ue(B,{allowed:f(()=>[t.buttonRef.current,t.optionsRef.current])});let h=V(null);be(()=>{var P;if(!((P=a==null?void 0:a.to)!=null&&P.includes("selection")))return;if(!d){h.current=null;return}let s=Array.from(t.listRef.current.values());h.current=s.findIndex(F=>(F==null?void 0:F.dataset.selected)===""),h.current===-1&&(h.current=s.findIndex(F=>(F==null?void 0:F.dataset.disabled)===void 0),r.goToOption(m.First))},[d,t.listRef]);let _=t.listboxState!==0,y=Be(_,t.buttonRef)?!1:d,I=(()=>{if(a==null)return;if(t.listRef.current.size<=0)return{...a,inner:void 0};let s=Array.from(t.listRef.current.values());return{...a,inner:{listRef:{current:s},index:h.current}}})(),[v,k]=Je(I),w=$e(),x=K(t.optionsRef,l,a?v:null),A=J(),E=J();be(()=>{var P;let s=t.optionsRef.current;s&&t.listboxState===0&&s!==((P=pt(s))==null?void 0:P.activeElement)&&(s==null||s.focus({preventScroll:!0}))},[t.listboxState,t.optionsRef,t.optionsRef.current]);let N=f(s=>{switch(E.dispose(),s.key){case L.Space:if(t.searchQuery!=="")return s.preventDefault(),s.stopPropagation(),r.search(s.key);case L.Enter:if(s.preventDefault(),s.stopPropagation(),t.activeOptionIndex!==null){let{dataRef:P}=t.options[t.activeOptionIndex];r.onChange(P.current.value)}t.mode===0&&(r.closeListbox(),se().nextFrame(()=>{var P;return(P=t.buttonRef.current)==null?void 0:P.focus({preventScroll:!0})}));break;case H(t.orientation,{vertical:L.ArrowDown,horizontal:L.ArrowRight}):return s.preventDefault(),s.stopPropagation(),r.goToOption(m.Next);case H(t.orientation,{vertical:L.ArrowUp,horizontal:L.ArrowLeft}):return s.preventDefault(),s.stopPropagation(),r.goToOption(m.Previous);case L.Home:case L.PageUp:return s.preventDefault(),s.stopPropagation(),r.goToOption(m.First);case L.End:case L.PageDown:return s.preventDefault(),s.stopPropagation(),r.goToOption(m.Last);case L.Escape:return s.preventDefault(),s.stopPropagation(),r.closeListbox(),A.nextFrame(()=>{var P;return(P=t.buttonRef.current)==null?void 0:P.focus({preventScroll:!0})});case L.Tab:s.preventDefault(),s.stopPropagation();break;default:s.key.length===1&&(r.search(s.key),E.setTimeout(()=>r.clearSearch(),350));break}}),u=Fe(()=>{var s;return(s=t.buttonRef.current)==null?void 0:s.id},[t.buttonRef.current]),G=U(()=>({open:t.listboxState===0}),[t]),Z=xe(a?w():{},{id:n,ref:x,"aria-activedescendant":t.activeOptionIndex===null||(X=t.options[t.activeOptionIndex])==null?void 0:X.id,"aria-multiselectable":t.mode===1?!0:void 0,"aria-labelledby":u,"aria-orientation":t.orientation,onKeyDown:N,role:"listbox",tabIndex:0,style:{...k,"--button-width":ke(t.buttonRef,!0).width}}),[Q,ee]=_e(t.value);t.value!==Q&&t.listboxState===0&&t.mode!==1&&ee(t.value);let te=f(s=>t.compare(Q,s));return D.createElement(bt,{enabled:T?e.static||d:!1},D.createElement(Y.Provider,{value:t.mode===1?t:{...t,isSelected:te}},z({ourProps:Z,theirProps:i,slot:G,defaultTag:Pt,features:At,visible:y,name:"Listbox.Options"})))}let ht="div";function Dt(e,l){let o=re(),{id:n=`headlessui-listbox-option-${o}`,disabled:p=!1,value:T,...O}=e,i=ie(me)===!0,a=W("Listbox.Option"),t=q("Listbox.Option"),r=a.activeOptionIndex!==null?a.options[a.activeOptionIndex].id===n:!1,R=a.isSelected(T),c=V(null),d=ze(c),M=Ne({disabled:p,value:T,domRef:c,get textValue(){return d()}}),B=K(l,c,x=>{x?a.listRef.current.set(n,x):a.listRef.current.delete(n)});le(()=>{if(a.__demoMode||a.listboxState!==0||!r||a.activationTrigger===0)return;let x=se();return x.requestAnimationFrame(()=>{var A,E;(E=(A=c.current)==null?void 0:A.scrollIntoView)==null||E.call(A,{block:"nearest"})}),x.dispose},[c,r,a.__demoMode,a.listboxState,a.activationTrigger,a.activeOptionIndex]),le(()=>{if(!i)return t.registerOption(n,M)},[M,n,i]);let h=f(x=>{if(p)return x.preventDefault();t.onChange(T),a.mode===0&&(t.closeListbox(),se().nextFrame(()=>{var A;return(A=a.buttonRef.current)==null?void 0:A.focus({preventScroll:!0})}))}),_=f(()=>{if(p)return t.goToOption(m.Nothing);t.goToOption(m.Specific,n)}),S=We(),y=f(x=>{S.update(x),!p&&(r||t.goToOption(m.Specific,n,0))}),I=f(x=>{S.wasMoved(x)&&(p||r||t.goToOption(m.Specific,n,0))}),v=f(x=>{S.wasMoved(x)&&(p||r&&t.goToOption(m.Nothing))}),k=U(()=>({active:r,focus:r,selected:R,disabled:p,selectedOption:R&&i}),[r,R,p,i]),w=i?{}:{id:n,ref:B,role:"option",tabIndex:p===!0?void 0:-1,"aria-disabled":p===!0?!0:void 0,"aria-selected":R,disabled:void 0,onClick:h,onFocus:_,onPointerEnter:y,onMouseEnter:y,onPointerMove:I,onMouseMove:I,onPointerLeave:v,onMouseLeave:v};return!R&&i?null:z({ourProps:w,theirProps:O,slot:k,defaultTag:ht,name:"Listbox.Option"})}let _t=ce;function It(e,l){let{options:o,placeholder:n,...p}=e,O={ref:K(l)},i=W("ListboxSelectedOption"),a=U(()=>({}),[]),t=i.value===void 0||i.value===null||i.mode===1&&Array.isArray(i.value)&&i.value.length===0;return D.createElement(me.Provider,{value:!0},z({ourProps:O,theirProps:{...p,children:D.createElement(D.Fragment,null,n&&t?n:o)},slot:a,defaultTag:_t,name:"ListboxSelectedOption"}))}let Ct=j(Lt),Ft=j(Rt),Mt=dt,wt=j(Et),Bt=j(Dt),kt=j(It),Ao=Object.assign(Ct,{Button:Ft,Label:Mt,Options:wt,Option:Bt,SelectedOption:kt});export{Ao as Listbox,Ft as ListboxButton,Mt as ListboxLabel,Bt as ListboxOption,wt as ListboxOptions,kt as ListboxSelectedOption}; | ||
"use client";import{useFocusRing as Ee}from"@react-aria/focus";import{useHover as he}from"@react-aria/interactions";import D,{Fragment as ce,createContext as ie,createRef as De,useCallback as fe,useContext as re,useEffect as be,useMemo as N,useReducer as _e,useRef as V}from"react";import{flushSync as G}from"react-dom";import{useActivePress as Ie}from'../../hooks/use-active-press.js';import{useByComparator as Ce}from'../../hooks/use-by-comparator.js';import{useComputed as Fe}from'../../hooks/use-computed.js';import{useControllable as Me}from'../../hooks/use-controllable.js';import{useDefaultValue as we}from'../../hooks/use-default-value.js';import{useDidElementMove as Be}from'../../hooks/use-did-element-move.js';import{useDisposables as Te}from'../../hooks/use-disposables.js';import{useElementSize as ke}from'../../hooks/use-element-size.js';import{useEvent as x}from'../../hooks/use-event.js';import{useId as ae}from'../../hooks/use-id.js';import{useInertOthers as Ue}from'../../hooks/use-inert-others.js';import{useIsoMorphicEffect as le}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as Ne}from'../../hooks/use-latest-value.js';import{useOnDisappear as Ge}from'../../hooks/use-on-disappear.js';import{useOutsideClick as Ve}from'../../hooks/use-outside-click.js';import{useOwnerDocument as He}from'../../hooks/use-owner.js';import{useResolveButtonType as Ke}from'../../hooks/use-resolve-button-type.js';import{useScrollLock as je}from'../../hooks/use-scroll-lock.js';import{useSyncRefs as j}from'../../hooks/use-sync-refs.js';import{useTextValue as ze}from'../../hooks/use-text-value.js';import{useTrackedPointer as We}from'../../hooks/use-tracked-pointer.js';import{useTransition as Qe}from'../../hooks/use-transition.js';import{useDisabled as Xe}from'../../internal/disabled.js';import{FloatingProvider as Je,useFloatingPanel as $e,useFloatingPanelProps as qe,useFloatingReference as Ye,useFloatingReferenceProps as Ze,useResolvedAnchor as et}from'../../internal/floating.js';import{FormFields as tt}from'../../internal/form-fields.js';import{useFrozenData as ot}from'../../internal/frozen.js';import{useProvidedId as nt}from'../../internal/id.js';import{OpenClosedProvider as it,State as X,useOpenClosed as rt}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as at}from'../../utils/bugs.js';import{Focus as y,calculateActiveIndex as se}from'../../utils/calculate-active-index.js';import{disposables as lt}from'../../utils/disposables.js';import{Focus as xe,FocusableMode as st,focusFrom as pt,isFocusableElement as ut,sortByDomNode as dt}from'../../utils/focus-management.js';import{attemptSubmit as ct}from'../../utils/form.js';import{match as H}from'../../utils/match.js';import{getOwnerDocument as ft}from'../../utils/owner.js';import{RenderFeatures as me,forwardRefWithAs as z,mergeProps as Oe,render as W}from'../../utils/render.js';import{useDescribedBy as bt}from'../description/description.js';import{Keys as P}from'../keyboard.js';import{Label as Tt,useLabelledBy as xt,useLabels as mt}from'../label/label.js';import{Portal as Ot}from'../portal/portal.js';var yt=(o=>(o[o.Open=0]="Open",o[o.Closed=1]="Closed",o))(yt||{}),vt=(o=>(o[o.Single=0]="Single",o[o.Multi=1]="Multi",o))(vt||{}),gt=(o=>(o[o.Pointer=0]="Pointer",o[o.Other=1]="Other",o))(gt||{}),Lt=(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))(Lt||{});function pe(e,r=o=>o){let o=e.activeOptionIndex!==null?e.options[e.activeOptionIndex]:null,n=dt(r(e.options.slice()),O=>O.dataRef.current.domRef.current),l=o?n.indexOf(o):null;return l===-1&&(l=null),{options:n,activeOptionIndex:l}}let St={[1](e){return e.dataRef.current.disabled||e.listboxState===1?e:{...e,activeOptionIndex:null,listboxState:1,__demoMode:!1}},[0](e){if(e.dataRef.current.disabled||e.listboxState===0)return e;let r=e.activeOptionIndex,{isSelected:o}=e.dataRef.current,n=e.options.findIndex(l=>o(l.dataRef.current.value));return n!==-1&&(r=n),{...e,listboxState:0,activeOptionIndex:r,__demoMode:!1}},[2](e,r){var O,v,i,s,p;if(e.dataRef.current.disabled||e.listboxState===1)return e;let o={...e,searchQuery:"",activationTrigger:(O=r.trigger)!=null?O:1,__demoMode:!1};if(r.focus===y.Nothing)return{...o,activeOptionIndex:null};if(r.focus===y.Specific)return{...o,activeOptionIndex:e.options.findIndex(t=>t.id===r.id)};if(r.focus===y.Previous){let t=e.activeOptionIndex;if(t!==null){let u=e.options[t].dataRef.current.domRef,b=se(r,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:c=>c.id,resolveDisabled:c=>c.dataRef.current.disabled});if(b!==null){let c=e.options[b].dataRef.current.domRef;if(((v=u.current)==null?void 0:v.previousElementSibling)===c.current||((i=c.current)==null?void 0:i.previousElementSibling)===null)return{...o,activeOptionIndex:b}}}}else if(r.focus===y.Next){let t=e.activeOptionIndex;if(t!==null){let u=e.options[t].dataRef.current.domRef,b=se(r,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:c=>c.id,resolveDisabled:c=>c.dataRef.current.disabled});if(b!==null){let c=e.options[b].dataRef.current.domRef;if(((s=u.current)==null?void 0:s.nextElementSibling)===c.current||((p=c.current)==null?void 0:p.nextElementSibling)===null)return{...o,activeOptionIndex:b}}}}let n=pe(e),l=se(r,{resolveItems:()=>n.options,resolveActiveIndex:()=>n.activeOptionIndex,resolveId:t=>t.id,resolveDisabled:t=>t.dataRef.current.disabled});return{...o,...n,activeOptionIndex:l}},[3]:(e,r)=>{if(e.dataRef.current.disabled||e.listboxState===1)return e;let n=e.searchQuery!==""?0:1,l=e.searchQuery+r.value.toLowerCase(),v=(e.activeOptionIndex!==null?e.options.slice(e.activeOptionIndex+n).concat(e.options.slice(0,e.activeOptionIndex+n)):e.options).find(s=>{var p;return!s.dataRef.current.disabled&&((p=s.dataRef.current.textValue)==null?void 0:p.startsWith(l))}),i=v?e.options.indexOf(v):-1;return i===-1||i===e.activeOptionIndex?{...e,searchQuery:l}:{...e,searchQuery:l,activeOptionIndex:i,activationTrigger:1}},[4](e){return e.dataRef.current.disabled||e.listboxState===1||e.searchQuery===""?e:{...e,searchQuery:""}},[5]:(e,r)=>{let o={id:r.id,dataRef:r.dataRef},n=pe(e,l=>[...l,o]);return e.activeOptionIndex===null&&e.dataRef.current.isSelected(r.dataRef.current.value)&&(n.activeOptionIndex=n.options.indexOf(o)),{...e,...n}},[6]:(e,r)=>{let o=pe(e,n=>{let l=n.findIndex(O=>O.id===r.id);return l!==-1&&n.splice(l,1),n});return{...e,...o,activationTrigger:1}}},ue=ie(null);ue.displayName="ListboxActionsContext";function J(e){let r=re(ue);if(r===null){let o=new Error(`<${e} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,J),o}return r}let $=ie(null);$.displayName="ListboxDataContext";function Q(e){let r=re($);if(r===null){let o=new Error(`<${e} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,Q),o}return r}function Rt(e,r){return H(r.type,St,e,r)}let Pt=ce;function At(e,r){var de;let o=Xe(),{value:n,defaultValue:l,form:O,name:v,onChange:i,by:s,invalid:p=!1,disabled:t=o||!1,horizontal:u=!1,multiple:b=!1,__demoMode:c=!1,...E}=e;const w=u?"horizontal":"vertical";let k=j(r),_=we(l),[f=b?[]:void 0,L]=Me(n,i,_),[I,S]=_e(Rt,{dataRef:De(),listboxState:c?0:1,options:[],searchQuery:"",activeOptionIndex:null,activationTrigger:1,optionsVisible:!1,__demoMode:c}),B=V({static:!1,hold:!1}),U=V(null),T=V(null),h=V(new Map),M=Ce(s),g=fe(m=>H(d.mode,{[1]:()=>f.some(R=>M(R,m)),[0]:()=>M(f,m)}),[f]),d=N(()=>({...I,value:f,disabled:t,invalid:p,mode:b?1:0,orientation:w,compare:M,isSelected:g,optionsPropsRef:B,buttonRef:U,optionsRef:T,listRef:h}),[f,t,p,b,I,h]);le(()=>{I.dataRef.current=d},[d]);let q=d.listboxState===0;Ve(q,[d.buttonRef,d.optionsRef],(m,R)=>{var F;S({type:1}),ut(R,st.Loose)||(m.preventDefault(),(F=d.buttonRef.current)==null||F.focus())});let Y=N(()=>({open:d.listboxState===0,disabled:t,invalid:p,value:f}),[d,t,f,p]),Z=x(m=>{let R=d.options.find(F=>F.id===m);R&&A(R.dataRef.current.value)}),ee=x(()=>{if(d.activeOptionIndex!==null){let{dataRef:m,id:R}=d.options[d.activeOptionIndex];A(m.current.value),S({type:2,focus:y.Specific,id:R})}}),te=x(()=>S({type:0})),oe=x(()=>S({type:1})),K=Te(),a=x((m,R,F)=>{K.dispose(),K.microTask(()=>m===y.Specific?S({type:2,focus:y.Specific,id:R,trigger:F}):S({type:2,focus:m,trigger:F}))}),C=x((m,R)=>(S({type:5,id:m,dataRef:R}),()=>S({type:6,id:m}))),A=x(m=>H(d.mode,{[0](){return L==null?void 0:L(m)},[1](){let R=d.value.slice(),F=R.findIndex(Ae=>M(Ae,m));return F===-1?R.push(m):R.splice(F,1),L==null?void 0:L(R)}})),ne=x(m=>S({type:3,value:m})),ve=x(()=>S({type:4})),ge=N(()=>({onChange:A,registerOption:C,goToOption:a,closeListbox:oe,openListbox:te,selectActiveOption:ee,selectOption:Z,search:ne,clearSearch:ve}),[]),[Le,Se]=mt({inherit:!0}),Re={ref:k},Pe=fe(()=>{if(_!==void 0)return L==null?void 0:L(_)},[L,_]);return D.createElement(Se,{value:Le,props:{htmlFor:(de=d.buttonRef.current)==null?void 0:de.id},slot:{open:d.listboxState===0,disabled:t}},D.createElement(Je,null,D.createElement(ue.Provider,{value:ge},D.createElement($.Provider,{value:d},D.createElement(it,{value:H(d.listboxState,{[0]:X.Open,[1]:X.Closed})},v!=null&&f!=null&&D.createElement(tt,{disabled:t,data:{[v]:f},form:O,onReset:Pe}),W({ourProps:Re,theirProps:E,slot:Y,defaultTag:Pt,name:"Listbox"}))))))}let Et="button";function ht(e,r){var M;let o=Q("Listbox.Button"),n=J("Listbox.Button"),l=ae(),O=nt(),{id:v=O||`headlessui-listbox-button-${l}`,disabled:i=o.disabled||!1,autoFocus:s=!1,...p}=e,t=j(o.buttonRef,r,Ye()),u=Ze(),b=x(g=>{switch(g.key){case P.Enter:ct(g.currentTarget);break;case P.Space:case P.ArrowDown:g.preventDefault(),G(()=>n.openListbox()),o.value||n.goToOption(y.First);break;case P.ArrowUp:g.preventDefault(),G(()=>n.openListbox()),o.value||n.goToOption(y.Last);break}}),c=x(g=>{switch(g.key){case P.Space:g.preventDefault();break}}),E=x(g=>{var d;if(at(g.currentTarget))return g.preventDefault();o.listboxState===0?(G(()=>n.closeListbox()),(d=o.buttonRef.current)==null||d.focus({preventScroll:!0})):(g.preventDefault(),n.openListbox())}),w=x(g=>g.preventDefault()),k=xt([v]),_=bt(),{isFocusVisible:f,focusProps:L}=Ee({autoFocus:s}),{isHovered:I,hoverProps:S}=he({isDisabled:i}),{pressed:B,pressProps:U}=Ie({disabled:i}),T=N(()=>({open:o.listboxState===0,active:B||o.listboxState===0,disabled:i,invalid:o.invalid,value:o.value,hover:I,focus:f,autofocus:s}),[o.listboxState,o.value,i,I,f,B,o.invalid,s]),h=Oe(u(),{ref:t,id:v,type:Ke(e,o.buttonRef),"aria-haspopup":"listbox","aria-controls":(M=o.optionsRef.current)==null?void 0:M.id,"aria-expanded":o.listboxState===0,"aria-labelledby":k,"aria-describedby":_,disabled:i||void 0,autoFocus:s,onKeyDown:b,onKeyUp:c,onKeyPress:w,onClick:E},L,S,U);return W({ourProps:h,theirProps:p,slot:T,defaultTag:Et,name:"Listbox.Button"})}let ye=ie(!1),Dt="div",_t=me.RenderStrategy|me.Static;function It(e,r){var K;let o=ae(),{id:n=`headlessui-listbox-options-${o}`,anchor:l,portal:O=!1,modal:v=!0,transition:i=!1,...s}=e,p=et(l);p&&(O=!0);let t=Q("Listbox.Options"),u=J("Listbox.Options"),b=He(t.optionsRef),c=rt(),[E,w]=Qe(i,t.optionsRef,c!==null?(c&X.Open)===X.Open:t.listboxState===0);Ge(E,t.buttonRef,u.closeListbox);let k=t.__demoMode?!1:v&&t.listboxState===0;je(k,b);let _=t.__demoMode?!1:v&&t.listboxState===0;Ue(_,{allowed:x(()=>[t.buttonRef.current,t.optionsRef.current])});let f=V(null);be(()=>{var C;if(!((C=p==null?void 0:p.to)!=null&&C.includes("selection")))return;if(!E){f.current=null;return}let a=Array.from(t.listRef.current.values());f.current=a.findIndex(A=>(A==null?void 0:A.dataset.selected)===""),f.current===-1&&(f.current=a.findIndex(A=>(A==null?void 0:A.dataset.disabled)===void 0),u.goToOption(y.First))},[E,t.listRef]);let L=t.listboxState!==0,S=Be(L,t.buttonRef)?!1:E,B=(()=>{if(p==null)return;if(t.listRef.current.size<=0)return{...p,inner:void 0};let a=Array.from(t.listRef.current.values());return{...p,inner:{listRef:{current:a},index:f.current}}})(),[U,T]=$e(B),h=qe(),M=j(t.optionsRef,r,p?U:null),g=Te();be(()=>{var C;let a=t.optionsRef.current;a&&t.listboxState===0&&a!==((C=ft(a))==null?void 0:C.activeElement)&&(a==null||a.focus({preventScroll:!0}))},[t.listboxState,t.optionsRef,t.optionsRef.current]);let d=x(a=>{var C,A;switch(g.dispose(),a.key){case P.Space:if(t.searchQuery!=="")return a.preventDefault(),a.stopPropagation(),u.search(a.key);case P.Enter:if(a.preventDefault(),a.stopPropagation(),t.activeOptionIndex!==null){let{dataRef:ne}=t.options[t.activeOptionIndex];u.onChange(ne.current.value)}t.mode===0&&(G(()=>u.closeListbox()),(C=t.buttonRef.current)==null||C.focus({preventScroll:!0}));break;case H(t.orientation,{vertical:P.ArrowDown,horizontal:P.ArrowRight}):return a.preventDefault(),a.stopPropagation(),u.goToOption(y.Next);case H(t.orientation,{vertical:P.ArrowUp,horizontal:P.ArrowLeft}):return a.preventDefault(),a.stopPropagation(),u.goToOption(y.Previous);case P.Home:case P.PageUp:return a.preventDefault(),a.stopPropagation(),u.goToOption(y.First);case P.End:case P.PageDown:return a.preventDefault(),a.stopPropagation(),u.goToOption(y.Last);case P.Escape:a.preventDefault(),a.stopPropagation(),G(()=>u.closeListbox()),(A=t.buttonRef.current)==null||A.focus({preventScroll:!0});return;case P.Tab:a.preventDefault(),a.stopPropagation(),G(()=>u.closeListbox()),pt(t.buttonRef.current,a.shiftKey?xe.Previous:xe.Next);break;default:a.key.length===1&&(u.search(a.key),g.setTimeout(()=>u.clearSearch(),350));break}}),q=Fe(()=>{var a;return(a=t.buttonRef.current)==null?void 0:a.id},[t.buttonRef.current]),Y=N(()=>({open:t.listboxState===0,...w}),[t.listboxState,w]),Z=Oe(p?h():{},{id:n,ref:M,"aria-activedescendant":t.activeOptionIndex===null||(K=t.options[t.activeOptionIndex])==null?void 0:K.id,"aria-multiselectable":t.mode===1?!0:void 0,"aria-labelledby":q,"aria-orientation":t.orientation,onKeyDown:d,role:"listbox",tabIndex:t.listboxState===0?0:void 0,style:{...s.style,...T,"--button-width":ke(t.buttonRef,!0).width}}),ee=E&&t.listboxState===1,te=ot(ee,t.value),oe=x(a=>t.compare(te,a));return D.createElement(Ot,{enabled:O?e.static||E:!1},D.createElement($.Provider,{value:t.mode===1?t:{...t,isSelected:oe}},W({ourProps:Z,theirProps:s,slot:Y,defaultTag:Dt,features:_t,visible:S,name:"Listbox.Options"})))}let Ct="div";function Ft(e,r){let o=ae(),{id:n=`headlessui-listbox-option-${o}`,disabled:l=!1,value:O,...v}=e,i=re(ye)===!0,s=Q("Listbox.Option"),p=J("Listbox.Option"),t=s.activeOptionIndex!==null?s.options[s.activeOptionIndex].id===n:!1,u=s.isSelected(O),b=V(null),c=ze(b),E=Ne({disabled:l,value:O,domRef:b,get textValue(){return c()}}),w=j(r,b,T=>{T?s.listRef.current.set(n,T):s.listRef.current.delete(n)});le(()=>{if(!s.__demoMode&&s.listboxState===0&&t&&s.activationTrigger!==0)return lt().requestAnimationFrame(()=>{var T,h;(h=(T=b.current)==null?void 0:T.scrollIntoView)==null||h.call(T,{block:"nearest"})})},[b,t,s.__demoMode,s.listboxState,s.activationTrigger,s.activeOptionIndex]),le(()=>{if(!i)return p.registerOption(n,E)},[E,n,i]);let k=x(T=>{var h;if(l)return T.preventDefault();p.onChange(O),s.mode===0&&(G(()=>p.closeListbox()),(h=s.buttonRef.current)==null||h.focus({preventScroll:!0}))}),_=x(()=>{if(l)return p.goToOption(y.Nothing);p.goToOption(y.Specific,n)}),f=We(),L=x(T=>{f.update(T),!l&&(t||p.goToOption(y.Specific,n,0))}),I=x(T=>{f.wasMoved(T)&&(l||t||p.goToOption(y.Specific,n,0))}),S=x(T=>{f.wasMoved(T)&&(l||t&&p.goToOption(y.Nothing))}),B=N(()=>({active:t,focus:t,selected:u,disabled:l,selectedOption:u&&i}),[t,u,l,i]),U=i?{}:{id:n,ref:w,role:"option",tabIndex:l===!0?void 0:-1,"aria-disabled":l===!0?!0:void 0,"aria-selected":u,disabled:void 0,onClick:k,onFocus:_,onPointerEnter:L,onMouseEnter:L,onPointerMove:I,onMouseMove:I,onPointerLeave:S,onMouseLeave:S};return!u&&i?null:W({ourProps:U,theirProps:v,slot:B,defaultTag:Ct,name:"Listbox.Option"})}let Mt=ce;function wt(e,r){let{options:o,placeholder:n,...l}=e,v={ref:j(r)},i=Q("ListboxSelectedOption"),s=N(()=>({}),[]),p=i.value===void 0||i.value===null||i.mode===1&&Array.isArray(i.value)&&i.value.length===0;return D.createElement(ye.Provider,{value:!0},W({ourProps:v,theirProps:{...l,children:D.createElement(D.Fragment,null,n&&p?n:o)},slot:s,defaultTag:Mt,name:"ListboxSelectedOption"}))}let Bt=z(At),kt=z(ht),Ut=Tt,Nt=z(It),Gt=z(Ft),Vt=z(wt),Fo=Object.assign(Bt,{Button:kt,Label:Ut,Options:Nt,Option:Gt,SelectedOption:Vt});export{Fo as Listbox,kt as ListboxButton,Ut as ListboxLabel,Gt as ListboxOption,Nt as ListboxOptions,Vt as ListboxSelectedOption}; |
import React, { type ElementType, type Ref } from 'react'; | ||
import { type TransitionData } from '../../hooks/use-transition.js'; | ||
import { type AnchorProps } from '../../internal/floating.js'; | ||
@@ -35,3 +36,3 @@ import type { Props } from '../../types.js'; | ||
open: boolean; | ||
}; | ||
} & TransitionData; | ||
type ItemsPropsWeControl = 'aria-activedescendant' | 'aria-labelledby' | 'role' | 'tabIndex'; | ||
@@ -42,2 +43,3 @@ export type MenuItemsProps<TTag extends ElementType = typeof DEFAULT_ITEMS_TAG> = Props<TTag, ItemsRenderPropArg, ItemsPropsWeControl, { | ||
modal?: boolean; | ||
transition?: boolean; | ||
static?: boolean; | ||
@@ -44,0 +46,0 @@ unmount?: boolean; |
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as ie}from"@react-aria/focus";import{useHover as se}from"@react-aria/interactions";import x,{Fragment as q,createContext as le,createRef as z,useContext as ue,useEffect as pe,useMemo as H,useReducer as de,useRef as Y}from"react";import{useActivePress as me}from'../../hooks/use-active-press.js';import{useDidElementMove as ce}from'../../hooks/use-did-element-move.js';import{useDisposables as Z}from'../../hooks/use-disposables.js';import{useElementSize as fe}from'../../hooks/use-element-size.js';import{useEvent as I}from'../../hooks/use-event.js';import{useId as N}from'../../hooks/use-id.js';import{useInertOthers as Te}from'../../hooks/use-inert-others.js';import{useIsoMorphicEffect as k}from'../../hooks/use-iso-morphic-effect.js';import{useOnDisappear as ye}from'../../hooks/use-on-disappear.js';import{useOutsideClick as ge}from'../../hooks/use-outside-click.js';import{useOwnerDocument as Ie}from'../../hooks/use-owner.js';import{useResolveButtonType as Me}from'../../hooks/use-resolve-button-type.js';import{useScrollLock as Ae}from'../../hooks/use-scroll-lock.js';import{useSyncRefs as B}from'../../hooks/use-sync-refs.js';import{useTextValue as Pe}from'../../hooks/use-text-value.js';import{useTrackedPointer as be}from'../../hooks/use-tracked-pointer.js';import{useTreeWalker as Se}from'../../hooks/use-tree-walker.js';import{FloatingProvider as Ee,useFloatingPanel as Re,useFloatingPanelProps as xe,useFloatingReference as ve,useFloatingReferenceProps as _e,useResolvedAnchor as De}from'../../internal/floating.js';import{OpenClosedProvider as he,State as w,useOpenClosed as Fe}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as Ce}from'../../utils/bugs.js';import{Focus as y,calculateActiveIndex as W}from'../../utils/calculate-active-index.js';import{disposables as j}from'../../utils/disposables.js';import{Focus as ee,FocusableMode as Oe,focusFrom as Le,isFocusableElement as Ge,restoreFocusIfNecessary as te,sortByDomNode as Ue}from'../../utils/focus-management.js';import{match as ne}from'../../utils/match.js';import{RenderFeatures as re,forwardRefWithAs as v,mergeProps as oe,render as _}from'../../utils/render.js';import{useDescriptions as He}from'../description/description.js';import{Keys as T}from'../keyboard.js';import{useLabelContext as Ne,useLabels as ae}from'../label/label.js';import{Portal as ke}from'../portal/portal.js';var Be=(r=>(r[r.Open=0]="Open",r[r.Closed=1]="Closed",r))(Be||{}),we=(r=>(r[r.Pointer=0]="Pointer",r[r.Other=1]="Other",r))(we||{}),Ke=(n=>(n[n.OpenMenu=0]="OpenMenu",n[n.CloseMenu=1]="CloseMenu",n[n.GoToItem=2]="GoToItem",n[n.Search=3]="Search",n[n.ClearSearch=4]="ClearSearch",n[n.RegisterItem=5]="RegisterItem",n[n.UnregisterItem=6]="UnregisterItem",n))(Ke||{});function Q(e,a=r=>r){let r=e.activeItemIndex!==null?e.items[e.activeItemIndex]:null,i=Ue(a(e.items.slice()),p=>p.dataRef.current.domRef.current),o=r?i.indexOf(r):null;return o===-1&&(o=null),{items:i,activeItemIndex:o}}let We={[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,a)=>{var p,d,n,l,t;if(e.menuState===1)return e;let r={...e,searchQuery:"",activationTrigger:(p=a.trigger)!=null?p:1,__demoMode:!1};if(a.focus===y.Nothing)return{...r,activeItemIndex:null};if(a.focus===y.Specific)return{...r,activeItemIndex:e.items.findIndex(u=>u.id===a.id)};if(a.focus===y.Previous){let u=e.activeItemIndex;if(u!==null){let g=e.items[u].dataRef.current.domRef,c=W(a,{resolveItems:()=>e.items,resolveActiveIndex:()=>e.activeItemIndex,resolveId:m=>m.id,resolveDisabled:m=>m.dataRef.current.disabled});if(c!==null){let m=e.items[c].dataRef.current.domRef;if(((d=g.current)==null?void 0:d.previousElementSibling)===m.current||((n=m.current)==null?void 0:n.previousElementSibling)===null)return{...r,activeItemIndex:c}}}}else if(a.focus===y.Next){let u=e.activeItemIndex;if(u!==null){let g=e.items[u].dataRef.current.domRef,c=W(a,{resolveItems:()=>e.items,resolveActiveIndex:()=>e.activeItemIndex,resolveId:m=>m.id,resolveDisabled:m=>m.dataRef.current.disabled});if(c!==null){let m=e.items[c].dataRef.current.domRef;if(((l=g.current)==null?void 0:l.nextElementSibling)===m.current||((t=m.current)==null?void 0:t.nextElementSibling)===null)return{...r,activeItemIndex:c}}}}let i=Q(e),o=W(a,{resolveItems:()=>i.items,resolveActiveIndex:()=>i.activeItemIndex,resolveId:u=>u.id,resolveDisabled:u=>u.dataRef.current.disabled});return{...r,...i,activeItemIndex:o}},[3]:(e,a)=>{let i=e.searchQuery!==""?0:1,o=e.searchQuery+a.value.toLowerCase(),d=(e.activeItemIndex!==null?e.items.slice(e.activeItemIndex+i).concat(e.items.slice(0,e.activeItemIndex+i)):e.items).find(l=>{var t;return((t=l.dataRef.current.textValue)==null?void 0:t.startsWith(o))&&!l.dataRef.current.disabled}),n=d?e.items.indexOf(d):-1;return n===-1||n===e.activeItemIndex?{...e,searchQuery:o}:{...e,searchQuery:o,activeItemIndex:n,activationTrigger:1}},[4](e){return e.searchQuery===""?e:{...e,searchQuery:"",searchActiveItemIndex:null}},[5]:(e,a)=>{let r=Q(e,i=>[...i,{id:a.id,dataRef:a.dataRef}]);return{...e,...r}},[6]:(e,a)=>{let r=Q(e,i=>{let o=i.findIndex(p=>p.id===a.id);return o!==-1&&i.splice(o,1),i});return{...e,...r,activationTrigger:1}}},J=le(null);J.displayName="MenuContext";function K(e){let a=ue(J);if(a===null){let r=new Error(`<${e} /> is missing a parent <Menu /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,K),r}return a}function je(e,a){return ne(a.type,We,e,a)}let Qe=q;function Je(e,a){let{__demoMode:r=!1,...i}=e,o=de(je,{__demoMode:r,menuState:r?0:1,buttonRef:z(),itemsRef:z(),items:[],searchQuery:"",activeItemIndex:null,activationTrigger:1}),[{menuState:p,itemsRef:d,buttonRef:n},l]=o,t=B(a);ge(p===0,[n,d],(E,M)=>{var P;l({type:1}),Ge(M,Oe.Loose)||(E.preventDefault(),(P=n.current)==null||P.focus())});let g=I(()=>{l({type:1})}),c=H(()=>({open:p===0,close:g}),[p,g]),m={ref:t};return x.createElement(Ee,null,x.createElement(J.Provider,{value:o},x.createElement(he,{value:ne(p,{[0]:w.Open,[1]:w.Closed})},_({ourProps:m,theirProps:i,slot:c,defaultTag:Qe,name:"Menu"}))))}let Ve="button";function Xe(e,a){var D;let r=N(),{id:i=`headlessui-menu-button-${r}`,disabled:o=!1,autoFocus:p=!1,...d}=e,[n,l]=K("Menu.Button"),t=_e(),u=B(n.buttonRef,a,ve()),g=Z(),c=I(f=>{switch(f.key){case T.Space:case T.Enter:case T.ArrowDown:f.preventDefault(),f.stopPropagation(),l({type:0}),g.nextFrame(()=>l({type:2,focus:y.First}));break;case T.ArrowUp:f.preventDefault(),f.stopPropagation(),l({type:0}),g.nextFrame(()=>l({type:2,focus:y.Last}));break}}),m=I(f=>{switch(f.key){case T.Space:f.preventDefault();break}}),E=I(f=>{if(Ce(f.currentTarget))return f.preventDefault();o||(n.menuState===0?(l({type:1}),g.nextFrame(()=>{var O;return(O=n.buttonRef.current)==null?void 0:O.focus({preventScroll:!0})})):(f.preventDefault(),l({type:0})))}),{isFocusVisible:M,focusProps:P}=ie({autoFocus:p}),{isHovered:b,hoverProps:S}=se({isDisabled:o}),{pressed:R,pressProps:F}=me({disabled:o}),C=H(()=>({open:n.menuState===0,active:R||n.menuState===0,disabled:o,hover:b,focus:M,autofocus:p}),[n,b,M,R,o,p]),G=oe(t(),{ref:u,id:i,type:Me(e,n.buttonRef),"aria-haspopup":"menu","aria-controls":(D=n.itemsRef.current)==null?void 0:D.id,"aria-expanded":n.menuState===0,disabled:o||void 0,autoFocus:p,onKeyDown:c,onKeyUp:m,onClick:E},P,S,F);return _({ourProps:G,theirProps:d,slot:C,defaultTag:Ve,name:"Menu.Button"})}let $e="div",qe=re.RenderStrategy|re.Static;function ze(e,a){var L,V;let r=N(),{id:i=`headlessui-menu-items-${r}`,anchor:o,portal:p=!1,modal:d=!0,...n}=e,l=De(o),[t,u]=K("Menu.Items"),[g,c]=Re(l),m=xe(),E=B(t.itemsRef,a,l?g:null),M=Ie(t.itemsRef);l&&(p=!0);let P=Z(),b=Fe(),S=(()=>b!==null?(b&w.Open)===w.Open:t.menuState===0)();ye(S,t.buttonRef,()=>{u({type:1})});let R=t.__demoMode?!1:d&&t.menuState===0;Ae(R,M);let F=t.__demoMode?!1:d&&t.menuState===0;Te(F,{allowed:I(()=>[t.buttonRef.current,t.itemsRef.current])});let C=t.menuState!==0,D=ce(C,t.buttonRef)?!1:S;pe(()=>{let s=t.itemsRef.current;s&&t.menuState===0&&s!==(M==null?void 0:M.activeElement)&&s.focus({preventScroll:!0})},[t.menuState,t.itemsRef,M,t.itemsRef.current]),Se(t.menuState===0,{container:t.itemsRef.current,accept(s){return s.getAttribute("role")==="menuitem"?NodeFilter.FILTER_REJECT:s.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(s){s.setAttribute("role","none")}});let f=I(s=>{var X,$;switch(P.dispose(),s.key){case T.Space:if(t.searchQuery!=="")return s.preventDefault(),s.stopPropagation(),u({type:3,value:s.key});case T.Enter:if(s.preventDefault(),s.stopPropagation(),u({type:1}),t.activeItemIndex!==null){let{dataRef:U}=t.items[t.activeItemIndex];($=(X=U.current)==null?void 0:X.domRef.current)==null||$.click()}te(t.buttonRef.current);break;case T.ArrowDown:return s.preventDefault(),s.stopPropagation(),u({type:2,focus:y.Next});case T.ArrowUp:return s.preventDefault(),s.stopPropagation(),u({type:2,focus:y.Previous});case T.Home:case T.PageUp:return s.preventDefault(),s.stopPropagation(),u({type:2,focus:y.First});case T.End:case T.PageDown:return s.preventDefault(),s.stopPropagation(),u({type:2,focus:y.Last});case T.Escape:s.preventDefault(),s.stopPropagation(),u({type:1}),j().nextFrame(()=>{var U;return(U=t.buttonRef.current)==null?void 0:U.focus({preventScroll:!0})});break;case T.Tab:s.preventDefault(),s.stopPropagation(),u({type:1}),j().microTask(()=>{Le(t.buttonRef.current,s.shiftKey?ee.Previous:ee.Next)});break;default:s.key.length===1&&(u({type:3,value:s.key}),P.setTimeout(()=>u({type:4}),350));break}}),O=I(s=>{switch(s.key){case T.Space:s.preventDefault();break}}),A=H(()=>({open:t.menuState===0}),[t]),h=oe(l?m():{},{"aria-activedescendant":t.activeItemIndex===null||(L=t.items[t.activeItemIndex])==null?void 0:L.id,"aria-labelledby":(V=t.buttonRef.current)==null?void 0:V.id,id:i,onKeyDown:f,onKeyUp:O,role:"menu",tabIndex:0,ref:E,style:{...c,"--button-width":fe(t.buttonRef,!0).width}});return x.createElement(ke,{enabled:p?e.static||S:!1},_({ourProps:h,theirProps:n,slot:A,defaultTag:$e,features:qe,visible:D,name:"Menu.Items"}))}let Ye=q;function Ze(e,a){let r=N(),{id:i=`headlessui-menu-item-${r}`,disabled:o=!1,...p}=e,[d,n]=K("Menu.Item"),l=d.activeItemIndex!==null?d.items[d.activeItemIndex].id===i:!1,t=Y(null),u=B(a,t);k(()=>{if(d.__demoMode||d.menuState!==0||!l||d.activationTrigger===0)return;let A=j();return A.requestAnimationFrame(()=>{var h,L;(L=(h=t.current)==null?void 0:h.scrollIntoView)==null||L.call(h,{block:"nearest"})}),A.dispose},[d.__demoMode,t,l,d.menuState,d.activationTrigger,d.activeItemIndex]);let g=Pe(t),c=Y({disabled:o,domRef:t,get textValue(){return g()}});k(()=>{c.current.disabled=o},[c,o]),k(()=>(n({type:5,id:i,dataRef:c}),()=>n({type:6,id:i})),[c,i]);let m=I(()=>{n({type:1})}),E=I(A=>{if(o)return A.preventDefault();n({type:1}),te(d.buttonRef.current)}),M=I(()=>{if(o)return n({type:2,focus:y.Nothing});n({type:2,focus:y.Specific,id:i})}),P=be(),b=I(A=>{P.update(A),!o&&(l||n({type:2,focus:y.Specific,id:i,trigger:0}))}),S=I(A=>{P.wasMoved(A)&&(o||l||n({type:2,focus:y.Specific,id:i,trigger:0}))}),R=I(A=>{P.wasMoved(A)&&(o||l&&n({type:2,focus:y.Nothing}))}),[F,C]=ae(),[G,D]=He(),f=H(()=>({active:l,focus:l,disabled:o,close:m}),[l,o,m]);return x.createElement(C,null,x.createElement(D,null,_({ourProps:{id:i,ref:u,role:"menuitem",tabIndex:o===!0?void 0:-1,"aria-disabled":o===!0?!0:void 0,"aria-labelledby":F,"aria-describedby":G,disabled:void 0,onClick:E,onFocus:M,onPointerEnter:b,onMouseEnter:b,onPointerMove:S,onMouseMove:S,onPointerLeave:R,onMouseLeave:R},theirProps:p,slot:f,defaultTag:Ye,name:"Menu.Item"})))}let et="div";function tt(e,a){let[r,i]=ae();return x.createElement(i,null,_({ourProps:{ref:a,"aria-labelledby":r,role:"group"},theirProps:e,slot:{},defaultTag:et,name:"Menu.Section"}))}let nt="header";function rt(e,a){let r=N(),{id:i=`headlessui-menu-heading-${r}`,...o}=e,p=Ne();k(()=>p.register(i),[i,p.register]);let d={id:i,ref:a,role:"presentation",...p.props};return _({ourProps:d,theirProps:o,slot:{},defaultTag:nt,name:"Menu.Heading"})}let ot="div";function at(e,a){return _({ourProps:{ref:a,role:"separator"},theirProps:e,slot:{},defaultTag:ot,name:"Menu.Separator"})}let it=v(Je),st=v(Xe),lt=v(ze),ut=v(Ze),pt=v(tt),dt=v(rt),mt=v(at),Qt=Object.assign(it,{Button:st,Items:lt,Item:ut,Section:pt,Heading:dt,Separator:mt});export{Qt as Menu,st as MenuButton,dt as MenuHeading,ut as MenuItem,lt as MenuItems,pt as MenuSection,mt as MenuSeparator}; | ||
"use client";import{useFocusRing as le}from"@react-aria/focus";import{useHover as ue}from"@react-aria/interactions";import v,{Fragment as q,createContext as pe,createRef as z,useContext as de,useEffect as me,useMemo as G,useReducer as ce,useRef as Y}from"react";import{flushSync as O}from"react-dom";import{useActivePress as fe}from'../../hooks/use-active-press.js';import{useDidElementMove as Te}from'../../hooks/use-did-element-move.js';import{useDisposables as ye}from'../../hooks/use-disposables.js';import{useElementSize as ge}from'../../hooks/use-element-size.js';import{useEvent as A}from'../../hooks/use-event.js';import{useId as U}from'../../hooks/use-id.js';import{useInertOthers as Ie}from'../../hooks/use-inert-others.js';import{useIsoMorphicEffect as H}from'../../hooks/use-iso-morphic-effect.js';import{useOnDisappear as Me}from'../../hooks/use-on-disappear.js';import{useOutsideClick as Ae}from'../../hooks/use-outside-click.js';import{useOwnerDocument as Pe}from'../../hooks/use-owner.js';import{useResolveButtonType as Se}from'../../hooks/use-resolve-button-type.js';import{useScrollLock as be}from'../../hooks/use-scroll-lock.js';import{useSyncRefs as N}from'../../hooks/use-sync-refs.js';import{useTextValue as Ee}from'../../hooks/use-text-value.js';import{useTrackedPointer as Re}from'../../hooks/use-tracked-pointer.js';import{useTransition as ve}from'../../hooks/use-transition.js';import{useTreeWalker as xe}from'../../hooks/use-tree-walker.js';import{FloatingProvider as _e,useFloatingPanel as De,useFloatingPanelProps as he,useFloatingReference as Ce,useFloatingReferenceProps as Fe,useResolvedAnchor as Oe}from'../../internal/floating.js';import{OpenClosedProvider as Le,State as k,useOpenClosed as Ge}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as Ue}from'../../utils/bugs.js';import{Focus as I,calculateActiveIndex as K}from'../../utils/calculate-active-index.js';import{disposables as He}from'../../utils/disposables.js';import{Focus as Z,FocusableMode as Ne,focusFrom as ke,isFocusableElement as Be,restoreFocusIfNecessary as ee,sortByDomNode as we}from'../../utils/focus-management.js';import{match as te}from'../../utils/match.js';import{RenderFeatures as ne,forwardRefWithAs as x,mergeProps as re,render as _}from'../../utils/render.js';import{useDescriptions as Ke}from'../description/description.js';import{Keys as T}from'../keyboard.js';import{useLabelContext as We,useLabels as oe}from'../label/label.js';import{Portal as je}from'../portal/portal.js';var Qe=(r=>(r[r.Open=0]="Open",r[r.Closed=1]="Closed",r))(Qe||{}),Je=(r=>(r[r.Pointer=0]="Pointer",r[r.Other=1]="Other",r))(Je||{}),Ve=(n=>(n[n.OpenMenu=0]="OpenMenu",n[n.CloseMenu=1]="CloseMenu",n[n.GoToItem=2]="GoToItem",n[n.Search=3]="Search",n[n.ClearSearch=4]="ClearSearch",n[n.RegisterItem=5]="RegisterItem",n[n.UnregisterItem=6]="UnregisterItem",n))(Ve||{});function W(e,a=r=>r){let r=e.activeItemIndex!==null?e.items[e.activeItemIndex]:null,i=we(a(e.items.slice()),l=>l.dataRef.current.domRef.current),o=r?i.indexOf(r):null;return o===-1&&(o=null),{items:i,activeItemIndex:o}}let Xe={[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,a)=>{var l,p,n,u,c;if(e.menuState===1)return e;let r={...e,searchQuery:"",activationTrigger:(l=a.trigger)!=null?l:1,__demoMode:!1};if(a.focus===I.Nothing)return{...r,activeItemIndex:null};if(a.focus===I.Specific)return{...r,activeItemIndex:e.items.findIndex(t=>t.id===a.id)};if(a.focus===I.Previous){let t=e.activeItemIndex;if(t!==null){let d=e.items[t].dataRef.current.domRef,f=K(a,{resolveItems:()=>e.items,resolveActiveIndex:()=>e.activeItemIndex,resolveId:m=>m.id,resolveDisabled:m=>m.dataRef.current.disabled});if(f!==null){let m=e.items[f].dataRef.current.domRef;if(((p=d.current)==null?void 0:p.previousElementSibling)===m.current||((n=m.current)==null?void 0:n.previousElementSibling)===null)return{...r,activeItemIndex:f}}}}else if(a.focus===I.Next){let t=e.activeItemIndex;if(t!==null){let d=e.items[t].dataRef.current.domRef,f=K(a,{resolveItems:()=>e.items,resolveActiveIndex:()=>e.activeItemIndex,resolveId:m=>m.id,resolveDisabled:m=>m.dataRef.current.disabled});if(f!==null){let m=e.items[f].dataRef.current.domRef;if(((u=d.current)==null?void 0:u.nextElementSibling)===m.current||((c=m.current)==null?void 0:c.nextElementSibling)===null)return{...r,activeItemIndex:f}}}}let i=W(e),o=K(a,{resolveItems:()=>i.items,resolveActiveIndex:()=>i.activeItemIndex,resolveId:t=>t.id,resolveDisabled:t=>t.dataRef.current.disabled});return{...r,...i,activeItemIndex:o}},[3]:(e,a)=>{let i=e.searchQuery!==""?0:1,o=e.searchQuery+a.value.toLowerCase(),p=(e.activeItemIndex!==null?e.items.slice(e.activeItemIndex+i).concat(e.items.slice(0,e.activeItemIndex+i)):e.items).find(u=>{var c;return((c=u.dataRef.current.textValue)==null?void 0:c.startsWith(o))&&!u.dataRef.current.disabled}),n=p?e.items.indexOf(p):-1;return n===-1||n===e.activeItemIndex?{...e,searchQuery:o}:{...e,searchQuery:o,activeItemIndex:n,activationTrigger:1}},[4](e){return e.searchQuery===""?e:{...e,searchQuery:"",searchActiveItemIndex:null}},[5]:(e,a)=>{let r=W(e,i=>[...i,{id:a.id,dataRef:a.dataRef}]);return{...e,...r}},[6]:(e,a)=>{let r=W(e,i=>{let o=i.findIndex(l=>l.id===a.id);return o!==-1&&i.splice(o,1),i});return{...e,...r,activationTrigger:1}}},j=pe(null);j.displayName="MenuContext";function B(e){let a=de(j);if(a===null){let r=new Error(`<${e} /> is missing a parent <Menu /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,B),r}return a}function $e(e,a){return te(a.type,Xe,e,a)}let qe=q;function ze(e,a){let{__demoMode:r=!1,...i}=e,o=ce($e,{__demoMode:r,menuState:r?0:1,buttonRef:z(),itemsRef:z(),items:[],searchQuery:"",activeItemIndex:null,activationTrigger:1}),[{menuState:l,itemsRef:p,buttonRef:n},u]=o,c=N(a);Ae(l===0,[n,p],(S,b)=>{var y;u({type:1}),Be(b,Ne.Loose)||(S.preventDefault(),(y=n.current)==null||y.focus())});let d=A(()=>{u({type:1})}),f=G(()=>({open:l===0,close:d}),[l,d]),m={ref:c};return v.createElement(_e,null,v.createElement(j.Provider,{value:o},v.createElement(Le,{value:te(l,{[0]:k.Open,[1]:k.Closed})},_({ourProps:m,theirProps:i,slot:f,defaultTag:qe,name:"Menu"}))))}let Ye="button";function Ze(e,a){var D;let r=U(),{id:i=`headlessui-menu-button-${r}`,disabled:o=!1,autoFocus:l=!1,...p}=e,[n,u]=B("Menu.Button"),c=Fe(),t=N(n.buttonRef,a,Ce()),d=A(g=>{switch(g.key){case T.Space:case T.Enter:case T.ArrowDown:g.preventDefault(),g.stopPropagation(),O(()=>u({type:0})),u({type:2,focus:I.First});break;case T.ArrowUp:g.preventDefault(),g.stopPropagation(),O(()=>u({type:0})),u({type:2,focus:I.Last});break}}),f=A(g=>{switch(g.key){case T.Space:g.preventDefault();break}}),m=A(g=>{var h;if(Ue(g.currentTarget))return g.preventDefault();o||(n.menuState===0?(O(()=>u({type:1})),(h=n.buttonRef.current)==null||h.focus({preventScroll:!0})):(g.preventDefault(),u({type:0})))}),{isFocusVisible:S,focusProps:b}=le({autoFocus:l}),{isHovered:y,hoverProps:E}=ue({isDisabled:o}),{pressed:P,pressProps:R}=fe({disabled:o}),C=G(()=>({open:n.menuState===0,active:P||n.menuState===0,disabled:o,hover:y,focus:S,autofocus:l}),[n,y,S,P,o,l]),F=re(c(),{ref:t,id:i,type:Se(e,n.buttonRef),"aria-haspopup":"menu","aria-controls":(D=n.itemsRef.current)==null?void 0:D.id,"aria-expanded":n.menuState===0,disabled:o||void 0,autoFocus:l,onKeyDown:d,onKeyUp:f,onClick:m},b,E,R);return _({ourProps:F,theirProps:p,slot:C,defaultTag:Ye,name:"Menu.Button"})}let et="div",tt=ne.RenderStrategy|ne.Static;function nt(e,a){var Q,J;let r=U(),{id:i=`headlessui-menu-items-${r}`,anchor:o,portal:l=!1,modal:p=!0,transition:n=!1,...u}=e,c=Oe(o),[t,d]=B("Menu.Items"),[f,m]=De(c),S=he(),b=N(t.itemsRef,a,c?f:null),y=Pe(t.itemsRef);c&&(l=!0);let E=Ge(),[P,R]=ve(n,t.itemsRef,E!==null?(E&k.Open)===k.Open:t.menuState===0);Me(P,t.buttonRef,()=>{d({type:1})});let C=t.__demoMode?!1:p&&t.menuState===0;be(C,y);let F=t.__demoMode?!1:p&&t.menuState===0;Ie(F,{allowed:A(()=>[t.buttonRef.current,t.itemsRef.current])});let D=t.menuState!==0,h=Te(D,t.buttonRef)?!1:P;me(()=>{let s=t.itemsRef.current;s&&t.menuState===0&&s!==(y==null?void 0:y.activeElement)&&s.focus({preventScroll:!0})},[t.menuState,t.itemsRef,y,t.itemsRef.current]),xe(t.menuState===0,{container:t.itemsRef.current,accept(s){return s.getAttribute("role")==="menuitem"?NodeFilter.FILTER_REJECT:s.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(s){s.setAttribute("role","none")}});let w=ye(),M=A(s=>{var V,X,$;switch(w.dispose(),s.key){case T.Space:if(t.searchQuery!=="")return s.preventDefault(),s.stopPropagation(),d({type:3,value:s.key});case T.Enter:if(s.preventDefault(),s.stopPropagation(),d({type:1}),t.activeItemIndex!==null){let{dataRef:se}=t.items[t.activeItemIndex];(X=(V=se.current)==null?void 0:V.domRef.current)==null||X.click()}ee(t.buttonRef.current);break;case T.ArrowDown:return s.preventDefault(),s.stopPropagation(),d({type:2,focus:I.Next});case T.ArrowUp:return s.preventDefault(),s.stopPropagation(),d({type:2,focus:I.Previous});case T.Home:case T.PageUp:return s.preventDefault(),s.stopPropagation(),d({type:2,focus:I.First});case T.End:case T.PageDown:return s.preventDefault(),s.stopPropagation(),d({type:2,focus:I.Last});case T.Escape:s.preventDefault(),s.stopPropagation(),O(()=>d({type:1})),($=t.buttonRef.current)==null||$.focus({preventScroll:!0});break;case T.Tab:s.preventDefault(),s.stopPropagation(),O(()=>d({type:1})),ke(t.buttonRef.current,s.shiftKey?Z.Previous:Z.Next);break;default:s.key.length===1&&(d({type:3,value:s.key}),w.setTimeout(()=>d({type:4}),350));break}}),L=A(s=>{switch(s.key){case T.Space:s.preventDefault();break}}),ae=G(()=>({open:t.menuState===0,...R}),[t.menuState,R]),ie=re(c?S():{},{"aria-activedescendant":t.activeItemIndex===null||(Q=t.items[t.activeItemIndex])==null?void 0:Q.id,"aria-labelledby":(J=t.buttonRef.current)==null?void 0:J.id,id:i,onKeyDown:M,onKeyUp:L,role:"menu",tabIndex:t.menuState===0?0:void 0,ref:b,style:{...u.style,...m,"--button-width":ge(t.buttonRef,!0).width}});return v.createElement(je,{enabled:l?e.static||P:!1},_({ourProps:ie,theirProps:u,slot:ae,defaultTag:et,features:tt,visible:h,name:"Menu.Items"}))}let rt=q;function ot(e,a){let r=U(),{id:i=`headlessui-menu-item-${r}`,disabled:o=!1,...l}=e,[p,n]=B("Menu.Item"),u=p.activeItemIndex!==null?p.items[p.activeItemIndex].id===i:!1,c=Y(null),t=N(a,c);H(()=>{if(!p.__demoMode&&p.menuState===0&&u&&p.activationTrigger!==0)return He().requestAnimationFrame(()=>{var M,L;(L=(M=c.current)==null?void 0:M.scrollIntoView)==null||L.call(M,{block:"nearest"})})},[p.__demoMode,c,u,p.menuState,p.activationTrigger,p.activeItemIndex]);let d=Ee(c),f=Y({disabled:o,domRef:c,get textValue(){return d()}});H(()=>{f.current.disabled=o},[f,o]),H(()=>(n({type:5,id:i,dataRef:f}),()=>n({type:6,id:i})),[f,i]);let m=A(()=>{n({type:1})}),S=A(M=>{if(o)return M.preventDefault();n({type:1}),ee(p.buttonRef.current)}),b=A(()=>{if(o)return n({type:2,focus:I.Nothing});n({type:2,focus:I.Specific,id:i})}),y=Re(),E=A(M=>{y.update(M),!o&&(u||n({type:2,focus:I.Specific,id:i,trigger:0}))}),P=A(M=>{y.wasMoved(M)&&(o||u||n({type:2,focus:I.Specific,id:i,trigger:0}))}),R=A(M=>{y.wasMoved(M)&&(o||u&&n({type:2,focus:I.Nothing}))}),[C,F]=oe(),[D,g]=Ke(),h=G(()=>({active:u,focus:u,disabled:o,close:m}),[u,o,m]);return v.createElement(F,null,v.createElement(g,null,_({ourProps:{id:i,ref:t,role:"menuitem",tabIndex:o===!0?void 0:-1,"aria-disabled":o===!0?!0:void 0,"aria-labelledby":C,"aria-describedby":D,disabled:void 0,onClick:S,onFocus:b,onPointerEnter:E,onMouseEnter:E,onPointerMove:P,onMouseMove:P,onPointerLeave:R,onMouseLeave:R},theirProps:l,slot:h,defaultTag:rt,name:"Menu.Item"})))}let at="div";function it(e,a){let[r,i]=oe();return v.createElement(i,null,_({ourProps:{ref:a,"aria-labelledby":r,role:"group"},theirProps:e,slot:{},defaultTag:at,name:"Menu.Section"}))}let st="header";function lt(e,a){let r=U(),{id:i=`headlessui-menu-heading-${r}`,...o}=e,l=We();H(()=>l.register(i),[i,l.register]);let p={id:i,ref:a,role:"presentation",...l.props};return _({ourProps:p,theirProps:o,slot:{},defaultTag:st,name:"Menu.Heading"})}let ut="div";function pt(e,a){return _({ourProps:{ref:a,role:"separator"},theirProps:e,slot:{},defaultTag:ut,name:"Menu.Separator"})}let dt=x(ze),mt=x(Ze),ct=x(nt),ft=x(ot),Tt=x(it),yt=x(lt),gt=x(pt),Yt=Object.assign(dt,{Button:mt,Items:ct,Item:ft,Section:Tt,Heading:yt,Separator:gt});export{Yt as Menu,mt as MenuButton,yt as MenuHeading,ft as MenuItem,ct as MenuItems,Tt as MenuSection,gt as MenuSeparator}; |
import React, { type ElementType, type MouseEventHandler, type MutableRefObject, type Ref } from 'react'; | ||
import { type TransitionData } from '../../hooks/use-transition.js'; | ||
import { type AnchorProps } from '../../internal/floating.js'; | ||
@@ -31,10 +32,13 @@ import type { Props } from '../../types.js'; | ||
declare function ButtonFn<TTag extends ElementType = typeof DEFAULT_BUTTON_TAG>(props: PopoverButtonProps<TTag>, ref: Ref<HTMLButtonElement>): React.JSX.Element; | ||
declare let DEFAULT_OVERLAY_TAG: "div"; | ||
type OverlayRenderPropArg = { | ||
declare let DEFAULT_BACKDROP_TAG: "div"; | ||
type BackdropRenderPropArg = { | ||
open: boolean; | ||
}; | ||
type OverlayPropsWeControl = 'aria-hidden'; | ||
declare let OverlayRenderFeatures: number; | ||
export type PopoverOverlayProps<TTag extends ElementType = typeof DEFAULT_OVERLAY_TAG> = Props<TTag, OverlayRenderPropArg, OverlayPropsWeControl, PropsForFeatures<typeof OverlayRenderFeatures>>; | ||
declare function OverlayFn<TTag extends ElementType = typeof DEFAULT_OVERLAY_TAG>(props: PopoverOverlayProps<TTag>, ref: Ref<HTMLElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null; | ||
} & TransitionData; | ||
type BackdropPropsWeControl = 'aria-hidden'; | ||
declare let BackdropRenderFeatures: number; | ||
export type PopoverBackdropProps<TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG> = Props<TTag, BackdropRenderPropArg, BackdropPropsWeControl, { | ||
transition?: boolean; | ||
} & PropsForFeatures<typeof BackdropRenderFeatures>>; | ||
export type PopoverOverlayProps<TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG> = PopoverBackdropProps<TTag>; | ||
declare function BackdropFn<TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG>(props: PopoverBackdropProps<TTag>, ref: Ref<HTMLElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null; | ||
declare let DEFAULT_PANEL_TAG: "div"; | ||
@@ -44,3 +48,3 @@ type PanelRenderPropArg = { | ||
close: (focusableElement?: HTMLElement | MutableRefObject<HTMLElement | null>) => void; | ||
}; | ||
} & TransitionData; | ||
type PanelPropsWeControl = 'tabIndex'; | ||
@@ -52,2 +56,3 @@ export type PopoverPanelProps<TTag extends ElementType = typeof DEFAULT_PANEL_TAG> = Props<TTag, PanelRenderPropArg, PanelPropsWeControl, { | ||
modal?: boolean; | ||
transition?: boolean; | ||
static?: boolean; | ||
@@ -68,4 +73,4 @@ unmount?: boolean; | ||
} | ||
export interface _internal_ComponentPopoverOverlay extends HasDisplayName { | ||
<TTag extends ElementType = typeof DEFAULT_OVERLAY_TAG>(props: PopoverOverlayProps<TTag> & RefProp<typeof OverlayFn>): JSX.Element; | ||
export interface _internal_ComponentPopoverBackdrop extends HasDisplayName { | ||
<TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG>(props: PopoverBackdropProps<TTag> & RefProp<typeof BackdropFn>): JSX.Element; | ||
} | ||
@@ -79,3 +84,5 @@ export interface _internal_ComponentPopoverPanel extends HasDisplayName { | ||
export declare let PopoverButton: _internal_ComponentPopoverButton; | ||
export declare let PopoverOverlay: _internal_ComponentPopoverOverlay; | ||
/** @deprecated use `<PopoverBackdrop>` instead of `<PopoverOverlay>` */ | ||
export declare let PopoverOverlay: _internal_ComponentPopoverBackdrop; | ||
export declare let PopoverBackdrop: _internal_ComponentPopoverBackdrop; | ||
export declare let PopoverPanel: _internal_ComponentPopoverPanel; | ||
@@ -86,4 +93,6 @@ export declare let PopoverGroup: _internal_ComponentPopoverGroup; | ||
Button: _internal_ComponentPopoverButton; | ||
/** @deprecated use `<PopoverBackdrop>` instead of `<Popover.Backdrop>` */ | ||
Backdrop: _internal_ComponentPopoverBackdrop; | ||
/** @deprecated use `<PopoverOverlay>` instead of `<Popover.Overlay>` */ | ||
Overlay: _internal_ComponentPopoverOverlay; | ||
Overlay: _internal_ComponentPopoverBackdrop; | ||
/** @deprecated use `<PopoverPanel>` instead of `<Popover.Panel>` */ | ||
@@ -90,0 +99,0 @@ Panel: _internal_ComponentPopoverPanel; |
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as Oe}from"@react-aria/focus";import{useHover as Ce}from"@react-aria/interactions";import b,{createContext as ee,createRef as se,useContext as te,useEffect as oe,useMemo as G,useReducer as Fe,useRef as z,useState as Ee}from"react";import{useActivePress as Me}from'../../hooks/use-active-press.js';import{useElementSize as _e}from'../../hooks/use-element-size.js';import{useEvent as A}from'../../hooks/use-event.js';import{useEventListener as xe}from'../../hooks/use-event-listener.js';import{useId as re}from'../../hooks/use-id.js';import{useIsoMorphicEffect as Le}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as be}from'../../hooks/use-latest-value.js';import{useOnDisappear as Ie}from'../../hooks/use-on-disappear.js';import{useOutsideClick as Be}from'../../hooks/use-outside-click.js';import{useOwnerDocument as ue}from'../../hooks/use-owner.js';import{useResolveButtonType as he}from'../../hooks/use-resolve-button-type.js';import{useMainTreeNode as De,useRootContainers as Ge}from'../../hooks/use-root-containers.js';import{useScrollLock as He}from'../../hooks/use-scroll-lock.js';import{optionalRef as Ne,useSyncRefs as J}from'../../hooks/use-sync-refs.js';import{Direction as k,useTabDirection as ge}from'../../hooks/use-tab-direction.js';import{CloseProvider as ke}from'../../internal/close-provider.js';import{FloatingProvider as Ue,useFloatingPanel as we,useFloatingPanelProps as We,useFloatingReference as Ve,useResolvedAnchor as je}from'../../internal/floating.js';import{Hidden as ie,HiddenFeatures as fe}from'../../internal/hidden.js';import{OpenClosedProvider as Ke,State as X,useOpenClosed as Se}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as Ae}from'../../utils/bugs.js';import{Focus as U,FocusResult as Pe,FocusableMode as $e,focusIn as w,getFocusableElements as de,isFocusableElement as Je}from'../../utils/focus-management.js';import{match as W}from'../../utils/match.js';import'../../utils/micro-task.js';import{getOwnerDocument as Xe}from'../../utils/owner.js';import{RenderFeatures as ne,forwardRefWithAs as Q,mergeProps as ce,render as Z,useMergeRefsFn as Ye}from'../../utils/render.js';import{Keys as V}from'../keyboard.js';import{Portal as qe,useNestedPortals as ze}from'../portal/portal.js';var Qe=(u=>(u[u.Open=0]="Open",u[u.Closed=1]="Closed",u))(Qe||{}),Ze=(i=>(i[i.TogglePopover=0]="TogglePopover",i[i.ClosePopover=1]="ClosePopover",i[i.SetButton=2]="SetButton",i[i.SetButtonId=3]="SetButtonId",i[i.SetPanel=4]="SetPanel",i[i.SetPanelId=5]="SetPanelId",i))(Ze||{});let et={[0]:t=>({...t,popoverState:W(t.popoverState,{[0]:1,[1]:0}),__demoMode:!1}),[1](t){return t.popoverState===1?t:{...t,popoverState:1,__demoMode:!1}},[2](t,a){return t.button===a.button?t:{...t,button:a.button}},[3](t,a){return t.buttonId===a.buttonId?t:{...t,buttonId:a.buttonId}},[4](t,a){return t.panel===a.panel?t:{...t,panel:a.panel}},[5](t,a){return t.panelId===a.panelId?t:{...t,panelId:a.panelId}}},ve=ee(null);ve.displayName="PopoverContext";function le(t){let a=te(ve);if(a===null){let u=new Error(`<${t} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(u,le),u}return a}let ae=ee(null);ae.displayName="PopoverAPIContext";function Te(t){let a=te(ae);if(a===null){let u=new Error(`<${t} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(u,Te),u}return a}let me=ee(null);me.displayName="PopoverGroupContext";function Re(){return te(me)}let pe=ee(null);pe.displayName="PopoverPanelContext";function tt(){return te(pe)}function ot(t,a){return W(a.type,et,t,a)}let rt="div";function nt(t,a){var g;let{__demoMode:u=!1,...C}=t,T=z(null),S=J(a,Ne(o=>{T.current=o})),i=z([]),l=Fe(ot,{__demoMode:u,popoverState:u?0:1,buttons:i,button:null,buttonId:null,panel:null,panelId:null,beforePanelSentinel:se(),afterPanelSentinel:se(),afterButtonSentinel:se()}),[{popoverState:f,button:e,buttonId:P,panel:v,panelId:_,beforePanelSentinel:y,afterPanelSentinel:j,afterButtonSentinel:n},s]=l,E=ue((g=T.current)!=null?g:e),x=G(()=>{if(!e||!v)return!1;for(let M of document.querySelectorAll("body > *"))if(Number(M==null?void 0:M.contains(e))^Number(M==null?void 0:M.contains(v)))return!0;let o=de(),p=o.indexOf(e),r=(p+o.length-1)%o.length,c=(p+1)%o.length,m=o[r],O=o[c];return!v.contains(m)&&!v.contains(O)},[e,v]),L=be(P),h=be(_),F=G(()=>({buttonId:L,panelId:h,close:()=>s({type:1})}),[L,h,s]),R=Re(),D=R==null?void 0:R.registerPopover,I=A(()=>{var o;return(o=R==null?void 0:R.isFocusWithinPopoverGroup())!=null?o:(E==null?void 0:E.activeElement)&&((e==null?void 0:e.contains(E.activeElement))||(v==null?void 0:v.contains(E.activeElement)))});oe(()=>D==null?void 0:D(F),[D,F]);let[K,$]=ze(),H=Ge({mainTreeNodeRef:R==null?void 0:R.mainTreeNodeRef,portals:K,defaultContainers:[e,v]});xe(E==null?void 0:E.defaultView,"focus",o=>{var p,r,c,m,O,M;o.target!==window&&o.target instanceof HTMLElement&&f===0&&(I()||e&&v&&(H.contains(o.target)||(r=(p=y.current)==null?void 0:p.contains)!=null&&r.call(p,o.target)||(m=(c=j.current)==null?void 0:c.contains)!=null&&m.call(c,o.target)||(M=(O=n.current)==null?void 0:O.contains)!=null&&M.call(O,o.target)||s({type:1})))},!0),Be(f===0,H.resolveContainers,(o,p)=>{s({type:1}),Je(p,$e.Loose)||(o.preventDefault(),e==null||e.focus())});let B=A(o=>{s({type:1});let p=(()=>o?o instanceof HTMLElement?o:"current"in o&&o.current instanceof HTMLElement?o.current:e:e)();p==null||p.focus()}),N=G(()=>({close:B,isPortalled:x}),[B,x]),q=G(()=>({open:f===0,close:B}),[f,B]),d={ref:S};return b.createElement(Ue,null,b.createElement(pe.Provider,{value:null},b.createElement(ve.Provider,{value:l},b.createElement(ae.Provider,{value:N},b.createElement(ke,{value:B},b.createElement(Ke,{value:W(f,{[0]:X.Open,[1]:X.Closed})},b.createElement($,null,Z({ourProps:d,theirProps:C,slot:q,defaultTag:rt,name:"Popover"}),b.createElement(H.MainTreeNode,null))))))))}let lt="button";function at(t,a){let u=re(),{id:C=`headlessui-popover-button-${u}`,disabled:T=!1,autoFocus:S=!1,...i}=t,[l,f]=le("Popover.Button"),{isPortalled:e}=Te("Popover.Button"),P=z(null),v=`headlessui-focus-sentinel-${re()}`,_=Re(),y=_==null?void 0:_.closeOthers,n=tt()!==null;oe(()=>{if(!n)return f({type:3,buttonId:C}),()=>{f({type:3,buttonId:null})}},[n,C,f]);let[s]=Ee(()=>Symbol()),E=J(P,a,Ve(),n?null:r=>{if(r)l.buttons.current.push(s);else{let c=l.buttons.current.indexOf(s);c!==-1&&l.buttons.current.splice(c,1)}l.buttons.current.length>1&&console.warn("You are already using a <Popover.Button /> but only 1 <Popover.Button /> is supported."),r&&f({type:2,button:r})}),x=J(P,a),L=ue(P),h=A(r=>{var c,m,O;if(n){if(l.popoverState===1)return;switch(r.key){case V.Space:case V.Enter:r.preventDefault(),(m=(c=r.target).click)==null||m.call(c),f({type:1}),(O=l.button)==null||O.focus();break}}else switch(r.key){case V.Space:case V.Enter:r.preventDefault(),r.stopPropagation(),l.popoverState===1&&(y==null||y(l.buttonId)),f({type:0});break;case V.Escape:if(l.popoverState!==0)return y==null?void 0:y(l.buttonId);if(!P.current||L!=null&&L.activeElement&&!P.current.contains(L.activeElement))return;r.preventDefault(),r.stopPropagation(),f({type:1});break}}),F=A(r=>{n||r.key===V.Space&&r.preventDefault()}),R=A(r=>{var c,m;Ae(r.currentTarget)||T||(n?(f({type:1}),(c=l.button)==null||c.focus()):(r.preventDefault(),r.stopPropagation(),l.popoverState===1&&(y==null||y(l.buttonId)),f({type:0}),(m=l.button)==null||m.focus()))}),D=A(r=>{r.preventDefault(),r.stopPropagation()}),{isFocusVisible:I,focusProps:K}=Oe({autoFocus:S}),{isHovered:$,hoverProps:H}=Ce({isDisabled:T}),{pressed:Y,pressProps:B}=Me({disabled:T}),N=l.popoverState===0,q=G(()=>({open:N,active:Y||N,disabled:T,hover:$,focus:I,autofocus:S}),[N,$,I,Y,T,S]),d=he(t,P),g=n?ce({ref:x,type:d,onKeyDown:h,onClick:R,disabled:T||void 0,autoFocus:S},K,H,B):ce({ref:E,id:l.buttonId,type:d,"aria-expanded":l.popoverState===0,"aria-controls":l.panel?l.panelId:void 0,disabled:T||void 0,autoFocus:S,onKeyDown:h,onKeyUp:F,onClick:R,onMouseDown:D},K,H,B),o=ge(),p=A(()=>{let r=l.panel;if(!r)return;function c(){W(o.current,{[k.Forwards]:()=>w(r,U.First),[k.Backwards]:()=>w(r,U.Last)})===Pe.Error&&w(de().filter(O=>O.dataset.headlessuiFocusGuard!=="true"),W(o.current,{[k.Forwards]:U.Next,[k.Backwards]:U.Previous}),{relativeTo:l.button})}c()});return b.createElement(b.Fragment,null,Z({ourProps:g,theirProps:i,slot:q,defaultTag:lt,name:"Popover.Button"}),N&&!n&&e&&b.createElement(ie,{id:v,ref:l.afterButtonSentinel,features:fe.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:p}))}let pt="div",st=ne.RenderStrategy|ne.Static;function ut(t,a){let u=re(),{id:C=`headlessui-popover-overlay-${u}`,...T}=t,[{popoverState:S},i]=le("Popover.Overlay"),l=J(a),f=Se(),e=(()=>f!==null?(f&X.Open)===X.Open:S===0)(),P=A(y=>{if(Ae(y.currentTarget))return y.preventDefault();i({type:1})}),v=G(()=>({open:S===0}),[S]);return Z({ourProps:{ref:l,id:C,"aria-hidden":!0,onClick:P},theirProps:T,slot:v,defaultTag:pt,features:st,visible:e,name:"Popover.Overlay"})}let it="div",ft=ne.RenderStrategy|ne.Static;function Pt(t,a){let u=re(),{id:C=`headlessui-popover-panel-${u}`,focus:T=!1,anchor:S,portal:i=!1,modal:l=!1,...f}=t,[e,P]=le("Popover.Panel"),{close:v,isPortalled:_}=Te("Popover.Panel"),y=`headlessui-focus-sentinel-before-${u}`,j=`headlessui-focus-sentinel-after-${u}`,n=z(null),s=je(S),[E,x]=we(s),L=We();s&&(i=!0);let h=J(n,a,s?E:null,d=>{P({type:4,panel:d})}),F=ue(n),R=Ye();Le(()=>(P({type:5,panelId:C}),()=>{P({type:5,panelId:null})}),[C,P]);let D=Se(),I=(()=>D!==null?(D&X.Open)===X.Open:e.popoverState===0)();Ie(I,e.button,()=>{P({type:1})});let K=e.__demoMode?!1:l&&I;He(K,F);let $=A(d=>{var g;switch(d.key){case V.Escape:if(e.popoverState!==0||!n.current||F!=null&&F.activeElement&&!n.current.contains(F.activeElement))return;d.preventDefault(),d.stopPropagation(),P({type:1}),(g=e.button)==null||g.focus();break}});oe(()=>{var d;t.static||e.popoverState===1&&((d=t.unmount)==null||d)&&P({type:4,panel:null})},[e.popoverState,t.unmount,t.static,P]),oe(()=>{if(e.__demoMode||!T||e.popoverState!==0||!n.current)return;let d=F==null?void 0:F.activeElement;n.current.contains(d)||w(n.current,U.First)},[e.__demoMode,T,n,e.popoverState]);let H=G(()=>({open:e.popoverState===0,close:v}),[e,v]),Y=ce(s?L():{},{ref:h,id:C,onKeyDown:$,onBlur:T&&e.popoverState===0?d=>{var o,p,r,c,m;let g=d.relatedTarget;g&&n.current&&((o=n.current)!=null&&o.contains(g)||(P({type:1}),((r=(p=e.beforePanelSentinel.current)==null?void 0:p.contains)!=null&&r.call(p,g)||(m=(c=e.afterPanelSentinel.current)==null?void 0:c.contains)!=null&&m.call(c,g))&&g.focus({preventScroll:!0})))}:void 0,tabIndex:-1,style:{...x,"--button-width":_e(e.button,!0).width}}),B=ge(),N=A(()=>{let d=n.current;if(!d)return;function g(){W(B.current,{[k.Forwards]:()=>{var p;w(d,U.First)===Pe.Error&&((p=e.afterPanelSentinel.current)==null||p.focus())},[k.Backwards]:()=>{var o;(o=e.button)==null||o.focus({preventScroll:!0})}})}g()}),q=A(()=>{let d=n.current;if(!d)return;function g(){W(B.current,{[k.Forwards]:()=>{var O;if(!e.button)return;let o=de(),p=o.indexOf(e.button),r=o.slice(0,p+1),m=[...o.slice(p+1),...r];for(let M of m.slice())if(M.dataset.headlessuiFocusGuard==="true"||(O=e.panel)!=null&&O.contains(M)){let ye=m.indexOf(M);ye!==-1&&m.splice(ye,1)}w(m,U.First,{sorted:!1})},[k.Backwards]:()=>{var p;w(d,U.Previous)===Pe.Error&&((p=e.button)==null||p.focus())}})}g()});return b.createElement(pe.Provider,{value:C},b.createElement(ae.Provider,{value:{close:v,isPortalled:_}},b.createElement(qe,{enabled:i?t.static||I:!1},I&&_&&b.createElement(ie,{id:y,ref:e.beforePanelSentinel,features:fe.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:N}),Z({mergeRefs:R,ourProps:Y,theirProps:f,slot:H,defaultTag:it,features:ft,visible:I,name:"Popover.Panel"}),I&&_&&b.createElement(ie,{id:j,ref:e.afterPanelSentinel,features:fe.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:q}))))}let dt="div";function ct(t,a){let u=z(null),C=J(u,a),[T,S]=Ee([]),i=De(),l=A(n=>{S(s=>{let E=s.indexOf(n);if(E!==-1){let x=s.slice();return x.splice(E,1),x}return s})}),f=A(n=>(S(s=>[...s,n]),()=>l(n))),e=A(()=>{var E;let n=Xe(u);if(!n)return!1;let s=n.activeElement;return(E=u.current)!=null&&E.contains(s)?!0:T.some(x=>{var L,h;return((L=n.getElementById(x.buttonId.current))==null?void 0:L.contains(s))||((h=n.getElementById(x.panelId.current))==null?void 0:h.contains(s))})}),P=A(n=>{for(let s of T)s.buttonId.current!==n&&s.close()}),v=G(()=>({registerPopover:f,unregisterPopover:l,isFocusWithinPopoverGroup:e,closeOthers:P,mainTreeNodeRef:i.mainTreeNodeRef}),[f,l,e,P,i.mainTreeNodeRef]),_=G(()=>({}),[]),y=t,j={ref:C};return b.createElement(me.Provider,{value:v},Z({ourProps:j,theirProps:y,slot:_,defaultTag:dt,name:"Popover.Group"}),b.createElement(i.MainTreeNode,null))}let vt=Q(nt),Tt=Q(at),mt=Q(ut),yt=Q(Pt),Et=Q(ct),zt=Object.assign(vt,{Button:Tt,Overlay:mt,Panel:yt,Group:Et});export{zt as Popover,Tt as PopoverButton,Et as PopoverGroup,mt as PopoverOverlay,yt as PopoverPanel}; | ||
"use client";import{useFocusRing as Me}from"@react-aria/focus";import{useHover as xe}from"@react-aria/interactions";import E,{createContext as ee,createRef as ie,useContext as te,useEffect as oe,useMemo as L,useReducer as Oe,useRef as X,useState as ge}from"react";import{useActivePress as Le}from'../../hooks/use-active-press.js';import{useElementSize as Ie}from'../../hooks/use-element-size.js';import{useEvent as A}from'../../hooks/use-event.js';import{useEventListener as De}from'../../hooks/use-event-listener.js';import{useId as re}from'../../hooks/use-id.js';import{useIsoMorphicEffect as he}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as Se}from'../../hooks/use-latest-value.js';import{useOnDisappear as ke}from'../../hooks/use-on-disappear.js';import{useOutsideClick as Ge}from'../../hooks/use-outside-click.js';import{useOwnerDocument as ue}from'../../hooks/use-owner.js';import{useResolveButtonType as He}from'../../hooks/use-resolve-button-type.js';import{useMainTreeNode as Ne,useRootContainers as Ue}from'../../hooks/use-root-containers.js';import{useScrollLock as we}from'../../hooks/use-scroll-lock.js';import{optionalRef as Ke,useSyncRefs as q}from'../../hooks/use-sync-refs.js';import{Direction as G,useTabDirection as Ae}from'../../hooks/use-tab-direction.js';import{useTransition as Re}from'../../hooks/use-transition.js';import{CloseProvider as We}from'../../internal/close-provider.js';import{FloatingProvider as je,useFloatingPanel as Ve,useFloatingPanelProps as $e,useFloatingReference as Je,useResolvedAnchor as Xe}from'../../internal/floating.js';import{Hidden as de,HiddenFeatures as fe}from'../../internal/hidden.js';import{OpenClosedProvider as qe,ResetOpenClosedProvider as ze,State as z,useOpenClosed as Ce}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as Be}from'../../utils/bugs.js';import{Focus as H,FocusResult as Pe,FocusableMode as Ye,focusIn as w,getFocusableElements as ce,isFocusableElement as Qe}from'../../utils/focus-management.js';import{match as K}from'../../utils/match.js';import'../../utils/micro-task.js';import{getOwnerDocument as Ze}from'../../utils/owner.js';import{RenderFeatures as ne,forwardRefWithAs as Y,mergeProps as ve,render as Z,useMergeRefsFn as et}from'../../utils/render.js';import{Keys as W}from'../keyboard.js';import{Portal as tt,useNestedPortals as ot}from'../portal/portal.js';var rt=(d=>(d[d.Open=0]="Open",d[d.Closed=1]="Closed",d))(rt||{}),nt=(i=>(i[i.TogglePopover=0]="TogglePopover",i[i.ClosePopover=1]="ClosePopover",i[i.SetButton=2]="SetButton",i[i.SetButtonId=3]="SetButtonId",i[i.SetPanel=4]="SetPanel",i[i.SetPanelId=5]="SetPanelId",i))(nt||{});let lt={[0]:t=>({...t,popoverState:K(t.popoverState,{[0]:1,[1]:0}),__demoMode:!1}),[1](t){return t.popoverState===1?t:{...t,popoverState:1,__demoMode:!1}},[2](t,a){return t.button===a.button?t:{...t,button:a.button}},[3](t,a){return t.buttonId===a.buttonId?t:{...t,buttonId:a.buttonId}},[4](t,a){return t.panel===a.panel?t:{...t,panel:a.panel}},[5](t,a){return t.panelId===a.panelId?t:{...t,panelId:a.panelId}}},Te=ee(null);Te.displayName="PopoverContext";function le(t){let a=te(Te);if(a===null){let d=new Error(`<${t} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(d,le),d}return a}let ae=ee(null);ae.displayName="PopoverAPIContext";function me(t){let a=te(ae);if(a===null){let d=new Error(`<${t} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(d,me),d}return a}let ye=ee(null);ye.displayName="PopoverGroupContext";function _e(){return te(ye)}let pe=ee(null);pe.displayName="PopoverPanelContext";function at(){return te(pe)}function pt(t,a){return K(a.type,lt,t,a)}let st="div";function it(t,a){var J;let{__demoMode:d=!1,...B}=t,m=X(null),R=q(a,Ke(e=>{m.current=e})),i=X([]),l=Oe(pt,{__demoMode:d,popoverState:d?0:1,buttons:i,button:null,buttonId:null,panel:null,panelId:null,beforePanelSentinel:ie(),afterPanelSentinel:ie(),afterButtonSentinel:ie()}),[{popoverState:c,button:f,buttonId:r,panel:u,panelId:C,beforePanelSentinel:y,afterPanelSentinel:I,afterButtonSentinel:P},n]=l,v=ue((J=m.current)!=null?J:f),_=L(()=>{if(!f||!u)return!1;for(let g of document.querySelectorAll("body > *"))if(Number(g==null?void 0:g.contains(f))^Number(g==null?void 0:g.contains(u)))return!0;let e=ce(),s=e.indexOf(f),o=(s+e.length-1)%e.length,p=(s+1)%e.length,S=e[o],b=e[p];return!u.contains(S)&&!u.contains(b)},[f,u]),F=Se(r),x=Se(C),j=L(()=>({buttonId:F,panelId:x,close:()=>n({type:1})}),[F,x,n]),T=_e(),D=T==null?void 0:T.registerPopover,N=A(()=>{var e;return(e=T==null?void 0:T.isFocusWithinPopoverGroup())!=null?e:(v==null?void 0:v.activeElement)&&((f==null?void 0:f.contains(v.activeElement))||(u==null?void 0:u.contains(v.activeElement)))});oe(()=>D==null?void 0:D(j),[D,j]);let[M,U]=ot(),h=Ue({mainTreeNodeRef:T==null?void 0:T.mainTreeNodeRef,portals:M,defaultContainers:[f,u]});De(v==null?void 0:v.defaultView,"focus",e=>{var s,o,p,S,b,g;e.target!==window&&e.target instanceof HTMLElement&&c===0&&(N()||f&&u&&(h.contains(e.target)||(o=(s=y.current)==null?void 0:s.contains)!=null&&o.call(s,e.target)||(S=(p=I.current)==null?void 0:p.contains)!=null&&S.call(p,e.target)||(g=(b=P.current)==null?void 0:b.contains)!=null&&g.call(b,e.target)||n({type:1})))},!0),Ge(c===0,h.resolveContainers,(e,s)=>{n({type:1}),Qe(s,Ye.Loose)||(e.preventDefault(),f==null||f.focus())});let O=A(e=>{n({type:1});let s=(()=>e?e instanceof HTMLElement?e:"current"in e&&e.current instanceof HTMLElement?e.current:f:f)();s==null||s.focus()}),k=L(()=>({close:O,isPortalled:_}),[O,_]),V=L(()=>({open:c===0,close:O}),[c,O]),$={ref:R};return E.createElement(je,null,E.createElement(pe.Provider,{value:null},E.createElement(Te.Provider,{value:l},E.createElement(ae.Provider,{value:k},E.createElement(We,{value:O},E.createElement(qe,{value:K(c,{[0]:z.Open,[1]:z.Closed})},E.createElement(U,null,Z({ourProps:$,theirProps:B,slot:V,defaultTag:st,name:"Popover"}),E.createElement(h.MainTreeNode,null))))))))}let ut="button";function dt(t,a){let d=re(),{id:B=`headlessui-popover-button-${d}`,disabled:m=!1,autoFocus:R=!1,...i}=t,[l,c]=le("Popover.Button"),{isPortalled:f}=me("Popover.Button"),r=X(null),u=`headlessui-focus-sentinel-${re()}`,C=_e(),y=C==null?void 0:C.closeOthers,P=at()!==null;oe(()=>{if(!P)return c({type:3,buttonId:B}),()=>{c({type:3,buttonId:null})}},[P,B,c]);let[n]=ge(()=>Symbol()),v=q(r,a,Je(),P?null:o=>{if(o)l.buttons.current.push(n);else{let p=l.buttons.current.indexOf(n);p!==-1&&l.buttons.current.splice(p,1)}l.buttons.current.length>1&&console.warn("You are already using a <Popover.Button /> but only 1 <Popover.Button /> is supported."),o&&c({type:2,button:o})}),_=q(r,a),F=ue(r),x=A(o=>{var p,S,b;if(P){if(l.popoverState===1)return;switch(o.key){case W.Space:case W.Enter:o.preventDefault(),(S=(p=o.target).click)==null||S.call(p),c({type:1}),(b=l.button)==null||b.focus();break}}else switch(o.key){case W.Space:case W.Enter:o.preventDefault(),o.stopPropagation(),l.popoverState===1&&(y==null||y(l.buttonId)),c({type:0});break;case W.Escape:if(l.popoverState!==0)return y==null?void 0:y(l.buttonId);if(!r.current||F!=null&&F.activeElement&&!r.current.contains(F.activeElement))return;o.preventDefault(),o.stopPropagation(),c({type:1});break}}),j=A(o=>{P||o.key===W.Space&&o.preventDefault()}),T=A(o=>{var p,S;Be(o.currentTarget)||m||(P?(c({type:1}),(p=l.button)==null||p.focus()):(o.preventDefault(),o.stopPropagation(),l.popoverState===1&&(y==null||y(l.buttonId)),c({type:0}),(S=l.button)==null||S.focus()))}),D=A(o=>{o.preventDefault(),o.stopPropagation()}),{isFocusVisible:N,focusProps:M}=Me({autoFocus:R}),{isHovered:U,hoverProps:h}=xe({isDisabled:m}),{pressed:Q,pressProps:O}=Le({disabled:m}),k=l.popoverState===0,V=L(()=>({open:k,active:Q||k,disabled:m,hover:U,focus:N,autofocus:R}),[k,U,N,Q,m,R]),$=He(t,r),J=P?ve({ref:_,type:$,onKeyDown:x,onClick:T,disabled:m||void 0,autoFocus:R},M,h,O):ve({ref:v,id:l.buttonId,type:$,"aria-expanded":l.popoverState===0,"aria-controls":l.panel?l.panelId:void 0,disabled:m||void 0,autoFocus:R,onKeyDown:x,onKeyUp:j,onClick:T,onMouseDown:D},M,h,O),e=Ae(),s=A(()=>{let o=l.panel;if(!o)return;function p(){K(e.current,{[G.Forwards]:()=>w(o,H.First),[G.Backwards]:()=>w(o,H.Last)})===Pe.Error&&w(ce().filter(b=>b.dataset.headlessuiFocusGuard!=="true"),K(e.current,{[G.Forwards]:H.Next,[G.Backwards]:H.Previous}),{relativeTo:l.button})}p()});return E.createElement(E.Fragment,null,Z({ourProps:J,theirProps:i,slot:V,defaultTag:ut,name:"Popover.Button"}),k&&!P&&f&&E.createElement(de,{id:u,ref:l.afterButtonSentinel,features:fe.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:s}))}let ft="div",Pt=ne.RenderStrategy|ne.Static;function Fe(t,a){let d=re(),{id:B=`headlessui-popover-backdrop-${d}`,transition:m=!1,...R}=t,[{popoverState:i},l]=le("Popover.Backdrop"),c=X(null),f=q(a,c),r=Ce(),[u,C]=Re(m,c,r!==null?(r&z.Open)===z.Open:i===0),y=A(n=>{if(Be(n.currentTarget))return n.preventDefault();l({type:1})}),I=L(()=>({open:i===0,...C}),[i,C]);return Z({ourProps:{ref:f,id:B,"aria-hidden":!0,onClick:y},theirProps:R,slot:I,defaultTag:ft,features:Pt,visible:u,name:"Popover.Backdrop"})}let ct="div",vt=ne.RenderStrategy|ne.Static;function Tt(t,a){let d=re(),{id:B=`headlessui-popover-panel-${d}`,focus:m=!1,anchor:R,portal:i=!1,modal:l=!1,transition:c=!1,...f}=t,[r,u]=le("Popover.Panel"),{close:C,isPortalled:y}=me("Popover.Panel"),I=`headlessui-focus-sentinel-before-${d}`,P=`headlessui-focus-sentinel-after-${d}`,n=X(null),v=Xe(R),[_,F]=Ve(v),x=$e();v&&(i=!0);let j=q(n,a,v?_:null,e=>{u({type:4,panel:e})}),T=ue(n),D=et();he(()=>(u({type:5,panelId:B}),()=>{u({type:5,panelId:null})}),[B,u]);let N=Ce(),[M,U]=Re(c,n,N!==null?(N&z.Open)===z.Open:r.popoverState===0);ke(M,r.button,()=>{u({type:1})});let h=r.__demoMode?!1:l&&M;we(h,T);let Q=A(e=>{var s;switch(e.key){case W.Escape:if(r.popoverState!==0||!n.current||T!=null&&T.activeElement&&!n.current.contains(T.activeElement))return;e.preventDefault(),e.stopPropagation(),u({type:1}),(s=r.button)==null||s.focus();break}});oe(()=>{var e;t.static||r.popoverState===1&&((e=t.unmount)==null||e)&&u({type:4,panel:null})},[r.popoverState,t.unmount,t.static,u]),oe(()=>{if(r.__demoMode||!m||r.popoverState!==0||!n.current)return;let e=T==null?void 0:T.activeElement;n.current.contains(e)||w(n.current,H.First)},[r.__demoMode,m,n,r.popoverState]);let O=L(()=>({open:r.popoverState===0,close:C,...U}),[r.popoverState,C,U]),k=ve(v?x():{},{ref:j,id:B,onKeyDown:Q,onBlur:m&&r.popoverState===0?e=>{var o,p,S,b,g;let s=e.relatedTarget;s&&n.current&&((o=n.current)!=null&&o.contains(s)||(u({type:1}),((S=(p=r.beforePanelSentinel.current)==null?void 0:p.contains)!=null&&S.call(p,s)||(g=(b=r.afterPanelSentinel.current)==null?void 0:b.contains)!=null&&g.call(b,s))&&s.focus({preventScroll:!0})))}:void 0,tabIndex:-1,style:{...f.style,...F,"--button-width":Ie(r.button,!0).width}}),V=Ae(),$=A(()=>{let e=n.current;if(!e)return;function s(){K(V.current,{[G.Forwards]:()=>{var p;w(e,H.First)===Pe.Error&&((p=r.afterPanelSentinel.current)==null||p.focus())},[G.Backwards]:()=>{var o;(o=r.button)==null||o.focus({preventScroll:!0})}})}s()}),J=A(()=>{let e=n.current;if(!e)return;function s(){K(V.current,{[G.Forwards]:()=>{var Ee;if(!r.button)return;let o=ce(),p=o.indexOf(r.button),S=o.slice(0,p+1),g=[...o.slice(p+1),...S];for(let se of g.slice())if(se.dataset.headlessuiFocusGuard==="true"||(Ee=r.panel)!=null&&Ee.contains(se)){let be=g.indexOf(se);be!==-1&&g.splice(be,1)}w(g,H.First,{sorted:!1})},[G.Backwards]:()=>{var p;w(e,H.Previous)===Pe.Error&&((p=r.button)==null||p.focus())}})}s()});return E.createElement(ze,null,E.createElement(pe.Provider,{value:B},E.createElement(ae.Provider,{value:{close:C,isPortalled:y}},E.createElement(tt,{enabled:i?t.static||M:!1},M&&y&&E.createElement(de,{id:I,ref:r.beforePanelSentinel,features:fe.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:$}),Z({mergeRefs:D,ourProps:k,theirProps:f,slot:O,defaultTag:ct,features:vt,visible:M,name:"Popover.Panel"}),M&&y&&E.createElement(de,{id:P,ref:r.afterPanelSentinel,features:fe.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:J})))))}let mt="div";function yt(t,a){let d=X(null),B=q(d,a),[m,R]=ge([]),i=Ne(),l=A(P=>{R(n=>{let v=n.indexOf(P);if(v!==-1){let _=n.slice();return _.splice(v,1),_}return n})}),c=A(P=>(R(n=>[...n,P]),()=>l(P))),f=A(()=>{var v;let P=Ze(d);if(!P)return!1;let n=P.activeElement;return(v=d.current)!=null&&v.contains(n)?!0:m.some(_=>{var F,x;return((F=P.getElementById(_.buttonId.current))==null?void 0:F.contains(n))||((x=P.getElementById(_.panelId.current))==null?void 0:x.contains(n))})}),r=A(P=>{for(let n of m)n.buttonId.current!==P&&n.close()}),u=L(()=>({registerPopover:c,unregisterPopover:l,isFocusWithinPopoverGroup:f,closeOthers:r,mainTreeNodeRef:i.mainTreeNodeRef}),[c,l,f,r,i.mainTreeNodeRef]),C=L(()=>({}),[]),y=t,I={ref:B};return E.createElement(ye.Provider,{value:u},Z({ourProps:I,theirProps:y,slot:C,defaultTag:mt,name:"Popover.Group"}),E.createElement(i.MainTreeNode,null))}let Et=Y(it),bt=Y(dt),gt=Y(Fe),St=Y(Fe),At=Y(Tt),Rt=Y(yt),ro=Object.assign(Et,{Button:bt,Backdrop:St,Overlay:gt,Panel:At,Group:Rt});export{ro as Popover,St as PopoverBackdrop,bt as PopoverButton,Rt as PopoverGroup,gt as PopoverOverlay,At as PopoverPanel}; |
@@ -24,2 +24,3 @@ import React, { type ElementType, type MutableRefObject, type Ref } from 'react'; | ||
export type TransitionChildProps<TTag extends ReactTag> = Props<TTag, TransitionChildRenderPropArg, TransitionChildPropsWeControl, PropsForFeatures<typeof TransitionChildRenderFeatures> & TransitionClasses & TransitionEvents & { | ||
transition?: boolean; | ||
appear?: boolean; | ||
@@ -26,0 +27,0 @@ }>; |
@@ -1,1 +0,1 @@ | ||
"use client";import T,{Fragment as B,createContext as oe,useContext as z,useMemo as se,useRef as E,useState as K}from"react";import{useDisposables as be}from'../../hooks/use-disposables.js';import{useEvent as S}from'../../hooks/use-event.js';import{useFlags as Ee}from'../../hooks/use-flags.js';import{useIsMounted as Se}from'../../hooks/use-is-mounted.js';import{useIsoMorphicEffect as I}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as O}from'../../hooks/use-latest-value.js';import{useOnDisappear as Ne}from'../../hooks/use-on-disappear.js';import{useServerHandoffComplete as ae}from'../../hooks/use-server-handoff-complete.js';import{useSyncRefs as le}from'../../hooks/use-sync-refs.js';import{useTransition as ye}from'../../hooks/use-transition.js';import{OpenClosedProvider as Re,State as N,useOpenClosed as ue}from'../../internal/open-closed.js';import{classNames as Q}from'../../utils/class-names.js';import{match as D}from'../../utils/match.js';import{RenderFeatures as Pe,RenderStrategy as x,forwardRefWithAs as Y,render as Te}from'../../utils/render.js';function y(t=""){return t.split(/\s+/).filter(n=>n.length>1)}function de(t){var n;return!!(t.enter||t.enterFrom||t.enterTo||t.leave||t.leaveFrom||t.leaveTo)||((n=t.as)!=null?n:me)!==B||T.Children.count(t.children)===1}let W=oe(null);W.displayName="TransitionContext";var xe=(r=>(r.Visible="visible",r.Hidden="hidden",r))(xe||{});function Fe(){let t=z(W);if(t===null)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");return t}function _e(){let t=z(k);if(t===null)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");return t}let k=oe(null);k.displayName="NestingContext";function q(t){return"children"in t?q(t.children):t.current.filter(({el:n})=>n.current!==null).filter(({state:n})=>n==="visible").length>0}function fe(t,n){let r=O(t),a=E([]),H=Se(),L=be(),d=S((i,e=x.Hidden)=>{let o=a.current.findIndex(({el:s})=>s===i);o!==-1&&(D(e,{[x.Unmount](){a.current.splice(o,1)},[x.Hidden](){a.current[o].state="hidden"}}),L.microTask(()=>{var s;!q(a)&&H.current&&((s=r.current)==null||s.call(r))}))}),F=S(i=>{let e=a.current.find(({el:o})=>o===i);return e?e.state!=="visible"&&(e.state="visible"):a.current.push({el:i,state:"visible"}),()=>d(i,x.Unmount)}),R=E([]),f=E(Promise.resolve()),C=E({enter:[],leave:[],idle:[]}),m=S((i,e,o)=>{R.current.splice(0),n&&(n.chains.current[e]=n.chains.current[e].filter(([s])=>s!==i)),n==null||n.chains.current[e].push([i,new Promise(s=>{R.current.push(s)})]),n==null||n.chains.current[e].push([i,new Promise(s=>{Promise.all(C.current[e].map(([g,c])=>c)).then(()=>s())})]),e==="enter"?f.current=f.current.then(()=>n==null?void 0:n.wait.current).then(()=>o(e)):o(e)}),h=S((i,e,o)=>{Promise.all(C.current[e].splice(0).map(([s,g])=>g)).then(()=>{var s;(s=R.current.shift())==null||s()}).then(()=>o(e))});return se(()=>({children:a,register:F,unregister:d,onStart:m,onStop:h,wait:f,chains:C}),[F,d,a,m,h,C,f])}let me=B,ce=Pe.RenderStrategy;function De(t,n){var ne,re,ie;let{beforeEnter:r,afterEnter:a,beforeLeave:H,afterLeave:L,enter:d,enterFrom:F,enterTo:R,entered:f,leave:C,leaveFrom:m,leaveTo:h,...i}=t,e=E(null),o=de(t),s=le(...o?[e,n]:n===null?[]:[n]),g=(ne=i.unmount)==null||ne?x.Unmount:x.Hidden,{show:c,appear:V,initial:v}=Fe(),[P,J]=K(c?"visible":"hidden"),$=_e(),{register:w,unregister:M}=$;I(()=>w(e),[w,e]),I(()=>{if(g===x.Hidden&&e.current){if(c&&P!=="visible"){J("visible");return}return D(P,{["hidden"]:()=>M(e),["visible"]:()=>w(e)})}},[P,e,w,M,c,g]);let _=O({base:y(i.className),enter:y(d),enterFrom:y(F),enterTo:y(R),entered:y(f),leave:y(C),leaveFrom:y(m),leaveTo:y(h)}),U=O({beforeEnter:r,afterEnter:a,beforeLeave:H,afterLeave:L}),X=ae();I(()=>{if(o&&X&&P==="visible"&&e.current===null)throw new Error("Did you forget to passthrough the `ref` to the actual DOM node?")},[e,P,X,o]);let Ce=v&&!V,ee=V&&c&&v,te=(()=>ee?"enter":!X||Ce?"idle":c?"enter":"leave")(),A=Ee(0),he=S(b=>D(b,{enter:()=>{var l,u;A.addFlag(N.Opening),(u=(l=U.current).beforeEnter)==null||u.call(l)},leave:()=>{var l,u;A.addFlag(N.Closing),(u=(l=U.current).beforeLeave)==null||u.call(l)},idle:()=>{}})),ge=S(b=>D(b,{enter:()=>{var l,u;A.removeFlag(N.Opening),(u=(l=U.current).afterEnter)==null||u.call(l)},leave:()=>{var l,u;A.removeFlag(N.Closing),(u=(l=U.current).afterLeave)==null||u.call(l)},idle:()=>{}})),j=E(!1),G=fe(()=>{j.current||(J("hidden"),M(e))},$);ye({container:e,classes:_,direction:te,onStart:O(b=>{j.current=!0,G.onStart(e,b,he)}),onStop:O(b=>{j.current=!1,G.onStop(e,b,ge),b==="leave"&&!q(G)&&(J("hidden"),M(e))})});let p=i,ve={ref:s};return ee?p={...p,className:Q(i.className,..._.current.enter,..._.current.enterFrom)}:j.current?(p.className=Q(i.className,(re=e.current)==null?void 0:re.className),p.className===""&&delete p.className):(p.className=Q(i.className,(ie=e.current)==null?void 0:ie.className,...D(te,{enter:[..._.current.enterTo,..._.current.entered],leave:_.current.leaveTo,idle:[]})),p.className===""&&delete p.className),T.createElement(k.Provider,{value:G},T.createElement(Re,{value:D(P,{["visible"]:N.Open,["hidden"]:N.Closed})|A.flags},Te({ourProps:ve,theirProps:p,defaultTag:me,features:ce,visible:P==="visible",name:"Transition.Child"})))}function He(t,n){let{show:r,appear:a=!1,unmount:H=!0,...L}=t,d=E(null),F=de(t),R=le(...F?[d,n]:n===null?[]:[n]);ae();let f=ue();if(r===void 0&&f!==null&&(r=(f&N.Open)===N.Open),r===void 0)throw new Error("A <Transition /> is used but it is missing a `show={true | false}` prop.");let[C,m]=K(r?"visible":"hidden"),h=fe(()=>{r||m("hidden")}),[i,e]=K(!0),o=E([r]);I(()=>{i!==!1&&o.current[o.current.length-1]!==r&&(o.current.push(r),e(!1))},[o,r]);let s=se(()=>({show:r,appear:a,initial:i}),[r,a,i]);Ne(r,d,()=>m("hidden")),I(()=>{r?m("visible"):!q(h)&&d.current!==null&&m("hidden")},[r,h]);let g={unmount:H},c=S(()=>{var v;i&&e(!1),(v=t.beforeEnter)==null||v.call(t)}),V=S(()=>{var v;i&&e(!1),(v=t.beforeLeave)==null||v.call(t)});return T.createElement(k.Provider,{value:h},T.createElement(W.Provider,{value:s},Te({ourProps:{...g,as:B,children:T.createElement(pe,{ref:R,...g,...L,beforeEnter:c,beforeLeave:V})},theirProps:{},defaultTag:B,features:ce,visible:C==="visible",name:"Transition"})))}function Le(t,n){let r=z(W)!==null,a=ue()!==null;return T.createElement(T.Fragment,null,!r&&a?T.createElement(Z,{ref:n,...t}):T.createElement(pe,{ref:n,...t}))}let Z=Y(He),pe=Y(De),Ae=Y(Le),Ke=Object.assign(Z,{Child:Ae,Root:Z});export{Ke as Transition,Ae as TransitionChild}; | ||
"use client";import d,{Fragment as O,createContext as ee,useContext as W,useEffect as pe,useMemo as te,useRef as v,useState as k}from"react";import{useDisposables as Ce}from'../../hooks/use-disposables.js';import{useEvent as b}from'../../hooks/use-event.js';import{useIsMounted as he}from'../../hooks/use-is-mounted.js';import{useIsoMorphicEffect as H}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as ge}from'../../hooks/use-latest-value.js';import{useOnDisappear as ve}from'../../hooks/use-on-disappear.js';import{useServerHandoffComplete as ne}from'../../hooks/use-server-handoff-complete.js';import{useSyncRefs as ie}from'../../hooks/use-sync-refs.js';import{useTransition as be}from'../../hooks/use-transition.js';import{OpenClosedProvider as Se,State as N,useOpenClosed as re}from'../../internal/open-closed.js';import{classNames as Ee}from'../../utils/class-names.js';import{match as oe}from'../../utils/match.js';import{RenderFeatures as ye,RenderStrategy as P,compact as Re,forwardRefWithAs as q,render as se}from'../../utils/render.js';function le(e){var t;return!!(e.enter||e.enterFrom||e.enterTo||e.leave||e.leaveFrom||e.leaveTo)||((t=e.as)!=null?t:ue)!==O||d.Children.count(e.children)===1}let V=ee(null);V.displayName="TransitionContext";var Pe=(i=>(i.Visible="visible",i.Hidden="hidden",i))(Pe||{});function xe(){let e=W(V);if(e===null)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");return e}function Ne(){let e=W(w);if(e===null)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition /> or <Transition.Root />.");return e}let w=ee(null);w.displayName="NestingContext";function M(e){return"children"in e?M(e.children):e.current.filter(({el:t})=>t.current!==null).filter(({state:t})=>t==="visible").length>0}function ae(e,t){let i=ge(e),l=v([]),S=he(),E=Ce(),u=b((s,r=P.Hidden)=>{let n=l.current.findIndex(({el:o})=>o===s);n!==-1&&(oe(r,{[P.Unmount](){l.current.splice(n,1)},[P.Hidden](){l.current[n].state="hidden"}}),E.microTask(()=>{var o;!M(l)&&S.current&&((o=i.current)==null||o.call(i))}))}),y=b(s=>{let r=l.current.find(({el:n})=>n===s);return r?r.state!=="visible"&&(r.state="visible"):l.current.push({el:s,state:"visible"}),()=>u(s,P.Unmount)}),c=v([]),f=v(Promise.resolve()),p=v({enter:[],leave:[]}),m=b((s,r,n)=>{c.current.splice(0),t&&(t.chains.current[r]=t.chains.current[r].filter(([o])=>o!==s)),t==null||t.chains.current[r].push([s,new Promise(o=>{c.current.push(o)})]),t==null||t.chains.current[r].push([s,new Promise(o=>{Promise.all(p.current[r].map(([R,x])=>x)).then(()=>o())})]),r==="enter"?f.current=f.current.then(()=>t==null?void 0:t.wait.current).then(()=>n(r)):n(r)}),C=b((s,r,n)=>{Promise.all(p.current[r].splice(0).map(([o,R])=>R)).then(()=>{var o;(o=c.current.shift())==null||o()}).then(()=>n(r))});return te(()=>({children:l,register:y,unregister:u,onStart:m,onStop:C,wait:f,chains:p}),[y,u,l,m,C,p,f])}let ue=O,Te=ye.RenderStrategy;function _e(e,t){var Z,$;let{transition:i=!0,beforeEnter:l,afterEnter:S,beforeLeave:E,afterLeave:u,enter:y,enterFrom:c,enterTo:f,entered:p,leave:m,leaveFrom:C,leaveTo:s,...r}=e,n=v(null),o=le(e),R=ie(...o?[n,t]:t===null?[]:[t]),x=(Z=r.unmount)==null||Z?P.Unmount:P.Hidden,{show:T,appear:h,initial:X}=xe(),[g,U]=k(T?"visible":"hidden"),z=Ne(),{register:A,unregister:I}=z;H(()=>A(n),[A,n]),H(()=>{if(x===P.Hidden&&n.current){if(T&&g!=="visible"){U("visible");return}return oe(g,{["hidden"]:()=>I(n),["visible"]:()=>A(n)})}},[g,n,A,I,T,x]);let j=ne();H(()=>{if(o&&j&&g==="visible"&&n.current===null)throw new Error("Did you forget to passthrough the `ref` to the actual DOM node?")},[n,g,j,o]);let fe=X&&!h,K=h&&T&&X,G=v(!1),F=ae(()=>{G.current||(U("hidden"),I(n))},z),Q=b(B=>{G.current=!0;let L=B?"enter":"leave";F.onStart(n,L,D=>{D==="enter"?l==null||l():D==="leave"&&(E==null||E())})}),Y=b(B=>{let L=B?"enter":"leave";G.current=!1,F.onStop(n,L,D=>{D==="enter"?S==null||S():D==="leave"&&(u==null||u())}),L==="leave"&&!M(F)&&(U("hidden"),I(n))});pe(()=>{o&&i||(Q(T),Y(T))},[T,o,i]);let me=(()=>!(!i||!o||!j||fe))(),[,a]=be(me,n,T,{start:Q,end:Y}),ce=Re({ref:R,className:(($=Ee(r.className,K&&y,K&&c,a.enter&&y,a.enter&&a.closed&&c,a.enter&&!a.closed&&f,a.leave&&m,a.leave&&!a.closed&&C,a.leave&&a.closed&&s,!a.transition&&T&&p))==null?void 0:$.trim())||void 0}),_=0;return g==="visible"&&(_|=N.Open),g==="hidden"&&(_|=N.Closed),a.enter&&(_|=N.Opening),a.leave&&(_|=N.Closing),d.createElement(w.Provider,{value:F},d.createElement(Se,{value:_},se({ourProps:ce,theirProps:r,slot:a,defaultTag:ue,features:Te,visible:g==="visible",name:"Transition.Child"})))}function De(e,t){let{show:i,appear:l=!1,unmount:S=!0,...E}=e,u=v(null),y=le(e),c=ie(...y?[u,t]:t===null?[]:[t]);ne();let f=re();if(i===void 0&&f!==null&&(i=(f&N.Open)===N.Open),i===void 0)throw new Error("A <Transition /> is used but it is missing a `show={true | false}` prop.");let[p,m]=k(i?"visible":"hidden"),C=ae(()=>{i||m("hidden")}),[s,r]=k(!0),n=v([i]);H(()=>{s!==!1&&n.current[n.current.length-1]!==i&&(n.current.push(i),r(!1))},[n,i]);let o=te(()=>({show:i,appear:l,initial:s}),[i,l,s]);ve(i,u,()=>m("hidden")),H(()=>{i?m("visible"):!M(C)&&u.current!==null&&m("hidden")},[i,C]);let R={unmount:S},x=b(()=>{var h;s&&r(!1),(h=e.beforeEnter)==null||h.call(e)}),T=b(()=>{var h;s&&r(!1),(h=e.beforeLeave)==null||h.call(e)});return d.createElement(w.Provider,{value:C},d.createElement(V.Provider,{value:o},se({ourProps:{...R,as:O,children:d.createElement(de,{ref:c,...R,...E,beforeEnter:x,beforeLeave:T})},theirProps:{},defaultTag:O,features:Te,visible:p==="visible",name:"Transition"})))}function He(e,t){let i=W(V)!==null,l=re()!==null;return d.createElement(d.Fragment,null,!i&&l?d.createElement(J,{ref:t,...e}):d.createElement(de,{ref:t,...e}))}let J=q(De),de=q(_e),Ae=q(He),Je=Object.assign(J,{Child:Ae,Root:J});export{Je as Transition,Ae as TransitionChild}; |
@@ -1,1 +0,1 @@ | ||
export declare function useDocumentOverflowLockedEffect(doc: Document | null, shouldBeLocked: boolean, meta?: (meta: Record<string, any>) => Record<string, any>): boolean; | ||
export declare function useDocumentOverflowLockedEffect(shouldBeLocked: boolean, doc: Document | null, meta?: (meta: Record<string, any>) => Record<string, any>): boolean; |
@@ -1,1 +0,1 @@ | ||
import{useStore as s}from'../../hooks/use-store.js';import{useIsoMorphicEffect as u}from'../use-iso-morphic-effect.js';import{overflows as t}from'./overflow-store.js';function a(e,r,n=()=>({containers:[]})){let f=s(t),o=e?f.get(e):void 0,i=o?o.count>0:!1;return u(()=>{if(!(!e||!r))return t.dispatch("PUSH",e,n),()=>t.dispatch("POP",e,n)},[r,e]),i}export{a as useDocumentOverflowLockedEffect}; | ||
import{useStore as s}from'../../hooks/use-store.js';import{useIsoMorphicEffect as u}from'../use-iso-morphic-effect.js';import{overflows as t}from'./overflow-store.js';function a(r,e,n=()=>({containers:[]})){let f=s(t),o=e?f.get(e):void 0,i=o?o.count>0:!1;return u(()=>{if(!(!e||!r))return t.dispatch("PUSH",e,n),()=>t.dispatch("POP",e,n)},[r,e]),i}export{a as useDocumentOverflowLockedEffect}; |
@@ -1,1 +0,1 @@ | ||
export declare function useDocumentEvent<TType extends keyof DocumentEventMap>(type: TType, listener: (ev: DocumentEventMap[TType]) => any, options?: boolean | AddEventListenerOptions): void; | ||
export declare function useDocumentEvent<TType extends keyof DocumentEventMap>(enabled: boolean, type: TType, listener: (ev: DocumentEventMap[TType]) => any, options?: boolean | AddEventListenerOptions): void; |
@@ -1,1 +0,1 @@ | ||
import{useEffect as m}from"react";import{useLatestValue as c}from'./use-latest-value.js';function d(e,r,n){let o=c(r);m(()=>{function t(u){o.current(u)}return document.addEventListener(e,t,n),()=>document.removeEventListener(e,t,n)},[e,n])}export{d as useDocumentEvent}; | ||
import{useEffect as c}from"react";import{useLatestValue as a}from'./use-latest-value.js';function i(t,e,o,n){let u=a(o);c(()=>{if(!t)return;function r(m){u.current(m)}return document.addEventListener(e,r,n),()=>document.removeEventListener(e,r,n)},[t,e,n])}export{i as useDocumentEvent}; |
export declare function useFlags(initialFlags?: number): { | ||
flags: number; | ||
setFlag: (flag: number) => void; | ||
addFlag: (flag: number) => void; | ||
@@ -4,0 +5,0 @@ hasFlag: (flag: number) => boolean; |
@@ -1,1 +0,1 @@ | ||
import{useCallback as n,useState as f}from"react";import{useIsMounted as i}from'./use-is-mounted.js';function c(a=0){let[l,r]=f(a),t=i(),o=n(e=>{t.current&&r(u=>u|e)},[l,t]),m=n(e=>!!(l&e),[l]),s=n(e=>{t.current&&r(u=>u&~e)},[r,t]),g=n(e=>{t.current&&r(u=>u^e)},[r]);return{flags:l,addFlag:o,hasFlag:m,removeFlag:s,toggleFlag:g}}export{c as useFlags}; | ||
import{useCallback as r,useState as b}from"react";function c(u=0){let[t,l]=b(u),g=r(e=>l(e),[t]),s=r(e=>l(a=>a|e),[t]),m=r(e=>(t&e)===e,[t]),n=r(e=>l(a=>a&~e),[l]),F=r(e=>l(a=>a^e),[l]);return{flags:t,setFlag:g,addFlag:s,hasFlag:m,removeFlag:n,toggleFlag:F}}export{c as useFlags}; |
@@ -1,1 +0,1 @@ | ||
import{disposables as m}from'../utils/disposables.js';import{getOwnerDocument as M}from'../utils/owner.js';import{useIsoMorphicEffect as b}from'./use-iso-morphic-effect.js';let a=new Map,u=new Map;function h(t){var e;let r=(e=u.get(t))!=null?e:0;return u.set(t,r+1),r!==0?()=>p(t):(a.set(t,{"aria-hidden":t.getAttribute("aria-hidden"),inert:t.inert}),t.setAttribute("aria-hidden","true"),t.inert=!0,()=>p(t))}function p(t){var n;let r=(n=u.get(t))!=null?n:1;if(r===1?u.delete(t):u.set(t,r-1),r!==1)return;let e=a.get(t);e&&(e["aria-hidden"]===null?t.removeAttribute("aria-hidden"):t.setAttribute("aria-hidden",e["aria-hidden"]),t.inert=e.inert,a.delete(t))}function T(t,{allowed:r,disallowed:e}={}){b(()=>{var s,c;if(!t)return;let n=m();for(let i of(s=e==null?void 0:e())!=null?s:[])i&&n.add(h(i));let f=(c=r==null?void 0:r())!=null?c:[];for(let i of f){if(!i)continue;let d=M(i);if(!d)continue;let o=i.parentElement;for(;o&&o!==d.body;){for(let l of o.children)f.some(E=>l.contains(E))||n.add(h(l));o=o.parentElement}}return n.dispose},[t,r,e])}export{T as useInertOthers}; | ||
import{disposables as M}from'../utils/disposables.js';import{getOwnerDocument as b}from'../utils/owner.js';import{useIsTopLayer as L}from'./use-is-top-layer.js';import{useIsoMorphicEffect as T}from'./use-iso-morphic-effect.js';let f=new Map,u=new Map;function h(t){var e;let r=(e=u.get(t))!=null?e:0;return u.set(t,r+1),r!==0?()=>m(t):(f.set(t,{"aria-hidden":t.getAttribute("aria-hidden"),inert:t.inert}),t.setAttribute("aria-hidden","true"),t.inert=!0,()=>m(t))}function m(t){var i;let r=(i=u.get(t))!=null?i:1;if(r===1?u.delete(t):u.set(t,r-1),r!==1)return;let e=f.get(t);e&&(e["aria-hidden"]===null?t.removeAttribute("aria-hidden"):t.setAttribute("aria-hidden",e["aria-hidden"]),t.inert=e.inert,f.delete(t))}function y(t,{allowed:r,disallowed:e}={}){let i=L(t,"inert-others");T(()=>{var d,c;if(!i)return;let a=M();for(let n of(d=e==null?void 0:e())!=null?d:[])n&&a.add(h(n));let s=(c=r==null?void 0:r())!=null?c:[];for(let n of s){if(!n)continue;let l=b(n);if(!l)continue;let o=n.parentElement;for(;o&&o!==l.body;){for(let p of o.children)s.some(E=>p.contains(E))||a.add(h(p));o=o.parentElement}}return a.dispose},[i,r,e])}export{y as useInertOthers}; |
@@ -1,1 +0,1 @@ | ||
import{useEffect as d,useRef as f}from"react";import{FocusableMode as p,isFocusableElement as C}from'../utils/focus-management.js';import{isMobile as M}from'../utils/platform.js';import{useDocumentEvent as l}from'./use-document-event.js';import{useWindowEvent as T}from'./use-window-event.js';function w(a,s,m){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=>{M()||o.current&&(c(e,()=>o.current),o.current=null)},!0),l("touchend",e=>c(e,()=>e.target instanceof HTMLElement?e.target:null),!0),T("blur",e=>c(e,()=>window.document.activeElement instanceof HTMLIFrameElement?window.document.activeElement:null),!0)}export{w as useOutsideClick}; | ||
import{useCallback as h,useRef as m}from"react";import{FocusableMode as M,isFocusableElement as b}from'../utils/focus-management.js';import{isMobile as y}from'../utils/platform.js';import{useDocumentEvent as c}from'./use-document-event.js';import{useIsTopLayer as L}from'./use-is-top-layer.js';import{useLatestValue as g}from'./use-latest-value.js';import{useWindowEvent as H}from'./use-window-event.js';const d=30;function F(E,p,C){let u=L(E,"outside-click"),f=g(C),s=h(function(e,o){if(e.defaultPrevented)return;let r=o(e);if(r===null||!r.getRootNode().contains(r)||!r.isConnected)return;let T=function i(n){return typeof n=="function"?i(n()):Array.isArray(n)||n instanceof Set?n:[n]}(p);for(let i of T){if(i===null)continue;let n=i instanceof HTMLElement?i:i.current;if(n!=null&&n.contains(r)||e.composed&&e.composedPath().includes(n))return}return!b(r,M.Loose)&&r.tabIndex!==-1&&e.preventDefault(),f.current(e,r)},[f]),l=m(null);c(u,"pointerdown",t=>{var e,o;l.current=((o=(e=t.composedPath)==null?void 0:e.call(t))==null?void 0:o[0])||t.target},!0),c(u,"mousedown",t=>{var e,o;l.current=((o=(e=t.composedPath)==null?void 0:e.call(t))==null?void 0:o[0])||t.target},!0),c(u,"click",t=>{y()||l.current&&(s(t,()=>l.current),l.current=null)},!0);let a=m({x:0,y:0});c(u,"touchstart",t=>{a.current.x=t.touches[0].clientX,a.current.y=t.touches[0].clientY},!0),c(u,"touchend",t=>{let e={x:t.changedTouches[0].clientX,y:t.changedTouches[0].clientY};if(!(Math.abs(e.x-a.current.x)>=d||Math.abs(e.y-a.current.y)>=d))return s(t,()=>t.target instanceof HTMLElement?t.target:null)},!0),H(u,"blur",t=>s(t,()=>window.document.activeElement instanceof HTMLIFrameElement?window.document.activeElement:null),!0)}export{F as useOutsideClick}; |
@@ -1,1 +0,1 @@ | ||
import{useDocumentOverflowLockedEffect as l}from'./document-overflow/use-document-overflow.js';function u(e,n,c=()=>[document.body]){l(n,e,t=>{var o;return{containers:[...(o=t.containers)!=null?o:[],c]}})}export{u as useScrollLock}; | ||
import{useDocumentOverflowLockedEffect as l}from'./document-overflow/use-document-overflow.js';import{useIsTopLayer as m}from'./use-is-top-layer.js';function f(e,c,n=()=>[document.body]){let r=m(e,"scroll-lock");l(r,c,t=>{var o;return{containers:[...(o=t.containers)!=null?o:[],n]}})}export{f as useScrollLock}; |
@@ -1,1 +0,1 @@ | ||
import{useRef as t}from"react";import{useWindowEvent as a}from'./use-window-event.js';var s=(r=>(r[r.Forwards=0]="Forwards",r[r.Backwards=1]="Backwards",r))(s||{});function n(){let e=t(0);return a("keydown",o=>{o.key==="Tab"&&(e.current=o.shiftKey?1:0)},!0),e}export{s as Direction,n as useTabDirection}; | ||
import{useRef as o}from"react";import{useWindowEvent as t}from'./use-window-event.js';var a=(r=>(r[r.Forwards=0]="Forwards",r[r.Backwards=1]="Backwards",r))(a||{});function u(){let e=o(0);return t(!0,"keydown",r=>{r.key==="Tab"&&(e.current=r.shiftKey?1:0)},!0),e}export{a as Direction,u as useTabDirection}; |
import { type MutableRefObject } from 'react'; | ||
interface TransitionArgs { | ||
container: MutableRefObject<HTMLElement | null>; | ||
classes: MutableRefObject<{ | ||
base: string[]; | ||
enter: string[]; | ||
enterFrom: string[]; | ||
enterTo: string[]; | ||
leave: string[]; | ||
leaveFrom: string[]; | ||
leaveTo: string[]; | ||
entered: string[]; | ||
}>; | ||
direction: 'enter' | 'leave' | 'idle'; | ||
onStart: MutableRefObject<(direction: TransitionArgs['direction']) => void>; | ||
onStop: MutableRefObject<(direction: TransitionArgs['direction']) => void>; | ||
} | ||
export declare function useTransition({ container, direction, classes, onStart, onStop }: TransitionArgs): void; | ||
export {}; | ||
export type TransitionData = { | ||
closed?: boolean; | ||
enter?: boolean; | ||
leave?: boolean; | ||
transition?: boolean; | ||
}; | ||
export declare function useTransition(enabled: boolean, elementRef: MutableRefObject<HTMLElement | null>, show: boolean, events?: { | ||
start?(show: boolean): void; | ||
end?(show: boolean): void; | ||
}): [visible: boolean, data: TransitionData]; |
@@ -1,1 +0,1 @@ | ||
import{useRef as u}from"react";import{transition as f}from'../components/transition/utils/transition.js';import{useDisposables as c}from'./use-disposables.js';import{useIsMounted as m}from'./use-is-mounted.js';import{useIsoMorphicEffect as d}from'./use-iso-morphic-effect.js';function v({container:i,direction:e,classes:s,onStart:o,onStop:t}){let a=m(),r=c(),l=u(!1);d(()=>{if(e==="idle"||!a.current)return;o.current(e);let n=i.current;return n?r.add(f(n,{direction:e,classes:s.current,inFlight:l,done(){t.current(e)}})):t.current(e),r.dispose},[e])}export{v as useTransition}; | ||
import{useRef as b,useState as S}from"react";import{disposables as E}from'../utils/disposables.js';import{once as g}from'../utils/once.js';import{useDisposables as L}from'./use-disposables.js';import{useFlags as C}from'./use-flags.js';import{useIsoMorphicEffect as M}from'./use-iso-morphic-effect.js';var y=(i=>(i[i.None=0]="None",i[i.Closed=1]="Closed",i[i.Enter=2]="Enter",i[i.Leave=4]="Leave",i))(y||{});function V(r,a,e,t){let[i,u]=S(e),{hasFlag:d,addFlag:f,removeFlag:s}=C(r&&i?3:0),l=b(!1),n=b(!1),o=L();return M(function p(){var T;if(!r)return;e&&u(!0);let c=a.current;return c?((T=t==null?void 0:t.start)==null||T.call(t,e),D(c,{inFlight:l,prepare(){n.current?n.current=!1:n.current=l.current,l.current=!0,!n.current&&(e?(f(3),s(4)):(f(4),s(2)))},run(){n.current?e?(s(3),f(4)):(s(4),f(3)):e?s(1):f(1)},done(){var m;n.current&&typeof c.getAnimations=="function"&&c.getAnimations().length>0||(l.current=!1,s(7),e||u(!1),(m=t==null?void 0:t.end)==null||m.call(t,e))}})):e?(f(3),o.nextFrame(()=>p())):void 0},[r,e,a,o]),r?[i,{closed:d(1),enter:d(2),leave:d(4),transition:d(2)||d(4)}]:[e,{closed:void 0,enter:void 0,leave:void 0,transition:void 0}]}function D(r,{prepare:a,run:e,done:t,inFlight:i}){let u=E();return v(r,{prepare:a,inFlight:i}),u.nextFrame(()=>{u.add(F(r,t)),e()}),u.dispose}function F(r,a){let e=g(a),t=E();if(!r)return t.dispose;let{transitionDuration:i,transitionDelay:u}=getComputedStyle(r),[d,f]=[i,u].map(l=>{let[n=0]=l.split(",").filter(Boolean).map(o=>o.includes("ms")?parseFloat(o):parseFloat(o)*1e3).sort((o,p)=>p-o);return n}),s=d+f;if(s!==0){let l=t.group(n=>{let o=n.setTimeout(()=>{e(),n.dispose()},s);n.addEventListener(r,"transitionrun",p=>{p.target===p.currentTarget&&(o(),n.addEventListener(r,"transitioncancel",c=>{c.target===c.currentTarget&&(e(),l())}))})});t.addEventListener(r,"transitionend",n=>{n.target===n.currentTarget&&(e(),t.dispose())})}else e();return t.dispose}function v(r,{inFlight:a,prepare:e}){if(a!=null&&a.current){e();return}let t=r.style.transition;r.style.transition="none",e(),r.offsetHeight,r.style.transition=t}export{V as useTransition}; |
@@ -1,1 +0,1 @@ | ||
export declare function useWindowEvent<TType extends keyof WindowEventMap>(type: TType, listener: (ev: WindowEventMap[TType]) => any, options?: boolean | AddEventListenerOptions): void; | ||
export declare function useWindowEvent<TType extends keyof WindowEventMap>(enabled: boolean, type: TType, listener: (ev: WindowEventMap[TType]) => any, options?: boolean | AddEventListenerOptions): void; |
@@ -1,1 +0,1 @@ | ||
import{useEffect as d}from"react";import{useLatestValue as a}from'./use-latest-value.js';function s(e,r,n){let o=a(r);d(()=>{function t(i){o.current(i)}return window.addEventListener(e,t,n),()=>window.removeEventListener(e,t,n)},[e,n])}export{s as useWindowEvent}; | ||
import{useEffect as a}from"react";import{useLatestValue as f}from'./use-latest-value.js';function s(t,e,o,n){let i=f(o);a(()=>{if(!t)return;function r(d){i.current(d)}return window.addEventListener(e,r,n),()=>window.removeEventListener(e,r,n)},[t,e,n])}export{s as useWindowEvent}; |
@@ -1,2 +0,2 @@ | ||
import { type ReactElement, type ReactNode } from 'react'; | ||
import React, { type ReactElement, type ReactNode } from 'react'; | ||
export declare enum State { | ||
@@ -14,2 +14,5 @@ Open = 1, | ||
export declare function OpenClosedProvider({ value, children }: Props): ReactElement; | ||
export declare function ResetOpenClosedProvider({ children }: { | ||
children: React.ReactNode; | ||
}): ReactElement; | ||
export {}; |
@@ -1,1 +0,1 @@ | ||
import t,{createContext as l,useContext as p}from"react";let n=l(null);n.displayName="OpenClosedContext";var d=(e=>(e[e.Open=1]="Open",e[e.Closed=2]="Closed",e[e.Closing=4]="Closing",e[e.Opening=8]="Opening",e))(d||{});function u(){return p(n)}function s({value:o,children:r}){return t.createElement(n.Provider,{value:o},r)}export{s as OpenClosedProvider,d as State,u as useOpenClosed}; | ||
import r,{createContext as l,useContext as d}from"react";let n=l(null);n.displayName="OpenClosedContext";var i=(e=>(e[e.Open=1]="Open",e[e.Closed=2]="Closed",e[e.Closing=4]="Closing",e[e.Opening=8]="Opening",e))(i||{});function u(){return d(n)}function c({value:o,children:t}){return r.createElement(n.Provider,{value:o},t)}function s({children:o}){return r.createElement(n.Provider,{value:null},o)}export{c as OpenClosedProvider,s as ResetOpenClosedProvider,i as State,u as useOpenClosed}; |
@@ -1,1 +0,1 @@ | ||
import*as r from"react";const s=r.createContext(null);function a(){return{groups:new Map,get(n,t){var c;let e=this.groups.get(n);e||(e=new Map,this.groups.set(n,e));let l=(c=e.get(t))!=null?c:0;e.set(t,l+1);let o=Array.from(e.keys()).indexOf(t);function i(){let u=e.get(t);u>1?e.set(t,u-1):e.delete(t)}return[o,i]}}}function C({children:n}){let t=r.useRef(a());return r.createElement(s.Provider,{value:t},n)}function d(n){let t=r.useContext(s);if(!t)throw new Error("You must wrap your component in a <StableCollection>");let e=f(),[l,o]=t.current.get(n,e);return r.useEffect(()=>o,[]),l}function f(){var l,o,i;let n=(i=(o=(l=r.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED)==null?void 0:l.ReactCurrentOwner)==null?void 0:o.current)!=null?i:null;if(!n)return Symbol();let t=[],e=n;for(;e;)t.push(e.index),e=e.return;return"$."+t.join(".")}export{C as StableCollection,d as useStableCollectionIndex}; | ||
import*as l from"react";const s=l.createContext(null);function a(){return{groups:new Map,get(o,e){var i;let t=this.groups.get(o);t||(t=new Map,this.groups.set(o,t));let n=(i=t.get(e))!=null?i:0;t.set(e,n+1);let r=Array.from(t.keys()).indexOf(e);function u(){let c=t.get(e);c>1?t.set(e,c-1):t.delete(e)}return[r,u]}}}function f({children:o}){let e=l.useRef(a());return l.createElement(s.Provider,{value:e},o)}function C(o){let e=l.useContext(s);if(!e)throw new Error("You must wrap your component in a <StableCollection>");let t=l.useId(),[n,r]=e.current.get(o,t);return l.useEffect(()=>r,[]),n}export{f as StableCollection,C as useStableCollectionIndex}; |
{ | ||
"name": "@headlessui/react", | ||
"version": "0.0.0-insiders.1ee4cfd", | ||
"version": "0.0.0-insiders.1f1e290", | ||
"description": "A set of completely unstyled, fully accessible UI components for React, designed to integrate beautifully with Tailwind CSS.", | ||
@@ -49,4 +49,4 @@ "main": "dist/index.cjs", | ||
"devDependencies": { | ||
"@testing-library/react": "^15.0.5", | ||
"@types/react": "^18.3.1", | ||
"@testing-library/react": "^15.0.7", | ||
"@types/react": "^18.3.3", | ||
"@types/react-dom": "^18.3.0", | ||
@@ -58,7 +58,7 @@ "react": "^18.3.1", | ||
"dependencies": { | ||
"@floating-ui/react": "^0.26.13", | ||
"@floating-ui/react": "^0.26.16", | ||
"@tanstack/react-virtual": "3.5.0", | ||
"@react-aria/focus": "^3.16.2", | ||
"@react-aria/interactions": "^3.21.1" | ||
"@react-aria/focus": "^3.17.1", | ||
"@react-aria/interactions": "^3.21.3" | ||
} | ||
} |
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
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
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
299
0
905349
16237
Updated@floating-ui/react@^0.26.16
Updated@react-aria/focus@^3.17.1