@headlessui/react
Advanced tools
Comparing version 2.1.0 to 2.1.1
@@ -72,3 +72,3 @@ import React, { type ElementType, type Ref } from 'react'; | ||
open: boolean; | ||
option: unknown; | ||
option: any; | ||
}; | ||
@@ -75,0 +75,0 @@ type OptionsPropsWeControl = 'aria-labelledby' | 'aria-multiselectable' | 'role' | 'tabIndex'; |
@@ -1,1 +0,1 @@ | ||
"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}; | ||
"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 l=h(),{id:a=`headlessui-dialog-${l}`,open:i,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();i===void 0&&g!==null&&(i=(g&R.Open)===R.Open);let u=B(null),J=S(u,o),F=ge(u),T=i?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:a,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:l,...a}=e,i=U(),p=e.hasOwnProperty("open")||i!==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(!i&&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!==void 0||o)&&!a.static?n.createElement(ve,{show:l,transition:o,unmount:a.unmount},n.createElement(Y,{ref:t,...a})):n.createElement(Y,{ref:t,open:l,...a})}let ke="div";function Me(e,t){let o=h(),{id:l=`headlessui-dialog-panel-${o}`,transition:a=!1,...i}=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(a?j:H,null,v({ourProps:{ref:s,id:l,onClick:f},theirProps:i,slot:C,defaultTag:ke,name:"Dialog.Panel"}))}let we="div";function He(e,t){let{transition:o=!1,...l}=e,[{dialogState:a}]=x("Dialog.Backdrop"),i=y(()=>({open:a===0}),[a]);return n.createElement(o?j:H,null,v({ourProps:{ref:t,"aria-hidden":!0},theirProps:l,slot:i,defaultTag:we,name:"Dialog.Backdrop"}))}let Be="h2";function Ue(e,t){let o=h(),{id:l=`headlessui-dialog-title-${o}`,...a}=e,[{dialogState:i,setTitleId:p}]=x("Dialog.Title"),d=S(t);ie(()=>(p(l),()=>p(null)),[l,p]);let s=y(()=>({open:i===0}),[i]);return v({ourProps:{ref:d,id:l},theirProps:a,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}; |
@@ -1,1 +0,1 @@ | ||
"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}; | ||
"use client";import{useFocusRing as Ae}from"@react-aria/focus";import{useHover as Ee}from"@react-aria/interactions";import D,{Fragment as ce,createContext as ie,createRef as he,useCallback as fe,useContext as re,useEffect as De,useMemo as k,useReducer as _e,useRef as K}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 be}from'../../hooks/use-disposables.js';import{useElementSize as ke}from'../../hooks/use-element-size.js';import{useEvent as T}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 J,useOpenClosed as lt}from'../../internal/open-closed.js';import{isDisabledReactIssue7711 as at}from'../../utils/bugs.js';import{Focus as v,calculateActiveIndex as se}from'../../utils/calculate-active-index.js';import{disposables as st}from'../../utils/disposables.js';import{Focus as Te,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 V}from'../../utils/match.js';import{getOwnerDocument as bt}from'../../utils/owner.js';import{RenderFeatures as xe,forwardRefWithAs as z,mergeProps as me,render as W}from'../../utils/render.js';import{useDescribedBy as Tt}from'../description/description.js';import{Keys as R}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()),m=>m.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 m,O,i,p,s;if(e.dataRef.current.disabled||e.listboxState===1)return e;let o={...e,searchQuery:"",activationTrigger:(m=r.trigger)!=null?m:1,__demoMode:!1};if(r.focus===v.Nothing)return{...o,activeOptionIndex:null};if(r.focus===v.Specific)return{...o,activeOptionIndex:e.options.findIndex(t=>t.id===r.id)};if(r.focus===v.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(((O=u.current)==null?void 0:O.previousElementSibling)===c.current||((i=c.current)==null?void 0:i.previousElementSibling)===null)return{...o,activeOptionIndex:b}}}}else if(r.focus===v.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(((p=u.current)==null?void 0:p.nextElementSibling)===c.current||((s=c.current)==null?void 0:s.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(),O=(e.activeOptionIndex!==null?e.options.slice(e.activeOptionIndex+n).concat(e.options.slice(0,e.activeOptionIndex+n)):e.options).find(p=>{var s;return!p.dataRef.current.disabled&&((s=p.dataRef.current.textValue)==null?void 0:s.startsWith(a))}),i=O?e.options.indexOf(O):-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(m=>m.id===r.id);return a!==-1&&n.splice(a,1),n});return{...e,...o,activationTrigger:1}}},ue=ie(null);ue.displayName="ListboxActionsContext";function $(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,$),o}return r}let q=ie(null);q.displayName="ListboxDataContext";function Q(e){let r=re(q);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 V(r.type,Rt,e,r)}let At=ce;function Et(e,r){var de;let o=Je(),{value:n,defaultValue:a,form:m,name:O,onChange:i,by:p,invalid:s=!1,disabled:t=o||!1,horizontal:u=!1,multiple:b=!1,__demoMode:c=!1,...E}=e;const U=u?"horizontal":"vertical";let N=j(r),_=we(a),[y=b?[]:void 0,P]=Me(n,i,_),[h,g]=_e(Pt,{dataRef:he(),listboxState:c?0:1,options:[],searchQuery:"",activeOptionIndex:null,activationTrigger:1,optionsVisible:!1,__demoMode:c}),M=K({static:!1,hold:!1}),w=K(null),f=K(null),A=K(new Map),F=Ce(p),L=fe(x=>V(d.mode,{[1]:()=>y.some(S=>F(S,x)),[0]:()=>F(y,x)}),[y]),d=k(()=>({...h,value:y,disabled:t,invalid:s,mode:b?1:0,orientation:U,compare:F,isSelected:L,optionsPropsRef:M,buttonRef:w,optionsRef:f,listRef:A}),[y,t,s,b,h,A]);ae(()=>{h.dataRef.current=d},[d]);let Y=d.listboxState===0;Ve(Y,[d.buttonRef,d.optionsRef],(x,S)=>{var C;g({type:1}),dt(S,pt.Loose)||(x.preventDefault(),(C=d.buttonRef.current)==null||C.focus())});let X=k(()=>({open:d.listboxState===0,disabled:t,invalid:s,value:y}),[d,t,y,s]),Z=T(x=>{let S=d.options.find(C=>C.id===x);S&&B(S.dataRef.current.value)}),ee=T(()=>{if(d.activeOptionIndex!==null){let{dataRef:x,id:S}=d.options[d.activeOptionIndex];B(x.current.value),g({type:2,focus:v.Specific,id:S})}}),te=T(()=>g({type:0})),oe=T(()=>g({type:1})),H=be(),l=T((x,S,C)=>{H.dispose(),H.microTask(()=>x===v.Specific?g({type:2,focus:v.Specific,id:S,trigger:C}):g({type:2,focus:x,trigger:C}))}),I=T((x,S)=>(g({type:5,id:x,dataRef:S}),()=>g({type:6,id:x}))),B=T(x=>V(d.mode,{[0](){return P==null?void 0:P(x)},[1](){let S=d.value.slice(),C=S.findIndex(Pe=>F(Pe,x));return C===-1?S.push(x):S.splice(C,1),P==null?void 0:P(S)}})),ne=T(x=>g({type:3,value:x})),ye=T(()=>g({type:4})),ve=k(()=>({onChange:B,registerOption:I,goToOption:l,closeListbox:oe,openListbox:te,selectActiveOption:ee,selectOption:Z,search:ne,clearSearch:ye}),[]),[ge,Le]=Ot({inherit:!0}),Se={ref:N},Re=fe(()=>{if(_!==void 0)return P==null?void 0:P(_)},[P,_]);return D.createElement(Le,{value:ge,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:ve},D.createElement(q.Provider,{value:d},D.createElement(rt,{value:V(d.listboxState,{[0]:J.Open,[1]:J.Closed})},O!=null&&y!=null&&D.createElement(ot,{disabled:t,data:{[O]:y},form:m,onReset:Re}),W({ourProps:Se,theirProps:E,slot:X,defaultTag:At,name:"Listbox"}))))))}let ht="button";function Dt(e,r){var F;let o=Q("Listbox.Button"),n=$("Listbox.Button"),a=le(),m=it(),{id:O=m||`headlessui-listbox-button-${a}`,disabled:i=o.disabled||!1,autoFocus:p=!1,...s}=e,t=j(o.buttonRef,r,Ze()),u=et(),b=T(L=>{switch(L.key){case R.Enter:ft(L.currentTarget);break;case R.Space:case R.ArrowDown:L.preventDefault(),G(()=>n.openListbox()),o.value||n.goToOption(v.First);break;case R.ArrowUp:L.preventDefault(),G(()=>n.openListbox()),o.value||n.goToOption(v.Last);break}}),c=T(L=>{switch(L.key){case R.Space:L.preventDefault();break}}),E=T(L=>{var d;if(at(L.currentTarget))return L.preventDefault();o.listboxState===0?(G(()=>n.closeListbox()),(d=o.buttonRef.current)==null||d.focus({preventScroll:!0})):(L.preventDefault(),n.openListbox())}),U=T(L=>L.preventDefault()),N=mt([O]),_=Tt(),{isFocusVisible:y,focusProps:P}=Ae({autoFocus:p}),{isHovered:h,hoverProps:g}=Ee({isDisabled:i}),{pressed:M,pressProps:w}=Ie({disabled:i}),f=k(()=>({open:o.listboxState===0,active:M||o.listboxState===0,disabled:i,invalid:o.invalid,value:o.value,hover:h,focus:y,autofocus:p}),[o.listboxState,o.value,i,h,y,M,o.invalid,p]),A=me(u(),{ref:t,id:O,type:Ke(e,o.buttonRef),"aria-haspopup":"listbox","aria-controls":(F=o.optionsRef.current)==null?void 0:F.id,"aria-expanded":o.listboxState===0,"aria-labelledby":N,"aria-describedby":_,disabled:i||void 0,autoFocus:p,onKeyDown:b,onKeyUp:c,onKeyPress:U,onClick:E},P,g,w);return W({ourProps:A,theirProps:s,slot:f,defaultTag:ht,name:"Listbox.Button"})}let Oe=ie(!1),_t="div",It=xe.RenderStrategy|xe.Static;function Ct(e,r){var H;let o=le(),{id:n=`headlessui-listbox-options-${o}`,anchor:a,portal:m=!1,modal:O=!0,transition:i=!1,...p}=e,s=tt(a);s&&(m=!0);let t=Q("Listbox.Options"),u=$("Listbox.Options"),b=He(t.optionsRef),c=lt(),[E,U]=Xe(i,t.optionsRef,c!==null?(c&J.Open)===J.Open:t.listboxState===0);Ge(E,t.buttonRef,u.closeListbox);let N=t.__demoMode?!1:O&&t.listboxState===0;je(N,b);let _=t.__demoMode?!1:O&&t.listboxState===0;Ue(_,{allowed:T(()=>[t.buttonRef.current,t.optionsRef.current])});let y=t.listboxState!==0,h=Be(y,t.buttonRef)?!1:E,g=E&&t.listboxState===1,M=nt(g,t.value),w=T(l=>t.compare(M,l)),f=k(()=>{var I;if(s==null||!((I=s==null?void 0:s.to)!=null&&I.includes("selection")))return null;let l=t.options.findIndex(B=>w(B.dataRef.current.value));return l===-1&&(l=0),l},[s,t.options]),A=(()=>{if(f===null)return{...s,inner:void 0};let l=Array.from(t.listRef.current.values());return{...s,inner:{listRef:{current:l},index:f}}})(),[F,L]=qe(A),d=Ye(),Y=j(t.optionsRef,r,s?F:null),X=be();De(()=>{var I;let l=t.optionsRef.current;l&&t.listboxState===0&&l!==((I=bt(l))==null?void 0:I.activeElement)&&(l==null||l.focus({preventScroll:!0}))},[t.listboxState,t.optionsRef,t.optionsRef.current]);let Z=T(l=>{var I,B;switch(X.dispose(),l.key){case R.Space:if(t.searchQuery!=="")return l.preventDefault(),l.stopPropagation(),u.search(l.key);case R.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()),(I=t.buttonRef.current)==null||I.focus({preventScroll:!0}));break;case V(t.orientation,{vertical:R.ArrowDown,horizontal:R.ArrowRight}):return l.preventDefault(),l.stopPropagation(),u.goToOption(v.Next);case V(t.orientation,{vertical:R.ArrowUp,horizontal:R.ArrowLeft}):return l.preventDefault(),l.stopPropagation(),u.goToOption(v.Previous);case R.Home:case R.PageUp:return l.preventDefault(),l.stopPropagation(),u.goToOption(v.First);case R.End:case R.PageDown:return l.preventDefault(),l.stopPropagation(),u.goToOption(v.Last);case R.Escape:l.preventDefault(),l.stopPropagation(),G(()=>u.closeListbox()),(B=t.buttonRef.current)==null||B.focus({preventScroll:!0});return;case R.Tab:l.preventDefault(),l.stopPropagation(),G(()=>u.closeListbox()),ut(t.buttonRef.current,l.shiftKey?Te.Previous:Te.Next);break;default:l.key.length===1&&(u.search(l.key),X.setTimeout(()=>u.clearSearch(),350));break}}),ee=Fe(()=>{var l;return(l=t.buttonRef.current)==null?void 0:l.id},[t.buttonRef.current]),te=k(()=>({open:t.listboxState===0}),[t.listboxState]),oe=me(s?d():{},{id:n,ref:Y,"aria-activedescendant":t.activeOptionIndex===null||(H=t.options[t.activeOptionIndex])==null?void 0:H.id,"aria-multiselectable":t.mode===1?!0:void 0,"aria-labelledby":ee,"aria-orientation":t.orientation,onKeyDown:Z,role:"listbox",tabIndex:t.listboxState===0?0:void 0,style:{...p.style,...L,"--button-width":ke(t.buttonRef,!0).width},...Qe(U)});return D.createElement(yt,{enabled:m?e.static||E:!1},D.createElement(q.Provider,{value:t.mode===1?t:{...t,isSelected:w}},W({ourProps:oe,theirProps:p,slot:te,defaultTag:_t,features:It,visible:h,name:"Listbox.Options"})))}let Ft="div";function Mt(e,r){let o=le(),{id:n=`headlessui-listbox-option-${o}`,disabled:a=!1,value:m,...O}=e,i=re(Oe)===!0,p=Q("Listbox.Option"),s=$("Listbox.Option"),t=p.activeOptionIndex!==null?p.options[p.activeOptionIndex].id===n:!1,u=p.isSelected(m),b=K(null),c=ze(b),E=Ne({disabled:a,value:m,domRef:b,get textValue(){return c()}}),U=j(r,b,f=>{f?p.listRef.current.set(n,f):p.listRef.current.delete(n)});ae(()=>{if(!p.__demoMode&&p.listboxState===0&&t&&p.activationTrigger!==0)return st().requestAnimationFrame(()=>{var f,A;(A=(f=b.current)==null?void 0:f.scrollIntoView)==null||A.call(f,{block:"nearest"})})},[b,t,p.__demoMode,p.listboxState,p.activationTrigger,p.activeOptionIndex]),ae(()=>{if(!i)return s.registerOption(n,E)},[E,n,i]);let N=T(f=>{var A;if(a)return f.preventDefault();s.onChange(m),p.mode===0&&(G(()=>s.closeListbox()),(A=p.buttonRef.current)==null||A.focus({preventScroll:!0}))}),_=T(()=>{if(a)return s.goToOption(v.Nothing);s.goToOption(v.Specific,n)}),y=We(),P=T(f=>{y.update(f),!a&&(t||s.goToOption(v.Specific,n,0))}),h=T(f=>{y.wasMoved(f)&&(a||t||s.goToOption(v.Specific,n,0))}),g=T(f=>{y.wasMoved(f)&&(a||t&&s.goToOption(v.Nothing))}),M=k(()=>({active:t,focus:t,selected:u,disabled:a,selectedOption:u&&i}),[t,u,a,i]),w=i?{}:{id:n,ref:U,role:"option",tabIndex:a===!0?void 0:-1,"aria-disabled":a===!0?!0:void 0,"aria-selected":u,disabled:void 0,onClick:N,onFocus:_,onPointerEnter:P,onMouseEnter:P,onPointerMove:h,onMouseMove:h,onPointerLeave:g,onMouseLeave:g};return!u&&i?null:W({ourProps:w,theirProps:O,slot:M,defaultTag:Ft,name:"Listbox.Option"})}let wt=ce;function Bt(e,r){let{options:o,placeholder:n,...a}=e,O={ref:j(r)},i=Q("ListboxSelectedOption"),p=k(()=>({}),[]),s=i.value===void 0||i.value===null||i.mode===1&&Array.isArray(i.value)&&i.value.length===0;return D.createElement(Oe.Provider,{value:!0},W({ourProps:O,theirProps:{...a,children:D.createElement(D.Fragment,null,n&&s?n:o)},slot:p,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}; |
import type { JSXElementConstructor, ReactElement, ReactNode } from 'react'; | ||
export type ReactTag = keyof JSX.IntrinsicElements | JSXElementConstructor<any>; | ||
declare let __: "1D45E01E-AF44-47C4-988A-19A94EBAF55C"; | ||
export type __ = typeof __; | ||
export type Expand<T> = T extends infer O ? { | ||
@@ -21,7 +19,3 @@ [K in keyof O]: O[K]; | ||
export type Props<TTag extends ReactTag, TSlot = {}, TOmittableProps extends PropertyKey = never, Overrides = {}> = CleanProps<TTag, TOmittableProps | keyof Overrides> & OurProps<TTag, TSlot> & ClassNameOverride<TTag, TSlot> & Overrides; | ||
type Without<T, U> = { | ||
[P in Exclude<keyof T, keyof U>]?: never; | ||
}; | ||
export type XOR<T, U> = T | U extends __ ? never : T extends __ ? U : U extends __ ? T : T | U extends object ? (Without<T, U> & U) | (Without<U, T> & T) : T | U; | ||
export type EnsureArray<T> = T extends any[] ? T : Expand<T>[]; | ||
export {}; |
import { type ElementType, type ReactElement, type Ref } from 'react'; | ||
import type { Expand, Props, XOR, __ } from '../types.js'; | ||
import type { Expand, Props } from '../types.js'; | ||
export declare enum RenderFeatures { | ||
@@ -24,10 +24,9 @@ /** No features at all */ | ||
} | ||
type PropsForFeature<TPassedInFeatures extends RenderFeatures, TForFeature extends RenderFeatures, TProps> = { | ||
[P in TPassedInFeatures]: P extends TForFeature ? TProps : __; | ||
}[TPassedInFeatures]; | ||
export type PropsForFeatures<T extends RenderFeatures> = XOR<PropsForFeature<T, RenderFeatures.Static, { | ||
type UnionToIntersection<T> = (T extends any ? (x: T) => any : never) extends (x: infer R) => any ? R : never; | ||
type PropsForFeature<TPassedInFeatures extends RenderFeatures, TForFeature extends RenderFeatures, TProps> = TPassedInFeatures extends TForFeature ? TProps : {}; | ||
export type PropsForFeatures<T extends RenderFeatures> = Expand<UnionToIntersection<PropsForFeature<T, RenderFeatures.Static, { | ||
static?: boolean; | ||
}>, PropsForFeature<T, RenderFeatures.RenderStrategy, { | ||
}> | PropsForFeature<T, RenderFeatures.RenderStrategy, { | ||
unmount?: boolean; | ||
}>>; | ||
}>>>; | ||
export declare function render<TFeature extends RenderFeatures, TTag extends ElementType, TSlot>({ ourProps, theirProps, slot, defaultTag, features, visible, name, mergeRefs, }: { | ||
@@ -34,0 +33,0 @@ ourProps: Expand<Props<TTag, TSlot, any> & PropsForFeatures<TFeature>> & { |
@@ -1,4 +0,4 @@ | ||
import{Fragment as R,cloneElement as x,createElement as E,forwardRef as j,isValidElement as S,useCallback as v,useRef as w}from"react";import{classNames as P}from'./class-names.js';import{match as k}from'./match.js';var O=(a=>(a[a.None=0]="None",a[a.RenderStrategy=1]="RenderStrategy",a[a.Static=2]="Static",a))(O||{}),M=(e=>(e[e.Unmount=0]="Unmount",e[e.Hidden=1]="Hidden",e))(M||{});function H({ourProps:r,theirProps:n,slot:e,defaultTag:a,features:s,visible:t=!0,name:l,mergeRefs:i}){i=i!=null?i:A;let o=N(n,r);if(t)return b(o,e,a,l,i);let y=s!=null?s:0;if(y&2){let{static:f=!1,...u}=o;if(f)return b(u,e,a,l,i)}if(y&1){let{unmount:f=!0,...u}=o;return k(f?0:1,{[0](){return null},[1](){return b({...u,hidden:!0,style:{display:"none"}},e,a,l,i)}})}return b(o,e,a,l,i)}function b(r,n={},e,a,s){let{as:t=e,children:l,refName:i="ref",...o}=h(r,["unmount","static"]),y=r.ref!==void 0?{[i]:r.ref}:{},f=typeof l=="function"?l(n):l;"className"in o&&o.className&&typeof o.className=="function"&&(o.className=o.className(n)),o["aria-labelledby"]&&o["aria-labelledby"]===o.id&&(o["aria-labelledby"]=void 0);let u={};if(n){let d=!1,p=[];for(let[c,T]of Object.entries(n))typeof T=="boolean"&&(d=!0),T===!0&&p.push(c.replace(/([A-Z])/g,g=>`-${g.toLowerCase()}`));if(d){u["data-headlessui-state"]=p.join(" ");for(let c of p)u[`data-${c}`]=""}}if(t===R&&(Object.keys(m(o)).length>0||Object.keys(m(u)).length>0))if(!S(f)||Array.isArray(f)&&f.length>1){if(Object.keys(m(o)).length>0)throw new Error(['Passing props on "Fragment"!',"",`The current component <${a} /> is rendering a "Fragment".`,"However we need to passthrough the following props:",Object.keys(m(o)).concat(Object.keys(m(u))).map(d=>` - ${d}`).join(` | ||
import{Fragment as R,cloneElement as P,createElement as E,forwardRef as j,isValidElement as v,useCallback as S,useRef as w}from"react";import{classNames as x}from'./class-names.js';import{match as k}from'./match.js';var M=(a=>(a[a.None=0]="None",a[a.RenderStrategy=1]="RenderStrategy",a[a.Static=2]="Static",a))(M||{}),O=(e=>(e[e.Unmount=0]="Unmount",e[e.Hidden=1]="Hidden",e))(O||{});function H({ourProps:r,theirProps:n,slot:e,defaultTag:a,features:s,visible:t=!0,name:l,mergeRefs:i}){i=i!=null?i:A;let o=N(n,r);if(t)return b(o,e,a,l,i);let y=s!=null?s:0;if(y&2){let{static:f=!1,...u}=o;if(f)return b(u,e,a,l,i)}if(y&1){let{unmount:f=!0,...u}=o;return k(f?0:1,{[0](){return null},[1](){return b({...u,hidden:!0,style:{display:"none"}},e,a,l,i)}})}return b(o,e,a,l,i)}function b(r,n={},e,a,s){let{as:t=e,children:l,refName:i="ref",...o}=h(r,["unmount","static"]),y=r.ref!==void 0?{[i]:r.ref}:{},f=typeof l=="function"?l(n):l;"className"in o&&o.className&&typeof o.className=="function"&&(o.className=o.className(n)),o["aria-labelledby"]&&o["aria-labelledby"]===o.id&&(o["aria-labelledby"]=void 0);let u={};if(n){let d=!1,p=[];for(let[c,T]of Object.entries(n))typeof T=="boolean"&&(d=!0),T===!0&&p.push(c.replace(/([A-Z])/g,g=>`-${g.toLowerCase()}`));if(d){u["data-headlessui-state"]=p.join(" ");for(let c of p)u[`data-${c}`]=""}}if(t===R&&(Object.keys(m(o)).length>0||Object.keys(m(u)).length>0))if(!v(f)||Array.isArray(f)&&f.length>1){if(Object.keys(m(o)).length>0)throw new Error(['Passing props on "Fragment"!',"",`The current component <${a} /> is rendering a "Fragment".`,"However we need to passthrough the following props:",Object.keys(m(o)).concat(Object.keys(m(u))).map(d=>` - ${d}`).join(` | ||
`),"","You can apply a few solutions:",['Add an `as="..."` prop, to ensure that we render an actual element instead of a "Fragment".',"Render a single element as the child so that we can forward the props onto that element."].map(d=>` - ${d}`).join(` | ||
`)].join(` | ||
`))}else{let d=f.props,p=d==null?void 0:d.className,c=typeof p=="function"?(...F)=>P(p(...F),o.className):P(p,o.className),T=c?{className:c}:{},g=N(f.props,m(h(o,["ref"])));for(let F in u)F in g&&delete u[F];return x(f,Object.assign({},g,u,y,{ref:s(f.ref,y.ref)},T))}return E(t,Object.assign({},h(o,["ref"]),t!==R&&y,t!==R&&u),f)}function U(){let r=w([]),n=v(e=>{for(let a of r.current)a!=null&&(typeof a=="function"?a(e):a.current=e)},[]);return(...e)=>{if(!e.every(a=>a==null))return r.current=e,n}}function A(...r){return r.every(n=>n==null)?void 0:n=>{for(let e of r)e!=null&&(typeof e=="function"?e(n):e.current=n)}}function N(...r){var a;if(r.length===0)return{};if(r.length===1)return r[0];let n={},e={};for(let s of r)for(let t in s)t.startsWith("on")&&typeof s[t]=="function"?((a=e[t])!=null||(e[t]=[]),e[t].push(s[t])):n[t]=s[t];if(n.disabled||n["aria-disabled"])for(let s in e)/^(on(?:Click|Pointer|Mouse|Key)(?:Down|Up|Press)?)$/.test(s)&&(e[s]=[t=>{var l;return(l=t==null?void 0:t.preventDefault)==null?void 0:l.call(t)}]);for(let s in e)Object.assign(n,{[s](t,...l){let i=e[s];for(let o of i){if((t instanceof Event||(t==null?void 0:t.nativeEvent)instanceof Event)&&t.defaultPrevented)return;o(t,...l)}}});return n}function D(...r){var a;if(r.length===0)return{};if(r.length===1)return r[0];let n={},e={};for(let s of r)for(let t in s)t.startsWith("on")&&typeof s[t]=="function"?((a=e[t])!=null||(e[t]=[]),e[t].push(s[t])):n[t]=s[t];for(let s in e)Object.assign(n,{[s](...t){let l=e[s];for(let i of l)i==null||i(...t)}});return n}function I(r){var n;return Object.assign(j(r),{displayName:(n=r.displayName)!=null?n:r.name})}function m(r){let n=Object.assign({},r);for(let e in n)n[e]===void 0&&delete n[e];return n}function h(r,n=[]){let e=Object.assign({},r);for(let a of n)a in e&&delete e[a];return e}export{O as RenderFeatures,M as RenderStrategy,m as compact,I as forwardRefWithAs,D as mergeProps,H as render,U as useMergeRefsFn}; | ||
`))}else{let d=f.props,p=d==null?void 0:d.className,c=typeof p=="function"?(...F)=>x(p(...F),o.className):x(p,o.className),T=c?{className:c}:{},g=N(f.props,m(h(o,["ref"])));for(let F in u)F in g&&delete u[F];return P(f,Object.assign({},g,u,y,{ref:s(f.ref,y.ref)},T))}return E(t,Object.assign({},h(o,["ref"]),t!==R&&y,t!==R&&u),f)}function I(){let r=w([]),n=S(e=>{for(let a of r.current)a!=null&&(typeof a=="function"?a(e):a.current=e)},[]);return(...e)=>{if(!e.every(a=>a==null))return r.current=e,n}}function A(...r){return r.every(n=>n==null)?void 0:n=>{for(let e of r)e!=null&&(typeof e=="function"?e(n):e.current=n)}}function N(...r){var a;if(r.length===0)return{};if(r.length===1)return r[0];let n={},e={};for(let s of r)for(let t in s)t.startsWith("on")&&typeof s[t]=="function"?((a=e[t])!=null||(e[t]=[]),e[t].push(s[t])):n[t]=s[t];if(n.disabled||n["aria-disabled"])for(let s in e)/^(on(?:Click|Pointer|Mouse|Key)(?:Down|Up|Press)?)$/.test(s)&&(e[s]=[t=>{var l;return(l=t==null?void 0:t.preventDefault)==null?void 0:l.call(t)}]);for(let s in e)Object.assign(n,{[s](t,...l){let i=e[s];for(let o of i){if((t instanceof Event||(t==null?void 0:t.nativeEvent)instanceof Event)&&t.defaultPrevented)return;o(t,...l)}}});return n}function D(...r){var a;if(r.length===0)return{};if(r.length===1)return r[0];let n={},e={};for(let s of r)for(let t in s)t.startsWith("on")&&typeof s[t]=="function"?((a=e[t])!=null||(e[t]=[]),e[t].push(s[t])):n[t]=s[t];for(let s in e)Object.assign(n,{[s](...t){let l=e[s];for(let i of l)i==null||i(...t)}});return n}function W(r){var n;return Object.assign(j(r),{displayName:(n=r.displayName)!=null?n:r.name})}function m(r){let n=Object.assign({},r);for(let e in n)n[e]===void 0&&delete n[e];return n}function h(r,n=[]){let e=Object.assign({},r);for(let a of n)a in e&&delete e[a];return e}export{M as RenderFeatures,O as RenderStrategy,m as compact,W as forwardRefWithAs,D as mergeProps,H as render,I as useMergeRefsFn}; |
{ | ||
"name": "@headlessui/react", | ||
"version": "2.1.0", | ||
"version": "2.1.1", | ||
"description": "A set of completely unstyled, fully accessible UI components for React, designed to integrate beautifully with Tailwind CSS.", | ||
@@ -5,0 +5,0 @@ "main": "dist/index.cjs", |
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
904580
16220