@headlessui/react
Advanced tools
Comparing version 0.0.0-insiders.f0e3e5b to 0.0.0-insiders.f144666
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as G}from"@react-aria/focus";import{useHover as S}from"@react-aria/interactions";import n,{useCallback as W,useMemo as N,useState as w}from"react";import{useActivePress as J}from'../../hooks/use-active-press.js';import{useControllable as V}from'../../hooks/use-controllable.js';import{useDisposables as $}from'../../hooks/use-disposables.js';import{useEvent as s}from'../../hooks/use-event.js';import{useId as j}from'../../hooks/use-id.js';import{useDisabled as q}from'../../internal/disabled.js';import{FormFields as z}from'../../internal/form-fields.js';import{useProvidedId as Q}from'../../internal/id.js';import{isDisabledReactIssue7711 as Y}from'../../utils/bugs.js';import{attemptSubmit as Z}from'../../utils/form.js';import{forwardRefWithAs as ee,mergeProps as oe,render as te}from'../../utils/render.js';import{useDescribedBy as re}from'../description/description.js';import{Keys as y}from'../keyboard.js';import{useLabelledBy as ae}from'../label/label.js';let se="span";function le(T,h){let C=j(),k=Q(),x=q(),{id:g=k||`headlessui-checkbox-${C}`,disabled:o=x||!1,autoFocus:l=!1,checked:E,defaultChecked:i=!1,onChange:v,name:d,value:P,form:D,indeterminate:a=!1,...R}=T,[r,t]=V(E,v,i),A=ae(),F=re(),K=$(),[p,c]=w(!1),m=s(()=>{c(!0),t==null||t(!r),K.nextFrame(()=>{c(!1)})}),_=s(e=>{if(Y(e.currentTarget))return e.preventDefault();e.preventDefault(),m()}),H=s(e=>{e.key===y.Space?(e.preventDefault(),m()):e.key===y.Enter&&Z(e.currentTarget)}),B=s(e=>e.preventDefault()),{isFocusVisible:b,focusProps:L}=G({autoFocus:l}),{isHovered:u,hoverProps:I}=S({isDisabled:o}),{pressed:f,pressProps:M}=J({disabled:o}),U=oe({ref:h,id:g,role:"checkbox","aria-checked":a?"mixed":r?"true":"false","aria-labelledby":A,"aria-describedby":F,"aria-disabled":o?!0:void 0,indeterminate:a?"true":void 0,tabIndex:0,onKeyUp:o?void 0:H,onKeyPress:o?void 0:B,onClick:o?void 0:_},L,I,M),O=N(()=>({checked:r,disabled:o,hover:u,focus:b,active:f,indeterminate:a,changing:p,autofocus:l}),[r,a,o,u,b,f,p,l]),X=W(()=>t==null?void 0:t(i),[t]);return n.createElement(n.Fragment,null,d!=null&&n.createElement(z,{disabled:o,data:{[d]:P||"on"},overrides:{type:"checkbox",checked:r},form:D,onReset:X}),te({ourProps:U,theirProps:R,slot:O,defaultTag:se,name:"Checkbox"}))}let ve=ee(le);export{ve 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}; |
@@ -81,4 +81,5 @@ import React, { type ElementType, type Ref } from 'react'; | ||
modal?: boolean; | ||
transition?: boolean; | ||
}>; | ||
declare function OptionsFn<TTag extends ElementType = typeof DEFAULT_OPTIONS_TAG>(props: ComboboxOptionsProps<TTag>, ref: Ref<HTMLUListElement>): React.JSX.Element; | ||
declare function OptionsFn<TTag extends ElementType = typeof DEFAULT_OPTIONS_TAG>(props: ComboboxOptionsProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; | ||
declare let DEFAULT_OPTION_TAG: "div"; | ||
@@ -98,3 +99,3 @@ type OptionRenderPropArg = { | ||
}>; | ||
declare function OptionFn<TTag extends ElementType = typeof DEFAULT_OPTION_TAG, TType = Parameters<typeof ComboboxRoot>[0]['value']>(props: ComboboxOptionProps<TTag, TType>, ref: Ref<HTMLLIElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null; | ||
declare function OptionFn<TTag extends ElementType = typeof DEFAULT_OPTION_TAG, TType = Parameters<typeof ComboboxRoot>[0]['value']>(props: ComboboxOptionProps<TTag, TType>, ref: Ref<HTMLElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null; | ||
export interface _internal_ComponentCombobox extends HasDisplayName { | ||
@@ -125,9 +126,13 @@ <TValue, TMultiple extends boolean | undefined = false, TTag extends ElementType = typeof DEFAULT_COMBOBOX_TAG>(props: ComboboxProps<TValue, TMultiple, TTag> & RefProp<typeof ComboboxFn>): JSX.Element; | ||
export declare let Combobox: _internal_ComponentCombobox & { | ||
/** @deprecated use `<ComboboxInput>` instead of `<Combobox.Input>` */ | ||
Input: _internal_ComponentComboboxInput; | ||
/** @deprecated use `<ComboboxButton>` instead of `<Combobox.Button>` */ | ||
Button: _internal_ComponentComboboxButton; | ||
/** @deprecated use `<Label>` instead of `<Combobox.Label>` */ | ||
Label: _internal_ComponentComboboxLabel; | ||
/** @deprecated use `<ComboboxOptions>` instead of `<Combobox.Options>` */ | ||
Options: _internal_ComponentComboboxOptions; | ||
/** @deprecated use `<ComboboxOption>` instead of `<Combobox.Option>` */ | ||
Option: _internal_ComponentComboboxOption; | ||
}; | ||
export {}; |
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as ve}from"@react-aria/focus";import{useHover as Oe}from"@react-aria/interactions";import{useVirtualizer as Le}from"@tanstack/react-virtual";import D,{Fragment as Ce,createContext as be,createRef as we,useCallback as ye,useContext as ce,useMemo as G,useReducer as Be,useRef as j,useState as Re}from"react";import{useActivePress as Ue}from'../../hooks/use-active-press.js';import{useByComparator as ke}from'../../hooks/use-by-comparator.js';import{useControllable as Ne}from'../../hooks/use-controllable.js';import{useDisposables as Se}from'../../hooks/use-disposables.js';import{useElementSize as Pe}from'../../hooks/use-element-size.js';import{useEvent as x}from'../../hooks/use-event.js';import{useFrameDebounce as He}from'../../hooks/use-frame-debounce.js';import{useId as ie}from'../../hooks/use-id.js';import{useInertOthers as Ge}from'../../hooks/use-inert-others.js';import{useIsoMorphicEffect as K}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as je}from'../../hooks/use-latest-value.js';import{useOnDisappear as Ke}from'../../hooks/use-on-disappear.js';import{useOutsideClick as We}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 ze}from'../../hooks/use-resolve-button-type.js';import{useScrollLock as $e}from'../../hooks/use-scroll-lock.js';import{useSyncRefs as ae}from'../../hooks/use-sync-refs.js';import{useTrackedPointer as Xe}from'../../hooks/use-tracked-pointer.js';import{useTreeWalker as Je}from'../../hooks/use-tree-walker.js';import{useWatch as Ee}from'../../hooks/use-watch.js';import{useDisabled as qe}from'../../internal/disabled.js';import{FloatingProvider as Ye,useFloatingPanel as Qe,useFloatingPanelProps as Ze,useFloatingReference as eo,useResolvedAnchor as oo}from'../../internal/floating.js';import{FormFields as to}from'../../internal/form-fields.js';import{useProvidedId as no}from'../../internal/id.js';import{OpenClosedProvider as ro,State as le,useOpenClosed as io}from'../../internal/open-closed.js';import{history as _e}from'../../utils/active-element-history.js';import{isDisabledReactIssue7711 as ao}from'../../utils/bugs.js';import{Focus as S,calculateActiveIndex as Fe}from'../../utils/calculate-active-index.js';import{disposables as he}from'../../utils/disposables.js';import{sortByDomNode as lo}from'../../utils/focus-management.js';import{match as q}from'../../utils/match.js';import{isMobile as uo}from'../../utils/platform.js';import{RenderFeatures as Me,forwardRefWithAs as Q,mergeProps as fe,render as Z}from'../../utils/render.js';import{useDescribedBy as po}from'../description/description.js';import{Keys as M}from'../keyboard.js';import{Label as so,useLabelledBy as me,useLabels as bo}from'../label/label.js';import{MouseButton as De}from'../mouse.js';import{Portal as co}from'../portal/portal.js';var fo=(e=>(e[e.Open=0]="Open",e[e.Closed=1]="Closed",e))(fo||{}),mo=(e=>(e[e.Single=0]="Single",e[e.Multi=1]="Multi",e))(mo||{}),xo=(t=>(t[t.Pointer=0]="Pointer",t[t.Focus=1]="Focus",t[t.Other=2]="Other",t))(xo||{}),To=(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.UpdateVirtualOptions=6]="UpdateVirtualOptions",i))(To||{});function xe(o,r=e=>e){let e=o.activeOptionIndex!==null?o.options[o.activeOptionIndex]:null,t=r(o.options.slice()),p=t.length>0&&t[0].dataRef.current.order!==null?t.sort((b,i)=>b.dataRef.current.order-i.dataRef.current.order):lo(t,b=>b.dataRef.current.domRef.current),f=e?p.indexOf(e):null;return f===-1&&(f=null),{options:p,activeOptionIndex:f}}let go={[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 f,b,i,m,n;if((f=o.dataRef.current)!=null&&f.disabled||(b=o.dataRef.current)!=null&&b.optionsRef.current&&!((i=o.dataRef.current)!=null&&i.optionsPropsRef.current.static)&&o.comboboxState===1)return o;if(o.virtual){let u=r.focus===S.Specific?r.idx:Fe(r,{resolveItems:()=>o.virtual.options,resolveActiveIndex:()=>{var A,_;return(_=(A=o.activeOptionIndex)!=null?A:o.virtual.options.findIndex(s=>!o.virtual.disabled(s)))!=null?_:null},resolveDisabled:o.virtual.disabled,resolveId(){throw new Error("Function not implemented.")}}),c=(m=r.trigger)!=null?m:2;return o.activeOptionIndex===u&&o.activationTrigger===c?o:{...o,activeOptionIndex:u,activationTrigger:c,__demoMode:!1}}let e=xe(o);if(e.activeOptionIndex===null){let u=e.options.findIndex(c=>!c.dataRef.current.disabled);u!==-1&&(e.activeOptionIndex=u)}let t=r.focus===S.Specific?r.idx:Fe(r,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:u=>u.id,resolveDisabled:u=>u.dataRef.current.disabled}),p=(n=r.trigger)!=null?n:2;return o.activeOptionIndex===t&&o.activationTrigger===p?o:{...o,...e,activeOptionIndex:t,activationTrigger:p,__demoMode:!1}},[3]:(o,r)=>{var f,b,i;if((f=o.dataRef.current)!=null&&f.virtual)return{...o,options:[...o.options,r.payload]};let e=r.payload,t=xe(o,m=>(m.push(e),m));o.activeOptionIndex===null&&(b=o.dataRef.current)!=null&&b.isSelected(r.payload.dataRef.current.value)&&(t.activeOptionIndex=t.options.indexOf(e));let p={...o,...t,activationTrigger:2};return(i=o.dataRef.current)!=null&&i.__demoMode&&o.dataRef.current.value===void 0&&(p.activeOptionIndex=0),p},[4]:(o,r)=>{var t;if((t=o.dataRef.current)!=null&&t.virtual)return{...o,options:o.options.filter(p=>p.id!==r.id)};let e=xe(o,p=>{let f=p.findIndex(b=>b.id===r.id);return f!==-1&&p.splice(f,1),p});return{...o,...e,activationTrigger:2}},[5]:(o,r)=>o.activationTrigger===r.trigger?o:{...o,activationTrigger:r.trigger},[6]:(o,r)=>{var t;if(((t=o.virtual)==null?void 0:t.options)===r.options)return o;let e=o.activeOptionIndex;if(o.activeOptionIndex!==null){let p=r.options.indexOf(o.virtual.options[o.activeOptionIndex]);p!==-1?e=p:e=null}return{...o,activeOptionIndex:e,virtual:Object.assign({},o.virtual,{options:r.options})}}},Te=be(null);Te.displayName="ComboboxActionsContext";function ee(o){let r=ce(Te);if(r===null){let e=new Error(`<${o} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,ee),e}return r}let Ve=be(null);function vo(o){var m;let r=Y("VirtualProvider"),[e,t]=G(()=>{let n=r.optionsRef.current;if(!n)return[0,0];let u=window.getComputedStyle(n);return[parseFloat(u.paddingBlockStart||u.paddingTop),parseFloat(u.paddingBlockEnd||u.paddingBottom)]},[r.optionsRef.current]),p=Le({scrollPaddingStart:e,scrollPaddingEnd:t,count:r.virtual.options.length,estimateSize(){return 40},getScrollElement(){var n;return(n=r.optionsRef.current)!=null?n:null},overscan:12}),[f,b]=Re(0);K(()=>{b(n=>n+1)},[(m=r.virtual)==null?void 0:m.options]);let i=p.getVirtualItems();return i.length===0?null:D.createElement(Ve.Provider,{value:p},D.createElement("div",{style:{position:"relative",width:"100%",height:`${p.getTotalSize()}px`},ref:n=>{if(n){if(typeof process!="undefined"&&process.env.JEST_WORKER_ID!==void 0||r.activationTrigger===0)return;r.activeOptionIndex!==null&&r.virtual.options.length>r.activeOptionIndex&&p.scrollToIndex(r.activeOptionIndex)}}},i.map(n=>{var u;return D.createElement(Ce,{key:n.key},D.cloneElement((u=o.children)==null?void 0:u.call(o,{option:r.virtual.options[n.index],open:r.comboboxState===0}),{key:`${f}-${n.key}`,"data-index":n.index,"aria-setsize":r.virtual.options.length,"aria-posinset":n.index+1,style:{position:"absolute",top:0,left:0,transform:`translateY(${n.start}px)`,overflowAnchor:"none"}}))})))}let ue=be(null);ue.displayName="ComboboxDataContext";function Y(o){let r=ce(ue);if(r===null){let e=new Error(`<${o} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,Y),e}return r}function Oo(o,r){return q(r.type,go,o,r)}let Co=Ce;function yo(o,r){var R,h;let e=qe(),{value:t,defaultValue:p,onChange:f,form:b,name:i,by:m,disabled:n=e||!1,onClose:u,__demoMode:c=!1,multiple:A=!1,immediate:_=!1,virtual:s=null,nullable:T,...w}=o,[C=A?[]:void 0,v]=Ne(t,f,p),[y,E]=Be(Oo,{dataRef:we(),comboboxState:c?0:1,options:[],virtual:s?{options:s.options,disabled:(R=s.disabled)!=null?R:()=>!1}:null,activeOptionIndex:null,activationTrigger:2,__demoMode:c}),F=j(!1),k=j({static:!1,hold:!1}),V=j(null),O=j(null),W=j(null),L=ke(m),P=x(d=>s?m===null?s.options.indexOf(d):s.options.findIndex(g=>L(g,d)):y.options.findIndex(g=>L(g.dataRef.current.value,d))),$=ye(d=>q(a.mode,{[1]:()=>C.some(g=>L(g,d)),[0]:()=>L(C,d)}),[C]),z=x(d=>y.activeOptionIndex===P(d)),a=G(()=>({...y,immediate:_,optionsPropsRef:k,inputRef:V,buttonRef:O,optionsRef:W,value:C,defaultValue:p,disabled:n,mode:A?1:0,virtual:y.virtual,get activeOptionIndex(){if(F.current&&y.activeOptionIndex===null&&(s?s.options.length>0:y.options.length>0)){if(s){let g=s.options.findIndex(N=>{var re,ge;return!((ge=(re=s==null?void 0:s.disabled)==null?void 0:re.call(s,N))!=null&&ge)});if(g!==-1)return g}let d=y.options.findIndex(g=>!g.dataRef.current.disabled);if(d!==-1)return d}return y.activeOptionIndex},calculateIndex:P,compare:L,isSelected:$,isActive:z,__demoMode:c}),[C,p,n,A,c,y,s]);K(()=>{s&&E({type:6,options:s.options})},[s,s==null?void 0:s.options]),K(()=>{y.dataRef.current=a},[a]),We([a.buttonRef,a.inputRef,a.optionsRef],()=>J.closeCombobox(),a.comboboxState===0);let H=G(()=>{var d,g,N;return{open:a.comboboxState===0,disabled:n,activeIndex:a.activeOptionIndex,activeOption:a.activeOptionIndex===null?null:a.virtual?a.virtual.options[(d=a.activeOptionIndex)!=null?d:0]:(N=(g=a.options[a.activeOptionIndex])==null?void 0:g.dataRef.current.value)!=null?N:null,value:C}},[a,n,C]),pe=x(()=>{if(a.activeOptionIndex!==null){if(a.virtual)X(a.virtual.options[a.activeOptionIndex]);else{let{dataRef:d}=a.options[a.activeOptionIndex];X(d.current.value)}J.goToOption(S.Specific,a.activeOptionIndex)}}),se=x(()=>{E({type:0}),F.current=!0}),de=x(()=>{E({type:1}),F.current=!1,u==null||u()}),oe=x((d,g,N)=>(F.current=!1,d===S.Specific?E({type:2,focus:S.Specific,idx:g,trigger:N}):E({type:2,focus:d,trigger:N}))),te=x((d,g)=>(E({type:3,payload:{id:d,dataRef:g}}),()=>{a.isActive(g.current.value)&&(F.current=!0),E({type:4,id:d})})),X=x(d=>q(a.mode,{[0](){return v==null?void 0:v(d)},[1](){let g=a.value.slice(),N=g.findIndex(re=>L(re,d));return N===-1?g.push(d):g.splice(N,1),v==null?void 0:v(g)}})),ne=x(d=>{E({type:5,trigger:d})}),J=G(()=>({onChange:X,registerOption:te,goToOption:oe,closeCombobox:de,openCombobox:se,setActivationTrigger:ne,selectActiveOption:pe}),[]),[l,B]=bo(),I=r===null?{}:{ref:r},U=ye(()=>v==null?void 0:v(p),[v]);return D.createElement(B,{value:l,props:{htmlFor:(h=a.inputRef.current)==null?void 0:h.id},slot:{open:a.comboboxState===0,disabled:n}},D.createElement(Ye,null,D.createElement(Te.Provider,{value:J},D.createElement(ue.Provider,{value:a},D.createElement(ro,{value:q(a.comboboxState,{[0]:le.Open,[1]:le.Closed})},i!=null&&D.createElement(to,{disabled:n,data:C!=null?{[i]:C}:{},form:b,onReset:U}),Z({ourProps:I,theirProps:w,slot:H,defaultTag:Co,name:"Combobox"}))))))}let Ro="input";function So(o,r){var oe,te,X,ne,J;let e=Y("Combobox.Input"),t=ee("Combobox.Input"),p=ie(),f=no(),{id:b=f||`headlessui-combobox-input-${p}`,onChange:i,displayValue:m,disabled:n=e.disabled||!1,autoFocus:u=!1,type:c="text",...A}=o,_=ae(e.inputRef,r,eo()),s=Ie(e.inputRef),T=j(!1),w=Se(),C=x(()=>{t.onChange(null),e.optionsRef.current&&(e.optionsRef.current.scrollTop=0),t.goToOption(S.Nothing)}),v=G(()=>{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]);Ee(([l,B],[I,U])=>{if(T.current)return;let R=e.inputRef.current;R&&((U===0&&B===1||l!==I)&&(R.value=l),requestAnimationFrame(()=>{if(T.current||!R||(s==null?void 0:s.activeElement)!==R)return;let{selectionStart:h,selectionEnd:d}=R;Math.abs((d!=null?d:0)-(h!=null?h:0))===0&&h===0&&R.setSelectionRange(R.value.length,R.value.length)}))},[v,e.comboboxState,s]),Ee(([l],[B])=>{if(l===0&&B===1){if(T.current)return;let I=e.inputRef.current;if(!I)return;let U=I.value,{selectionStart:R,selectionEnd:h,selectionDirection:d}=I;I.value="",I.value=U,d!==null?I.setSelectionRange(R,h,d):I.setSelectionRange(R,h)}},[e.comboboxState]);let y=j(!1),E=x(()=>{y.current=!0}),F=x(()=>{w.nextFrame(()=>{y.current=!1})}),k=He(),V=x(l=>{switch(T.current=!0,k(()=>{T.current=!1}),l.key){case M.Enter:if(T.current=!1,e.comboboxState!==0||y.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 T.current=!1,l.preventDefault(),l.stopPropagation(),q(e.comboboxState,{[0]:()=>t.goToOption(S.Next),[1]:()=>t.openCombobox()});case M.ArrowUp:return T.current=!1,l.preventDefault(),l.stopPropagation(),q(e.comboboxState,{[0]:()=>t.goToOption(S.Previous),[1]:()=>{t.openCombobox(),w.nextFrame(()=>{e.value||t.goToOption(S.Last)})}});case M.Home:if(l.shiftKey)break;return T.current=!1,l.preventDefault(),l.stopPropagation(),t.goToOption(S.First);case M.PageUp:return T.current=!1,l.preventDefault(),l.stopPropagation(),t.goToOption(S.First);case M.End:if(l.shiftKey)break;return T.current=!1,l.preventDefault(),l.stopPropagation(),t.goToOption(S.Last);case M.PageDown:return T.current=!1,l.preventDefault(),l.stopPropagation(),t.goToOption(S.Last);case M.Escape:return T.current=!1,e.comboboxState!==0?void 0:(l.preventDefault(),e.optionsRef.current&&!e.optionsPropsRef.current.static&&l.stopPropagation(),e.mode===0&&e.value===null&&C(),t.closeCombobox());case M.Tab:if(T.current=!1,e.comboboxState!==0)return;e.mode===0&&e.activationTrigger!==1&&t.selectActiveOption(),t.closeCombobox();break}}),O=x(l=>{i==null||i(l),e.mode===0&&l.target.value===""&&C(),t.openCombobox()}),W=x(l=>{var I,U,R;let B=(I=l.relatedTarget)!=null?I:_e.find(h=>h!==l.currentTarget);if(T.current=!1,!((U=e.optionsRef.current)!=null&&U.contains(B))&&!((R=e.buttonRef.current)!=null&&R.contains(B))&&e.comboboxState===0)return l.preventDefault(),e.mode===0&&e.value===null&&C(),t.closeCombobox()}),L=x(l=>{var I,U,R;let B=(I=l.relatedTarget)!=null?I:_e.find(h=>h!==l.currentTarget);(U=e.buttonRef.current)!=null&&U.contains(B)||(R=e.optionsRef.current)!=null&&R.contains(B)||e.disabled||e.immediate&&e.comboboxState!==0&&(t.openCombobox(),w.nextFrame(()=>{t.setActivationTrigger(1)}))}),P=me(),$=po(),{isFocused:z,focusProps:a}=ve({autoFocus:u}),{isHovered:H,hoverProps:pe}=Oe({isDisabled:n}),se=G(()=>({open:e.comboboxState===0,disabled:n,hover:H,focus:z,autofocus:u}),[e,H,z,u,n]),de=fe({ref:_,id:b,role:"combobox",type:c,"aria-controls":(oe=e.optionsRef.current)==null?void 0:oe.id,"aria-expanded":e.comboboxState===0,"aria-activedescendant":e.activeOptionIndex===null?void 0:e.virtual?(te=e.options.find(l=>!l.dataRef.current.disabled&&e.compare(l.dataRef.current.value,e.virtual.options[e.activeOptionIndex])))==null?void 0:te.id:(X=e.options[e.activeOptionIndex])==null?void 0:X.id,"aria-labelledby":P,"aria-describedby":$,"aria-autocomplete":"list",defaultValue:(J=(ne=o.defaultValue)!=null?ne:e.defaultValue!==void 0?m==null?void 0:m(e.defaultValue):null)!=null?J:e.defaultValue,disabled:n||void 0,autoFocus:u,onCompositionStart:E,onCompositionEnd:F,onKeyDown:V,onChange:O,onFocus:L,onBlur:W},a,pe);return Z({ourProps:de,theirProps:A,slot:se,defaultTag:Ro,name:"Combobox.Input"})}let Po="button";function Io(o,r){var V;let e=Y("Combobox.Button"),t=ee("Combobox.Button"),p=ae(e.buttonRef,r),f=ie(),{id:b=`headlessui-combobox-button-${f}`,disabled:i=e.disabled||!1,autoFocus:m=!1,...n}=o,u=Se(),c=Ae(e.inputRef),A=x(O=>{switch(O.key){case M.Space:case M.Enter:return O.preventDefault(),O.stopPropagation(),e.comboboxState===1&&t.openCombobox(),u.nextFrame(()=>c());case M.ArrowDown:return O.preventDefault(),O.stopPropagation(),e.comboboxState===1&&(t.openCombobox(),u.nextFrame(()=>{e.value||t.goToOption(S.First)})),u.nextFrame(()=>c());case M.ArrowUp:return O.preventDefault(),O.stopPropagation(),e.comboboxState===1&&(t.openCombobox(),u.nextFrame(()=>{e.value||t.goToOption(S.Last)})),u.nextFrame(()=>c());case M.Escape:return e.comboboxState!==0?void 0:(O.preventDefault(),e.optionsRef.current&&!e.optionsPropsRef.current.static&&O.stopPropagation(),t.closeCombobox(),u.nextFrame(()=>c()));default:return}}),_=x(O=>{O.preventDefault(),!ao(O.currentTarget)&&(O.button===De.Left&&(e.comboboxState===0?t.closeCombobox():t.openCombobox()),c())}),s=me([b]),{isFocusVisible:T,focusProps:w}=ve({autoFocus:m}),{isHovered:C,hoverProps:v}=Oe({isDisabled:i}),{pressed:y,pressProps:E}=Ue({disabled:i}),F=G(()=>({open:e.comboboxState===0,active:y||e.comboboxState===0,disabled:i,value:e.value,hover:C,focus:T}),[e,C,T,y,i]),k=fe({ref:p,id:b,type:ze(o,e.buttonRef),tabIndex:-1,"aria-haspopup":"listbox","aria-controls":(V=e.optionsRef.current)==null?void 0:V.id,"aria-expanded":e.comboboxState===0,"aria-labelledby":s,disabled:i||void 0,autoFocus:m,onMouseDown:_,onKeyDown:A},w,v,E);return Z({ourProps:k,theirProps:n,slot:F,defaultTag:Po,name:"Combobox.Button"})}let Ao="div",Eo=Me.RenderStrategy|Me.Static;function _o(o,r){var L;let e=ie(),{id:t=`headlessui-combobox-options-${e}`,hold:p=!1,anchor:f,portal:b=!1,modal:i=!0,...m}=o,n=Y("Combobox.Options"),u=ee("Combobox.Options"),c=oo(f);c&&(b=!0);let[A,_]=Qe(c),s=Ze(),T=ae(n.optionsRef,r,c?A:null),w=Ie(n.optionsRef),C=io(),v=(()=>C!==null?(C&le.Open)===le.Open:n.comboboxState===0)();Ke(n.inputRef,u.closeCombobox,v),$e(w,n.__demoMode?!1:i&&n.comboboxState===0),Ge({allowed:x(()=>[n.inputRef.current,n.buttonRef.current,n.optionsRef.current])},n.__demoMode?!1:i&&n.comboboxState===0),K(()=>{var P;n.optionsPropsRef.current.static=(P=o.static)!=null?P:!1},[n.optionsPropsRef,o.static]),K(()=>{n.optionsPropsRef.current.hold=p},[n.optionsPropsRef,p]),Je({container:n.optionsRef.current,enabled:n.comboboxState===0,accept(P){return P.getAttribute("role")==="option"?NodeFilter.FILTER_REJECT:P.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(P){P.setAttribute("role","none")}});let y=me([(L=n.buttonRef.current)==null?void 0:L.id]),E=G(()=>({open:n.comboboxState===0,option:void 0}),[n]),F=x(()=>{u.setActivationTrigger(0)}),k=fe(c?s():{},{"aria-labelledby":y,role:"listbox","aria-multiselectable":n.mode===1?!0:void 0,id:t,ref:T,style:{..._,"--input-width":Pe(n.inputRef,!0).width,"--button-width":Pe(n.buttonRef,!0).width},onWheel:F});n.virtual&&v&&Object.assign(m,{children:D.createElement(vo,null,m.children)});let[V,O]=Re(n.value);n.value!==V&&n.comboboxState===0&&n.mode!==1&&O(n.value);let W=x(P=>n.compare(V,P));return D.createElement(co,{enabled:b?o.static||v:!1},D.createElement(ue.Provider,{value:n.mode===1?n:{...n,isSelected:W}},Z({ourProps:k,theirProps:m,slot:E,defaultTag:Ao,features:Eo,visible:v,name:"Combobox.Options"})))}let Fo="div";function ho(o,r){var P,$,z;let e=Y("Combobox.Option"),t=ee("Combobox.Option"),p=ie(),{id:f=`headlessui-combobox-option-${p}`,value:b,disabled:i=($=(P=e.virtual)==null?void 0:P.disabled(b))!=null?$:!1,order:m=null,...n}=o,u=Ae(e.inputRef),c=e.virtual?e.activeOptionIndex===e.calculateIndex(b):e.activeOptionIndex===null?!1:((z=e.options[e.activeOptionIndex])==null?void 0:z.id)===f,A=e.isSelected(b),_=j(null),s=je({disabled:i,value:b,domRef:_,order:m}),T=ce(Ve),w=ae(r,_,T?T.measureElement:null),C=x(()=>t.onChange(b));K(()=>t.registerOption(f,s),[s,f]);let v=j(!(e.virtual||e.__demoMode));K(()=>{if(!e.virtual&&!e.__demoMode)return he().requestAnimationFrame(()=>{v.current=!0})},[e.virtual,e.__demoMode]),K(()=>{if(v.current&&e.comboboxState===0&&c&&e.activationTrigger!==0)return he().requestAnimationFrame(()=>{var a,H;(H=(a=_.current)==null?void 0:a.scrollIntoView)==null||H.call(a,{block:"nearest"})})},[_,c,e.comboboxState,e.activationTrigger,e.activeOptionIndex]);let y=x(a=>{a.preventDefault(),a.button===De.Left&&(i||(C(),uo()||requestAnimationFrame(()=>u()),e.mode===0&&t.closeCombobox()))}),E=x(()=>{if(i)return t.goToOption(S.Nothing);let a=e.calculateIndex(b);t.goToOption(S.Specific,a)}),F=Xe(),k=x(a=>F.update(a)),V=x(a=>{if(!F.wasMoved(a)||i||c)return;let H=e.calculateIndex(b);t.goToOption(S.Specific,H,0)}),O=x(a=>{F.wasMoved(a)&&(i||c&&(e.optionsPropsRef.current.hold||t.goToOption(S.Nothing)))}),W=G(()=>({active:c,focus:c,selected:A,disabled:i}),[c,A,i]);return Z({ourProps:{id:f,ref:w,role:"option",tabIndex:i===!0?void 0:-1,"aria-disabled":i===!0?!0:void 0,"aria-selected":A,disabled:void 0,onMouseDown:y,onFocus:E,onPointerEnter:k,onMouseEnter:k,onPointerMove:V,onMouseMove:V,onPointerLeave:O,onMouseLeave:O},theirProps:n,slot:W,defaultTag:Fo,name:"Combobox.Option"})}let Mo=Q(yo),Do=Q(Io),Vo=Q(So),Lo=so,wo=Q(_o),Bo=Q(ho),Et=Object.assign(Mo,{Input:Vo,Button:Do,Label:Lo,Options:wo,Option:Bo});export{Et as Combobox,Do as ComboboxButton,Vo as ComboboxInput,Lo as ComboboxLabel,Bo as ComboboxOption,wo 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 Ae}from'../../hooks/use-owner.js';import{useRefocusableInput as Ie}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{transitionDataAttributes as eo,useTransition as oo}from'../../hooks/use-transition.js';import{useTreeWalker as to}from'../../hooks/use-tree-walker.js';import{useWatch as Ee}from'../../hooks/use-watch.js';import{useDisabled as no}from'../../internal/disabled.js';import{FloatingProvider as ro,useFloatingPanel as io,useFloatingPanelProps as ao,useFloatingReference as lo,useResolvedAnchor as uo}from'../../internal/floating.js';import{FormFields as po}from'../../internal/form-fields.js';import{Frozen as so,useFrozenData as _e}from'../../internal/frozen.js';import{useProvidedId as bo}from'../../internal/id.js';import{OpenClosedProvider as fo,State as de,useOpenClosed as co}from'../../internal/open-closed.js';import{history as he}from'../../utils/active-element-history.js';import{isDisabledReactIssue7711 as mo}from'../../utils/bugs.js';import{Focus as P,calculateActiveIndex as De}from'../../utils/calculate-active-index.js';import{disposables as Me}from'../../utils/disposables.js';import{sortByDomNode as To}from'../../utils/focus-management.js';import{match as ee}from'../../utils/match.js';import{isMobile as xo}from'../../utils/platform.js';import{RenderFeatures as Fe,forwardRefWithAs as te,mergeProps as ce,render as ne}from'../../utils/render.js';import{useDescribedBy as go}from'../description/description.js';import{Keys as V}from'../keyboard.js';import{Label as vo,useLabelledBy as me,useLabels as Oo}from'../label/label.js';import{MouseButton as Ve}from'../mouse.js';import{Portal as yo}from'../portal/portal.js';var Co=(e=>(e[e.Open=0]="Open",e[e.Closed=1]="Closed",e))(Co||{}),Ro=(e=>(e[e.Single=0]="Single",e[e.Multi=1]="Multi",e))(Ro||{}),So=(t=>(t[t.Pointer=0]="Pointer",t[t.Focus=1]="Focus",t[t.Other=2]="Other",t))(So||{}),Po=(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))(Po||{});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):To(t,f=>f.dataRef.current.domRef.current),d=e?c.indexOf(e):null;return d===-1&&(d=null),{options:c,activeOptionIndex:d}}let Ao={[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===P.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===P.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 Eo(o,r){return ee(r.type,Ao,o,r)}let _o=Re;function ho(o,r){var ge,ve;let e=no(),{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),[A,R]=Ue(Eo,{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),I=je(u),B=m(b=>p?u===null?p.options.indexOf(b):p.options.findIndex(g=>I(g,b)):A.options.findIndex(g=>I(g.dataRef.current.value,b))),k=Se(b=>ee(i.mode,{[1]:()=>v.some(g=>I(g,b)),[0]:()=>I(v,b)}),[v]),K=m(b=>A.activeOptionIndex===B(b)),i=z(()=>({...A,immediate:_,optionsPropsRef:O,inputRef:G,buttonRef:J,optionsRef:Q,value:v,defaultValue:F,disabled:a,mode:C?1:0,virtual:p?A.virtual:null,get activeOptionIndex(){if(h.current&&A.activeOptionIndex===null&&(p?p.options.length>0:A.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=A.options.findIndex(g=>!g.dataRef.current.disabled);if(b!==-1)return b}return A.activeOptionIndex},calculateIndex:B,compare:I,isSelected:k,isActive:K}),[v,F,a,C,T,A,p]);X(()=>{var b;p&&R({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(()=>{A.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)S(i.virtual.options[i.activeOptionIndex]);else{let{dataRef:b}=i.options[i.activeOptionIndex];S(b.current.value)}x.goToOption(P.Specific,i.activeOptionIndex)}}),E=m(()=>{R({type:0}),h.current=!0}),ae=m(()=>{R({type:1}),h.current=!1,n==null||n()}),le=m(b=>{R({type:3,isTyping:b})}),l=m((b,g,j)=>(h.current=!1,b===P.Specific?R({type:2,focus:P.Specific,idx:g,trigger:j}):R({type:2,focus:b,trigger:j}))),U=m((b,g)=>(R({type:4,payload:{id:b,dataRef:g}}),()=>{i.isActive(g.current.value)&&(h.current=!0),R({type:5,id:b})})),S=m(b=>ee(i.mode,{[0](){return y==null?void 0:y(b)},[1](){let g=i.value.slice(),j=g.findIndex(ue=>I(ue,b));return j===-1?g.push(b):g.splice(j,1),y==null?void 0:y(g)}})),H=m(b=>{R({type:6,trigger:b})}),x=z(()=>({onChange:S,registerOption:U,goToOption:l,setIsTyping:le,closeCombobox:ae,openCombobox:E,setActivationTrigger:H,selectActiveOption:Y}),[]),[L,W]=Oo(),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(ro,null,D.createElement(xe.Provider,{value:x},D.createElement(ie.Provider,{value:i},D.createElement(fo,{value:ee(i.comboboxState,{[0]:de.Open,[1]:de.Closed})},s!=null&&D.createElement(po,{disabled:a,data:v!=null?{[s]:v}:{},form:f,onReset:Be}),ne({ourProps:we,theirProps:M,slot:q,defaultTag:_o,name:"Combobox"}))))))}let Do="input";function Mo(o,r){var q,Y,E,ae,le;let e=oe("Combobox.Input"),t=re("Combobox.Input"),c=pe(),d=bo(),{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,lo()),p=Ae(e.inputRef),w=We(),M=m(()=>{t.onChange(null),e.optionsRef.current&&(e.optionsRef.current.scrollTop=0),t.goToOption(P.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],[S,H])=>{if(e.isTyping)return;let x=e.inputRef.current;x&&((H===0&&U===1||l!==S)&&(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 S=e.inputRef.current;if(!S)return;let H=S.value,{selectionStart:x,selectionEnd:L,selectionDirection:W}=S;S.value="",S.value=H,W!==null?S.setSelectionRange(x,L,W):S.setSelectionRange(x,L)}},[e.comboboxState]);let v=$(!1),y=m(()=>{v.current=!0}),A=m(()=>{w.nextFrame(()=>{v.current=!1})}),R=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(P.Next),[1]:()=>t.openCombobox()});case V.ArrowUp:return l.preventDefault(),l.stopPropagation(),ee(e.comboboxState,{[0]:()=>t.goToOption(P.Previous),[1]:()=>{Z(()=>t.openCombobox()),e.value||t.goToOption(P.Last)}});case V.Home:if(l.shiftKey)break;return l.preventDefault(),l.stopPropagation(),t.goToOption(P.First);case V.PageUp:return l.preventDefault(),l.stopPropagation(),t.goToOption(P.First);case V.End:if(l.shiftKey)break;return l.preventDefault(),l.stopPropagation(),t.goToOption(P.Last);case V.PageDown:return l.preventDefault(),l.stopPropagation(),t.goToOption(P.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 S,H,x;let U=(S=l.relatedTarget)!=null?S: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 S,H,x;let U=(S=l.relatedTarget)!=null?S: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=go(),{isFocused:I,focusProps:B}=ye({autoFocus:n}),{isHovered:k,hoverProps:K}=Ce({isDisabled:a}),i=z(()=>({open:e.comboboxState===0,disabled:a,hover:k,focus:I,autofocus:n}),[e,k,I,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:A,onKeyDown:R,onChange:h,onFocus:G,onBlur:O},B,K);return ne({ourProps:N,theirProps:C,slot:i,defaultTag:Do,name:"Combobox.Input"})}let Fo="button";function Vo(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=Ie(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(P.First)),n();return;case V.ArrowUp:O.preventDefault(),O.stopPropagation(),e.comboboxState===1&&(Z(()=>t.openCombobox()),e.value||t.goToOption(P.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(),!mo(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}),A=z(()=>({open:e.comboboxState===0,active:v||e.comboboxState===0,disabled:s,value:e.value,hover:M,focus:p}),[e,M,p,v,s]),R=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:R,theirProps:a,slot:A,defaultTag:Fo,name:"Combobox.Button"})}let Lo="div",wo=Fe.RenderStrategy|Fe.Static;function Bo(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=uo(d);C&&(f=!0);let[_,p]=io(C),w=ao(),M=se(n.optionsRef,r,C?_:null),F=Ae(n.optionsRef),v=co(),[y,A]=oo(u,n.optionsRef,v!==null?(v&de.Open)===de.Open:n.comboboxState===0);Je(y,n.inputRef,T.closeCombobox);let R=n.__demoMode?!1:s&&n.comboboxState===0;Qe(R,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]),to(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}),[n.comboboxState]),J=m(()=>{T.setActivationTrigger(0)}),Q=m(E=>{E.preventDefault(),T.setActivationTrigger(0)}),I=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,...eo(A)}),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(yo,{enabled:f?o.static||y:!1},D.createElement(ie.Provider,{value:n.mode===1?n:{...n,isSelected:i}},ne({ourProps:I,theirProps:{...a,children:D.createElement(so,{freeze:B},typeof a.children=="function"?(Y=a.children)==null?void 0:Y.call(a,G):a.children)},slot:G,defaultTag:Lo,features:wo,visible:y,name:"Combobox.Options"})))}let ko="div";function No(o,r){var I,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=(I=e.virtual)==null?void 0:I.disabled)==null?void 0:B.call(I,f))!=null?k:!1,order:u=null,...a}=o,n=Ie(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(),xo()||requestAnimationFrame(()=>n()),e.mode===0&&t.closeCombobox()))}),A=m(()=>{if(s)return t.goToOption(P.Nothing);let i=e.calculateIndex(f);t.goToOption(P.Specific,i)}),R=Ze(),h=m(i=>R.update(i)),O=m(i=>{if(!R.wasMoved(i)||s||T)return;let N=e.calculateIndex(f);t.goToOption(P.Specific,N,0)}),G=m(i=>{R.wasMoved(i)&&(s||T&&(e.optionsPropsRef.current.hold||t.goToOption(P.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:A,onPointerEnter:h,onMouseEnter:h,onPointerMove:O,onMouseMove:O,onPointerLeave:G,onMouseLeave:G},theirProps:a,slot:J,defaultTag:ko,name:"Combobox.Option"})}let Uo=te(ho),Ho=te(Vo),Go=te(Mo),jo=vo,zo=te(Bo),Ko=te(No),Nt=Object.assign(Uo,{Input:Go,Button:Ho,Label:jo,Options:zo,Option:Ko});export{Nt as Combobox,Ho as ComboboxButton,Go as ComboboxInput,jo as ComboboxLabel,Ko as ComboboxOption,zo as ComboboxOptions}; |
@@ -20,3 +20,3 @@ import React, { type ElementType, type ReactNode, type Ref } from 'react'; | ||
export type DescriptionProps<TTag extends ElementType = typeof DEFAULT_DESCRIPTION_TAG> = Props<TTag>; | ||
declare function DescriptionFn<TTag extends ElementType = typeof DEFAULT_DESCRIPTION_TAG>(props: DescriptionProps<TTag>, ref: Ref<HTMLParagraphElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null; | ||
declare function DescriptionFn<TTag extends ElementType = typeof DEFAULT_DESCRIPTION_TAG>(props: DescriptionProps<TTag>, ref: Ref<HTMLElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null; | ||
export interface _internal_ComponentDescription extends HasDisplayName { | ||
@@ -23,0 +23,0 @@ <TTag extends ElementType = typeof DEFAULT_DESCRIPTION_TAG>(props: DescriptionProps<TTag> & RefProp<typeof DescriptionFn>): JSX.Element; |
@@ -1,1 +0,1 @@ | ||
"use client";import m,{createContext as T,useContext as u,useMemo as c,useState as P}from"react";import{useEvent as g}from'../../hooks/use-event.js';import{useId as x}from'../../hooks/use-id.js';import{useIsoMorphicEffect as y}from'../../hooks/use-iso-morphic-effect.js';import{useSyncRefs as E}from'../../hooks/use-sync-refs.js';import{useDisabled as v}from'../../internal/disabled.js';import{forwardRefWithAs as R,render as I}from'../../utils/render.js';let a=T(null);a.displayName="DescriptionContext";function f(){let r=u(a);if(r===null){let e=new Error("You used a <Description /> component, but it is not inside a relevant parent.");throw Error.captureStackTrace&&Error.captureStackTrace(e,f),e}return r}function G(){var r,e;return(e=(r=u(a))==null?void 0:r.value)!=null?e:void 0}function U(){let[r,e]=P([]);return[r.length>0?r.join(" "):void 0,c(()=>function(t){let i=g(n=>(e(s=>[...s,n]),()=>e(s=>{let o=s.slice(),p=o.indexOf(n);return p!==-1&&o.splice(p,1),o}))),l=c(()=>({register:i,slot:t.slot,name:t.name,props:t.props,value:t.value}),[i,t.slot,t.name,t.props,t.value]);return m.createElement(a.Provider,{value:l},t.children)},[e])]}let S="p";function h(r,e){let d=x(),t=v(),{id:i=`headlessui-description-${d}`,...l}=r,n=f(),s=E(e);y(()=>n.register(i),[i,n.register]);let o=t||!1,p=c(()=>({...n.slot,disabled:o}),[n.slot,o]),D={ref:s,...n.props,id:i};return I({ourProps:D,theirProps:l,slot:p,defaultTag:S,name:n.name||"Description"})}let C=R(h),w=Object.assign(C,{});export{w as Description,G as useDescribedBy,U as useDescriptions}; | ||
"use client";import m,{createContext as T,useContext as u,useMemo as c,useState as P}from"react";import{useEvent as g}from'../../hooks/use-event.js';import{useId as x}from'../../hooks/use-id.js';import{useIsoMorphicEffect as y}from'../../hooks/use-iso-morphic-effect.js';import{useSyncRefs as E}from'../../hooks/use-sync-refs.js';import{useDisabled as v}from'../../internal/disabled.js';import{forwardRefWithAs as R,render as I}from'../../utils/render.js';let a=T(null);a.displayName="DescriptionContext";function f(){let r=u(a);if(r===null){let e=new Error("You used a <Description /> component, but it is not inside a relevant parent.");throw Error.captureStackTrace&&Error.captureStackTrace(e,f),e}return r}function G(){var r,e;return(e=(r=u(a))==null?void 0:r.value)!=null?e:void 0}function U(){let[r,e]=P([]);return[r.length>0?r.join(" "):void 0,c(()=>function(t){let i=g(n=>(e(s=>[...s,n]),()=>e(s=>{let o=s.slice(),p=o.indexOf(n);return p!==-1&&o.splice(p,1),o}))),l=c(()=>({register:i,slot:t.slot,name:t.name,props:t.props,value:t.value}),[i,t.slot,t.name,t.props,t.value]);return m.createElement(a.Provider,{value:l},t.children)},[e])]}let S="p";function C(r,e){let d=x(),t=v(),{id:i=`headlessui-description-${d}`,...l}=r,n=f(),s=E(e);y(()=>n.register(i),[i,n.register]);let o=t||!1,p=c(()=>({...n.slot,disabled:o}),[n.slot,o]),D={ref:s,...n.props,id:i};return I({ourProps:D,theirProps:l,slot:p,defaultTag:S,name:n.name||"Description"})}let _=R(C),w=Object.assign(_,{});export{w as Description,G as useDescribedBy,U as useDescriptions}; |
@@ -17,12 +17,14 @@ import React, { type ElementType, type MutableRefObject, type Ref } from 'react'; | ||
autoFocus?: boolean; | ||
transition?: boolean; | ||
__demoMode?: boolean; | ||
}>; | ||
declare function DialogFn<TTag extends ElementType = typeof DEFAULT_DIALOG_TAG>(props: DialogProps<TTag>, ref: Ref<HTMLDivElement>): React.JSX.Element; | ||
declare let DEFAULT_OVERLAY_TAG: "div"; | ||
type OverlayRenderPropArg = { | ||
declare function DialogFn<TTag extends ElementType = typeof DEFAULT_DIALOG_TAG>(props: DialogProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; | ||
declare let DEFAULT_PANEL_TAG: "div"; | ||
type PanelRenderPropArg = { | ||
open: boolean; | ||
}; | ||
type OverlayPropsWeControl = 'aria-hidden'; | ||
export type DialogOverlayProps<TTag extends ElementType = typeof DEFAULT_OVERLAY_TAG> = Props<TTag, OverlayRenderPropArg, OverlayPropsWeControl>; | ||
declare function OverlayFn<TTag extends ElementType = typeof DEFAULT_OVERLAY_TAG>(props: DialogOverlayProps<TTag>, ref: Ref<HTMLDivElement>): 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"; | ||
@@ -32,11 +34,6 @@ type BackdropRenderPropArg = { | ||
}; | ||
type BackdropPropsWeControl = 'aria-hidden'; | ||
export type DialogBackdropProps<TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG> = Props<TTag, BackdropRenderPropArg, BackdropPropsWeControl>; | ||
declare function BackdropFn<TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG>(props: DialogBackdropProps<TTag>, ref: Ref<HTMLDivElement>): React.JSX.Element; | ||
declare let DEFAULT_PANEL_TAG: "div"; | ||
type PanelRenderPropArg = { | ||
open: boolean; | ||
}; | ||
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<HTMLDivElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null; | ||
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"; | ||
@@ -47,14 +44,11 @@ type TitleRenderPropArg = { | ||
export type DialogTitleProps<TTag extends ElementType = typeof DEFAULT_TITLE_TAG> = Props<TTag, TitleRenderPropArg>; | ||
declare function TitleFn<TTag extends ElementType = typeof DEFAULT_TITLE_TAG>(props: DialogTitleProps<TTag>, ref: Ref<HTMLHeadingElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null; | ||
declare function TitleFn<TTag extends ElementType = typeof DEFAULT_TITLE_TAG>(props: DialogTitleProps<TTag>, ref: Ref<HTMLElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null; | ||
export interface _internal_ComponentDialog extends HasDisplayName { | ||
<TTag extends ElementType = typeof DEFAULT_DIALOG_TAG>(props: DialogProps<TTag> & RefProp<typeof DialogFn>): JSX.Element; | ||
} | ||
export interface _internal_ComponentDialogBackdrop extends HasDisplayName { | ||
<TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG>(props: DialogBackdropProps<TTag> & RefProp<typeof BackdropFn>): JSX.Element; | ||
} | ||
export interface _internal_ComponentDialogPanel extends HasDisplayName { | ||
<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(props: DialogPanelProps<TTag> & RefProp<typeof PanelFn>): JSX.Element; | ||
} | ||
export interface _internal_ComponentDialogOverlay extends HasDisplayName { | ||
<TTag extends ElementType = typeof DEFAULT_OVERLAY_TAG>(props: DialogOverlayProps<TTag> & RefProp<typeof OverlayFn>): JSX.Element; | ||
export interface _internal_ComponentDialogBackdrop extends HasDisplayName { | ||
<TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG>(props: DialogBackdropProps<TTag> & RefProp<typeof BackdropFn>): JSX.Element; | ||
} | ||
@@ -66,5 +60,4 @@ export interface _internal_ComponentDialogTitle extends HasDisplayName { | ||
} | ||
export declare let DialogPanel: _internal_ComponentDialogPanel; | ||
export declare let DialogBackdrop: _internal_ComponentDialogBackdrop; | ||
export declare let DialogPanel: _internal_ComponentDialogPanel; | ||
export declare let DialogOverlay: _internal_ComponentDialogOverlay; | ||
export declare let DialogTitle: _internal_ComponentDialogTitle; | ||
@@ -74,5 +67,5 @@ /** @deprecated use `<Description>` instead of `<DialogDescription>` */ | ||
export declare let Dialog: _internal_ComponentDialog & { | ||
Backdrop: _internal_ComponentDialogBackdrop; | ||
/** @deprecated use `<DialogPanel>` instead of `<Dialog.Panel>` */ | ||
Panel: _internal_ComponentDialogPanel; | ||
Overlay: _internal_ComponentDialogOverlay; | ||
/** @deprecated use `<DialogTitle>` instead of `<Dialog.Title>` */ | ||
Title: _internal_ComponentDialogTitle; | ||
@@ -79,0 +72,0 @@ /** @deprecated use `<Description>` instead of `<Dialog.Description>` */ |
@@ -1,1 +0,1 @@ | ||
"use client";import n,{createContext as ce,createRef as me,useContext as J,useEffect as K,useMemo as P,useReducer as ye,useRef as V,useState as Pe}from"react";import{useEvent as c}from'../../hooks/use-event.js';import{useEventListener as Ee}from'../../hooks/use-event-listener.js';import{useId as A}from'../../hooks/use-id.js';import{useInertOthers as Ae}from'../../hooks/use-inert-others.js';import{useIsTouchDevice as _e}from'../../hooks/use-is-touch-device.js';import{useOnDisappear as Ce}from'../../hooks/use-on-disappear.js';import{useOutsideClick as Re}from'../../hooks/use-outside-click.js';import{useOwnerDocument as ve}from'../../hooks/use-owner.js';import{useRootContainers as Fe}from'../../hooks/use-root-containers.js';import{useScrollLock as Oe}from'../../hooks/use-scroll-lock.js';import{useServerHandoffComplete as xe}from'../../hooks/use-server-handoff-complete.js';import{useSyncRefs as _}from'../../hooks/use-sync-refs.js';import{CloseProvider as Le}from'../../internal/close-provider.js';import{HoistFormFields as be}from'../../internal/form-fields.js';import{State as b,useOpenClosed as he}from'../../internal/open-closed.js';import{ForcePortalRoot as M}from'../../internal/portal-force-root.js';import{StackMessage as X,StackProvider as Se}from'../../internal/stack-context.js';import{isDisabledReactIssue7711 as ke}from'../../utils/bugs.js';import{match as w}from'../../utils/match.js';import{RenderFeatures as q,forwardRefWithAs as C,render as R}from'../../utils/render.js';import{Description as z,useDescriptions as Ie}from'../description/description.js';import{FocusTrap as Ge,FocusTrapFeatures as m}from'../focus-trap/focus-trap.js';import{Keys as Me}from'../keyboard.js';import{Portal as B,useNestedPortals as we}from'../portal/portal.js';var Be=(r=>(r[r.Open=0]="Open",r[r.Closed=1]="Closed",r))(Be||{}),Ue=(e=>(e[e.SetTitleId=0]="SetTitleId",e))(Ue||{});let He={[0](t,e){return t.titleId===e.id?t:{...t,titleId:e.id}}},h=ce(null);h.displayName="DialogContext";function v(t){let e=J(h);if(e===null){let r=new Error(`<${t} /> is missing a parent <Dialog /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,v),r}return e}function Ne(t,e){return w(e.type,He,t,e)}let We="div",Ye=q.RenderStrategy|q.Static;function $e(t,e){let r=A(),{id:s=`headlessui-dialog-${r}`,open:i,onClose:l,initialFocus:p,role:a="dialog",autoFocus:f=!0,__demoMode:g=!1,...S}=t,[u,U]=Pe(0),H=V(!1);a=function(){return a==="dialog"||a==="alertdialog"?a:(H.current||(H.current=!0,console.warn(`Invalid role [${a}] passed to <Dialog />. Only \`dialog\` and and \`alertdialog\` are supported. Using \`dialog\` instead.`)),"dialog")}();let E=he();i===void 0&&E!==null&&(i=(E&b.Open)===b.Open);let T=V(null),Q=_(T,e),F=ve(T),N=t.hasOwnProperty("open")||E!==null,W=t.hasOwnProperty("onClose");if(!N&&!W)throw new Error("You have to provide an `open` and an `onClose` prop to the `Dialog` component.");if(!N)throw new Error("You provided an `onClose` prop to the `Dialog`, but forgot an `open` prop.");if(!W)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 l!="function")throw new Error(`You provided an \`onClose\` prop to the \`Dialog\`, but the value is not a function. Received: ${l}`);let d=i?0:1,[O,Z]=ye(Ne,{titleId:null,descriptionId:null,panelRef:me()}),y=c(()=>l(!1)),Y=c(o=>Z({type:0,id:o})),k=xe()?d===0:!1,x=u>1,ee=J(h)!==null,[te,oe]=we(),re={get current(){var o;return(o=O.panelRef.current)!=null?o:T.current}},{resolveContainers:I,mainTreeNodeRef:le,MainTreeNode:ae}=Fe({portals:te,defaultContainers:[re]}),ne=x?"parent":"leaf",$=E!==null?(E&b.Closing)===b.Closing:!1,ie=(()=>x||$?!1:k)();Ae({allowed:c(()=>{var o,D;return[(D=(o=T.current)==null?void 0:o.closest("[data-headlessui-portal]"))!=null?D:null]}),disallowed:c(()=>{var o,D;return[(D=(o=le.current)==null?void 0:o.closest("body > *:not(#headlessui-portal-root)"))!=null?D:null]})},g?!1:ie);let pe=(()=>!(!k||x))();Re(I,o=>{o.preventDefault(),y()},pe);let se=(()=>!(x||d!==0))();Ee(F==null?void 0:F.defaultView,"keydown",o=>{se&&(o.defaultPrevented||o.key===Me.Escape&&(o.preventDefault(),o.stopPropagation(),y()))});let de=(()=>!($||d!==0||ee))();Oe(F,g?!1:de,I),Ce(T,y,d===0);let[ue,fe]=Ie(),ge=P(()=>[{dialogState:d,close:y,setTitleId:Y},O],[d,O,y,Y]),j=P(()=>({open:d===0}),[d]),Te={ref:Q,id:s,role:a,tabIndex:-1,"aria-modal":d===0?!0:void 0,"aria-labelledby":O.titleId,"aria-describedby":ue},De=!_e(),L=k?w(ne,{parent:m.RestoreFocus,leaf:m.All&~m.FocusLock}):m.None;return f&&(L|=m.AutoFocus),De||(L&=~m.InitialFocus),g&&(L=m.None),n.createElement(Se,{type:"Dialog",enabled:d===0,element:T,onUpdate:c((o,D)=>{D==="Dialog"&&w(o,{[X.Add]:()=>U(G=>G+1),[X.Remove]:()=>U(G=>G-1)})})},n.createElement(M,{force:!0},n.createElement(B,null,n.createElement(h.Provider,{value:ge},n.createElement(B.Group,{target:T},n.createElement(M,{force:!1},n.createElement(fe,{slot:j,name:"Dialog.Description"},n.createElement(oe,null,n.createElement(Ge,{initialFocus:p,initialFocusFallback:T,containers:I,features:L},n.createElement(Le,{value:y},R({ourProps:Te,theirProps:S,slot:j,defaultTag:We,features:Ye,visible:d===0,name:"Dialog"})))))))))),n.createElement(be,null,n.createElement(ae,null)))}let je="div";function Je(t,e){let r=A(),{id:s=`headlessui-dialog-overlay-${r}`,...i}=t,[{dialogState:l,close:p}]=v("Dialog.Overlay"),a=_(e),f=c(u=>{if(u.target===u.currentTarget){if(ke(u.currentTarget))return u.preventDefault();u.preventDefault(),u.stopPropagation(),p()}}),g=P(()=>({open:l===0}),[l]);return R({ourProps:{ref:a,id:s,"aria-hidden":!0,onClick:f},theirProps:i,slot:g,defaultTag:je,name:"Dialog.Overlay"})}let Ke="div";function Ve(t,e){let r=A(),{id:s=`headlessui-dialog-backdrop-${r}`,...i}=t,[{dialogState:l},p]=v("Dialog.Backdrop"),a=_(e);K(()=>{if(p.panelRef.current===null)throw new Error("A <Dialog.Backdrop /> component is being used, but a <Dialog.Panel /> component is missing.")},[p.panelRef]);let f=P(()=>({open:l===0}),[l]);return n.createElement(M,{force:!0},n.createElement(B,null,R({ourProps:{ref:a,id:s,"aria-hidden":!0},theirProps:i,slot:f,defaultTag:Ke,name:"Dialog.Backdrop"})))}let Xe="div";function qe(t,e){let r=A(),{id:s=`headlessui-dialog-panel-${r}`,...i}=t,[{dialogState:l},p]=v("Dialog.Panel"),a=_(e,p.panelRef),f=P(()=>({open:l===0}),[l]),g=c(u=>{u.stopPropagation()});return R({ourProps:{ref:a,id:s,onClick:g},theirProps:i,slot:f,defaultTag:Xe,name:"Dialog.Panel"})}let ze="h2";function Qe(t,e){let r=A(),{id:s=`headlessui-dialog-title-${r}`,...i}=t,[{dialogState:l,setTitleId:p}]=v("Dialog.Title"),a=_(e);K(()=>(p(s),()=>p(null)),[s,p]);let f=P(()=>({open:l===0}),[l]);return R({ourProps:{ref:a,id:s},theirProps:i,slot:f,defaultTag:ze,name:"Dialog.Title"})}let Ze=C($e),et=C(Ve),tt=C(qe),ot=C(Je),rt=C(Qe),bt=z,ht=Object.assign(Ze,{Backdrop:et,Panel:tt,Overlay:ot,Title:rt,Description:z});export{ht as Dialog,et as DialogBackdrop,bt as DialogDescription,ot as DialogOverlay,tt as DialogPanel,rt 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}; |
@@ -38,4 +38,6 @@ import React, { type ElementType, type MutableRefObject, type Ref } from 'react'; | ||
declare let PanelRenderFeatures: number; | ||
export type DisclosurePanelProps<TTag extends ElementType = typeof DEFAULT_PANEL_TAG> = Props<TTag, PanelRenderPropArg, DisclosurePanelPropsWeControl, PropsForFeatures<typeof PanelRenderFeatures>>; | ||
declare function PanelFn<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(props: DisclosurePanelProps<TTag>, ref: Ref<HTMLDivElement>): React.JSX.Element; | ||
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; | ||
export interface _internal_ComponentDisclosure extends HasDisplayName { | ||
@@ -53,5 +55,7 @@ <TTag extends ElementType = typeof DEFAULT_DISCLOSURE_TAG>(props: DisclosureProps<TTag> & RefProp<typeof DisclosureFn>): JSX.Element; | ||
export declare let Disclosure: _internal_ComponentDisclosure & { | ||
/** @deprecated use `<DisclosureButton>` instead of `<Disclosure.Button>` */ | ||
Button: _internal_ComponentDisclosureButton; | ||
/** @deprecated use `<DisclosurePanel>` instead of `<Disclosure.Panel>` */ | ||
Panel: _internal_ComponentDisclosurePanel; | ||
}; | ||
export {}; |
@@ -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 ie}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 ue}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,i=R(null),r=v(n,ne(c=>{i.current=c},e.as===void 0||e.as===K)),t=R(null),l=R(null),u=Z(fe,{disclosureState:o?0:1,linkedPanel:!1,buttonRef:l,panelRef:t,buttonId:null,panelId:null}),[{disclosureState:f,buttonId:s},T]=u,p=A(c=>{T({type:1});let P=ie(i);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:u},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:i=!1,autoFocus:r=!1,...t}=e,[l,u]=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 u({type:2,buttonId:d}),()=>{u({type:2,buttonId:null})}},[d,u,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(),u({type:0}),(E=l.buttonRef.current)==null||E.focus();break}}else switch(a.key){case S.Space:case S.Enter:a.preventDefault(),a.stopPropagation(),u({type:0});break}}),I=A(a=>{switch(a.key){case S.Space:a.preventDefault();break}}),c=A(a=>{var E;se(a.currentTarget)||i||(s?(u({type:0}),(E=l.buttonRef.current)==null||E.focus()):u({type:0}))}),{isFocusVisible:P,focusProps:y}=Q({autoFocus:r}),{isHovered:U,hoverProps:h}=Y({isDisabled:i}),{pressed:N,pressProps:w}=ee({disabled:i}),q=b(()=>({open:l.disclosureState===0,hover:U,active:N,disabled:i,focus:P,autofocus:r}),[l,U,N,P,i,r]),G=te(e,T),z=s?J({ref:p,type:G,disabled:i||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:i||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}`,...i}=e,[r,t]=F("Disclosure.Panel"),{close:l}=V("Disclosure.Panel"),u=X(),f=v(n,r.panelRef,D=>{ue(()=>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:u,ourProps:m,theirProps:i,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 m,{Fragment as K,createContext as x,useContext as L,useEffect as j,useMemo as R,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{transitionDataAttributes as oe,useTransition as re}from'../../hooks/use-transition.js';import{CloseProvider as le}from'../../internal/close-provider.js';import{OpenClosedProvider as se,ResetOpenClosedProvider as ie,State as I,useOpenClosed as ue}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as ae}from'../../utils/bugs.js';import{match as O}from'../../utils/match.js';import{getOwnerDocument as pe}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 ce}from'../../utils/start-transition.js';import{Keys as b}from'../keyboard.js';var de=(r=>(r[r.Open=0]="Open",r[r.Closed=1]="Closed",r))(de||{}),fe=(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))(fe||{});let Te={[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 De(){return L(H)}function Pe(e,n){return O(n.type,Te,e,n)}let ye=K;function me(e,n){let{defaultOpen:r=!1,...c}=e,s=A(null),d=v(n,ne(u=>{s.current=u},e.as===void 0||e.as===K)),t=A(null),o=A(null),l=Z(Pe,{disclosureState:r?0:1,linkedPanel:!1,buttonRef:o,panelRef:t,buttonId:null,panelId:null}),[{disclosureState:f,buttonId:i},T]=l,p=C(u=>{T({type:1});let P=pe(s);if(!P||!i)return;let y=(()=>u?u instanceof HTMLElement?u:u.current instanceof HTMLElement?u.current:P.getElementById(i):P.getElementById(i))();y==null||y.focus()}),E=R(()=>({close:p}),[p]),D=R(()=>({open:f===0,close:p}),[f,p]),g={ref:d};return m.createElement(M.Provider,{value:l},m.createElement(k.Provider,{value:E},m.createElement(le,{value:p},m.createElement(se,{value:O(f,{[0]:I.Open,[1]:I.Closed})},B({ourProps:g,theirProps:c,slot:D,defaultTag:ye,name:"Disclosure"})))))}let Ee="button";function ge(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=De(),i=f===null?!1:f===o.panelId,T=A(null),p=v(T,n,i?null:o.buttonRef),E=X();j(()=>{if(!i)return l({type:2,buttonId:c}),()=>{l({type:2,buttonId:null})}},[c,l,i]);let D=C(a=>{var S;if(i){if(o.disclosureState===1)return;switch(a.key){case b.Space:case b.Enter:a.preventDefault(),a.stopPropagation(),l({type:0}),(S=o.buttonRef.current)==null||S.focus();break}}else switch(a.key){case b.Space:case b.Enter:a.preventDefault(),a.stopPropagation(),l({type:0});break}}),g=C(a=>{switch(a.key){case b.Space:a.preventDefault();break}}),u=C(a=>{var S;ae(a.currentTarget)||s||(i?(l({type:0}),(S=o.buttonRef.current)==null||S.focus()):l({type:0}))}),{isFocusVisible:P,focusProps:y}=Q({autoFocus:d}),{isHovered:U,hoverProps:h}=Y({isDisabled:s}),{pressed:N,pressProps:w}=ee({disabled:s}),q=R(()=>({open:o.disclosureState===0,hover:U,active:N,disabled:s,focus:P,autofocus:d}),[o,U,N,P,s,d]),G=te(e,T),z=i?J({ref:p,type:G,disabled:s||void 0,autoFocus:d,onKeyDown:D,onClick:u},y,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:D,onKeyUp:g,onClick:u},y,h,w);return B({mergeRefs:E,ourProps:z,theirProps:t,slot:q,defaultTag:Ee,name:"Disclosure.Button"})}let Se="div",be=$.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,u=>{ce(()=>o({type:u?4:5}))});j(()=>(o({type:3,panelId:c}),()=>{o({type:3,panelId:null})}),[c,o]);let T=ue(),[p,E]=re(s,t.panelRef,T!==null?(T&I.Open)===I.Open:t.disclosureState===0),D=R(()=>({open:t.disclosureState===0,close:l}),[t.disclosureState,l]),g={ref:i,id:c,...oe(E)};return m.createElement(ie,null,m.createElement(H.Provider,{value:t.panelId},B({mergeRefs:f,ourProps:g,theirProps:d,slot:D,defaultTag:Se,features:be,visible:p,name:"Disclosure.Panel"})))}let Ae=_(me),Ce=_(ge),Ie=_(Re),We=Object.assign(Ae,{Button:Ce,Panel:Ie});export{We as Disclosure,Ce as DisclosureButton,Ie as DisclosurePanel}; |
import { type ElementType } from 'react'; | ||
import type { Props } from '../../types.js'; | ||
import { type HasDisplayName } from '../../utils/render.js'; | ||
declare let DEFAULT_FIELDSET_TAG: "div"; | ||
declare let DEFAULT_FIELDSET_TAG: "fieldset"; | ||
type FieldsetRenderPropArg = {}; | ||
type FieldsetPropsWeControl = 'aria-controls'; | ||
type FieldsetPropsWeControl = 'aria-labelledby' | 'aria-disabled' | 'role'; | ||
export type FieldsetProps<TTag extends ElementType = typeof DEFAULT_FIELDSET_TAG> = Props<TTag, FieldsetRenderPropArg, FieldsetPropsWeControl, { | ||
@@ -8,0 +8,0 @@ disabled?: boolean; |
@@ -1,1 +0,1 @@ | ||
"use client";import t,{useMemo as a}from"react";import{DisabledProvider as n,useDisabled as T}from'../../internal/disabled.js';import{forwardRefWithAs as m,render as F}from'../../utils/render.js';import{useLabels as y}from'../label/label.js';let f="div";function E(r,l){let o=T(),{disabled:e=o||!1,...s}=r,[i,d]=y(),p=a(()=>({disabled:e}),[e]);return t.createElement(n,{value:e},t.createElement(d,null,F({ourProps:{ref:l,role:"group","aria-labelledby":i,"aria-disabled":e||void 0},theirProps:s,slot:p,defaultTag:f,name:"Fieldset"})))}let L=m(E);export{L as Fieldset}; | ||
"use client";import o,{useMemo as y}from"react";import{useResolvedTag as F}from'../../hooks/use-resolved-tag.js';import{useSyncRefs as b}from'../../hooks/use-sync-refs.js';import{DisabledProvider as E,useDisabled as P}from'../../internal/disabled.js';import{forwardRefWithAs as u,render as g}from'../../utils/render.js';import{useLabels as D}from'../label/label.js';let d="fieldset";function A(t,i){var s;let a=P(),{disabled:e=a||!1,...p}=t,[n,T]=F((s=t.as)!=null?s:d),l=b(i,T),[r,f]=D(),m=y(()=>({disabled:e}),[e]);return o.createElement(E,{value:e},o.createElement(f,null,g({ourProps:n==="fieldset"?{ref:l,"aria-labelledby":r,disabled:e||void 0}:{ref:l,role:"group","aria-labelledby":r,"aria-disabled":e||void 0},theirProps:p,slot:m,defaultTag:d,name:"Fieldset"})))}let C=u(A);export{C as Fieldset}; |
@@ -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 | ||
} | ||
@@ -31,3 +29,3 @@ type FocusTrapRenderPropArg = {}; | ||
}>; | ||
declare function FocusTrapFn<TTag extends ElementType = typeof DEFAULT_FOCUS_TRAP_TAG>(props: FocusTrapProps<TTag>, ref: Ref<HTMLDivElement>): React.JSX.Element; | ||
declare function FocusTrapFn<TTag extends ElementType = typeof DEFAULT_FOCUS_TRAP_TAG>(props: FocusTrapProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; | ||
export interface _internal_ComponentFocusTrap extends HasDisplayName { | ||
@@ -37,4 +35,5 @@ <TTag extends ElementType = typeof DEFAULT_FOCUS_TRAP_TAG>(props: FocusTrapProps<TTag> & RefProp<typeof FocusTrapFn>): JSX.Element; | ||
export declare let FocusTrap: _internal_ComponentFocusTrap & { | ||
/** @deprecated use `FocusTrapFeatures` instead of `FocusTrap.features` */ | ||
features: typeof FocusTrapFeatures; | ||
}; | ||
export {}; |
@@ -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 A}from'../../hooks/use-event.js';import{useEventListener as G}from'../../hooks/use-event-listener.js';import{useIsMounted as g}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 m}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(),v=A(a=>{let i=e.current;if(!i)return;(N=>N())(()=>{C(b.current,{[M.Forwards]:()=>{m(i,T.First,{skipElements:[a.relatedTarget,p]})},[M.Backwards]:()=>{m(i,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 i=S(u);e.current instanceof HTMLElement&&i.add(e.current);let E=a.relatedTarget;E instanceof HTMLElement&&E.dataset.headlessuiFocusGuard!=="true"&&(j(i,E)||(H.current?m(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:v,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:v,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]),A(()=>{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=g();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(m(l,T.First|T.AutoFocus)!==O.Error)return}else if(m(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=g();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}; |
@@ -57,2 +57,3 @@ import React, { type ElementType, type Ref } from 'react'; | ||
modal?: boolean; | ||
transition?: boolean; | ||
} & PropsForFeatures<typeof OptionsRenderFeatures>>; | ||
@@ -110,8 +111,13 @@ declare function OptionsFn<TTag extends ElementType = typeof DEFAULT_OPTIONS_TAG>(props: ListboxOptionsProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; | ||
export declare let Listbox: _internal_ComponentListbox & { | ||
/** @deprecated use `<ListboxButton>` instead of `<Listbox.Button>` */ | ||
Button: _internal_ComponentListboxButton; | ||
/** @deprecated use `<Label>` instead of `<Listbox.Label>` */ | ||
Label: _internal_ComponentListboxLabel; | ||
/** @deprecated use `<ListboxOptions>` instead of `<Listbox.Options>` */ | ||
Options: _internal_ComponentListboxOptions; | ||
/** @deprecated use `<ListboxOption>` instead of `<Listbox.Option>` */ | ||
Option: _internal_ComponentListboxOption; | ||
/** @deprecated use `<ListboxSelectedOption>` instead of `<Listbox.SelectedOption>` */ | ||
SelectedOption: _internal_ComponentListboxSelectedOption; | ||
}; | ||
export {}; |
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as Re}from"@react-aria/focus";import{useHover as Pe}from"@react-aria/interactions";import _,{Fragment as pe,createContext as ee,createRef as Ae,useCallback as ue,useContext as te,useEffect as de,useMemo as k,useReducer as Ee,useRef as H,useState as he}from"react";import{useActivePress as De}from'../../hooks/use-active-press.js';import{useByComparator as _e}from'../../hooks/use-by-comparator.js';import{useComputed as Ie}from'../../hooks/use-computed.js';import{useControllable as Ce}from'../../hooks/use-controllable.js';import{useDidElementMove as Fe}from'../../hooks/use-did-element-move.js';import{useDisposables as X}from'../../hooks/use-disposables.js';import{useElementSize as Me}from'../../hooks/use-element-size.js';import{useEvent as f}from'../../hooks/use-event.js';import{useId as oe}from'../../hooks/use-id.js';import{useInertOthers as we}from'../../hooks/use-inert-others.js';import{useIsoMorphicEffect as ne}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as Be}from'../../hooks/use-latest-value.js';import{useOnDisappear as Ue}from'../../hooks/use-on-disappear.js';import{useOutsideClick as ke}from'../../hooks/use-outside-click.js';import{useOwnerDocument as Ne}from'../../hooks/use-owner.js';import{useResolveButtonType as Ge}from'../../hooks/use-resolve-button-type.js';import{useScrollLock as He}from'../../hooks/use-scroll-lock.js';import{useSyncRefs as K}from'../../hooks/use-sync-refs.js';import{useTextValue as Ve}from'../../hooks/use-text-value.js';import{useTrackedPointer as Ke}from'../../hooks/use-tracked-pointer.js';import{useDisabled as je}from'../../internal/disabled.js';import{FloatingProvider as ze,useFloatingPanel as We,useFloatingPanelProps as Qe,useFloatingReference as Xe,useFloatingReferenceProps as Je,useResolvedAnchor as $e}from'../../internal/floating.js';import{FormFields as qe}from'../../internal/form-fields.js';import{useProvidedId as Ye}from'../../internal/id.js';import{OpenClosedProvider as Ze,State as J,useOpenClosed as et}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as tt}from'../../utils/bugs.js';import{Focus as m,calculateActiveIndex as ie}from'../../utils/calculate-active-index.js';import{disposables as re}from'../../utils/disposables.js';import{FocusableMode as ot,isFocusableElement as nt,sortByDomNode as it}from'../../utils/focus-management.js';import{attemptSubmit as rt}from'../../utils/form.js';import{match as V}from'../../utils/match.js';import{getOwnerDocument as at}from'../../utils/owner.js';import{RenderFeatures as ce,forwardRefWithAs as j,mergeProps as fe,render as z}from'../../utils/render.js';import{useDescribedBy as lt}from'../description/description.js';import{Keys as S}from'../keyboard.js';import{Label as st,useLabelledBy as pt,useLabels as ut}from'../label/label.js';import{Portal as dt}from'../portal/portal.js';var ct=(o=>(o[o.Open=0]="Open",o[o.Closed=1]="Closed",o))(ct||{}),ft=(o=>(o[o.Single=0]="Single",o[o.Multi=1]="Multi",o))(ft||{}),bt=(o=>(o[o.Pointer=0]="Pointer",o[o.Other=1]="Other",o))(bt||{}),Tt=(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))(Tt||{});function ae(e,a=o=>o){let o=e.activeOptionIndex!==null?e.options[e.activeOptionIndex]:null,n=it(a(e.options.slice()),x=>x.dataRef.current.domRef.current),p=o?n.indexOf(o):null;return p===-1&&(p=null),{options:n,activeOptionIndex:p}}let xt={[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 a=e.activeOptionIndex,{isSelected:o}=e.dataRef.current,n=e.options.findIndex(p=>o(p.dataRef.current.value));return n!==-1&&(a=n),{...e,listboxState:0,activeOptionIndex:a,__demoMode:!1}},[2](e,a){var x,O,i,l,t;if(e.dataRef.current.disabled||e.listboxState===1)return e;let o={...e,searchQuery:"",activationTrigger:(x=a.trigger)!=null?x:1,__demoMode:!1};if(a.focus===m.Nothing)return{...o,activeOptionIndex:null};if(a.focus===m.Specific)return{...o,activeOptionIndex:e.options.findIndex(r=>r.id===a.id)};if(a.focus===m.Previous){let r=e.activeOptionIndex;if(r!==null){let A=e.options[r].dataRef.current.domRef,d=ie(a,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:u=>u.id,resolveDisabled:u=>u.dataRef.current.disabled});if(d!==null){let u=e.options[d].dataRef.current.domRef;if(((O=A.current)==null?void 0:O.previousElementSibling)===u.current||((i=u.current)==null?void 0:i.previousElementSibling)===null)return{...o,activeOptionIndex:d}}}}else if(a.focus===m.Next){let r=e.activeOptionIndex;if(r!==null){let A=e.options[r].dataRef.current.domRef,d=ie(a,{resolveItems:()=>e.options,resolveActiveIndex:()=>e.activeOptionIndex,resolveId:u=>u.id,resolveDisabled:u=>u.dataRef.current.disabled});if(d!==null){let u=e.options[d].dataRef.current.domRef;if(((l=A.current)==null?void 0:l.nextElementSibling)===u.current||((t=u.current)==null?void 0:t.nextElementSibling)===null)return{...o,activeOptionIndex:d}}}}let n=ae(e),p=ie(a,{resolveItems:()=>n.options,resolveActiveIndex:()=>n.activeOptionIndex,resolveId:r=>r.id,resolveDisabled:r=>r.dataRef.current.disabled});return{...o,...n,activeOptionIndex:p}},[3]:(e,a)=>{if(e.dataRef.current.disabled||e.listboxState===1)return e;let n=e.searchQuery!==""?0:1,p=e.searchQuery+a.value.toLowerCase(),O=(e.activeOptionIndex!==null?e.options.slice(e.activeOptionIndex+n).concat(e.options.slice(0,e.activeOptionIndex+n)):e.options).find(l=>{var t;return!l.dataRef.current.disabled&&((t=l.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,a)=>{let o={id:a.id,dataRef:a.dataRef},n=ae(e,p=>[...p,o]);return e.activeOptionIndex===null&&e.dataRef.current.isSelected(a.dataRef.current.value)&&(n.activeOptionIndex=n.options.indexOf(o)),{...e,...n}},[6]:(e,a)=>{let o=ae(e,n=>{let p=n.findIndex(x=>x.id===a.id);return p!==-1&&n.splice(p,1),n});return{...e,...o,activationTrigger:1}}},le=ee(null);le.displayName="ListboxActionsContext";function $(e){let a=te(le);if(a===null){let o=new Error(`<${e} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,$),o}return a}let q=ee(null);q.displayName="ListboxDataContext";function W(e){let a=te(q);if(a===null){let o=new Error(`<${e} /> is missing a parent <Listbox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(o,W),o}return a}function mt(e,a){return V(a.type,xt,e,a)}let Ot=pe;function yt(e,a){var se;let o=je(),{value:n,defaultValue:p,form:x,name:O,onChange:i,by:l,invalid:t=!1,disabled:r=o||!1,horizontal:A=!1,multiple:d=!1,__demoMode:u=!1,...h}=e;const N=A?"horizontal":"vertical";let B=K(a),[E=d?[]:void 0,y]=Ce(n,i,p),[D,g]=Ee(mt,{dataRef:Ae(),listboxState:u?0:1,options:[],searchQuery:"",activeOptionIndex:null,activationTrigger:1,optionsVisible:!1,__demoMode:u}),C=H({static:!1,hold:!1}),U=H(null),F=H(null),b=H(new Map),R=_e(l),w=ue(T=>V(c.mode,{[1]:()=>E.some(L=>R(L,T)),[0]:()=>R(E,T)}),[E]),c=k(()=>({...D,value:E,disabled:r,invalid:t,mode:d?1:0,orientation:N,compare:R,isSelected:w,optionsPropsRef:C,buttonRef:U,optionsRef:F,listRef:b}),[E,r,t,d,D,b]);ne(()=>{D.dataRef.current=c},[c]),ke([c.buttonRef,c.optionsRef],(T,L)=>{var I;g({type:1}),nt(L,ot.Loose)||(T.preventDefault(),(I=c.buttonRef.current)==null||I.focus())},c.listboxState===0);let v=k(()=>({open:c.listboxState===0,disabled:r,invalid:t,value:E}),[c,r,E,t]),G=f(T=>{let L=c.options.find(I=>I.id===T);L&&Z(L.dataRef.current.value)}),Y=f(()=>{if(c.activeOptionIndex!==null){let{dataRef:T,id:L}=c.options[c.activeOptionIndex];Z(T.current.value),g({type:2,focus:m.Specific,id:L})}}),Q=f(()=>g({type:0})),s=f(()=>g({type:1})),P=X(),M=f((T,L,I)=>{P.dispose(),P.microTask(()=>T===m.Specific?g({type:2,focus:m.Specific,id:L,trigger:I}):g({type:2,focus:T,trigger:I}))}),Te=f((T,L)=>(g({type:5,id:T,dataRef:L}),()=>g({type:6,id:T}))),Z=f(T=>V(c.mode,{[0](){return y==null?void 0:y(T)},[1](){let L=c.value.slice(),I=L.findIndex(Se=>R(Se,T));return I===-1?L.push(T):L.splice(I,1),y==null?void 0:y(L)}})),xe=f(T=>g({type:3,value:T})),me=f(()=>g({type:4})),Oe=k(()=>({onChange:Z,registerOption:Te,goToOption:M,closeListbox:s,openListbox:Q,selectActiveOption:Y,selectOption:G,search:xe,clearSearch:me}),[]),[ye,ve]=ut({inherit:!0}),ge={ref:B},Le=ue(()=>y==null?void 0:y(p),[y]);return _.createElement(ve,{value:ye,props:{htmlFor:(se=c.buttonRef.current)==null?void 0:se.id},slot:{open:c.listboxState===0,disabled:r}},_.createElement(ze,null,_.createElement(le.Provider,{value:Oe},_.createElement(q.Provider,{value:c},_.createElement(Ze,{value:V(c.listboxState,{[0]:J.Open,[1]:J.Closed})},O!=null&&E!=null&&_.createElement(qe,{disabled:r,data:{[O]:E},form:x,onReset:Le}),z({ourProps:ge,theirProps:h,slot:v,defaultTag:Ot,name:"Listbox"}))))))}let vt="button";function gt(e,a){var c;let o=W("Listbox.Button"),n=$("Listbox.Button"),p=oe(),x=Ye(),{id:O=x||`headlessui-listbox-button-${p}`,disabled:i=o.disabled||!1,autoFocus:l=!1,...t}=e,r=K(o.buttonRef,a,Xe()),A=Je(),d=X(),u=f(v=>{switch(v.key){case S.Enter:rt(v.currentTarget);break;case S.Space:case S.ArrowDown:v.preventDefault(),n.openListbox(),d.nextFrame(()=>{o.value||n.goToOption(m.First)});break;case S.ArrowUp:v.preventDefault(),n.openListbox(),d.nextFrame(()=>{o.value||n.goToOption(m.Last)});break}}),h=f(v=>{switch(v.key){case S.Space:v.preventDefault();break}}),N=f(v=>{if(tt(v.currentTarget))return v.preventDefault();o.listboxState===0?(n.closeListbox(),d.nextFrame(()=>{var G;return(G=o.buttonRef.current)==null?void 0:G.focus({preventScroll:!0})})):(v.preventDefault(),n.openListbox())}),B=f(v=>v.preventDefault()),E=pt([O]),y=lt(),{isFocusVisible:D,focusProps:g}=Re({autoFocus:l}),{isHovered:C,hoverProps:U}=Pe({isDisabled:i}),{pressed:F,pressProps:b}=De({disabled:i}),R=k(()=>({open:o.listboxState===0,active:F||o.listboxState===0,disabled:i,invalid:o.invalid,value:o.value,hover:C,focus:D,autofocus:l}),[o.listboxState,o.value,i,C,D,F,o.invalid,l]),w=fe(A(),{ref:r,id:O,type:Ge(e,o.buttonRef),"aria-haspopup":"listbox","aria-controls":(c=o.optionsRef.current)==null?void 0:c.id,"aria-expanded":o.listboxState===0,"aria-labelledby":E,"aria-describedby":y,disabled:i||void 0,autoFocus:l,onKeyDown:u,onKeyUp:h,onKeyPress:B,onClick:N},g,U,b);return z({ourProps:w,theirProps:t,slot:R,defaultTag:vt,name:"Listbox.Button"})}let be=ee(!1),Lt="div",St=ce.RenderStrategy|ce.Static;function Rt(e,a){var Q;let o=oe(),{id:n=`headlessui-listbox-options-${o}`,anchor:p,portal:x=!1,modal:O=!0,...i}=e,l=$e(p);l&&(x=!0);let t=W("Listbox.Options"),r=$("Listbox.Options"),A=Ne(t.optionsRef),d=et(),u=(()=>d!==null?(d&J.Open)===J.Open:t.listboxState===0)();Ue(t.buttonRef,r.closeListbox,u),He(A,t.__demoMode?!1:O&&t.listboxState===0),we({allowed:f(()=>[t.buttonRef.current,t.optionsRef.current])},t.__demoMode?!1:O&&t.listboxState===0);let h=H(null);de(()=>{var P;if(!((P=l==null?void 0:l.to)!=null&&P.includes("selection")))return;if(!u){h.current=null;return}let s=Array.from(t.listRef.current.values());h.current=s.findIndex(M=>(M==null?void 0:M.dataset.selected)===""),h.current===-1&&(h.current=s.findIndex(M=>(M==null?void 0:M.dataset.disabled)===void 0),r.goToOption(m.First))},[u,t.listRef]);let B=Fe(t.buttonRef,t.listboxState!==0)?!1:u,E=(()=>{if(l==null)return;if(t.listRef.current.size<=0)return{...l,inner:void 0};let s=Array.from(t.listRef.current.values());return{...l,inner:{listRef:{current:s},index:h.current}}})(),[y,D]=We(E),g=Qe(),C=K(t.optionsRef,a,l?y:null),U=X(),F=X();de(()=>{var P;let s=t.optionsRef.current;s&&t.listboxState===0&&s!==((P=at(s))==null?void 0:P.activeElement)&&(s==null||s.focus({preventScroll:!0}))},[t.listboxState,t.optionsRef,t.optionsRef.current]);let b=f(s=>{switch(F.dispose(),s.key){case S.Space:if(t.searchQuery!=="")return s.preventDefault(),s.stopPropagation(),r.search(s.key);case S.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(),re().nextFrame(()=>{var P;return(P=t.buttonRef.current)==null?void 0:P.focus({preventScroll:!0})}));break;case V(t.orientation,{vertical:S.ArrowDown,horizontal:S.ArrowRight}):return s.preventDefault(),s.stopPropagation(),r.goToOption(m.Next);case V(t.orientation,{vertical:S.ArrowUp,horizontal:S.ArrowLeft}):return s.preventDefault(),s.stopPropagation(),r.goToOption(m.Previous);case S.Home:case S.PageUp:return s.preventDefault(),s.stopPropagation(),r.goToOption(m.First);case S.End:case S.PageDown:return s.preventDefault(),s.stopPropagation(),r.goToOption(m.Last);case S.Escape:return s.preventDefault(),s.stopPropagation(),r.closeListbox(),U.nextFrame(()=>{var P;return(P=t.buttonRef.current)==null?void 0:P.focus({preventScroll:!0})});case S.Tab:s.preventDefault(),s.stopPropagation();break;default:s.key.length===1&&(r.search(s.key),F.setTimeout(()=>r.clearSearch(),350));break}}),R=Ie(()=>{var s;return(s=t.buttonRef.current)==null?void 0:s.id},[t.buttonRef.current]),w=k(()=>({open:t.listboxState===0}),[t]),c=fe(l?g():{},{id:n,ref:C,"aria-activedescendant":t.activeOptionIndex===null||(Q=t.options[t.activeOptionIndex])==null?void 0:Q.id,"aria-multiselectable":t.mode===1?!0:void 0,"aria-labelledby":R,"aria-orientation":t.orientation,onKeyDown:b,role:"listbox",tabIndex:0,style:{...D,"--button-width":Me(t.buttonRef,!0).width}}),[v,G]=he(t.value);t.value!==v&&t.listboxState===0&&t.mode!==1&&G(t.value);let Y=f(s=>t.compare(v,s));return _.createElement(dt,{enabled:x?e.static||u:!1},_.createElement(q.Provider,{value:t.mode===1?t:{...t,isSelected:Y}},z({ourProps:c,theirProps:i,slot:w,defaultTag:Lt,features:St,visible:B,name:"Listbox.Options"})))}let Pt="div";function At(e,a){let o=oe(),{id:n=`headlessui-listbox-option-${o}`,disabled:p=!1,value:x,...O}=e,i=te(be)===!0,l=W("Listbox.Option"),t=$("Listbox.Option"),r=l.activeOptionIndex!==null?l.options[l.activeOptionIndex].id===n:!1,A=l.isSelected(x),d=H(null),u=Ve(d),h=Be({disabled:p,value:x,domRef:d,get textValue(){return u()}}),N=K(a,d,b=>{b?l.listRef.current.set(n,b):l.listRef.current.delete(n)});ne(()=>{if(l.__demoMode||l.listboxState!==0||!r||l.activationTrigger===0)return;let b=re();return b.requestAnimationFrame(()=>{var R,w;(w=(R=d.current)==null?void 0:R.scrollIntoView)==null||w.call(R,{block:"nearest"})}),b.dispose},[d,r,l.__demoMode,l.listboxState,l.activationTrigger,l.activeOptionIndex]),ne(()=>{if(!i)return t.registerOption(n,h)},[h,n,i]);let B=f(b=>{if(p)return b.preventDefault();t.onChange(x),l.mode===0&&(t.closeListbox(),re().nextFrame(()=>{var R;return(R=l.buttonRef.current)==null?void 0:R.focus({preventScroll:!0})}))}),E=f(()=>{if(p)return t.goToOption(m.Nothing);t.goToOption(m.Specific,n)}),y=Ke(),D=f(b=>{y.update(b),!p&&(r||t.goToOption(m.Specific,n,0))}),g=f(b=>{y.wasMoved(b)&&(p||r||t.goToOption(m.Specific,n,0))}),C=f(b=>{y.wasMoved(b)&&(p||r&&t.goToOption(m.Nothing))}),U=k(()=>({active:r,focus:r,selected:A,disabled:p,selectedOption:A&&i}),[r,A,p,i]),F=i?{}:{id:n,ref:N,role:"option",tabIndex:p===!0?void 0:-1,"aria-disabled":p===!0?!0:void 0,"aria-selected":A,disabled:void 0,onClick:B,onFocus:E,onPointerEnter:D,onMouseEnter:D,onPointerMove:g,onMouseMove:g,onPointerLeave:C,onMouseLeave:C};return!A&&i?null:z({ourProps:F,theirProps:O,slot:U,defaultTag:Pt,name:"Listbox.Option"})}let Et=pe;function ht(e,a){let{options:o,placeholder:n,...p}=e,O={ref:K(a)},i=W("ListboxSelectedOption"),l=k(()=>({}),[]),t=i.value===void 0||i.value===null||i.mode===1&&Array.isArray(i.value)&&i.value.length===0;return _.createElement(be.Provider,{value:!0},z({ourProps:O,theirProps:{...p,children:_.createElement(_.Fragment,null,n&&t?n:o)},slot:l,defaultTag:Et,name:"ListboxSelectedOption"}))}let Dt=j(yt),_t=j(gt),It=st,Ct=j(Rt),Ft=j(At),go=j(ht),Lo=Object.assign(Dt,{Button:_t,Label:It,Options:Ct,Option:Ft});export{Lo as Listbox,_t as ListboxButton,It as ListboxLabel,Ft as ListboxOption,Ct as ListboxOptions,go 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 le}from'../../hooks/use-id.js';import{useInertOthers as Ue}from'../../hooks/use-inert-others.js';import{useIsoMorphicEffect as ae}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{transitionDataAttributes as Qe,useTransition as Xe}from'../../hooks/use-transition.js';import{useDisabled as Je}from'../../internal/disabled.js';import{FloatingProvider as $e,useFloatingPanel as qe,useFloatingPanelProps as Ye,useFloatingReference as Ze,useFloatingReferenceProps as et,useResolvedAnchor as tt}from'../../internal/floating.js';import{FormFields as ot}from'../../internal/form-fields.js';import{useFrozenData as nt}from'../../internal/frozen.js';import{useProvidedId as it}from'../../internal/id.js';import{OpenClosedProvider as rt,State as X,useOpenClosed as lt}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 st}from'../../utils/disposables.js';import{Focus as xe,FocusableMode as pt,focusFrom as ut,isFocusableElement as dt,sortByDomNode as ct}from'../../utils/focus-management.js';import{attemptSubmit as ft}from'../../utils/form.js';import{match as H}from'../../utils/match.js';import{getOwnerDocument as bt}from'../../utils/owner.js';import{RenderFeatures as me,forwardRefWithAs as z,mergeProps as Oe,render as W}from'../../utils/render.js';import{useDescribedBy as Tt}from'../description/description.js';import{Keys as P}from'../keyboard.js';import{Label as xt,useLabelledBy as mt,useLabels as Ot}from'../label/label.js';import{Portal as yt}from'../portal/portal.js';var vt=(o=>(o[o.Open=0]="Open",o[o.Closed=1]="Closed",o))(vt||{}),gt=(o=>(o[o.Single=0]="Single",o[o.Multi=1]="Multi",o))(gt||{}),Lt=(o=>(o[o.Pointer=0]="Pointer",o[o.Other=1]="Other",o))(Lt||{}),St=(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))(St||{});function pe(e,r=o=>o){let o=e.activeOptionIndex!==null?e.options[e.activeOptionIndex]:null,n=ct(r(e.options.slice()),O=>O.dataRef.current.domRef.current),a=o?n.indexOf(o):null;return a===-1&&(a=null),{options:n,activeOptionIndex:a}}let Rt={[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(a=>o(a.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),a=se(r,{resolveItems:()=>n.options,resolveActiveIndex:()=>n.activeOptionIndex,resolveId:t=>t.id,resolveDisabled:t=>t.dataRef.current.disabled});return{...o,...n,activeOptionIndex:a}},[3]:(e,r)=>{if(e.dataRef.current.disabled||e.listboxState===1)return e;let n=e.searchQuery!==""?0:1,a=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(a))}),i=v?e.options.indexOf(v):-1;return i===-1||i===e.activeOptionIndex?{...e,searchQuery:a}:{...e,searchQuery:a,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,a=>[...a,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 a=n.findIndex(O=>O.id===r.id);return a!==-1&&n.splice(a,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 Pt(e,r){return H(r.type,Rt,e,r)}let At=ce;function Et(e,r){var de;let o=Je(),{value:n,defaultValue:a,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 B=u?"horizontal":"vertical";let k=j(r),_=we(a),[f=b?[]:void 0,L]=Me(n,i,_),[I,S]=_e(Pt,{dataRef:De(),listboxState:c?0:1,options:[],searchQuery:"",activeOptionIndex:null,activationTrigger:1,optionsVisible:!1,__demoMode:c}),w=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:B,compare:M,isSelected:g,optionsPropsRef:w,buttonRef:U,optionsRef:T,listRef:h}),[f,t,p,b,I,h]);ae(()=>{I.dataRef.current=d},[d]);let q=d.listboxState===0;Ve(q,[d.buttonRef,d.optionsRef],(m,R)=>{var F;S({type:1}),dt(R,pt.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(),l=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:l,closeListbox:oe,openListbox:te,selectActiveOption:ee,selectOption:Z,search:ne,clearSearch:ve}),[]),[Le,Se]=Ot({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($e,null,D.createElement(ue.Provider,{value:ge},D.createElement($.Provider,{value:d},D.createElement(rt,{value:H(d.listboxState,{[0]:X.Open,[1]:X.Closed})},v!=null&&f!=null&&D.createElement(ot,{disabled:t,data:{[v]:f},form:O,onReset:Pe}),W({ourProps:Re,theirProps:E,slot:Y,defaultTag:At,name:"Listbox"}))))))}let ht="button";function Dt(e,r){var M;let o=Q("Listbox.Button"),n=J("Listbox.Button"),a=le(),O=it(),{id:v=O||`headlessui-listbox-button-${a}`,disabled:i=o.disabled||!1,autoFocus:s=!1,...p}=e,t=j(o.buttonRef,r,Ze()),u=et(),b=x(g=>{switch(g.key){case P.Enter:ft(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())}),B=x(g=>g.preventDefault()),k=mt([v]),_=Tt(),{isFocusVisible:f,focusProps:L}=Ee({autoFocus:s}),{isHovered:I,hoverProps:S}=he({isDisabled:i}),{pressed:w,pressProps:U}=Ie({disabled:i}),T=N(()=>({open:o.listboxState===0,active:w||o.listboxState===0,disabled:i,invalid:o.invalid,value:o.value,hover:I,focus:f,autofocus:s}),[o.listboxState,o.value,i,I,f,w,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:B,onClick:E},L,S,U);return W({ourProps:h,theirProps:p,slot:T,defaultTag:ht,name:"Listbox.Button"})}let ye=ie(!1),_t="div",It=me.RenderStrategy|me.Static;function Ct(e,r){var K;let o=le(),{id:n=`headlessui-listbox-options-${o}`,anchor:a,portal:O=!1,modal:v=!0,transition:i=!1,...s}=e,p=tt(a);p&&(O=!0);let t=Q("Listbox.Options"),u=J("Listbox.Options"),b=He(t.optionsRef),c=lt(),[E,B]=Xe(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 l=Array.from(t.listRef.current.values());f.current=l.findIndex(A=>(A==null?void 0:A.dataset.selected)===""),f.current===-1&&(f.current=l.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,w=(()=>{if(p==null)return;if(t.listRef.current.size<=0)return{...p,inner:void 0};let l=Array.from(t.listRef.current.values());return{...p,inner:{listRef:{current:l},index:f.current}}})(),[U,T]=qe(w),h=Ye(),M=j(t.optionsRef,r,p?U:null),g=Te();be(()=>{var C;let l=t.optionsRef.current;l&&t.listboxState===0&&l!==((C=bt(l))==null?void 0:C.activeElement)&&(l==null||l.focus({preventScroll:!0}))},[t.listboxState,t.optionsRef,t.optionsRef.current]);let d=x(l=>{var C,A;switch(g.dispose(),l.key){case P.Space:if(t.searchQuery!=="")return l.preventDefault(),l.stopPropagation(),u.search(l.key);case P.Enter:if(l.preventDefault(),l.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 l.preventDefault(),l.stopPropagation(),u.goToOption(y.Next);case H(t.orientation,{vertical:P.ArrowUp,horizontal:P.ArrowLeft}):return l.preventDefault(),l.stopPropagation(),u.goToOption(y.Previous);case P.Home:case P.PageUp:return l.preventDefault(),l.stopPropagation(),u.goToOption(y.First);case P.End:case P.PageDown:return l.preventDefault(),l.stopPropagation(),u.goToOption(y.Last);case P.Escape:l.preventDefault(),l.stopPropagation(),G(()=>u.closeListbox()),(A=t.buttonRef.current)==null||A.focus({preventScroll:!0});return;case P.Tab:l.preventDefault(),l.stopPropagation(),G(()=>u.closeListbox()),ut(t.buttonRef.current,l.shiftKey?xe.Previous:xe.Next);break;default:l.key.length===1&&(u.search(l.key),g.setTimeout(()=>u.clearSearch(),350));break}}),q=Fe(()=>{var l;return(l=t.buttonRef.current)==null?void 0:l.id},[t.buttonRef.current]),Y=N(()=>({open:t.listboxState===0}),[t.listboxState]),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},...Qe(B)}),ee=E&&t.listboxState===1,te=nt(ee,t.value),oe=x(l=>t.compare(te,l));return D.createElement(yt,{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:_t,features:It,visible:S,name:"Listbox.Options"})))}let Ft="div";function Mt(e,r){let o=le(),{id:n=`headlessui-listbox-option-${o}`,disabled:a=!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:a,value:O,domRef:b,get textValue(){return c()}}),B=j(r,b,T=>{T?s.listRef.current.set(n,T):s.listRef.current.delete(n)});ae(()=>{if(!s.__demoMode&&s.listboxState===0&&t&&s.activationTrigger!==0)return st().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]),ae(()=>{if(!i)return p.registerOption(n,E)},[E,n,i]);let k=x(T=>{var h;if(a)return T.preventDefault();p.onChange(O),s.mode===0&&(G(()=>p.closeListbox()),(h=s.buttonRef.current)==null||h.focus({preventScroll:!0}))}),_=x(()=>{if(a)return p.goToOption(y.Nothing);p.goToOption(y.Specific,n)}),f=We(),L=x(T=>{f.update(T),!a&&(t||p.goToOption(y.Specific,n,0))}),I=x(T=>{f.wasMoved(T)&&(a||t||p.goToOption(y.Specific,n,0))}),S=x(T=>{f.wasMoved(T)&&(a||t&&p.goToOption(y.Nothing))}),w=N(()=>({active:t,focus:t,selected:u,disabled:a,selectedOption:u&&i}),[t,u,a,i]),U=i?{}:{id:n,ref:B,role:"option",tabIndex:a===!0?void 0:-1,"aria-disabled":a===!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:w,defaultTag:Ft,name:"Listbox.Option"})}let wt=ce;function Bt(e,r){let{options:o,placeholder:n,...a}=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:{...a,children:D.createElement(D.Fragment,null,n&&p?n:o)},slot:s,defaultTag:wt,name:"ListboxSelectedOption"}))}let kt=z(Et),Ut=z(Dt),Nt=xt,Gt=z(Ct),Vt=z(Mt),Ht=z(Bt),Mo=Object.assign(kt,{Button:Ut,Label:Nt,Options:Gt,Option:Vt,SelectedOption:Ht});export{Mo as Listbox,Ut as ListboxButton,Nt as ListboxLabel,Vt as ListboxOption,Gt as ListboxOptions,Ht as ListboxSelectedOption}; |
@@ -41,6 +41,7 @@ import React, { type ElementType, type Ref } from 'react'; | ||
modal?: boolean; | ||
transition?: boolean; | ||
static?: boolean; | ||
unmount?: boolean; | ||
}>; | ||
declare function ItemsFn<TTag extends ElementType = typeof DEFAULT_ITEMS_TAG>(props: MenuItemsProps<TTag>, ref: Ref<HTMLDivElement>): React.JSX.Element; | ||
declare function ItemsFn<TTag extends ElementType = typeof DEFAULT_ITEMS_TAG>(props: MenuItemsProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; | ||
declare let DEFAULT_ITEM_TAG: React.ExoticComponent<{ | ||
@@ -104,9 +105,15 @@ children?: React.ReactNode; | ||
export declare let Menu: _internal_ComponentMenu & { | ||
/** @deprecated use `<MenuButton>` instead of `<Menu.Button>` */ | ||
Button: _internal_ComponentMenuButton; | ||
/** @deprecated use `<MenuItems>` instead of `<Menu.Items>` */ | ||
Items: _internal_ComponentMenuItems; | ||
/** @deprecated use `<MenuItem>` instead of `<Menu.Item>` */ | ||
Item: _internal_ComponentMenuItem; | ||
/** @deprecated use `<MenuSection>` instead of `<Menu.Section>` */ | ||
Section: _internal_ComponentMenuSection; | ||
/** @deprecated use `<MenuHeading>` instead of `<Menu.Heading>` */ | ||
Heading: _internal_ComponentMenuHeading; | ||
/** @deprecated use `<MenuSeparator>` instead of `<Menu.Separator>` */ | ||
Separator: _internal_ComponentMenuSeparator; | ||
}; | ||
export {}; |
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as re}from"@react-aria/focus";import{useHover as oe}from"@react-aria/interactions";import R,{Fragment as V,createContext as ae,createRef as X,useContext as ie,useEffect as se,useMemo as U,useReducer as le,useRef as $}from"react";import{useActivePress as ue}from'../../hooks/use-active-press.js';import{useDidElementMove as pe}from'../../hooks/use-did-element-move.js';import{useDisposables as q}from'../../hooks/use-disposables.js';import{useElementSize as de}from'../../hooks/use-element-size.js';import{useEvent as A}from'../../hooks/use-event.js';import{useId as H}from'../../hooks/use-id.js';import{useInertOthers as me}from'../../hooks/use-inert-others.js';import{useIsoMorphicEffect as N}from'../../hooks/use-iso-morphic-effect.js';import{useOnDisappear as ce}from'../../hooks/use-on-disappear.js';import{useOutsideClick as fe}from'../../hooks/use-outside-click.js';import{useOwnerDocument as Te}from'../../hooks/use-owner.js';import{useResolveButtonType as ye}from'../../hooks/use-resolve-button-type.js';import{useScrollLock as ge}from'../../hooks/use-scroll-lock.js';import{useSyncRefs as B}from'../../hooks/use-sync-refs.js';import{useTextValue as Ie}from'../../hooks/use-text-value.js';import{useTrackedPointer as Me}from'../../hooks/use-tracked-pointer.js';import{useTreeWalker as Ae}from'../../hooks/use-tree-walker.js';import{FloatingProvider as Pe,useFloatingPanel as Se,useFloatingPanelProps as be,useFloatingReference as Ee,useFloatingReferenceProps as Re,useResolvedAnchor as ve}from'../../internal/floating.js';import{OpenClosedProvider as xe,State as k,useOpenClosed as _e}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as De}from'../../utils/bugs.js';import{Focus as y,calculateActiveIndex as K}from'../../utils/calculate-active-index.js';import{disposables as W}from'../../utils/disposables.js';import{Focus as z,FocusableMode as he,focusFrom as Fe,isFocusableElement as Ce,restoreFocusIfNecessary as Y,sortByDomNode as Oe}from'../../utils/focus-management.js';import{match as Z}from'../../utils/match.js';import{RenderFeatures as ee,forwardRefWithAs as v,mergeProps as te,render as x}from'../../utils/render.js';import{useDescriptions as Le}from'../description/description.js';import{Keys as T}from'../keyboard.js';import{useLabelContext as Ge,useLabels as ne}from'../label/label.js';import{Portal as Ue}from'../portal/portal.js';var He=(r=>(r[r.Open=0]="Open",r[r.Closed=1]="Closed",r))(He||{}),Ne=(r=>(r[r.Pointer=0]="Pointer",r[r.Other=1]="Other",r))(Ne||{}),Be=(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))(Be||{});function j(e,a=r=>r){let r=e.activeItemIndex!==null?e.items[e.activeItemIndex]:null,s=Oe(a(e.items.slice()),p=>p.dataRef.current.domRef.current),o=r?s.indexOf(r):null;return o===-1&&(o=null),{items:s,activeItemIndex:o}}let ke={[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,u,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(l=>l.id===a.id)};if(a.focus===y.Previous){let l=e.activeItemIndex;if(l!==null){let g=e.items[l].dataRef.current.domRef,c=K(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 l=e.activeItemIndex;if(l!==null){let g=e.items[l].dataRef.current.domRef,c=K(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(((u=g.current)==null?void 0:u.nextElementSibling)===m.current||((t=m.current)==null?void 0:t.nextElementSibling)===null)return{...r,activeItemIndex:c}}}}let s=j(e),o=K(a,{resolveItems:()=>s.items,resolveActiveIndex:()=>s.activeItemIndex,resolveId:l=>l.id,resolveDisabled:l=>l.dataRef.current.disabled});return{...r,...s,activeItemIndex:o}},[3]:(e,a)=>{let s=e.searchQuery!==""?0:1,o=e.searchQuery+a.value.toLowerCase(),d=(e.activeItemIndex!==null?e.items.slice(e.activeItemIndex+s).concat(e.items.slice(0,e.activeItemIndex+s)):e.items).find(u=>{var t;return((t=u.dataRef.current.textValue)==null?void 0:t.startsWith(o))&&!u.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=j(e,s=>[...s,{id:a.id,dataRef:a.dataRef}]);return{...e,...r}},[6]:(e,a)=>{let r=j(e,s=>{let o=s.findIndex(p=>p.id===a.id);return o!==-1&&s.splice(o,1),s});return{...e,...r,activationTrigger:1}}},Q=ae(null);Q.displayName="MenuContext";function w(e){let a=ie(Q);if(a===null){let r=new Error(`<${e} /> is missing a parent <Menu /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(r,w),r}return a}function we(e,a){return Z(a.type,ke,e,a)}let Ke=V;function We(e,a){let{__demoMode:r=!1,...s}=e,o=le(we,{__demoMode:r,menuState:r?0:1,buttonRef:X(),itemsRef:X(),items:[],searchQuery:"",activeItemIndex:null,activationTrigger:1}),[{menuState:p,itemsRef:d,buttonRef:n},u]=o,t=B(a);fe([n,d],(m,E)=>{var I;u({type:1}),Ce(E,he.Loose)||(m.preventDefault(),(I=n.current)==null||I.focus())},p===0);let l=A(()=>{u({type:1})}),g=U(()=>({open:p===0,close:l}),[p,l]),c={ref:t};return R.createElement(Pe,null,R.createElement(Q.Provider,{value:o},R.createElement(xe,{value:Z(p,{[0]:k.Open,[1]:k.Closed})},x({ourProps:c,theirProps:s,slot:g,defaultTag:Ke,name:"Menu"}))))}let je="button";function Qe(e,a){var D;let r=H(),{id:s=`headlessui-menu-button-${r}`,disabled:o=!1,autoFocus:p=!1,...d}=e,[n,u]=w("Menu.Button"),t=Re(),l=B(n.buttonRef,a,Ee()),g=q(),c=A(f=>{switch(f.key){case T.Space:case T.Enter:case T.ArrowDown:f.preventDefault(),f.stopPropagation(),u({type:0}),g.nextFrame(()=>u({type:2,focus:y.First}));break;case T.ArrowUp:f.preventDefault(),f.stopPropagation(),u({type:0}),g.nextFrame(()=>u({type:2,focus:y.Last}));break}}),m=A(f=>{switch(f.key){case T.Space:f.preventDefault();break}}),E=A(f=>{if(De(f.currentTarget))return f.preventDefault();o||(n.menuState===0?(u({type:1}),g.nextFrame(()=>{var h;return(h=n.buttonRef.current)==null?void 0:h.focus({preventScroll:!0})})):(f.preventDefault(),u({type:0})))}),{isFocusVisible:I,focusProps:P}=re({autoFocus:p}),{isHovered:S,hoverProps:b}=oe({isDisabled:o}),{pressed:_,pressProps:F}=ue({disabled:o}),C=U(()=>({open:n.menuState===0,active:_||n.menuState===0,disabled:o,hover:S,focus:I,autofocus:p}),[n,S,I,_,o,p]),O=te(t(),{ref:l,id:s,type:ye(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,b,F);return x({ourProps:O,theirProps:d,slot:C,defaultTag:je,name:"Menu.Button"})}let Je="div",Ve=ee.RenderStrategy|ee.Static;function Xe(e,a){var h,M;let r=H(),{id:s=`headlessui-menu-items-${r}`,anchor:o,portal:p=!1,modal:d=!0,...n}=e,u=ve(o),[t,l]=w("Menu.Items"),[g,c]=Se(u),m=be(),E=B(t.itemsRef,a,u?g:null),I=Te(t.itemsRef);u&&(p=!0);let P=q(),S=_e(),b=(()=>S!==null?(S&k.Open)===k.Open:t.menuState===0)();ce(t.buttonRef,()=>l({type:1}),b),ge(I,t.__demoMode?!1:d&&t.menuState===0),me({allowed:A(()=>[t.buttonRef.current,t.itemsRef.current])},t.__demoMode?!1:d&&t.menuState===0);let F=pe(t.buttonRef,t.menuState!==0)?!1:b;se(()=>{let i=t.itemsRef.current;i&&t.menuState===0&&i!==(I==null?void 0:I.activeElement)&&i.focus({preventScroll:!0})},[t.menuState,t.itemsRef,I,t.itemsRef.current]),Ae({container:t.itemsRef.current,enabled:t.menuState===0,accept(i){return i.getAttribute("role")==="menuitem"?NodeFilter.FILTER_REJECT:i.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(i){i.setAttribute("role","none")}});let C=A(i=>{var L,J;switch(P.dispose(),i.key){case T.Space:if(t.searchQuery!=="")return i.preventDefault(),i.stopPropagation(),l({type:3,value:i.key});case T.Enter:if(i.preventDefault(),i.stopPropagation(),l({type:1}),t.activeItemIndex!==null){let{dataRef:G}=t.items[t.activeItemIndex];(J=(L=G.current)==null?void 0:L.domRef.current)==null||J.click()}Y(t.buttonRef.current);break;case T.ArrowDown:return i.preventDefault(),i.stopPropagation(),l({type:2,focus:y.Next});case T.ArrowUp:return i.preventDefault(),i.stopPropagation(),l({type:2,focus:y.Previous});case T.Home:case T.PageUp:return i.preventDefault(),i.stopPropagation(),l({type:2,focus:y.First});case T.End:case T.PageDown:return i.preventDefault(),i.stopPropagation(),l({type:2,focus:y.Last});case T.Escape:i.preventDefault(),i.stopPropagation(),l({type:1}),W().nextFrame(()=>{var G;return(G=t.buttonRef.current)==null?void 0:G.focus({preventScroll:!0})});break;case T.Tab:i.preventDefault(),i.stopPropagation(),l({type:1}),W().microTask(()=>{Fe(t.buttonRef.current,i.shiftKey?z.Previous:z.Next)});break;default:i.key.length===1&&(l({type:3,value:i.key}),P.setTimeout(()=>l({type:4}),350));break}}),O=A(i=>{switch(i.key){case T.Space:i.preventDefault();break}}),D=U(()=>({open:t.menuState===0}),[t]),f=te(u?m():{},{"aria-activedescendant":t.activeItemIndex===null||(h=t.items[t.activeItemIndex])==null?void 0:h.id,"aria-labelledby":(M=t.buttonRef.current)==null?void 0:M.id,id:s,onKeyDown:C,onKeyUp:O,role:"menu",tabIndex:0,ref:E,style:{...c,"--button-width":de(t.buttonRef,!0).width}});return R.createElement(Ue,{enabled:p?e.static||b:!1},x({ourProps:f,theirProps:n,slot:D,defaultTag:Je,features:Ve,visible:F,name:"Menu.Items"}))}let $e=V;function qe(e,a){let r=H(),{id:s=`headlessui-menu-item-${r}`,disabled:o=!1,...p}=e,[d,n]=w("Menu.Item"),u=d.activeItemIndex!==null?d.items[d.activeItemIndex].id===s:!1,t=$(null),l=B(a,t);N(()=>{if(d.__demoMode||d.menuState!==0||!u||d.activationTrigger===0)return;let M=W();return M.requestAnimationFrame(()=>{var i,L;(L=(i=t.current)==null?void 0:i.scrollIntoView)==null||L.call(i,{block:"nearest"})}),M.dispose},[d.__demoMode,t,u,d.menuState,d.activationTrigger,d.activeItemIndex]);let g=Ie(t),c=$({disabled:o,domRef:t,get textValue(){return g()}});N(()=>{c.current.disabled=o},[c,o]),N(()=>(n({type:5,id:s,dataRef:c}),()=>n({type:6,id:s})),[c,s]);let m=A(()=>{n({type:1})}),E=A(M=>{if(o)return M.preventDefault();n({type:1}),Y(d.buttonRef.current)}),I=A(()=>{if(o)return n({type:2,focus:y.Nothing});n({type:2,focus:y.Specific,id:s})}),P=Me(),S=A(M=>{P.update(M),!o&&(u||n({type:2,focus:y.Specific,id:s,trigger:0}))}),b=A(M=>{P.wasMoved(M)&&(o||u||n({type:2,focus:y.Specific,id:s,trigger:0}))}),_=A(M=>{P.wasMoved(M)&&(o||u&&n({type:2,focus:y.Nothing}))}),[F,C]=ne(),[O,D]=Le(),f=U(()=>({active:u,focus:u,disabled:o,close:m}),[u,o,m]);return R.createElement(C,null,R.createElement(D,null,x({ourProps:{id:s,ref:l,role:"menuitem",tabIndex:o===!0?void 0:-1,"aria-disabled":o===!0?!0:void 0,"aria-labelledby":F,"aria-describedby":O,disabled:void 0,onClick:E,onFocus:I,onPointerEnter:S,onMouseEnter:S,onPointerMove:b,onMouseMove:b,onPointerLeave:_,onMouseLeave:_},theirProps:p,slot:f,defaultTag:$e,name:"Menu.Item"})))}let ze="div";function Ye(e,a){let[r,s]=ne();return R.createElement(s,null,x({ourProps:{ref:a,"aria-labelledby":r,role:"group"},theirProps:e,slot:{},defaultTag:ze,name:"Menu.Section"}))}let Ze="header";function et(e,a){let r=H(),{id:s=`headlessui-menu-heading-${r}`,...o}=e,p=Ge();N(()=>p.register(s),[s,p.register]);let d={id:s,ref:a,role:"presentation",...p.props};return x({ourProps:d,theirProps:o,slot:{},defaultTag:Ze,name:"Menu.Heading"})}let tt="div";function nt(e,a){return x({ourProps:{ref:a,role:"separator"},theirProps:e,slot:{},defaultTag:tt,name:"Menu.Separator"})}let rt=v(We),ot=v(Qe),at=v(Xe),it=v(qe),st=v(Ye),lt=v(et),ut=v(nt),Kt=Object.assign(rt,{Button:ot,Items:at,Item:it,Section:st,Heading:lt,Separator:ut});export{Kt as Menu,ot as MenuButton,lt as MenuHeading,it as MenuItem,at as MenuItems,st as MenuSection,ut as MenuSeparator}; | ||
"use client";import{useFocusRing as le}from"@react-aria/focus";import{useHover as ue}from"@react-aria/interactions";import R,{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{transitionDataAttributes as ve,useTransition as xe}from'../../hooks/use-transition.js';import{useTreeWalker as _e}from'../../hooks/use-tree-walker.js';import{FloatingProvider as De,useFloatingPanel as he,useFloatingPanelProps as Ce,useFloatingReference as Fe,useFloatingReferenceProps as Oe,useResolvedAnchor as Le}from'../../internal/floating.js';import{OpenClosedProvider as Ge,State as k,useOpenClosed as Ue}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as He}from'../../utils/bugs.js';import{Focus as I,calculateActiveIndex as K}from'../../utils/calculate-active-index.js';import{disposables as Ne}from'../../utils/disposables.js';import{Focus as Z,FocusableMode as ke,focusFrom as Be,isFocusableElement as we,restoreFocusIfNecessary as ee,sortByDomNode as Ke}from'../../utils/focus-management.js';import{match as te}from'../../utils/match.js';import{RenderFeatures as ne,forwardRefWithAs as v,mergeProps as re,render as x}from'../../utils/render.js';import{useDescriptions as We}from'../description/description.js';import{Keys as T}from'../keyboard.js';import{useLabelContext as je,useLabels as oe}from'../label/label.js';import{Portal as Qe}from'../portal/portal.js';var Je=(r=>(r[r.Open=0]="Open",r[r.Closed=1]="Closed",r))(Je||{}),Ve=(r=>(r[r.Pointer=0]="Pointer",r[r.Other=1]="Other",r))(Ve||{}),Xe=(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))(Xe||{});function W(e,a=r=>r){let r=e.activeItemIndex!==null?e.items[e.activeItemIndex]:null,i=Ke(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 $e={[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 qe(e,a){return te(a.type,$e,e,a)}let ze=q;function Ye(e,a){let{__demoMode:r=!1,...i}=e,o=ce(qe,{__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}),we(b,ke.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 R.createElement(De,null,R.createElement(j.Provider,{value:o},R.createElement(Ge,{value:te(l,{[0]:k.Open,[1]:k.Closed})},x({ourProps:m,theirProps:i,slot:f,defaultTag:ze,name:"Menu"}))))}let Ze="button";function et(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=Oe(),t=N(n.buttonRef,a,Fe()),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(He(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:_}=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,_);return x({ourProps:F,theirProps:p,slot:C,defaultTag:Ze,name:"Menu.Button"})}let tt="div",nt=ne.RenderStrategy|ne.Static;function rt(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=Le(o),[t,d]=B("Menu.Items"),[f,m]=he(c),S=Ce(),b=N(t.itemsRef,a,c?f:null),y=Pe(t.itemsRef);c&&(l=!0);let E=Ue(),[P,_]=xe(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]),_e(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})),Be(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}),[t.menuState]),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},...ve(_)});return R.createElement(Qe,{enabled:l?e.static||P:!1},x({ourProps:ie,theirProps:u,slot:ae,defaultTag:tt,features:nt,visible:h,name:"Menu.Items"}))}let ot=q;function at(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 Ne().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}))}),_=A(M=>{y.wasMoved(M)&&(o||u&&n({type:2,focus:I.Nothing}))}),[C,F]=oe(),[D,g]=We(),h=G(()=>({active:u,focus:u,disabled:o,close:m}),[u,o,m]);return R.createElement(F,null,R.createElement(g,null,x({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:_,onMouseLeave:_},theirProps:l,slot:h,defaultTag:ot,name:"Menu.Item"})))}let it="div";function st(e,a){let[r,i]=oe();return R.createElement(i,null,x({ourProps:{ref:a,"aria-labelledby":r,role:"group"},theirProps:e,slot:{},defaultTag:it,name:"Menu.Section"}))}let lt="header";function ut(e,a){let r=U(),{id:i=`headlessui-menu-heading-${r}`,...o}=e,l=je();H(()=>l.register(i),[i,l.register]);let p={id:i,ref:a,role:"presentation",...l.props};return x({ourProps:p,theirProps:o,slot:{},defaultTag:lt,name:"Menu.Heading"})}let pt="div";function dt(e,a){return x({ourProps:{ref:a,role:"separator"},theirProps:e,slot:{},defaultTag:pt,name:"Menu.Separator"})}let mt=v(Ye),ct=v(et),ft=v(rt),Tt=v(at),yt=v(st),gt=v(ut),It=v(dt),Zt=Object.assign(mt,{Button:ct,Items:ft,Item:Tt,Section:yt,Heading:gt,Separator:It});export{Zt as Menu,ct as MenuButton,gt as MenuHeading,Tt as MenuItem,ft as MenuItems,yt as MenuSection,It as MenuSeparator}; |
@@ -31,10 +31,13 @@ import React, { type ElementType, type MouseEventHandler, type MutableRefObject, type Ref } from 'react'; | ||
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<HTMLDivElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null; | ||
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"; | ||
@@ -51,6 +54,7 @@ type PanelRenderPropArg = { | ||
modal?: boolean; | ||
transition?: boolean; | ||
static?: boolean; | ||
unmount?: boolean; | ||
}>; | ||
declare function PanelFn<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(props: PopoverPanelProps<TTag>, ref: Ref<HTMLDivElement>): React.JSX.Element; | ||
declare function PanelFn<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(props: PopoverPanelProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; | ||
declare let DEFAULT_GROUP_TAG: "div"; | ||
@@ -67,4 +71,4 @@ type GroupRenderPropArg = {}; | ||
} | ||
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; | ||
} | ||
@@ -78,11 +82,19 @@ 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; | ||
export declare let PopoverGroup: _internal_ComponentPopoverGroup; | ||
export declare let Popover: _internal_ComponentPopover & { | ||
/** @deprecated use `<PopoverButton>` instead of `<Popover.Button>` */ | ||
Button: _internal_ComponentPopoverButton; | ||
Overlay: _internal_ComponentPopoverOverlay; | ||
/** @deprecated use `<PopoverBackdrop>` instead of `<Popover.Backdrop>` */ | ||
Backdrop: _internal_ComponentPopoverBackdrop; | ||
/** @deprecated use `<PopoverOverlay>` instead of `<Popover.Overlay>` */ | ||
Overlay: _internal_ComponentPopoverBackdrop; | ||
/** @deprecated use `<PopoverPanel>` instead of `<Popover.Panel>` */ | ||
Panel: _internal_ComponentPopoverPanel; | ||
/** @deprecated use `<PopoverGroup>` instead of `<Popover.Group>` */ | ||
Group: _internal_ComponentPopoverGroup; | ||
}; | ||
export {}; |
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as Re}from"@react-aria/focus";import{useHover as Oe}from"@react-aria/interactions";import b,{createContext as Z,createRef as me,useContext as ee,useEffect as te,useMemo as B,useReducer as Ce,useRef as q,useState as ye}from"react";import{useActivePress as Fe}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 Me}from'../../hooks/use-event-listener.js';import{useId as oe}from'../../hooks/use-id.js';import{useIsoMorphicEffect as xe}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as Ee}from'../../hooks/use-latest-value.js';import{useOnDisappear as Le}from'../../hooks/use-on-disappear.js';import{useOutsideClick as Ie}from'../../hooks/use-outside-click.js';import{useOwnerDocument as pe}from'../../hooks/use-owner.js';import{useResolveButtonType as he}from'../../hooks/use-resolve-button-type.js';import{useMainTreeNode as Be,useRootContainers as De}from'../../hooks/use-root-containers.js';import{useScrollLock as Ge}from'../../hooks/use-scroll-lock.js';import{optionalRef as He,useSyncRefs as X}from'../../hooks/use-sync-refs.js';import{Direction as N,useTabDirection as be}from'../../hooks/use-tab-direction.js';import{CloseProvider as Ne}from'../../internal/close-provider.js';import{FloatingProvider as Ue,useFloatingPanel as ke,useFloatingPanelProps as we,useFloatingReference as We,useResolvedAnchor as Ve}from'../../internal/floating.js';import{Hidden as se,HiddenFeatures as ue}from'../../internal/hidden.js';import{OpenClosedProvider as Ke,State as Y,useOpenClosed as ge}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as Se}from'../../utils/bugs.js';import{Focus as U,FocusResult as ie,FocusableMode as je,focusIn as w,getFocusableElements as fe,isFocusableElement as $e}from'../../utils/focus-management.js';import{match as W}from'../../utils/match.js';import'../../utils/micro-task.js';import{getOwnerDocument as Je}from'../../utils/owner.js';import{RenderFeatures as re,forwardRefWithAs as z,mergeProps as Pe,render as Q,useMergeRefsFn as Xe}from'../../utils/render.js';import{Keys as V}from'../keyboard.js';import{Portal as Ye,useNestedPortals as qe}from'../portal/portal.js';var ze=(u=>(u[u.Open=0]="Open",u[u.Closed=1]="Closed",u))(ze||{}),Qe=(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))(Qe||{});let Ze={[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}}},de=Z(null);de.displayName="PopoverContext";function ne(t){let a=ee(de);if(a===null){let u=new Error(`<${t} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(u,ne),u}return a}let le=Z(null);le.displayName="PopoverAPIContext";function ce(t){let a=ee(le);if(a===null){let u=new Error(`<${t} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(u,ce),u}return a}let ve=Z(null);ve.displayName="PopoverGroupContext";function Ae(){return ee(ve)}let ae=Z(null);ae.displayName="PopoverPanelContext";function et(){return ee(ae)}function tt(t,a){return W(a.type,Ze,t,a)}let ot="div";function rt(t,a){var d;let{__demoMode:u=!1,...R}=t,y=q(null),g=X(a,He(o=>{y.current=o})),i=q([]),l=Ce(tt,{__demoMode:u,popoverState:u?0:1,buttons:i,button:null,buttonId:null,panel:null,panelId:null,beforePanelSentinel:me(),afterPanelSentinel:me()}),[{popoverState:f,button:e,buttonId:P,panel:v,panelId:C,beforePanelSentinel:E,afterPanelSentinel:K},r]=l,p=pe((d=y.current)!=null?d:e),F=B(()=>{if(!e||!v)return!1;for(let S of document.querySelectorAll("body > *"))if(Number(S==null?void 0:S.contains(e))^Number(S==null?void 0:S.contains(v)))return!0;let o=fe(),s=o.indexOf(e),c=(s+o.length-1)%o.length,O=(s+1)%o.length,n=o[c],m=o[O];return!v.contains(n)&&!v.contains(m)},[e,v]),_=Ee(P),M=Ee(C),L=B(()=>({buttonId:_,panelId:M,close:()=>r({type:1})}),[_,M,r]),T=Ae(),h=T==null?void 0:T.registerPopover,j=A(()=>{var o;return(o=T==null?void 0:T.isFocusWithinPopoverGroup())!=null?o:(p==null?void 0:p.activeElement)&&((e==null?void 0:e.contains(p.activeElement))||(v==null?void 0:v.contains(p.activeElement)))});te(()=>h==null?void 0:h(L),[h,L]);let[x,$]=qe(),D=De({mainTreeNodeRef:T==null?void 0:T.mainTreeNodeRef,portals:x,defaultContainers:[e,v]});Me(p==null?void 0:p.defaultView,"focus",o=>{var s,c,O,n;o.target!==window&&o.target instanceof HTMLElement&&f===0&&(j()||e&&v&&(D.contains(o.target)||(c=(s=E.current)==null?void 0:s.contains)!=null&&c.call(s,o.target)||(n=(O=K.current)==null?void 0:O.contains)!=null&&n.call(O,o.target)||r({type:1})))},!0),Ie(D.resolveContainers,(o,s)=>{r({type:1}),$e(s,je.Loose)||(o.preventDefault(),e==null||e.focus())},f===0);let I=A(o=>{r({type:1});let s=(()=>o?o instanceof HTMLElement?o:"current"in o&&o.current instanceof HTMLElement?o.current:e:e)();s==null||s.focus()}),k=B(()=>({close:I,isPortalled:F}),[I,F]),J=B(()=>({open:f===0,close:I}),[f,I]),G={ref:g};return b.createElement(Ue,null,b.createElement(ae.Provider,{value:null},b.createElement(de.Provider,{value:l},b.createElement(le.Provider,{value:k},b.createElement(Ne,{value:I},b.createElement(Ke,{value:W(f,{[0]:Y.Open,[1]:Y.Closed})},b.createElement($,null,Q({ourProps:G,theirProps:R,slot:J,defaultTag:ot,name:"Popover"}),b.createElement(D.MainTreeNode,null))))))))}let nt="button";function lt(t,a){let u=oe(),{id:R=`headlessui-popover-button-${u}`,disabled:y=!1,autoFocus:g=!1,...i}=t,[l,f]=ne("Popover.Button"),{isPortalled:e}=ce("Popover.Button"),P=q(null),v=`headlessui-focus-sentinel-${oe()}`,C=Ae(),E=C==null?void 0:C.closeOthers,r=et()!==null;te(()=>{if(!r)return f({type:3,buttonId:R}),()=>{f({type:3,buttonId:null})}},[r,R,f]);let[p]=ye(()=>Symbol()),F=X(P,a,We(),r?null:n=>{if(n)l.buttons.current.push(p);else{let m=l.buttons.current.indexOf(p);m!==-1&&l.buttons.current.splice(m,1)}l.buttons.current.length>1&&console.warn("You are already using a <Popover.Button /> but only 1 <Popover.Button /> is supported."),n&&f({type:2,button:n})}),_=X(P,a),M=pe(P),L=A(n=>{var m,S,H;if(r){if(l.popoverState===1)return;switch(n.key){case V.Space:case V.Enter:n.preventDefault(),(S=(m=n.target).click)==null||S.call(m),f({type:1}),(H=l.button)==null||H.focus();break}}else switch(n.key){case V.Space:case V.Enter:n.preventDefault(),n.stopPropagation(),l.popoverState===1&&(E==null||E(l.buttonId)),f({type:0});break;case V.Escape:if(l.popoverState!==0)return E==null?void 0:E(l.buttonId);if(!P.current||M!=null&&M.activeElement&&!P.current.contains(M.activeElement))return;n.preventDefault(),n.stopPropagation(),f({type:1});break}}),T=A(n=>{r||n.key===V.Space&&n.preventDefault()}),h=A(n=>{var m,S;Se(n.currentTarget)||y||(r?(f({type:1}),(m=l.button)==null||m.focus()):(n.preventDefault(),n.stopPropagation(),l.popoverState===1&&(E==null||E(l.buttonId)),f({type:0}),(S=l.button)==null||S.focus()))}),j=A(n=>{n.preventDefault(),n.stopPropagation()}),{isFocusVisible:x,focusProps:$}=Re({autoFocus:g}),{isHovered:D,hoverProps:I}=Oe({isDisabled:y}),{pressed:k,pressProps:J}=Fe({disabled:y}),G=l.popoverState===0,d=B(()=>({open:G,active:k||G,disabled:y,hover:D,focus:x,autofocus:g}),[G,D,x,k,y,g]),o=he(t,P),s=r?Pe({ref:_,type:o,onKeyDown:L,onClick:h,disabled:y||void 0,autoFocus:g},$,I,J):Pe({ref:F,id:l.buttonId,type:o,"aria-expanded":l.popoverState===0,"aria-controls":l.panel?l.panelId:void 0,disabled:y||void 0,autoFocus:g,onKeyDown:L,onKeyUp:T,onClick:h,onMouseDown:j},$,I,J),c=be(),O=A(()=>{let n=l.panel;if(!n)return;function m(){W(c.current,{[N.Forwards]:()=>w(n,U.First),[N.Backwards]:()=>w(n,U.Last)})===ie.Error&&w(fe().filter(H=>H.dataset.headlessuiFocusGuard!=="true"),W(c.current,{[N.Forwards]:U.Next,[N.Backwards]:U.Previous}),{relativeTo:l.button})}m()});return b.createElement(b.Fragment,null,Q({ourProps:s,theirProps:i,slot:d,defaultTag:nt,name:"Popover.Button"}),G&&!r&&e&&b.createElement(se,{id:v,features:ue.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:O}))}let at="div",pt=re.RenderStrategy|re.Static;function st(t,a){let u=oe(),{id:R=`headlessui-popover-overlay-${u}`,...y}=t,[{popoverState:g},i]=ne("Popover.Overlay"),l=X(a),f=ge(),e=(()=>f!==null?(f&Y.Open)===Y.Open:g===0)(),P=A(E=>{if(Se(E.currentTarget))return E.preventDefault();i({type:1})}),v=B(()=>({open:g===0}),[g]);return Q({ourProps:{ref:l,id:R,"aria-hidden":!0,onClick:P},theirProps:y,slot:v,defaultTag:at,features:pt,visible:e,name:"Popover.Overlay"})}let ut="div",it=re.RenderStrategy|re.Static;function ft(t,a){let u=oe(),{id:R=`headlessui-popover-panel-${u}`,focus:y=!1,anchor:g,portal:i=!1,modal:l=!1,...f}=t,[e,P]=ne("Popover.Panel"),{close:v,isPortalled:C}=ce("Popover.Panel"),E=`headlessui-focus-sentinel-before-${u}`,K=`headlessui-focus-sentinel-after-${u}`,r=q(null),p=Ve(g),[F,_]=ke(p),M=we();p&&(i=!0);let L=X(r,a,p?F:null,d=>{P({type:4,panel:d})}),T=pe(r),h=Xe();xe(()=>(P({type:5,panelId:R}),()=>{P({type:5,panelId:null})}),[R,P]);let j=ge(),x=(()=>j!==null?(j&Y.Open)===Y.Open:e.popoverState===0)();Le(e.button,()=>P({type:1}),x),Ge(T,e.__demoMode?!1:l&&x);let $=A(d=>{var o;switch(d.key){case V.Escape:if(e.popoverState!==0||!r.current||T!=null&&T.activeElement&&!r.current.contains(T.activeElement))return;d.preventDefault(),d.stopPropagation(),P({type:1}),(o=e.button)==null||o.focus();break}});te(()=>{var d;t.static||e.popoverState===1&&((d=t.unmount)==null||d)&&P({type:4,panel:null})},[e.popoverState,t.unmount,t.static,P]),te(()=>{if(e.__demoMode||!y||e.popoverState!==0||!r.current)return;let d=T==null?void 0:T.activeElement;r.current.contains(d)||w(r.current,U.First)},[e.__demoMode,y,r,e.popoverState]);let D=B(()=>({open:e.popoverState===0,close:v}),[e,v]),I=Pe(p?M():{},{ref:L,id:R,onKeyDown:$,onBlur:y&&e.popoverState===0?d=>{var s,c,O,n,m;let o=d.relatedTarget;o&&r.current&&((s=r.current)!=null&&s.contains(o)||(P({type:1}),((O=(c=e.beforePanelSentinel.current)==null?void 0:c.contains)!=null&&O.call(c,o)||(m=(n=e.afterPanelSentinel.current)==null?void 0:n.contains)!=null&&m.call(n,o))&&o.focus({preventScroll:!0})))}:void 0,tabIndex:-1,style:{..._,"--button-width":_e(e.button,!0).width}}),k=be(),J=A(()=>{let d=r.current;if(!d)return;function o(){W(k.current,{[N.Forwards]:()=>{var c;w(d,U.First)===ie.Error&&((c=e.afterPanelSentinel.current)==null||c.focus())},[N.Backwards]:()=>{var s;(s=e.button)==null||s.focus({preventScroll:!0})}})}o()}),G=A(()=>{let d=r.current;if(!d)return;function o(){W(k.current,{[N.Forwards]:()=>{var S;if(!e.button)return;let s=fe(),c=s.indexOf(e.button),O=s.slice(0,c+1),m=[...s.slice(c+1),...O];for(let H of m.slice())if(H.dataset.headlessuiFocusGuard==="true"||(S=e.panel)!=null&&S.contains(H)){let Te=m.indexOf(H);Te!==-1&&m.splice(Te,1)}w(m,U.First,{sorted:!1})},[N.Backwards]:()=>{var c;w(d,U.Previous)===ie.Error&&((c=e.button)==null||c.focus())}})}o()});return b.createElement(ae.Provider,{value:R},b.createElement(le.Provider,{value:{close:v,isPortalled:C}},b.createElement(Ye,{enabled:i?t.static||x:!1},x&&C&&b.createElement(se,{id:E,ref:e.beforePanelSentinel,features:ue.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:J}),Q({mergeRefs:h,ourProps:I,theirProps:f,slot:D,defaultTag:ut,features:it,visible:x,name:"Popover.Panel"}),x&&C&&b.createElement(se,{id:K,ref:e.afterPanelSentinel,features:ue.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:G}))))}let Pt="div";function dt(t,a){let u=q(null),R=X(u,a),[y,g]=ye([]),i=Be(),l=A(r=>{g(p=>{let F=p.indexOf(r);if(F!==-1){let _=p.slice();return _.splice(F,1),_}return p})}),f=A(r=>(g(p=>[...p,r]),()=>l(r))),e=A(()=>{var F;let r=Je(u);if(!r)return!1;let p=r.activeElement;return(F=u.current)!=null&&F.contains(p)?!0:y.some(_=>{var M,L;return((M=r.getElementById(_.buttonId.current))==null?void 0:M.contains(p))||((L=r.getElementById(_.panelId.current))==null?void 0:L.contains(p))})}),P=A(r=>{for(let p of y)p.buttonId.current!==r&&p.close()}),v=B(()=>({registerPopover:f,unregisterPopover:l,isFocusWithinPopoverGroup:e,closeOthers:P,mainTreeNodeRef:i.mainTreeNodeRef}),[f,l,e,P,i.mainTreeNodeRef]),C=B(()=>({}),[]),E=t,K={ref:R};return b.createElement(ve.Provider,{value:v},Q({ourProps:K,theirProps:E,slot:C,defaultTag:Pt,name:"Popover.Group"}),b.createElement(i.MainTreeNode,null))}let ct=z(rt),vt=z(lt),Tt=z(st),mt=z(ft),yt=z(dt),qt=Object.assign(ct,{Button:vt,Overlay:Tt,Panel:mt,Group:yt});export{qt as Popover,vt as PopoverButton,yt as PopoverGroup,Tt as PopoverOverlay,mt as PopoverPanel}; | ||
"use client";import{useFocusRing as xe}from"@react-aria/focus";import{useHover as Oe}from"@react-aria/interactions";import E,{createContext as ee,createRef as ue,useContext as te,useEffect as oe,useMemo as L,useReducer as Le,useRef as X,useState as ge}from"react";import{useActivePress as Ie}from'../../hooks/use-active-press.js';import{useElementSize as De}from'../../hooks/use-element-size.js';import{useEvent as A}from'../../hooks/use-event.js';import{useEventListener as he}from'../../hooks/use-event-listener.js';import{useId as re}from'../../hooks/use-id.js';import{useIsoMorphicEffect as ke}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as Se}from'../../hooks/use-latest-value.js';import{useOnDisappear as Ge}from'../../hooks/use-on-disappear.js';import{useOutsideClick as He}from'../../hooks/use-outside-click.js';import{useOwnerDocument as ie}from'../../hooks/use-owner.js';import{useResolveButtonType as Ne}from'../../hooks/use-resolve-button-type.js';import{useMainTreeNode as Ue,useRootContainers as we}from'../../hooks/use-root-containers.js';import{useScrollLock as Ke}from'../../hooks/use-scroll-lock.js';import{optionalRef as We,useSyncRefs as q}from'../../hooks/use-sync-refs.js';import{Direction as G,useTabDirection as Ae}from'../../hooks/use-tab-direction.js';import{transitionDataAttributes as Re,useTransition as Ce}from'../../hooks/use-transition.js';import{CloseProvider as je}from'../../internal/close-provider.js';import{FloatingProvider as Ve,useFloatingPanel as $e,useFloatingPanelProps as Je,useFloatingReference as Xe,useResolvedAnchor as qe}from'../../internal/floating.js';import{Hidden as de,HiddenFeatures as fe}from'../../internal/hidden.js';import{OpenClosedProvider as ze,ResetOpenClosedProvider as Ye,State as z,useOpenClosed as Be}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as _e}from'../../utils/bugs.js';import{Focus as H,FocusResult as Pe,FocusableMode as Qe,focusIn as U,getFocusableElements as ce,isFocusableElement as Ze}from'../../utils/focus-management.js';import{match as w}from'../../utils/match.js';import'../../utils/micro-task.js';import{getOwnerDocument as et}from'../../utils/owner.js';import{RenderFeatures as ne,forwardRefWithAs as Y,mergeProps as ve,render as Z,useMergeRefsFn as tt}from'../../utils/render.js';import{Keys as K}from'../keyboard.js';import{Portal as ot,useNestedPortals as rt}from'../portal/portal.js';var nt=(f=>(f[f.Open=0]="Open",f[f.Closed=1]="Closed",f))(nt||{}),lt=(u=>(u[u.TogglePopover=0]="TogglePopover",u[u.ClosePopover=1]="ClosePopover",u[u.SetButton=2]="SetButton",u[u.SetButtonId=3]="SetButtonId",u[u.SetPanel=4]="SetPanel",u[u.SetPanelId=5]="SetPanelId",u))(lt||{});let at={[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}}},Te=ee(null);Te.displayName="PopoverContext";function le(t){let a=te(Te);if(a===null){let f=new Error(`<${t} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(f,le),f}return a}let ae=ee(null);ae.displayName="PopoverAPIContext";function me(t){let a=te(ae);if(a===null){let f=new Error(`<${t} /> is missing a parent <Popover /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(f,me),f}return a}let ye=ee(null);ye.displayName="PopoverGroupContext";function Fe(){return te(ye)}let pe=ee(null);pe.displayName="PopoverPanelContext";function pt(){return te(pe)}function st(t,a){return w(a.type,at,t,a)}let ut="div";function it(t,a){var J;let{__demoMode:f=!1,...C}=t,m=X(null),R=q(a,We(e=>{m.current=e})),u=X([]),l=Le(st,{__demoMode:f,popoverState:f?0:1,buttons:u,button:null,buttonId:null,panel:null,panelId:null,beforePanelSentinel:ue(),afterPanelSentinel:ue(),afterButtonSentinel:ue()}),[{popoverState:c,button:P,buttonId:r,panel:i,panelId:B,beforePanelSentinel:y,afterPanelSentinel:I,afterButtonSentinel:d},n]=l,v=ie((J=m.current)!=null?J:P),_=L(()=>{if(!P||!i)return!1;for(let g of document.querySelectorAll("body > *"))if(Number(g==null?void 0:g.contains(P))^Number(g==null?void 0:g.contains(i)))return!0;let e=ce(),s=e.indexOf(P),o=(s+e.length-1)%e.length,p=(s+1)%e.length,S=e[o],b=e[p];return!i.contains(S)&&!i.contains(b)},[P,i]),F=Se(r),x=Se(B),W=L(()=>({buttonId:F,panelId:x,close:()=>n({type:1})}),[F,x,n]),T=Fe(),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)&&((P==null?void 0:P.contains(v.activeElement))||(i==null?void 0:i.contains(v.activeElement)))});oe(()=>D==null?void 0:D(W),[D,W]);let[M,j]=rt(),h=we({mainTreeNodeRef:T==null?void 0:T.mainTreeNodeRef,portals:M,defaultContainers:[P,i]});he(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()||P&&i&&(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=d.current)==null?void 0:b.contains)!=null&&g.call(b,e.target)||n({type:1})))},!0),He(c===0,h.resolveContainers,(e,s)=>{n({type:1}),Ze(s,Qe.Loose)||(e.preventDefault(),P==null||P.focus())});let O=A(e=>{n({type:1});let s=(()=>e?e instanceof HTMLElement?e:"current"in e&&e.current instanceof HTMLElement?e.current:P:P)();s==null||s.focus()}),k=L(()=>({close:O,isPortalled:_}),[O,_]),V=L(()=>({open:c===0,close:O}),[c,O]),$={ref:R};return E.createElement(Ve,null,E.createElement(pe.Provider,{value:null},E.createElement(Te.Provider,{value:l},E.createElement(ae.Provider,{value:k},E.createElement(je,{value:O},E.createElement(ze,{value:w(c,{[0]:z.Open,[1]:z.Closed})},E.createElement(j,null,Z({ourProps:$,theirProps:C,slot:V,defaultTag:ut,name:"Popover"}),E.createElement(h.MainTreeNode,null))))))))}let dt="button";function ft(t,a){let f=re(),{id:C=`headlessui-popover-button-${f}`,disabled:m=!1,autoFocus:R=!1,...u}=t,[l,c]=le("Popover.Button"),{isPortalled:P}=me("Popover.Button"),r=X(null),i=`headlessui-focus-sentinel-${re()}`,B=Fe(),y=B==null?void 0:B.closeOthers,d=pt()!==null;oe(()=>{if(!d)return c({type:3,buttonId:C}),()=>{c({type:3,buttonId:null})}},[d,C,c]);let[n]=ge(()=>Symbol()),v=q(r,a,Xe(),d?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=ie(r),x=A(o=>{var p,S,b;if(d){if(l.popoverState===1)return;switch(o.key){case K.Space:case K.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 K.Space:case K.Enter:o.preventDefault(),o.stopPropagation(),l.popoverState===1&&(y==null||y(l.buttonId)),c({type:0});break;case K.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}}),W=A(o=>{d||o.key===K.Space&&o.preventDefault()}),T=A(o=>{var p,S;_e(o.currentTarget)||m||(d?(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}=xe({autoFocus:R}),{isHovered:j,hoverProps:h}=Oe({isDisabled:m}),{pressed:Q,pressProps:O}=Ie({disabled:m}),k=l.popoverState===0,V=L(()=>({open:k,active:Q||k,disabled:m,hover:j,focus:N,autofocus:R}),[k,j,N,Q,m,R]),$=Ne(t,r),J=d?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:W,onClick:T,onMouseDown:D},M,h,O),e=Ae(),s=A(()=>{let o=l.panel;if(!o)return;function p(){w(e.current,{[G.Forwards]:()=>U(o,H.First),[G.Backwards]:()=>U(o,H.Last)})===Pe.Error&&U(ce().filter(b=>b.dataset.headlessuiFocusGuard!=="true"),w(e.current,{[G.Forwards]:H.Next,[G.Backwards]:H.Previous}),{relativeTo:l.button})}p()});return E.createElement(E.Fragment,null,Z({ourProps:J,theirProps:u,slot:V,defaultTag:dt,name:"Popover.Button"}),k&&!d&&P&&E.createElement(de,{id:i,ref:l.afterButtonSentinel,features:fe.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:s}))}let Pt="div",ct=ne.RenderStrategy|ne.Static;function Me(t,a){let f=re(),{id:C=`headlessui-popover-backdrop-${f}`,transition:m=!1,...R}=t,[{popoverState:u},l]=le("Popover.Backdrop"),c=X(null),P=q(a,c),r=Be(),[i,B]=Ce(m,c,r!==null?(r&z.Open)===z.Open:u===0),y=A(n=>{if(_e(n.currentTarget))return n.preventDefault();l({type:1})}),I=L(()=>({open:u===0}),[u]),d={ref:P,id:C,"aria-hidden":!0,onClick:y,...Re(B)};return Z({ourProps:d,theirProps:R,slot:I,defaultTag:Pt,features:ct,visible:i,name:"Popover.Backdrop"})}let vt="div",Tt=ne.RenderStrategy|ne.Static;function mt(t,a){let f=re(),{id:C=`headlessui-popover-panel-${f}`,focus:m=!1,anchor:R,portal:u=!1,modal:l=!1,transition:c=!1,...P}=t,[r,i]=le("Popover.Panel"),{close:B,isPortalled:y}=me("Popover.Panel"),I=`headlessui-focus-sentinel-before-${f}`,d=`headlessui-focus-sentinel-after-${f}`,n=X(null),v=qe(R),[_,F]=$e(v),x=Je();v&&(u=!0);let W=q(n,a,v?_:null,e=>{i({type:4,panel:e})}),T=ie(n),D=tt();ke(()=>(i({type:5,panelId:C}),()=>{i({type:5,panelId:null})}),[C,i]);let N=Be(),[M,j]=Ce(c,n,N!==null?(N&z.Open)===z.Open:r.popoverState===0);Ge(M,r.button,()=>{i({type:1})});let h=r.__demoMode?!1:l&&M;Ke(h,T);let Q=A(e=>{var s;switch(e.key){case K.Escape:if(r.popoverState!==0||!n.current||T!=null&&T.activeElement&&!n.current.contains(T.activeElement))return;e.preventDefault(),e.stopPropagation(),i({type:1}),(s=r.button)==null||s.focus();break}});oe(()=>{var e;t.static||r.popoverState===1&&((e=t.unmount)==null||e)&&i({type:4,panel:null})},[r.popoverState,t.unmount,t.static,i]),oe(()=>{if(r.__demoMode||!m||r.popoverState!==0||!n.current)return;let e=T==null?void 0:T.activeElement;n.current.contains(e)||U(n.current,H.First)},[r.__demoMode,m,n,r.popoverState]);let O=L(()=>({open:r.popoverState===0,close:B}),[r.popoverState,B]),k=ve(v?x():{},{ref:W,id:C,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)||(i({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:{...P.style,...F,"--button-width":De(r.button,!0).width},...Re(j)}),V=Ae(),$=A(()=>{let e=n.current;if(!e)return;function s(){w(V.current,{[G.Forwards]:()=>{var p;U(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(){w(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)}U(g,H.First,{sorted:!1})},[G.Backwards]:()=>{var p;U(e,H.Previous)===Pe.Error&&((p=r.button)==null||p.focus())}})}s()});return E.createElement(Ye,null,E.createElement(pe.Provider,{value:C},E.createElement(ae.Provider,{value:{close:B,isPortalled:y}},E.createElement(ot,{enabled:u?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:P,slot:O,defaultTag:vt,features:Tt,visible:M,name:"Popover.Panel"}),M&&y&&E.createElement(de,{id:d,ref:r.afterPanelSentinel,features:fe.Focusable,"data-headlessui-focus-guard":!0,as:"button",type:"button",onFocus:J})))))}let yt="div";function Et(t,a){let f=X(null),C=q(f,a),[m,R]=ge([]),u=Ue(),l=A(d=>{R(n=>{let v=n.indexOf(d);if(v!==-1){let _=n.slice();return _.splice(v,1),_}return n})}),c=A(d=>(R(n=>[...n,d]),()=>l(d))),P=A(()=>{var v;let d=et(f);if(!d)return!1;let n=d.activeElement;return(v=f.current)!=null&&v.contains(n)?!0:m.some(_=>{var F,x;return((F=d.getElementById(_.buttonId.current))==null?void 0:F.contains(n))||((x=d.getElementById(_.panelId.current))==null?void 0:x.contains(n))})}),r=A(d=>{for(let n of m)n.buttonId.current!==d&&n.close()}),i=L(()=>({registerPopover:c,unregisterPopover:l,isFocusWithinPopoverGroup:P,closeOthers:r,mainTreeNodeRef:u.mainTreeNodeRef}),[c,l,P,r,u.mainTreeNodeRef]),B=L(()=>({}),[]),y=t,I={ref:C};return E.createElement(ye.Provider,{value:i},Z({ourProps:I,theirProps:y,slot:B,defaultTag:yt,name:"Popover.Group"}),E.createElement(u.MainTreeNode,null))}let bt=Y(it),gt=Y(ft),St=Y(Me),At=Y(Me),Rt=Y(mt),Ct=Y(Et),no=Object.assign(bt,{Button:gt,Backdrop:At,Overlay:St,Panel:Rt,Group:Ct});export{no as Popover,At as PopoverBackdrop,gt as PopoverButton,Ct as PopoverGroup,St as PopoverOverlay,Rt as PopoverPanel}; |
@@ -33,4 +33,5 @@ import React, { type ElementType, type MutableRefObject, type Ref } from 'react'; | ||
export declare let Portal: _internal_ComponentPortal & { | ||
/** @deprecated use `<PortalGroup>` instead of `<Portal.Group>` */ | ||
Group: _internal_ComponentPortalGroup; | ||
}; | ||
export {}; |
@@ -68,2 +68,3 @@ import React, { type ElementType, type Ref } from 'react'; | ||
declare let RadioGroupRoot: _internal_ComponentRadioGroup; | ||
/** @deprecated use `<Radio>` instead of `<RadioGroupOption>` */ | ||
export declare let RadioGroupOption: _internal_ComponentRadioOption; | ||
@@ -76,3 +77,6 @@ export declare let Radio: _internal_ComponentRadio; | ||
export declare let RadioGroup: _internal_ComponentRadioGroup & { | ||
/** @deprecated use `<Radio>` instead of `<RadioGroup.Option>` */ | ||
Option: _internal_ComponentRadioOption; | ||
/** @deprecated use `<Radio>` instead of `<RadioGroup.Radio>` */ | ||
Radio: _internal_ComponentRadio; | ||
/** @deprecated use `<Label>` instead of `<RadioGroup.Label>` */ | ||
@@ -79,0 +83,0 @@ Label: _internal_ComponentRadioLabel; |
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as Q}from"@react-aria/focus";import{useHover as Y}from"@react-aria/interactions";import G,{createContext as Z,useCallback as ye,useContext as ee,useMemo as x,useReducer as me,useRef as W}from"react";import{useByComparator as Re}from'../../hooks/use-by-comparator.js';import{useControllable as be}from'../../hooks/use-controllable.js';import{useEvent as S}from'../../hooks/use-event.js';import{useId as B}from'../../hooks/use-id.js';import{useIsoMorphicEffect as te}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as oe}from'../../hooks/use-latest-value.js';import{useSyncRefs as K}from'../../hooks/use-sync-refs.js';import{useDisabled as re}from'../../internal/disabled.js';import{FormFields as ge}from'../../internal/form-fields.js';import{useProvidedId as Oe}from'../../internal/id.js';import{isDisabledReactIssue7711 as ne}from'../../utils/bugs.js';import{Focus as w,FocusResult as ie,focusIn as ae,sortByDomNode as Pe}from'../../utils/focus-management.js';import{attemptSubmit as ve}from'../../utils/form.js';import{match as De}from'../../utils/match.js';import{getOwnerDocument as Ae}from'../../utils/owner.js';import{forwardRefWithAs as $,mergeProps as pe,render as j}from'../../utils/render.js';import{Description as _e,useDescribedBy as Ee,useDescriptions as le}from'../description/description.js';import{Keys as I}from'../keyboard.js';import{Label as Ge,useLabelledBy as xe,useLabels as se}from'../label/label.js';var Ce=(e=>(e[e.RegisterOption=0]="RegisterOption",e[e.UnregisterOption=1]="UnregisterOption",e))(Ce||{});let he={[0](o,t){let e=[...o.options,{id:t.id,element:t.element,propsRef:t.propsRef}];return{...o,options:Pe(e,a=>a.element.current)}},[1](o,t){let e=o.options.slice(),a=o.options.findIndex(O=>O.id===t.id);return a===-1?o:(e.splice(a,1),{...o,options:e})}},V=Z(null);V.displayName="RadioGroupDataContext";function J(o){let t=ee(V);if(t===null){let e=new Error(`<${o} /> is missing a parent <RadioGroup /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,J),e}return t}let X=Z(null);X.displayName="RadioGroupActionsContext";function z(o){let t=ee(X);if(t===null){let e=new Error(`<${o} /> is missing a parent <RadioGroup /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,z),e}return t}function Le(o,t){return De(t.type,he,o,t)}let ke="div";function Fe(o,t){let e=B(),a=re(),{id:O=`headlessui-radiogroup-${e}`,value:T,defaultValue:y,form:p,name:d,onChange:u,by:c,disabled:m=a||!1,...R}=o,f=Re(c),[P,C]=me(Le,{options:[]}),i=P.options,[U,h]=se(),[v,L]=le(),D=W(null),M=K(D,t),[r,A]=be(T,u,y),k=x(()=>i.find(n=>!n.propsRef.current.disabled),[i]),b=x(()=>i.some(n=>f(n.propsRef.current.value,r)),[i,r]),l=S(n=>{var s;if(m||f(n,r))return!1;let F=(s=i.find(H=>f(H.propsRef.current.value,n)))==null?void 0:s.propsRef.current;return F!=null&&F.disabled?!1:(A==null||A(n),!0)}),_=S(n=>{let F=D.current;if(!F)return;let s=Ae(F),H=i.filter(g=>g.propsRef.current.disabled===!1).map(g=>g.element.current);switch(n.key){case I.Enter:ve(n.currentTarget);break;case I.ArrowLeft:case I.ArrowUp:if(n.preventDefault(),n.stopPropagation(),ae(H,w.Previous|w.WrapAround)===ie.Success){let E=i.find(N=>N.element.current===(s==null?void 0:s.activeElement));E&&l(E.propsRef.current.value)}break;case I.ArrowRight:case I.ArrowDown:if(n.preventDefault(),n.stopPropagation(),ae(H,w.Next|w.WrapAround)===ie.Success){let E=i.find(N=>N.element.current===(s==null?void 0:s.activeElement));E&&l(E.propsRef.current.value)}break;case I.Space:{n.preventDefault(),n.stopPropagation();let g=i.find(E=>E.element.current===(s==null?void 0:s.activeElement));g&&l(g.propsRef.current.value)}break}}),q=S(n=>(C({type:0,...n}),()=>C({type:1,id:n.id}))),de=x(()=>({value:r,firstOption:k,containsCheckedOption:b,disabled:m,compare:f,...P}),[r,k,b,m,f,P]),ue=x(()=>({registerOption:q,change:l}),[q,l]),ce={ref:M,id:O,role:"radiogroup","aria-labelledby":U,"aria-describedby":v,onKeyDown:_},fe=x(()=>({value:r}),[r]),Te=ye(()=>l(y),[l]);return G.createElement(L,{name:"RadioGroup.Description"},G.createElement(h,{name:"RadioGroup.Label"},G.createElement(X.Provider,{value:ue},G.createElement(V.Provider,{value:de},d!=null&&G.createElement(ge,{disabled:m,data:{[d]:r||"on"},overrides:{type:"radio",checked:r!=null},form:p,onReset:Te}),j({ourProps:ce,theirProps:R,slot:fe,defaultTag:ke,name:"RadioGroup"})))))}let Ie="div";function Ue(o,t){var b;let e=J("RadioGroup.Option"),a=z("RadioGroup.Option"),O=B(),{id:T=`headlessui-radiogroup-option-${O}`,value:y,disabled:p=e.disabled||!1,autoFocus:d=!1,...u}=o,c=W(null),m=K(c,t),[R,f]=se(),[P,C]=le(),i=oe({value:y,disabled:p});te(()=>a.registerOption({id:T,element:c,propsRef:i}),[T,a,c,i]);let U=S(l=>{var _;if(ne(l.currentTarget))return l.preventDefault();a.change(y)&&((_=c.current)==null||_.focus())}),h=((b=e.firstOption)==null?void 0:b.id)===T,{isFocusVisible:v,focusProps:L}=Q({autoFocus:d}),{isHovered:D,hoverProps:M}=Y({isDisabled:p}),r=e.compare(e.value,y),A=pe({ref:m,id:T,role:"radio","aria-checked":r?"true":"false","aria-labelledby":R,"aria-describedby":P,"aria-disabled":p?!0:void 0,tabIndex:(()=>p?-1:r||!e.containsCheckedOption&&h?0:-1)(),onClick:p?void 0:U,autoFocus:d},L,M),k=x(()=>({checked:r,disabled:p,active:v,hover:D,focus:v,autofocus:d}),[r,p,D,v,d]);return G.createElement(C,{name:"RadioGroup.Description"},G.createElement(f,{name:"RadioGroup.Label"},j({ourProps:A,theirProps:u,slot:k,defaultTag:Ie,name:"RadioGroup.Option"})))}let Me="span";function Se(o,t){var b;let e=J("Radio"),a=z("Radio"),O=B(),T=Oe(),y=re(),{id:p=T||`headlessui-radio-${O}`,value:d,disabled:u=e.disabled||y||!1,autoFocus:c=!1,...m}=o,R=W(null),f=K(R,t),P=xe(),C=Ee(),i=oe({value:d,disabled:u});te(()=>a.registerOption({id:p,element:R,propsRef:i}),[p,a,R,i]);let U=S(l=>{var _;if(ne(l.currentTarget))return l.preventDefault();a.change(d)&&((_=R.current)==null||_.focus())}),{isFocusVisible:h,focusProps:v}=Q({autoFocus:c}),{isHovered:L,hoverProps:D}=Y({isDisabled:u}),M=((b=e.firstOption)==null?void 0:b.id)===p,r=e.compare(e.value,d),A=pe({ref:f,id:p,role:"radio","aria-checked":r?"true":"false","aria-labelledby":P,"aria-describedby":C,"aria-disabled":u?!0:void 0,tabIndex:(()=>u?-1:r||!e.containsCheckedOption&&M?0:-1)(),autoFocus:c,onClick:u?void 0:U},v,D),k=x(()=>({checked:r,disabled:u,hover:L,focus:h,autofocus:c}),[r,u,L,h,c]);return j({ourProps:A,theirProps:m,slot:k,defaultTag:Me,name:"Radio"})}let He=$(Fe),we=$(Ue),dt=$(Se),Ne=Ge,We=_e,ut=Object.assign(He,{Option:we,Label:Ne,Description:We});export{dt as Radio,ut as RadioGroup,We as RadioGroupDescription,Ne as RadioGroupLabel,we as RadioGroupOption}; | ||
"use client";import{useFocusRing as Q}from"@react-aria/focus";import{useHover as Y}from"@react-aria/interactions";import G,{createContext as Z,useCallback as ye,useContext as ee,useMemo as x,useReducer as Re,useRef as W}from"react";import{useByComparator as be}from'../../hooks/use-by-comparator.js';import{useControllable as ge}from'../../hooks/use-controllable.js';import{useDefaultValue as Oe}from'../../hooks/use-default-value.js';import{useEvent as S}from'../../hooks/use-event.js';import{useId as B}from'../../hooks/use-id.js';import{useIsoMorphicEffect as te}from'../../hooks/use-iso-morphic-effect.js';import{useLatestValue as oe}from'../../hooks/use-latest-value.js';import{useSyncRefs as V}from'../../hooks/use-sync-refs.js';import{useDisabled as re}from'../../internal/disabled.js';import{FormFields as Pe}from'../../internal/form-fields.js';import{useProvidedId as ve}from'../../internal/id.js';import{isDisabledReactIssue7711 as ie}from'../../utils/bugs.js';import{Focus as w,FocusResult as ne,focusIn as ae,sortByDomNode as De}from'../../utils/focus-management.js';import{attemptSubmit as Ae}from'../../utils/form.js';import{match as _e}from'../../utils/match.js';import{getOwnerDocument as Ee}from'../../utils/owner.js';import{forwardRefWithAs as K,mergeProps as pe,render as $}from'../../utils/render.js';import{Description as Ge,useDescribedBy as xe,useDescriptions as le}from'../description/description.js';import{Keys as F}from'../keyboard.js';import{Label as Ce,useLabelledBy as he,useLabels as se}from'../label/label.js';var Le=(e=>(e[e.RegisterOption=0]="RegisterOption",e[e.UnregisterOption=1]="UnregisterOption",e))(Le||{});let ke={[0](o,t){let e=[...o.options,{id:t.id,element:t.element,propsRef:t.propsRef}];return{...o,options:De(e,a=>a.element.current)}},[1](o,t){let e=o.options.slice(),a=o.options.findIndex(O=>O.id===t.id);return a===-1?o:(e.splice(a,1),{...o,options:e})}},j=Z(null);j.displayName="RadioGroupDataContext";function J(o){let t=ee(j);if(t===null){let e=new Error(`<${o} /> is missing a parent <RadioGroup /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,J),e}return t}let X=Z(null);X.displayName="RadioGroupActionsContext";function z(o){let t=ee(X);if(t===null){let e=new Error(`<${o} /> is missing a parent <RadioGroup /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(e,z),e}return t}function Fe(o,t){return _e(t.type,ke,o,t)}let Ie="div";function Ue(o,t){let e=B(),a=re(),{id:O=`headlessui-radiogroup-${e}`,value:m,form:P,name:i,onChange:f,by:c,disabled:p=a||!1,defaultValue:I,...y}=o,T=be(c),[v,C]=Re(Fe,{options:[]}),n=v.options,[U,h]=se(),[D,L]=le(),A=W(null),M=V(A,t),l=Oe(I),[s,_]=ge(m,f,l),R=x(()=>n.find(r=>!r.propsRef.current.disabled),[n]),b=x(()=>n.some(r=>T(r.propsRef.current.value,s)),[n,s]),d=S(r=>{var u;if(p||T(r,s))return!1;let k=(u=n.find(H=>T(H.propsRef.current.value,r)))==null?void 0:u.propsRef.current;return k!=null&&k.disabled?!1:(_==null||_(r),!0)}),de=S(r=>{let k=A.current;if(!k)return;let u=Ee(k),H=n.filter(g=>g.propsRef.current.disabled===!1).map(g=>g.element.current);switch(r.key){case F.Enter:Ae(r.currentTarget);break;case F.ArrowLeft:case F.ArrowUp:if(r.preventDefault(),r.stopPropagation(),ae(H,w.Previous|w.WrapAround)===ne.Success){let E=n.find(N=>N.element.current===(u==null?void 0:u.activeElement));E&&d(E.propsRef.current.value)}break;case F.ArrowRight:case F.ArrowDown:if(r.preventDefault(),r.stopPropagation(),ae(H,w.Next|w.WrapAround)===ne.Success){let E=n.find(N=>N.element.current===(u==null?void 0:u.activeElement));E&&d(E.propsRef.current.value)}break;case F.Space:{r.preventDefault(),r.stopPropagation();let g=n.find(E=>E.element.current===(u==null?void 0:u.activeElement));g&&d(g.propsRef.current.value)}break}}),q=S(r=>(C({type:0,...r}),()=>C({type:1,id:r.id}))),ue=x(()=>({value:s,firstOption:R,containsCheckedOption:b,disabled:p,compare:T,...v}),[s,R,b,p,T,v]),ce=x(()=>({registerOption:q,change:d}),[q,d]),fe={ref:M,id:O,role:"radiogroup","aria-labelledby":U,"aria-describedby":D,onKeyDown:de},Te=x(()=>({value:s}),[s]),me=ye(()=>{if(l!==void 0)return d(l)},[d,l]);return G.createElement(L,{name:"RadioGroup.Description"},G.createElement(h,{name:"RadioGroup.Label"},G.createElement(X.Provider,{value:ce},G.createElement(j.Provider,{value:ue},i!=null&&G.createElement(Pe,{disabled:p,data:{[i]:s||"on"},overrides:{type:"radio",checked:s!=null},form:P,onReset:me}),$({ourProps:fe,theirProps:y,slot:Te,defaultTag:Ie,name:"RadioGroup"})))))}let Me="div";function Se(o,t){var R;let e=J("RadioGroup.Option"),a=z("RadioGroup.Option"),O=B(),{id:m=`headlessui-radiogroup-option-${O}`,value:P,disabled:i=e.disabled||!1,autoFocus:f=!1,...c}=o,p=W(null),I=V(p,t),[y,T]=se(),[v,C]=le(),n=oe({value:P,disabled:i});te(()=>a.registerOption({id:m,element:p,propsRef:n}),[m,a,p,n]);let U=S(b=>{var d;if(ie(b.currentTarget))return b.preventDefault();a.change(P)&&((d=p.current)==null||d.focus())}),h=((R=e.firstOption)==null?void 0:R.id)===m,{isFocusVisible:D,focusProps:L}=Q({autoFocus:f}),{isHovered:A,hoverProps:M}=Y({isDisabled:i}),l=e.compare(e.value,P),s=pe({ref:I,id:m,role:"radio","aria-checked":l?"true":"false","aria-labelledby":y,"aria-describedby":v,"aria-disabled":i?!0:void 0,tabIndex:(()=>i?-1:l||!e.containsCheckedOption&&h?0:-1)(),onClick:i?void 0:U,autoFocus:f},L,M),_=x(()=>({checked:l,disabled:i,active:D,hover:A,focus:D,autofocus:f}),[l,i,A,D,f]);return G.createElement(C,{name:"RadioGroup.Description"},G.createElement(T,{name:"RadioGroup.Label"},$({ourProps:s,theirProps:c,slot:_,defaultTag:Me,name:"RadioGroup.Option"})))}let He="span";function we(o,t){var R;let e=J("Radio"),a=z("Radio"),O=B(),m=ve(),P=re(),{id:i=m||`headlessui-radio-${O}`,value:f,disabled:c=e.disabled||P||!1,autoFocus:p=!1,...I}=o,y=W(null),T=V(y,t),v=he(),C=xe(),n=oe({value:f,disabled:c});te(()=>a.registerOption({id:i,element:y,propsRef:n}),[i,a,y,n]);let U=S(b=>{var d;if(ie(b.currentTarget))return b.preventDefault();a.change(f)&&((d=y.current)==null||d.focus())}),{isFocusVisible:h,focusProps:D}=Q({autoFocus:p}),{isHovered:L,hoverProps:A}=Y({isDisabled:c}),M=((R=e.firstOption)==null?void 0:R.id)===i,l=e.compare(e.value,f),s=pe({ref:T,id:i,role:"radio","aria-checked":l?"true":"false","aria-labelledby":v,"aria-describedby":C,"aria-disabled":c?!0:void 0,tabIndex:(()=>c?-1:l||!e.containsCheckedOption&&M?0:-1)(),autoFocus:p,onClick:c?void 0:U},D,A),_=x(()=>({checked:l,disabled:c,hover:L,focus:h,autofocus:p}),[l,c,L,h,p]);return $({ourProps:s,theirProps:I,slot:_,defaultTag:He,name:"Radio"})}let Ne=K(Ue),We=K(Se),Be=K(we),Ve=Ce,Ke=Ge,Tt=Object.assign(Ne,{Option:We,Radio:Be,Label:Ve,Description:Ke});export{Be as Radio,Tt as RadioGroup,Ke as RadioGroupDescription,Ve as RadioGroupLabel,We as RadioGroupOption}; |
@@ -44,2 +44,3 @@ import React, { type ElementType, type Ref } from 'react'; | ||
} | ||
/** @deprecated use `<Field>` instead of `<SwitchGroup>` */ | ||
export declare let SwitchGroup: _internal_ComponentSwitchGroup; | ||
@@ -51,2 +52,3 @@ /** @deprecated use `<Label>` instead of `<SwitchLabel>` */ | ||
export declare let Switch: _internal_ComponentSwitch & { | ||
/** @deprecated use `<Field>` instead of `<Switch.Group>` */ | ||
Group: _internal_ComponentSwitchGroup; | ||
@@ -53,0 +55,0 @@ /** @deprecated use `<Label>` instead of `<Switch.Label>` */ |
@@ -1,1 +0,1 @@ | ||
"use client";import{useFocusRing as V}from"@react-aria/focus";import{useHover as $}from"@react-aria/interactions";import l,{Fragment as q,createContext as z,useCallback as Q,useContext as Y,useMemo as C,useRef as Z,useState as L}from"react";import{useActivePress as ee}from'../../hooks/use-active-press.js';import{useControllable as te}from'../../hooks/use-controllable.js';import{useDisposables as oe}from'../../hooks/use-disposables.js';import{useEvent as m}from'../../hooks/use-event.js';import{useId as re}from'../../hooks/use-id.js';import{useResolveButtonType as ne}from'../../hooks/use-resolve-button-type.js';import{useSyncRefs as le}from'../../hooks/use-sync-refs.js';import{useDisabled as ie}from'../../internal/disabled.js';import{FormFields as ae}from'../../internal/form-fields.js';import{useProvidedId as se}from'../../internal/id.js';import{isDisabledReactIssue7711 as pe}from'../../utils/bugs.js';import{attemptSubmit as ce}from'../../utils/form.js';import{forwardRefWithAs as ue,mergeProps as de,render as G}from'../../utils/render.js';import{Description as me,useDescribedBy as fe,useDescriptions as be}from'../description/description.js';import{Keys as R}from'../keyboard.js';import{Label as he,useLabelledBy as Te,useLabels as ye}from'../label/label.js';let y=z(null);y.displayName="GroupContext";let Se=q;function we(n){var i;let[o,s]=L(null),[f,b]=ye(),[h,t]=be(),p=C(()=>({switch:o,setSwitch:s}),[o,s]),c={},T=n;return l.createElement(t,{name:"Switch.Description",value:h},l.createElement(b,{name:"Switch.Label",value:f,props:{htmlFor:(i=p.switch)==null?void 0:i.id,onClick(u){o&&(u.currentTarget instanceof HTMLLabelElement&&u.preventDefault(),o.click(),o.focus({preventScroll:!0}))}}},l.createElement(y.Provider,{value:p},G({ourProps:c,theirProps:T,slot:{},defaultTag:Se,name:"Switch.Group"}))))}let _e="button";function Pe(n,o){var x;let s=re(),f=se(),b=ie(),{id:h=f||`headlessui-switch-${s}`,disabled:t=b||!1,checked:p,defaultChecked:c=!1,onChange:T,name:i,value:u,form:A,autoFocus:d=!1,...F}=n,S=Y(y),w=Z(null),k=le(w,o,S===null?null:S.setSwitch),[a,r]=te(p,T,c),H=oe(),[_,P]=L(!1),E=m(()=>{P(!0),r==null||r(!a),H.nextFrame(()=>{P(!1)})}),M=m(e=>{if(pe(e.currentTarget))return e.preventDefault();e.preventDefault(),E()}),U=m(e=>{e.key===R.Space?(e.preventDefault(),E()):e.key===R.Enter&&ce(e.currentTarget)}),I=m(e=>e.preventDefault()),B=Te(),K=fe(),{isFocusVisible:g,focusProps:W}=V({autoFocus:d}),{isHovered:D,hoverProps:O}=$({isDisabled:t}),{pressed:v,pressProps:N}=ee({disabled:t}),J=C(()=>({checked:a,disabled:t,hover:D,focus:g,active:v,autofocus:d,changing:_}),[a,D,g,v,t,_,d]),X=de({id:h,ref:k,role:"switch",type:ne(n,w),tabIndex:n.tabIndex===-1?0:(x=n.tabIndex)!=null?x:0,"aria-checked":a,"aria-labelledby":B,"aria-describedby":K,disabled:t||void 0,autoFocus:d,onClick:M,onKeyUp:U,onKeyPress:I},W,O,N),j=Q(()=>r==null?void 0:r(c),[r]);return l.createElement(l.Fragment,null,i!=null&&l.createElement(ae,{disabled:t,data:{[i]:u||"on"},overrides:{type:"checkbox",checked:a},form:A,onReset:j}),G({ourProps:X,theirProps:F,slot:J,defaultTag:_e,name:"Switch"}))}let Ee=ue(Pe),ge=we,De=he,ve=me,je=Object.assign(Ee,{Group:ge,Label:De,Description:ve});export{je as Switch,ve as SwitchDescription,ge as SwitchGroup,De as SwitchLabel}; | ||
"use client";import{useFocusRing as $}from"@react-aria/focus";import{useHover as q}from"@react-aria/interactions";import i,{Fragment as z,createContext as Q,useCallback as Y,useContext as Z,useMemo as L,useRef as ee,useState as G}from"react";import{useActivePress as te}from'../../hooks/use-active-press.js';import{useControllable as oe}from'../../hooks/use-controllable.js';import{useDefaultValue as re}from'../../hooks/use-default-value.js';import{useDisposables as ne}from'../../hooks/use-disposables.js';import{useEvent as m}from'../../hooks/use-event.js';import{useId as le}from'../../hooks/use-id.js';import{useResolveButtonType as ie}from'../../hooks/use-resolve-button-type.js';import{useSyncRefs as ae}from'../../hooks/use-sync-refs.js';import{useDisabled as se}from'../../internal/disabled.js';import{FormFields as pe}from'../../internal/form-fields.js';import{useProvidedId as ce}from'../../internal/id.js';import{isDisabledReactIssue7711 as ue}from'../../utils/bugs.js';import{attemptSubmit as de}from'../../utils/form.js';import{forwardRefWithAs as me,mergeProps as fe,render as R}from'../../utils/render.js';import{Description as be,useDescribedBy as he,useDescriptions as Te}from'../description/description.js';import{Keys as A}from'../keyboard.js';import{Label as ye,useLabelledBy as Se,useLabels as we}from'../label/label.js';let S=Q(null);S.displayName="GroupContext";let _e=z;function Pe(n){var a;let[o,p]=G(null),[f,b]=we(),[h,t]=Te(),c=L(()=>({switch:o,setSwitch:p}),[o,p]),T={},y=n;return i.createElement(t,{name:"Switch.Description",value:h},i.createElement(b,{name:"Switch.Label",value:f,props:{htmlFor:(a=c.switch)==null?void 0:a.id,onClick(u){o&&(u.currentTarget instanceof HTMLLabelElement&&u.preventDefault(),o.click(),o.focus({preventScroll:!0}))}}},i.createElement(S.Provider,{value:c},R({ourProps:T,theirProps:y,slot:{},defaultTag:_e,name:"Switch.Group"}))))}let Ee="button";function De(n,o){var C;let p=le(),f=ce(),b=se(),{id:h=f||`headlessui-switch-${p}`,disabled:t=b||!1,checked:c,defaultChecked:T,onChange:y,name:a,value:u,form:F,autoFocus:d=!1,...k}=n,w=Z(S),_=ee(null),H=ae(_,o,w===null?null:w.setSwitch),l=re(T),[s,r]=oe(c,y,l!=null?l:!1),M=ne(),[P,E]=G(!1),D=m(()=>{E(!0),r==null||r(!s),M.nextFrame(()=>{E(!1)})}),U=m(e=>{if(ue(e.currentTarget))return e.preventDefault();e.preventDefault(),D()}),I=m(e=>{e.key===A.Space?(e.preventDefault(),D()):e.key===A.Enter&&de(e.currentTarget)}),B=m(e=>e.preventDefault()),K=Se(),W=he(),{isFocusVisible:g,focusProps:O}=$({autoFocus:d}),{isHovered:v,hoverProps:N}=q({isDisabled:t}),{pressed:x,pressProps:J}=te({disabled:t}),V=L(()=>({checked:s,disabled:t,hover:v,focus:g,active:x,autofocus:d,changing:P}),[s,v,g,x,t,P,d]),X=fe({id:h,ref:H,role:"switch",type:ie(n,_),tabIndex:n.tabIndex===-1?0:(C=n.tabIndex)!=null?C:0,"aria-checked":s,"aria-labelledby":K,"aria-describedby":W,disabled:t||void 0,autoFocus:d,onClick:U,onKeyUp:I,onKeyPress:B},O,N,J),j=Y(()=>{if(l!==void 0)return r==null?void 0:r(l)},[r,l]);return i.createElement(i.Fragment,null,a!=null&&i.createElement(pe,{disabled:t,data:{[a]:u||"on"},overrides:{type:"checkbox",checked:s},form:F,onReset:j}),R({ourProps:X,theirProps:k,slot:V,defaultTag:Ee,name:"Switch"}))}let ge=me(De),ve=Pe,xe=ye,Ce=be,qe=Object.assign(ge,{Group:ve,Label:xe,Description:Ce});export{qe as Switch,Ce as SwitchDescription,ve as SwitchGroup,xe as SwitchLabel}; |
@@ -77,7 +77,11 @@ import React, { type ElementType, type Ref } from 'react'; | ||
export declare let Tab: _internal_ComponentTab & { | ||
/** @deprecated use `<TabGroup>` instead of `<Tab.Group>` */ | ||
Group: _internal_ComponentTabGroup; | ||
/** @deprecated use `<TabList>` instead of `<Tab.List>` */ | ||
List: _internal_ComponentTabList; | ||
/** @deprecated use `<TabPanels>` instead of `<Tab.Panels>` */ | ||
Panels: _internal_ComponentTabPanels; | ||
/** @deprecated use `<TabPanel>` instead of `<Tab.Panel>` */ | ||
Panel: _internal_ComponentTabPanel; | ||
}; | ||
export {}; |
@@ -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; | ||
@@ -30,3 +31,3 @@ }>; | ||
}>; | ||
type TransitionChildRenderPropArg = MutableRefObject<HTMLDivElement>; | ||
type TransitionChildRenderPropArg = MutableRefObject<HTMLElement>; | ||
declare let TransitionChildRenderFeatures: RenderFeatures; | ||
@@ -47,5 +48,7 @@ declare function TransitionChildFn<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG>(props: TransitionChildProps<TTag>, ref: Ref<HTMLElement>): React.JSX.Element; | ||
export declare let Transition: _internal_ComponentTransitionRoot & { | ||
/** @deprecated use `<TransitionChild>` instead of `<Transition.Child>` */ | ||
Child: _internal_ComponentTransitionChild; | ||
/** @deprecated use `<Transition>` instead of `<Transition.Root>` */ | ||
Root: _internal_ComponentTransitionRoot; | ||
}; | ||
export {}; |
@@ -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 _}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 De(){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 Fe(){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&&(_(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))}))}),D=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:D,unregister:d,onStart:m,onStop:h,wait:f,chains:C}),[D,d,a,m,h,C,f])}let me=B,ce=Pe.RenderStrategy;function _e(t,n){var ne,re,ie;let{beforeEnter:r,afterEnter:a,beforeLeave:H,afterLeave:L,enter:d,enterFrom:D,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}=De(),[P,J]=K(c?"visible":"hidden"),$=Fe(),{register:w,unregister:M}=$;I(()=>w(e),[w,e]),I(()=>{if(g===x.Hidden&&e.current){if(c&&P!=="visible"){J("visible");return}return _(P,{["hidden"]:()=>M(e),["visible"]:()=>w(e)})}},[P,e,w,M,c,g]);let F=O({base:y(i.className),enter:y(d),enterFrom:y(D),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=>_(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=>_(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:F,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,...F.current.enter,...F.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,..._(te,{enter:[...F.current.enterTo,...F.current.entered],leave:F.current.leaveTo,idle:[]})),p.className===""&&delete p.className),T.createElement(k.Provider,{value:G},T.createElement(Re,{value:_(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),D=de(t),R=le(...D?[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(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(_e),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{transitionDataAttributes as be,useTransition as Se}from'../../hooks/use-transition.js';import{OpenClosedProvider as Ee,State as N,useOpenClosed as re}from'../../internal/open-closed.js';import{classNames as ye}from'../../utils/class-names.js';import{match as oe}from'../../utils/match.js';import{RenderFeatures as Re,RenderStrategy as P,compact as Pe,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 xe=(i=>(i.Visible="visible",i.Hidden="hidden",i))(xe||{});function Ne(){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 _e(){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=Re.RenderStrategy;function De(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}=Ne(),[g,U]=k(T?"visible":"hidden"),z=_e(),{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]=Se(me,n,T,{start:Q,end:Y}),ce=Pe({ref:R,className:(($=ye(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,...be(a)}),_=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(Ee,{value:_},se({ourProps:ce,theirProps:r,defaultTag:ue,features:Te,visible:g==="visible",name:"Transition.Child"})))}function He(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 Ae(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(He),de=q(De),Ie=q(Ae),Xe=Object.assign(J,{Child:Ie,Root:J});export{Xe as Transition,Ie as TransitionChild}; |
@@ -1,1 +0,1 @@ | ||
import{disposables as m}from'../../utils/disposables.js';import{isIOS as u}from'../../utils/platform.js';function d(){return u()?{before({doc:r,d:l,meta:c}){function o(a){return c.containers.flatMap(n=>n()).some(n=>n.contains(a))}l.microTask(()=>{var s;if(window.getComputedStyle(r.documentElement).scrollBehavior!=="auto"){let t=m();t.style(r.documentElement,"scrollBehavior","auto"),l.add(()=>l.microTask(()=>t.dispose()))}let a=(s=window.scrollY)!=null?s:window.pageYOffset,n=null;l.addEventListener(r,"click",t=>{if(t.target instanceof HTMLElement)try{let e=t.target.closest("a");if(!e)return;let{hash:f}=new URL(e.href),i=r.querySelector(f);i&&!o(i)&&(n=i)}catch{}},!0),l.addEventListener(r,"touchstart",t=>{if(t.target instanceof HTMLElement)if(o(t.target)){let e=t.target;for(;e.parentElement&&o(e.parentElement);)e=e.parentElement;l.style(e,"overscrollBehavior","contain")}else l.style(t.target,"touchAction","none")}),l.addEventListener(r,"touchmove",t=>{if(t.target instanceof HTMLElement)if(o(t.target)){let e=t.target;for(;e.parentElement&&e.dataset.headlessuiPortal!==""&&!(e.scrollHeight>e.clientHeight||e.scrollWidth>e.clientWidth);)e=e.parentElement;e.dataset.headlessuiPortal===""&&t.preventDefault()}else t.preventDefault()},{passive:!1}),l.add(()=>{var e;let t=(e=window.scrollY)!=null?e:window.pageYOffset;a!==t&&window.scrollTo(0,a),n&&n.isConnected&&(n.scrollIntoView({block:"nearest"}),n=null)})})}}:{}}export{d as handleIOSLocking}; | ||
import{disposables as m}from'../../utils/disposables.js';import{isIOS as u}from'../../utils/platform.js';function d(){return u()?{before({doc:r,d:n,meta:c}){function o(a){return c.containers.flatMap(l=>l()).some(l=>l.contains(a))}n.microTask(()=>{var s;if(window.getComputedStyle(r.documentElement).scrollBehavior!=="auto"){let t=m();t.style(r.documentElement,"scrollBehavior","auto"),n.add(()=>n.microTask(()=>t.dispose()))}let a=(s=window.scrollY)!=null?s:window.pageYOffset,l=null;n.addEventListener(r,"click",t=>{if(t.target instanceof HTMLElement)try{let e=t.target.closest("a");if(!e)return;let{hash:f}=new URL(e.href),i=r.querySelector(f);i&&!o(i)&&(l=i)}catch{}},!0),n.addEventListener(r,"touchstart",t=>{if(t.target instanceof HTMLElement)if(o(t.target)){let e=t.target;for(;e.parentElement&&o(e.parentElement);)e=e.parentElement;n.style(e,"overscrollBehavior","contain")}else n.style(t.target,"touchAction","none")}),n.addEventListener(r,"touchmove",t=>{if(t.target instanceof HTMLElement){if(t.target.tagName==="INPUT")return;if(o(t.target)){let e=t.target;for(;e.parentElement&&e.dataset.headlessuiPortal!==""&&!(e.scrollHeight>e.clientHeight||e.scrollWidth>e.clientWidth);)e=e.parentElement;e.dataset.headlessuiPortal===""&&t.preventDefault()}else t.preventDefault()}},{passive:!1}),n.add(()=>{var e;let t=(e=window.scrollY)!=null?e:window.pageYOffset;a!==t&&window.scrollTo(0,a),l&&l.isConnected&&(l.scrollIntoView({block:"nearest"}),l=null)})})}}:{}}export{d as handleIOSLocking}; |
@@ -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}; |
import { type MutableRefObject } from 'react'; | ||
export declare function useDidElementMove(element: MutableRefObject<HTMLElement | null>, enabled?: boolean): boolean; | ||
export declare function useDidElementMove(enabled: boolean, element: MutableRefObject<HTMLElement | null>): boolean; |
@@ -1,1 +0,1 @@ | ||
import{useRef as o}from"react";import{useIsoMorphicEffect as f}from'./use-iso-morphic-effect.js';function p(e,r=!0){let t=o({left:0,top:0});if(f(()=>{let u=e.current;if(!u)return;let l=u.getBoundingClientRect();l&&(t.current=l)},[r]),e.current==null||!r||e.current===document.activeElement)return!1;let n=e.current.getBoundingClientRect();return n.top!==t.current.top||n.left!==t.current.left}export{p as useDidElementMove}; | ||
import{useRef as o}from"react";import{useIsoMorphicEffect as f}from'./use-iso-morphic-effect.js';function p(r,e){let t=o({left:0,top:0});if(f(()=>{let u=e.current;if(!u)return;let l=u.getBoundingClientRect();l&&(t.current=l)},[r]),e.current==null||!r||e.current===document.activeElement)return!1;let n=e.current.getBoundingClientRect();return n.top!==t.current.top||n.left!==t.current.left}export{p as useDidElementMove}; |
@@ -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}; |
@@ -26,5 +26,5 @@ /** | ||
*/ | ||
export declare function useInertOthers({ allowed, disallowed, }?: { | ||
export declare function useInertOthers(enabled: boolean, { allowed, disallowed, }?: { | ||
allowed?: () => (HTMLElement | null)[]; | ||
disallowed?: () => (HTMLElement | null)[]; | ||
}, enabled?: boolean): void; | ||
}): void; |
@@ -1,1 +0,1 @@ | ||
import{disposables as p}from'../utils/disposables.js';import{getOwnerDocument as E}from'../utils/owner.js';import{useIsoMorphicEffect as m}from'./use-iso-morphic-effect.js';let a=new Map,u=new Map;function s(t){var e;let r=(e=u.get(t))!=null?e:0;return u.set(t,r+1),r!==0?()=>c(t):(a.set(t,{"aria-hidden":t.getAttribute("aria-hidden"),inert:t.inert}),t.setAttribute("aria-hidden","true"),t.inert=!0,()=>c(t))}function c(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 H({allowed:t=()=>[],disallowed:r=()=>[]}={},e=!0){m(()=>{if(!e)return;let n=p();for(let i of r())i&&n.add(s(i));let d=t();for(let i of d){if(!i)continue;let l=E(i);if(!l)continue;let o=i.parentElement;for(;o&&o!==l.body;){for(let f of o.children)d.some(h=>f.contains(h))||n.add(s(f));o=o.parentElement}}return n.dispose},[e,t,r])}export{H 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}; |
@@ -9,2 +9,2 @@ import { type MutableRefObject } from 'react'; | ||
*/ | ||
export declare function useOnDisappear(ref: MutableRefObject<HTMLElement | null> | HTMLElement | null, cb: () => void, enabled?: boolean): void; | ||
export declare function useOnDisappear(enabled: boolean, ref: MutableRefObject<HTMLElement | null> | HTMLElement | null, cb: () => void): void; |
@@ -1,1 +0,1 @@ | ||
import{useEffect as o}from"react";import{disposables as u}from'../utils/disposables.js';import{useLatestValue as c}from'./use-latest-value.js';function m(n,l,s=!0){let i=c(t=>{let e=t.getBoundingClientRect();e.x===0&&e.y===0&&e.width===0&&e.height===0&&l()});o(()=>{if(!s)return;let t=n===null?null:n instanceof HTMLElement?n:n.current;if(!t)return;let e=u();if(typeof ResizeObserver!="undefined"){let r=new ResizeObserver(()=>i.current(t));r.observe(t),e.add(()=>r.disconnect())}if(typeof IntersectionObserver!="undefined"){let r=new IntersectionObserver(()=>i.current(t));r.observe(t),e.add(()=>r.disconnect())}return()=>e.dispose()},[n,i,s])}export{m as useOnDisappear}; | ||
import{useEffect as o}from"react";import{disposables as u}from'../utils/disposables.js';import{useLatestValue as c}from'./use-latest-value.js';function m(s,n,l){let i=c(t=>{let e=t.getBoundingClientRect();e.x===0&&e.y===0&&e.width===0&&e.height===0&&l()});o(()=>{if(!s)return;let t=n===null?null:n instanceof HTMLElement?n:n.current;if(!t)return;let e=u();if(typeof ResizeObserver!="undefined"){let r=new ResizeObserver(()=>i.current(t));r.observe(t),e.add(()=>r.disconnect())}if(typeof IntersectionObserver!="undefined"){let r=new IntersectionObserver(()=>i.current(t));r.observe(t),e.add(()=>r.disconnect())}return()=>e.dispose()},[n,i,s])}export{m as useOnDisappear}; |
@@ -5,3 +5,3 @@ import { type MutableRefObject } from 'react'; | ||
type ContainerInput = Container | ContainerCollection; | ||
export declare function useOutsideClick(containers: ContainerInput | (() => ContainerInput), cb: (event: MouseEvent | PointerEvent | FocusEvent | TouchEvent, target: HTMLElement) => void, enabled?: boolean): void; | ||
export declare function useOutsideClick(enabled: boolean, containers: ContainerInput | (() => ContainerInput), cb: (event: MouseEvent | PointerEvent | FocusEvent | TouchEvent, target: HTMLElement) => void): void; | ||
export {}; |
@@ -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(s,m,a=!0){let i=f(!1);d(()=>{requestAnimationFrame(()=>{i.current=a})},[a]);function c(e,r){if(!i.current||e.defaultPrevented)return;let t=r(e);if(t===null||!t.getRootNode().contains(t)||!t.isConnected)return;let E=function u(n){return typeof n=="function"?u(n()):Array.isArray(n)||n instanceof Set?n:[n]}(s);for(let u of E){if(u===null)continue;let n=u instanceof HTMLElement?u:u.current;if(n!=null&&n.contains(t)||e.composed&&e.composedPath().includes(n))return}return!C(t,p.Loose)&&t.tabIndex!==-1&&e.preventDefault(),m(e,t)}let o=f(null);l("pointerdown",e=>{var r,t;i.current&&(o.current=((t=(r=e.composedPath)==null?void 0:r.call(e))==null?void 0:t[0])||e.target)},!0),l("mousedown",e=>{var r,t;i.current&&(o.current=((t=(r=e.composedPath)==null?void 0:r.call(e))==null?void 0:t[0])||e.target)},!0),l("click",e=>{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 @@ | ||
export declare function useScrollLock(ownerDocument: Document | null, enabled: boolean, resolveAllowedContainers?: () => HTMLElement[]): void; | ||
export declare function useScrollLock(enabled: boolean, ownerDocument: Document | null, resolveAllowedContainers?: () => HTMLElement[]): void; |
@@ -1,1 +0,1 @@ | ||
import{useDocumentOverflowLockedEffect as l}from'./document-overflow/use-document-overflow.js';function u(e,n,c=()=>[document.body]){l(e,n,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; | ||
type TransitionData = { | ||
closed?: boolean; | ||
enter?: boolean; | ||
leave?: boolean; | ||
transition?: boolean; | ||
}; | ||
export declare function transitionDataAttributes(data: TransitionData): Record<string, string>; | ||
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]; | ||
export {}; |
@@ -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 y}from'./use-flags.js';import{useIsoMorphicEffect as C}from'./use-iso-morphic-effect.js';var D=(i=>(i[i.None=0]="None",i[i.Closed=1]="Closed",i[i.Enter=2]="Enter",i[i.Leave=4]="Leave",i))(D||{});function A(e){let a={};for(let t in e)e[t]===!0&&(a[`data-${t}`]="");return a}function V(e,a,t,r){let[i,u]=S(t),{hasFlag:d,addFlag:f,removeFlag:s}=y(e&&i?3:0),l=b(!1),n=b(!1),o=L();return C(function p(){var T;if(!e)return;t&&u(!0);let c=a.current;return c?((T=r==null?void 0:r.start)==null||T.call(r,t),M(c,{inFlight:l,prepare(){n.current?n.current=!1:n.current=l.current,l.current=!0,!n.current&&(t?(f(3),s(4)):(f(4),s(2)))},run(){n.current?t?(s(3),f(4)):(s(4),f(3)):t?s(1):f(1)},done(){var m;n.current&&typeof c.getAnimations=="function"&&c.getAnimations().length>0||(l.current=!1,s(7),t||u(!1),(m=r==null?void 0:r.end)==null||m.call(r,t))}})):t?(f(3),o.nextFrame(()=>p())):void 0},[e,t,a,o]),e?[i,{closed:d(1),enter:d(2),leave:d(4),transition:d(2)||d(4)}]:[t,{closed:void 0,enter:void 0,leave:void 0,transition:void 0}]}function M(e,{prepare:a,run:t,done:r,inFlight:i}){let u=E();return R(e,{prepare:a,inFlight:i}),u.nextFrame(()=>{u.add(F(e,r)),t()}),u.dispose}function F(e,a){let t=g(a),r=E();if(!e)return r.dispose;let{transitionDuration:i,transitionDelay:u}=getComputedStyle(e),[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=r.group(n=>{let o=n.setTimeout(()=>{t(),n.dispose()},s);n.addEventListener(e,"transitionrun",p=>{p.target===p.currentTarget&&(o(),n.addEventListener(e,"transitioncancel",c=>{c.target===c.currentTarget&&(t(),l())}))})});r.addEventListener(e,"transitionend",n=>{n.target===n.currentTarget&&(t(),r.dispose())})}else t();return r.dispose}function R(e,{inFlight:a,prepare:t}){if(a!=null&&a.current){t();return}let r=e.style.transition;e.style.transition="none",t(),e.offsetHeight,e.style.transition=r}export{A as transitionDataAttributes,V as useTransition}; |
type AcceptNode = (node: HTMLElement) => typeof NodeFilter.FILTER_ACCEPT | typeof NodeFilter.FILTER_SKIP | typeof NodeFilter.FILTER_REJECT; | ||
export declare function useTreeWalker({ container, accept, walk, enabled, }: { | ||
export declare function useTreeWalker(enabled: boolean, { container, accept, walk, }: { | ||
container: HTMLElement | null; | ||
accept: AcceptNode; | ||
walk(node: HTMLElement): void; | ||
enabled?: boolean; | ||
}): void; | ||
export {}; |
@@ -1,1 +0,1 @@ | ||
import{useEffect as m,useRef as E}from"react";import{getOwnerDocument as T}from'../utils/owner.js';import{useIsoMorphicEffect as N}from'./use-iso-morphic-effect.js';function F({container:e,accept:t,walk:r,enabled:c=!0}){let o=E(t),l=E(r);m(()=>{o.current=t,l.current=r},[t,r]),N(()=>{if(!e||!c)return;let n=T(e);if(!n)return;let f=o.current,p=l.current,d=Object.assign(i=>f(i),{acceptNode:f}),u=n.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,d,!1);for(;u.nextNode();)p(u.currentNode)},[e,c,o,l])}export{F as useTreeWalker}; | ||
import{useEffect as T,useRef as E}from"react";import{getOwnerDocument as d}from'../utils/owner.js';import{useIsoMorphicEffect as N}from'./use-iso-morphic-effect.js';function F(c,{container:e,accept:t,walk:r}){let o=E(t),l=E(r);T(()=>{o.current=t,l.current=r},[t,r]),N(()=>{if(!e||!c)return;let n=d(e);if(!n)return;let f=o.current,p=l.current,i=Object.assign(m=>f(m),{acceptNode:f}),u=n.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,i,!1);for(;u.nextNode();)p(u.currentNode)},[e,c,o,l])}export{F as useTreeWalker}; |
@@ -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.f0e3e5b", | ||
"version": "0.0.0-insiders.f144666", | ||
"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
905830
299
16244
Updated@floating-ui/react@^0.26.16
Updated@react-aria/focus@^3.17.1