@radix-ui/react-select 0.1.2-rc.3 → 0.1.2-rc.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,1102 @@
1
- import{RemoveScroll as e}from"react-remove-scroll";import{hideOthers as t}from"aria-hidden";import{VisuallyHidden as o}from"@radix-ui/react-visually-hidden";import{usePrevious as n}from"@radix-ui/react-use-previous";import{useLayoutEffect as r}from"@radix-ui/react-use-layout-effect";import{useControllableState as l}from"@radix-ui/react-use-controllable-state";import{useCallbackRef as c}from"@radix-ui/react-use-callback-ref";import{Primitive as a}from"@radix-ui/react-primitive";import{Portal as i}from"@radix-ui/react-portal";import{useLabelContext as s}from"@radix-ui/react-label";import{useId as u}from"@radix-ui/react-id";import{FocusScope as d}from"@radix-ui/react-focus-scope";import{DismissableLayer as p}from"@radix-ui/react-dismissable-layer";import{createContextScope as f}from"@radix-ui/react-context";import{useComposedRefs as m}from"@radix-ui/react-compose-refs";import{createCollection as v}from"@radix-ui/react-collection";import{composeEventHandlers as S}from"@radix-ui/primitive";import{clamp as g}from"@radix-ui/number";import*as h from"react-dom";import*as x from"react";import w from"@babel/runtime/helpers/esm/extends";const b=[" ","Enter","ArrowUp","ArrowDown"],y=[" ","Enter"],[E,C,I]=v("Select"),[T,_]=f("Select",[I]);export{_ as createSelectScope};const[R,D]=T("Select");export const Select=e=>{const{__scopeSelect:t,children:o,open:n,defaultOpen:r,onOpenChange:c,value:a,defaultValue:i,onValueChange:s,dir:d,name:p,autoComplete:f}=e,[m,v]=x.useState(null),[S,g]=x.useState(null),[h,w]=x.useState(!1),[b=!1,y]=l({prop:n,defaultProp:r,onChange:c}),[C="",I]=l({prop:a,defaultProp:i,onChange:s}),T=!m||Boolean(m.closest("form")),[_,D]=x.useState(null),P=x.useRef(null);/*#__PURE__*/return x.createElement(R,{scope:t,trigger:m,onTriggerChange:v,valueNode:S,onValueNodeChange:g,valueNodeHasChildren:h,onValueNodeHasChildrenChange:w,contentId:u(),value:C,onValueChange:I,open:b,onOpenChange:y,dir:d,bubbleSelect:_,triggerPointerDownPosRef:P},/*#__PURE__*/x.createElement(E.Provider,{scope:t},o),T?/*#__PURE__*/x.createElement(O,{ref:D,"aria-hidden":!0,tabIndex:-1,name:p,autoComplete:f,value:C,onChange:e=>I(e.target.value)}):null)};/*#__PURE__*/export const SelectTrigger=/*#__PURE__*/x.forwardRef(((e,t)=>{const{__scopeSelect:o,disabled:n=!1,"aria-labelledby":r,...l}=e,c=D("SelectTrigger",o),i=m(t,c.onTriggerChange),u=C(o),d=s(c.trigger),p=r||d,[f,v,g]=N((e=>{const t=u().filter((e=>!e.disabled)),o=t.find((e=>e.value===c.value)),n=K(t,e,o);void 0!==n&&c.onValueChange(n.value)})),h=()=>{n||(c.onOpenChange(!0),g())};/*#__PURE__*/return x.createElement(a.button,w({type:"button",role:"combobox","aria-controls":c.contentId,"aria-expanded":c.open,"aria-autocomplete":"none","aria-labelledby":p,dir:c.dir,disabled:n,"data-disabled":n?"":void 0},l,{ref:i,onPointerDown:S(l.onPointerDown,(e=>{e.target.releasePointerCapture(e.pointerId),0===e.button&&!1===e.ctrlKey&&(h(),c.triggerPointerDownPosRef.current={x:Math.round(e.pageX),y:Math.round(e.pageY)},e.preventDefault())})),onKeyDown:S(l.onKeyDown,(e=>{const t=""!==f.current;e.ctrlKey||e.altKey||e.metaKey||1!==e.key.length||v(e.key),t&&" "===e.key||b.includes(e.key)&&(h(),e.preventDefault())}))}))}));/*#__PURE__*/export const SelectValue=/*#__PURE__*/x.forwardRef(((e,t)=>{const{__scopeSelect:o,className:n,style:r,...l}=e,c=D("SelectValue",o),{onValueNodeHasChildrenChange:i}=c,s=void 0!==e.children,u=m(t,c.onValueNodeChange);return x.useEffect((()=>{i(s)}),[i,s]),/*#__PURE__*/x.createElement(a.span,w({},l,{ref:u,style:{pointerEvents:"none"}}))}));/*#__PURE__*/export const SelectIcon=/*#__PURE__*/x.forwardRef(((e,t)=>{const{__scopeSelect:o,children:n,...r}=e;/*#__PURE__*/return x.createElement(a.span,w({"aria-hidden":!0},r,{ref:t}),n||"▼")}));/*#__PURE__*/export const SelectContent=/*#__PURE__*/x.forwardRef(((e,t)=>{const o=D("SelectContent",e.__scopeSelect),[n,l]=x.useState();return r((()=>{l(new DocumentFragment)}),[]),o.open?/*#__PURE__*/x.createElement(k,w({},e,{ref:t})):n?/*#__PURE__*/h.createPortal(/*#__PURE__*/
2
- x.createElement(P,{scope:e.__scopeSelect},/*#__PURE__*/x.createElement(E.Slot,{scope:e.__scopeSelect},/*#__PURE__*/x.createElement("div",null,e.children))),n):null}));const[P,L]=T("SelectContent"),k=/*#__PURE__*/x.forwardRef(((o,n)=>{const{__scopeSelect:l,onCloseAutoFocus:c,...a}=o,s=D("SelectContent",l),[u,f]=x.useState(null),[v,h]=x.useState(null),[b,y]=x.useState(null),E=m(n,(e=>h(e))),[I,T]=x.useState(null),[_,R]=x.useState(null),L=C(l),[k,V]=x.useState(!1),H=x.useRef(!0),M=x.useRef(!1);x.useEffect((()=>{if(v)return t(v)}),[v]);const B=x.useCallback((e=>{const[t,...o]=L().map((e=>e.ref.current)),[n]=o.slice(-1),r=document.activeElement;for(const o of e){if(o===r)return;if(null==o||o.scrollIntoView({block:"nearest"}),o===t&&b&&(b.scrollTop=0),o===n&&b&&(b.scrollTop=b.scrollHeight),null==o||o.focus(),document.activeElement!==r)return}}),[L,b]),A=x.useCallback((()=>{if(s.trigger&&s.valueNode&&u&&v&&b&&I&&_){const e=s.trigger.getBoundingClientRect(),t=v.getBoundingClientRect(),o=s.valueNode.getBoundingClientRect(),n=_.getBoundingClientRect();if("rtl"!==s.dir){const r=n.left-t.left,l=o.left-r,c=e.left-l,a=e.width+c,i=Math.max(a,t.width),s=window.innerWidth-10,d=g(l,[10,s-i]);u.style.minWidth=a+"px",u.style.left=d+"px"}else{const r=t.right-n.right,l=window.innerWidth-o.right-r,c=window.innerWidth-e.right-l,a=e.width+c,i=Math.max(a,t.width),s=window.innerWidth-10,d=g(l,[10,s-i]);u.style.minWidth=a+"px",u.style.right=d+"px"}const r=window.innerHeight-20,l=5*I.offsetHeight,c=b.scrollHeight,a=window.getComputedStyle(v),i=parseInt(a.borderTopWidth,10),d=parseInt(a.paddingTop,10),p=parseInt(a.borderBottomWidth,10),f=i+d+c+parseInt(a.paddingBottom,10)+p,m=e.top+e.height/2-10,S=r-m,h=I.offsetHeight/2,x=i+d+(I.offsetTop+h),w=f-x;if(x<=m){u.style.bottom="0px";const e=v.clientHeight-b.offsetTop-b.offsetHeight,t=x+Math.max(S,h+e+p);u.style.height=t+"px"}else{u.style.top="0px";const e=Math.max(m,i+b.offsetTop+h)+w;u.style.height=e+"px",b.scrollTop=x-m+b.offsetTop}u.style.margin="10px 0",u.style.minHeight=l+"px",u.style.maxHeight=r+"px",V(!0),requestAnimationFrame((()=>M.current=!0))}}),[s.trigger,s.valueNode,u,v,b,I,_,s.dir]);r((()=>A()),[A]);const O=x.useCallback((()=>B([I,v])),[B,I,v]);x.useEffect((()=>{k&&O()}),[k,O]);const F=x.useCallback((e=>{e&&!0===H.current&&(A(),O(),H.current=!1)}),[A,O]),{onOpenChange:U,triggerPointerDownPosRef:W}=s;x.useEffect((()=>{if(v){let e={x:0,y:0};const t=t=>{var o,n,r,l;e={x:Math.abs(Math.round(t.pageX)-(null!==(o=null===(n=W.current)||void 0===n?void 0:n.x)&&void 0!==o?o:0)),y:Math.abs(Math.round(t.pageY)-(null!==(r=null===(l=W.current)||void 0===l?void 0:l.y)&&void 0!==r?r:0))}},o=o=>{e.x<=10&&e.y<=10?o.preventDefault():v.contains(o.target)||U(!1),document.removeEventListener("pointermove",t),W.current=null};return null!==W.current&&(document.addEventListener("pointermove",t),document.addEventListener("pointerup",o,{capture:!0,once:!0})),()=>{document.removeEventListener("pointermove",t),document.removeEventListener("pointerup",o,{capture:!0})}}}),[v,U,W]),x.useEffect((()=>{const e=()=>U(!1);return window.addEventListener("blur",e),window.addEventListener("resize",e),()=>{window.removeEventListener("blur",e),window.removeEventListener("resize",e)}}),[U]);const[z,G]=N((e=>{const t=L().filter((e=>!e.disabled)),o=t.find((e=>e.ref.current===document.activeElement)),n=K(t,e,o);n&&setTimeout((()=>n.ref.current.focus()))})),j=x.useCallback((()=>null==v?void 0:v.focus()),[v]);/*#__PURE__*/return x.createElement(P,{scope:l,contentWrapper:u,content:v,viewport:b,onViewportChange:y,selectedItem:I,onSelectedItemChange:T,selectedItemText:_,onSelectedItemTextChange:R,onScrollButtonChange:F,onItemLeave:j,isPositioned:k,shouldExpandOnScrollRef:M,searchRef:z},/*#__PURE__*/x.createElement(i,null,/*#__PURE__*/x.createElement(e,null,/*#__PURE__*/x.createElement("div",{ref:f,style:{display:"flex",flexDirection:"column",position:"fixed",zIndex:0}},/*#__PURE__*/x.createElement(d,{asChild:!0,trapped:s.open,onMountAutoFocus:e=>{e.preventDefault()},onUnmountAutoFocus:S(c,(e=>{var t;null===(t=s.trigger)||void 0===t||t.focus({preventScroll:!0}),e.preventDefault()}))},/*#__PURE__*/x.createElement(p,w({role:"listbox",id:s.contentId,"data-state":s.open?"open":"closed",dir:s.dir,onContextMenu:e=>e.preventDefault()},a,{ref:E,style:{display:"flex",flexDirection:"column",boxSizing:"border-box",maxHeight:"100%",outline:"none",...a.style},disableOutsidePointerEvents:!0,onFocusOutside:e=>e.preventDefault(),onDismiss:()=>s.onOpenChange(!1),onKeyDown:S(a.onKeyDown,(e=>{const t=e.ctrlKey||e.altKey||e.metaKey;if("Tab"===e.key&&e.preventDefault(),t||1!==e.key.length||G(e.key),["ArrowUp","ArrowDown","Home","End"].includes(e.key)){let t=L().filter((e=>!e.disabled)).map((e=>e.ref.current));if(["ArrowUp","End"].includes(e.key)&&(t=t.slice().reverse()),["ArrowUp","ArrowDown"].includes(e.key)){const o=e.target,n=t.indexOf(o);t=t.slice(n+1)}setTimeout((()=>B(t))),e.preventDefault()}}))})))))))}));export const SelectViewport=/*#__PURE__*/x.forwardRef(((e,t)=>{const{__scopeSelect:o,...n}=e,r=L("SelectViewport",o),l=m(t,r.onViewportChange),c=x.useRef(0);/*#__PURE__*/return x.createElement(x.Fragment,null,/*#__PURE__*/x.createElement("style",{dangerouslySetInnerHTML:{__html:"[data-radix-select-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-select-viewport]::-webkit-scrollbar{display:none}"}}),/*#__PURE__*/x.createElement(E.Slot,{scope:o},/*#__PURE__*/x.createElement(a.div,w({"data-radix-select-viewport":"",role:"presentation"},n,{ref:l,style:{position:"relative",flex:1,overflow:"auto",...n.style},onScroll:S(n.onScroll,(e=>{const t=e.currentTarget,{contentWrapper:o,shouldExpandOnScrollRef:n}=r;if(n.current&&o){const e=Math.abs(c.current-t.scrollTop);if(e>0){const n=window.innerHeight-20,r=parseFloat(o.style.minHeight),l=parseFloat(o.style.height),c=Math.max(r,l);if(c<n){const r=c+e,l=Math.min(n,r),a=r-l;o.style.height=l+"px","0px"===o.style.bottom&&(t.scrollTop=a>0?a:0,o.style.justifyContent="flex-end")}}}c.current=t.scrollTop}))}))))}));/*#__PURE__*/const[V,H]=T("SelectGroup");export const SelectGroup=/*#__PURE__*/x.forwardRef(((e,t)=>{const{__scopeSelect:o,...n}=e,r=u();/*#__PURE__*/return x.createElement(V,{scope:o,id:r},/*#__PURE__*/x.createElement(a.div,w({role:"group","aria-labelledby":r},n,{ref:t})))}));/*#__PURE__*/export const SelectLabel=/*#__PURE__*/x.forwardRef(((e,t)=>{const{__scopeSelect:o,...n}=e,r=H("SelectLabel",o);/*#__PURE__*/return x.createElement(a.div,w({id:r.id},n,{ref:t}))}));/*#__PURE__*/const[M,B]=T("SelectItem");export const SelectItem=/*#__PURE__*/x.forwardRef(((e,t)=>{const{__scopeSelect:o,value:n,disabled:r=!1,textValue:l,...c}=e,i=D("SelectItem",o),s=L("SelectItem",o),d=i.value===n,[p,f]=x.useState(null!=l?l:""),[v,g]=x.useState(!1),h=m(t,d?s.onSelectedItemChange:void 0),b=u(),C=()=>{r||(i.onValueChange(n),i.onOpenChange(!1))};/*#__PURE__*/return x.createElement(M,{scope:o,value:n,textId:b,isSelected:d,onItemTextChange:x.useCallback((e=>{f((t=>{var o;return t||(null!==(o=null==e?void 0:e.textContent)&&void 0!==o?o:"").trim()}))}),[])},/*#__PURE__*/x.createElement(E.ItemSlot,{scope:o,value:n,disabled:r,textValue:p},/*#__PURE__*/x.createElement(a.div,w({role:"option","aria-labelledby":b,"aria-selected":d&&v,"data-state":d?"active":"inactive","aria-disabled":r||void 0,"data-disabled":r?"":void 0,tabIndex:r?void 0:-1},c,{ref:h,onFocus:S(c.onFocus,(()=>g(!0))),onBlur:S(c.onBlur,(()=>g(!1))),onPointerUp:S(c.onPointerUp,C),onPointerMove:S(c.onPointerMove,(e=>{r?s.onItemLeave():e.currentTarget.focus({preventScroll:!0})})),onPointerLeave:S(c.onPointerLeave,(e=>{e.currentTarget===document.activeElement&&s.onItemLeave()})),onKeyDown:S(c.onKeyDown,(e=>{""!==s.searchRef.current&&" "===e.key||(y.includes(e.key)&&C()," "===e.key&&e.preventDefault())}))}))))}));/*#__PURE__*/export const SelectItemText=/*#__PURE__*/x.forwardRef(((e,t)=>{var o;const{__scopeSelect:n,className:r,style:l,...c}=e,i=D("SelectItemText",n),s=L("SelectItemText",n),u=B("SelectItemText",n),d=x.useRef(null),p=m(t,d,u.onItemTextChange,u.isSelected?s.onSelectedItemTextChange:void 0);/*#__PURE__*/return x.createElement(x.Fragment,null,/*#__PURE__*/x.createElement(a.span,w({id:u.textId},c,{ref:p})),u.isSelected&&i.valueNode&&!i.valueNodeHasChildren?/*#__PURE__*/h.createPortal(c.children,i.valueNode):null,i.bubbleSelect?/*#__PURE__*/h.createPortal(/*#__PURE__*/
3
- x.createElement("option",{value:u.value},null===(o=d.current)||void 0===o?void 0:o.textContent),i.bubbleSelect):null)}));/*#__PURE__*/export const SelectItemIndicator=/*#__PURE__*/x.forwardRef(((e,t)=>{const{__scopeSelect:o,...n}=e;return B("SelectItemIndicator",o).isSelected?/*#__PURE__*/x.createElement(a.span,w({"aria-hidden":!0},n,{ref:t})):null}));/*#__PURE__*/export const SelectScrollUpButton=/*#__PURE__*/x.forwardRef(((e,t)=>{const o=L("SelectScrollUpButton",e.__scopeSelect),[n,r]=x.useState(!1),l=m(t,o.onScrollButtonChange);return x.useEffect((()=>{if(o.viewport&&o.isPositioned){const t=o.viewport;function e(){const e=t.scrollTop>0;r(e)}return e(),t.addEventListener("scroll",e),()=>t.removeEventListener("scroll",e)}}),[o.viewport,o.isPositioned]),n?/*#__PURE__*/x.createElement(A,w({},e,{ref:l,onAutoScroll:()=>{const{viewport:e,selectedItem:t}=o;e&&t&&(e.scrollTop=e.scrollTop-t.offsetHeight)}})):null}));/*#__PURE__*/export const SelectScrollDownButton=/*#__PURE__*/x.forwardRef(((e,t)=>{const o=L("SelectScrollDownButton",e.__scopeSelect),[n,r]=x.useState(!1),l=m(t,o.onScrollButtonChange);return x.useEffect((()=>{if(o.viewport&&o.isPositioned){const t=o.viewport;function e(){const e=t.scrollHeight-t.clientHeight,o=Math.ceil(t.scrollTop)<e;r(o)}return e(),t.addEventListener("scroll",e),()=>t.removeEventListener("scroll",e)}}),[o.viewport,o.isPositioned]),n?/*#__PURE__*/x.createElement(A,w({},e,{ref:l,onAutoScroll:()=>{const{viewport:e,selectedItem:t}=o;e&&t&&(e.scrollTop=e.scrollTop+t.offsetHeight)}})):null}));/*#__PURE__*/const A=/*#__PURE__*/x.forwardRef(((e,t)=>{const{__scopeSelect:o,onAutoScroll:n,...l}=e,c=L("SelectScrollButton",o),i=x.useRef(null),s=C(o),u=x.useCallback((()=>{null!==i.current&&(window.clearInterval(i.current),i.current=null)}),[]);return x.useEffect((()=>()=>u()),[u]),r((()=>{var e;const t=s().find((e=>e.ref.current===document.activeElement));null==t||null===(e=t.ref.current)||void 0===e||e.scrollIntoView({block:"nearest"})}),[s]),/*#__PURE__*/x.createElement(a.div,w({"aria-hidden":!0},l,{ref:t,style:{flexShrink:0,...l.style},onPointerMove:S(l.onPointerMove,(()=>{c.onItemLeave(),null===i.current&&(i.current=window.setInterval(n,50))})),onPointerLeave:S(l.onPointerLeave,(()=>{u()}))}))}));export const SelectSeparator=/*#__PURE__*/x.forwardRef(((e,t)=>{const{__scopeSelect:o,...n}=e;/*#__PURE__*/return x.createElement(a.div,w({"aria-hidden":!0},n,{ref:t}))}));/*#__PURE__*/const O=/*#__PURE__*/x.forwardRef(((e,t)=>{const{value:r,...l}=e,c=x.useRef(null),a=m(t,c),i=n(r);return x.useEffect((()=>{const e=c.current,t=window.HTMLSelectElement.prototype,o=Object.getOwnPropertyDescriptor(t,"value").set;if(i!==r&&o){const t=new Event("change",{bubbles:!0});o.call(e,r),e.dispatchEvent(t)}}),[i,r]),/*#__PURE__*/x.createElement(o,{asChild:!0},/*#__PURE__*/x.createElement("select",w({},l,{ref:a,defaultValue:r})))}));function N(e){const t=c(e),o=x.useRef(""),n=x.useRef(0),r=x.useCallback((e=>{const r=o.current+e;t(r),function e(t){o.current=t,window.clearTimeout(n.current),""!==t&&(n.current=window.setTimeout((()=>e("")),1e3))}(r)}),[t]),l=x.useCallback((()=>{o.current="",window.clearTimeout(n.current)}),[]);return x.useEffect((()=>()=>window.clearTimeout(n.current)),[]),[o,r,l]}function K(e,t,o){const n=t.length>1&&Array.from(t).every((e=>e===t[0]))?t[0]:t,r=o?e.indexOf(o):-1;let l=(c=e,a=Math.max(r,0),c.map(((e,t)=>c[(a+t)%c.length])));var c,a;1===n.length&&(l=l.filter((e=>e!==o)));const i=l.find((e=>e.textValue.toLowerCase().startsWith(n.toLowerCase())));return i!==o?i:void 0}export const Root=Select;export const Trigger=SelectTrigger;export const Value=SelectValue;export const Icon=SelectIcon;export const Content=SelectContent;export const Viewport=SelectViewport;export const Group=SelectGroup;export const Label=SelectLabel;export const Item=SelectItem;export const ItemText=SelectItemText;export const ItemIndicator=SelectItemIndicator;export const ScrollUpButton=SelectScrollUpButton;export const ScrollDownButton=SelectScrollDownButton;export const Separator=SelectSeparator;
1
+ import $01b9c$babelruntimehelpersesmextends from "@babel/runtime/helpers/esm/extends";
2
+ import {useState as $01b9c$useState, useRef as $01b9c$useRef, createElement as $01b9c$createElement, forwardRef as $01b9c$forwardRef, useEffect as $01b9c$useEffect, useCallback as $01b9c$useCallback, Fragment as $01b9c$Fragment} from "react";
3
+ import {createPortal as $01b9c$createPortal} from "react-dom";
4
+ import {clamp as $01b9c$clamp} from "@radix-ui/number";
5
+ import {composeEventHandlers as $01b9c$composeEventHandlers} from "@radix-ui/primitive";
6
+ import {createCollection as $01b9c$createCollection} from "@radix-ui/react-collection";
7
+ import {useComposedRefs as $01b9c$useComposedRefs} from "@radix-ui/react-compose-refs";
8
+ import {createContextScope as $01b9c$createContextScope} from "@radix-ui/react-context";
9
+ import {DismissableLayer as $01b9c$DismissableLayer} from "@radix-ui/react-dismissable-layer";
10
+ import {FocusScope as $01b9c$FocusScope} from "@radix-ui/react-focus-scope";
11
+ import {useId as $01b9c$useId} from "@radix-ui/react-id";
12
+ import {useLabelContext as $01b9c$useLabelContext} from "@radix-ui/react-label";
13
+ import {Portal as $01b9c$Portal} from "@radix-ui/react-portal";
14
+ import {Primitive as $01b9c$Primitive} from "@radix-ui/react-primitive";
15
+ import {useDirection as $01b9c$useDirection} from "@radix-ui/react-direction";
16
+ import {useCallbackRef as $01b9c$useCallbackRef} from "@radix-ui/react-use-callback-ref";
17
+ import {useControllableState as $01b9c$useControllableState} from "@radix-ui/react-use-controllable-state";
18
+ import {useLayoutEffect as $01b9c$useLayoutEffect} from "@radix-ui/react-use-layout-effect";
19
+ import {usePrevious as $01b9c$usePrevious} from "@radix-ui/react-use-previous";
20
+ import {VisuallyHidden as $01b9c$VisuallyHidden} from "@radix-ui/react-visually-hidden";
21
+ import {hideOthers as $01b9c$hideOthers} from "aria-hidden";
22
+ import {RemoveScroll as $01b9c$RemoveScroll} from "react-remove-scroll";
23
+
24
+ function $parcel$export(e, n, v, s) {
25
+ Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
26
+ }
27
+ var $cc7e05a45900e73f$exports = {};
28
+
29
+ $parcel$export($cc7e05a45900e73f$exports, "createSelectScope", () => $cc7e05a45900e73f$export$286727a75dc039bd);
30
+ $parcel$export($cc7e05a45900e73f$exports, "Select", () => $cc7e05a45900e73f$export$ef9b1a59e592288f);
31
+ $parcel$export($cc7e05a45900e73f$exports, "SelectTrigger", () => $cc7e05a45900e73f$export$3ac1e88a1c0b9f1);
32
+ $parcel$export($cc7e05a45900e73f$exports, "SelectValue", () => $cc7e05a45900e73f$export$e288731fd71264f0);
33
+ $parcel$export($cc7e05a45900e73f$exports, "SelectIcon", () => $cc7e05a45900e73f$export$99b400cabb58c515);
34
+ $parcel$export($cc7e05a45900e73f$exports, "SelectContent", () => $cc7e05a45900e73f$export$c973a4b3cb86a03d);
35
+ $parcel$export($cc7e05a45900e73f$exports, "SelectViewport", () => $cc7e05a45900e73f$export$9ed6e7b40248d36d);
36
+ $parcel$export($cc7e05a45900e73f$exports, "SelectGroup", () => $cc7e05a45900e73f$export$ee25a334c55de1f4);
37
+ $parcel$export($cc7e05a45900e73f$exports, "SelectLabel", () => $cc7e05a45900e73f$export$f67338d29bd972f8);
38
+ $parcel$export($cc7e05a45900e73f$exports, "SelectItem", () => $cc7e05a45900e73f$export$13ef48a934230896);
39
+ $parcel$export($cc7e05a45900e73f$exports, "SelectItemText", () => $cc7e05a45900e73f$export$3572fb0fb821ff49);
40
+ $parcel$export($cc7e05a45900e73f$exports, "SelectItemIndicator", () => $cc7e05a45900e73f$export$6b9198de19accfe6);
41
+ $parcel$export($cc7e05a45900e73f$exports, "SelectScrollUpButton", () => $cc7e05a45900e73f$export$d8117927658af6d7);
42
+ $parcel$export($cc7e05a45900e73f$exports, "SelectScrollDownButton", () => $cc7e05a45900e73f$export$ff951e476c12189);
43
+ $parcel$export($cc7e05a45900e73f$exports, "SelectSeparator", () => $cc7e05a45900e73f$export$eba4b1df07cb1d3);
44
+ $parcel$export($cc7e05a45900e73f$exports, "Root", () => $cc7e05a45900e73f$export$be92b6f5f03c0fe9);
45
+ $parcel$export($cc7e05a45900e73f$exports, "Trigger", () => $cc7e05a45900e73f$export$41fb9f06171c75f4);
46
+ $parcel$export($cc7e05a45900e73f$exports, "Value", () => $cc7e05a45900e73f$export$4c8d1a57a761ef94);
47
+ $parcel$export($cc7e05a45900e73f$exports, "Icon", () => $cc7e05a45900e73f$export$f04a61298a47a40f);
48
+ $parcel$export($cc7e05a45900e73f$exports, "Content", () => $cc7e05a45900e73f$export$7c6e2c02157bb7d2);
49
+ $parcel$export($cc7e05a45900e73f$exports, "Viewport", () => $cc7e05a45900e73f$export$d5c6c08dc2d3ca7);
50
+ $parcel$export($cc7e05a45900e73f$exports, "Group", () => $cc7e05a45900e73f$export$eb2fcfdbd7ba97d4);
51
+ $parcel$export($cc7e05a45900e73f$exports, "Label", () => $cc7e05a45900e73f$export$b04be29aa201d4f5);
52
+ $parcel$export($cc7e05a45900e73f$exports, "Item", () => $cc7e05a45900e73f$export$6d08773d2e66f8f2);
53
+ $parcel$export($cc7e05a45900e73f$exports, "ItemText", () => $cc7e05a45900e73f$export$d6e5bf9c43ea9319);
54
+ $parcel$export($cc7e05a45900e73f$exports, "ItemIndicator", () => $cc7e05a45900e73f$export$c3468e2714d175fa);
55
+ $parcel$export($cc7e05a45900e73f$exports, "ScrollUpButton", () => $cc7e05a45900e73f$export$2f60d3ec9ad468f2);
56
+ $parcel$export($cc7e05a45900e73f$exports, "ScrollDownButton", () => $cc7e05a45900e73f$export$bf1aedc3039c8d63);
57
+ $parcel$export($cc7e05a45900e73f$exports, "Separator", () => $cc7e05a45900e73f$export$1ff3c3f08ae963c0);
58
+
59
+
60
+
61
+
62
+
63
+
64
+
65
+
66
+
67
+
68
+
69
+
70
+
71
+
72
+
73
+
74
+
75
+
76
+
77
+
78
+
79
+
80
+ const $cc7e05a45900e73f$var$OPEN_KEYS = [
81
+ ' ',
82
+ 'Enter',
83
+ 'ArrowUp',
84
+ 'ArrowDown'
85
+ ];
86
+ const $cc7e05a45900e73f$var$SELECTION_KEYS = [
87
+ ' ',
88
+ 'Enter'
89
+ ];
90
+ /* -------------------------------------------------------------------------------------------------
91
+ * Select
92
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$SELECT_NAME = 'Select';
93
+ const [$cc7e05a45900e73f$var$Collection, $cc7e05a45900e73f$var$useCollection, $cc7e05a45900e73f$var$createCollectionScope] = $01b9c$createCollection($cc7e05a45900e73f$var$SELECT_NAME);
94
+ const [$cc7e05a45900e73f$var$createSelectContext, $cc7e05a45900e73f$export$286727a75dc039bd] = $01b9c$createContextScope($cc7e05a45900e73f$var$SELECT_NAME, [
95
+ $cc7e05a45900e73f$var$createCollectionScope
96
+ ]);
97
+ const [$cc7e05a45900e73f$var$SelectProvider, $cc7e05a45900e73f$var$useSelectContext] = $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$SELECT_NAME);
98
+ const $cc7e05a45900e73f$export$ef9b1a59e592288f = (props)=>{
99
+ const { __scopeSelect: __scopeSelect , children: children , open: openProp , defaultOpen: defaultOpen , onOpenChange: onOpenChange , value: valueProp , defaultValue: defaultValue , onValueChange: onValueChange , dir: dir , name: name , autoComplete: autoComplete } = props;
100
+ const [trigger, setTrigger] = $01b9c$useState(null);
101
+ const [valueNode, setValueNode] = $01b9c$useState(null);
102
+ const [valueNodeHasChildren, setValueNodeHasChildren] = $01b9c$useState(false);
103
+ const direction = $01b9c$useDirection(dir);
104
+ const [open = false, setOpen] = $01b9c$useControllableState({
105
+ prop: openProp,
106
+ defaultProp: defaultOpen,
107
+ onChange: onOpenChange
108
+ });
109
+ const [value, setValue] = $01b9c$useControllableState({
110
+ prop: valueProp,
111
+ defaultProp: defaultValue,
112
+ onChange: onValueChange
113
+ }); // We set this to true by default so that events bubble to forms without JS (SSR)
114
+ const isFormControl = trigger ? Boolean(trigger.closest('form')) : true;
115
+ const [bubbleSelect, setBubbleSelect] = $01b9c$useState(null);
116
+ const triggerPointerDownPosRef = $01b9c$useRef(null);
117
+ return /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$SelectProvider, {
118
+ scope: __scopeSelect,
119
+ trigger: trigger,
120
+ onTriggerChange: setTrigger,
121
+ valueNode: valueNode,
122
+ onValueNodeChange: setValueNode,
123
+ valueNodeHasChildren: valueNodeHasChildren,
124
+ onValueNodeHasChildrenChange: setValueNodeHasChildren,
125
+ contentId: $01b9c$useId(),
126
+ value: value,
127
+ onValueChange: setValue,
128
+ open: open,
129
+ onOpenChange: setOpen,
130
+ dir: direction,
131
+ bubbleSelect: bubbleSelect,
132
+ triggerPointerDownPosRef: triggerPointerDownPosRef
133
+ }, /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$Collection.Provider, {
134
+ scope: __scopeSelect
135
+ }, children), isFormControl ? /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$BubbleSelect, {
136
+ ref: setBubbleSelect,
137
+ "aria-hidden": true,
138
+ tabIndex: -1,
139
+ name: name,
140
+ autoComplete: autoComplete,
141
+ value: value // enable form autofill
142
+ ,
143
+ onChange: (event)=>setValue(event.target.value)
144
+ }) : null);
145
+ };
146
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$ef9b1a59e592288f, {
147
+ displayName: $cc7e05a45900e73f$var$SELECT_NAME
148
+ });
149
+ /* -------------------------------------------------------------------------------------------------
150
+ * SelectTrigger
151
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$TRIGGER_NAME = 'SelectTrigger';
152
+ const $cc7e05a45900e73f$export$3ac1e88a1c0b9f1 = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
153
+ const { __scopeSelect: __scopeSelect , disabled: disabled = false , 'aria-labelledby': ariaLabelledby , ...triggerProps } = props;
154
+ const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$TRIGGER_NAME, __scopeSelect);
155
+ const composedRefs = $01b9c$useComposedRefs(forwardedRef, context.onTriggerChange);
156
+ const getItems = $cc7e05a45900e73f$var$useCollection(__scopeSelect);
157
+ const labelId = $01b9c$useLabelContext(context.trigger);
158
+ const labelledBy = ariaLabelledby || labelId;
159
+ const [searchRef, handleTypeaheadSearch, resetTypeahead] = $cc7e05a45900e73f$var$useTypeaheadSearch((search)=>{
160
+ const enabledItems = getItems().filter((item)=>!item.disabled
161
+ );
162
+ const currentItem = enabledItems.find((item)=>item.value === context.value
163
+ );
164
+ const nextItem = $cc7e05a45900e73f$var$findNextItem(enabledItems, search, currentItem);
165
+ if (nextItem !== undefined) context.onValueChange(nextItem.value);
166
+ });
167
+ const handleOpen = ()=>{
168
+ if (!disabled) {
169
+ context.onOpenChange(true); // reset typeahead when we open
170
+ resetTypeahead();
171
+ }
172
+ };
173
+ return /*#__PURE__*/ $01b9c$createElement($01b9c$Primitive.button, $01b9c$babelruntimehelpersesmextends({
174
+ type: "button",
175
+ role: "combobox",
176
+ "aria-controls": context.contentId,
177
+ "aria-expanded": context.open,
178
+ "aria-autocomplete": "none",
179
+ "aria-labelledby": labelledBy,
180
+ dir: context.dir,
181
+ "data-state": context.open ? 'open' : 'closed',
182
+ disabled: disabled,
183
+ "data-disabled": disabled ? '' : undefined,
184
+ "data-placeholder": context.value === undefined ? '' : undefined
185
+ }, triggerProps, {
186
+ ref: composedRefs,
187
+ onPointerDown: $01b9c$composeEventHandlers(triggerProps.onPointerDown, (event)=>{
188
+ // prevent implicit pointer capture
189
+ // https://www.w3.org/TR/pointerevents3/#implicit-pointer-capture
190
+ event.target.releasePointerCapture(event.pointerId); // only call handler if it's the left button (mousedown gets triggered by all mouse buttons)
191
+ // but not when the control key is pressed (avoiding MacOS right click)
192
+ if (event.button === 0 && event.ctrlKey === false) {
193
+ handleOpen();
194
+ context.triggerPointerDownPosRef.current = {
195
+ x: Math.round(event.pageX),
196
+ y: Math.round(event.pageY)
197
+ }; // prevent trigger from stealing focus from the active item after opening.
198
+ event.preventDefault();
199
+ }
200
+ }),
201
+ onKeyDown: $01b9c$composeEventHandlers(triggerProps.onKeyDown, (event)=>{
202
+ const isTypingAhead = searchRef.current !== '';
203
+ const isModifierKey = event.ctrlKey || event.altKey || event.metaKey;
204
+ if (!isModifierKey && event.key.length === 1) handleTypeaheadSearch(event.key);
205
+ if (isTypingAhead && event.key === ' ') return;
206
+ if ($cc7e05a45900e73f$var$OPEN_KEYS.includes(event.key)) {
207
+ handleOpen();
208
+ event.preventDefault();
209
+ }
210
+ })
211
+ }));
212
+ });
213
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$3ac1e88a1c0b9f1, {
214
+ displayName: $cc7e05a45900e73f$var$TRIGGER_NAME
215
+ });
216
+ /* -------------------------------------------------------------------------------------------------
217
+ * SelectValue
218
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$VALUE_NAME = 'SelectValue';
219
+ const $cc7e05a45900e73f$export$e288731fd71264f0 = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
220
+ // We ignore `className` and `style` as this part shouldn't be styled.
221
+ const { __scopeSelect: __scopeSelect , className: className , style: style , children: children , placeholder: placeholder , ...valueProps } = props;
222
+ const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$VALUE_NAME, __scopeSelect);
223
+ const { onValueNodeHasChildrenChange: onValueNodeHasChildrenChange } = context;
224
+ const hasChildren = children !== undefined;
225
+ const composedRefs = $01b9c$useComposedRefs(forwardedRef, context.onValueNodeChange);
226
+ $01b9c$useLayoutEffect(()=>{
227
+ onValueNodeHasChildrenChange(hasChildren);
228
+ }, [
229
+ onValueNodeHasChildrenChange,
230
+ hasChildren
231
+ ]);
232
+ return /*#__PURE__*/ $01b9c$createElement($01b9c$Primitive.span, $01b9c$babelruntimehelpersesmextends({}, valueProps, {
233
+ ref: composedRefs // we don't want events from the portalled `SelectValue` children to bubble
234
+ ,
235
+ style: {
236
+ pointerEvents: 'none'
237
+ }
238
+ }), context.value === undefined && placeholder !== undefined ? placeholder : children);
239
+ });
240
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$e288731fd71264f0, {
241
+ displayName: $cc7e05a45900e73f$var$VALUE_NAME
242
+ });
243
+ /* -------------------------------------------------------------------------------------------------
244
+ * SelectIcon
245
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$ICON_NAME = 'SelectIcon';
246
+ const $cc7e05a45900e73f$export$99b400cabb58c515 = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
247
+ const { __scopeSelect: __scopeSelect , children: children , ...iconProps } = props;
248
+ return /*#__PURE__*/ $01b9c$createElement($01b9c$Primitive.span, $01b9c$babelruntimehelpersesmextends({
249
+ "aria-hidden": true
250
+ }, iconProps, {
251
+ ref: forwardedRef
252
+ }), children || '▼');
253
+ });
254
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$99b400cabb58c515, {
255
+ displayName: $cc7e05a45900e73f$var$ICON_NAME
256
+ });
257
+ /* -------------------------------------------------------------------------------------------------
258
+ * SelectContent
259
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$CONTENT_NAME = 'SelectContent';
260
+ const $cc7e05a45900e73f$export$c973a4b3cb86a03d = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
261
+ const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$CONTENT_NAME, props.__scopeSelect);
262
+ const [fragment, setFragment] = $01b9c$useState(); // setting the fragment in `useLayoutEffect` as `DocumentFragment` doesn't exist on the server
263
+ $01b9c$useLayoutEffect(()=>{
264
+ setFragment(new DocumentFragment());
265
+ }, []);
266
+ return context.open ? /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$SelectContentImpl, $01b9c$babelruntimehelpersesmextends({}, props, {
267
+ ref: forwardedRef
268
+ })) : fragment ? /*#__PURE__*/ $01b9c$createPortal(/*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$SelectContentContextProvider, {
269
+ scope: props.__scopeSelect
270
+ }, /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$Collection.Slot, {
271
+ scope: props.__scopeSelect
272
+ }, /*#__PURE__*/ $01b9c$createElement("div", null, props.children))), fragment) : null;
273
+ });
274
+ const $cc7e05a45900e73f$var$CONTENT_MARGIN = 10;
275
+ const [$cc7e05a45900e73f$var$SelectContentContextProvider, $cc7e05a45900e73f$var$useSelectContentContext] = $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$CONTENT_NAME);
276
+ const $cc7e05a45900e73f$var$SelectContentImpl = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
277
+ const { __scopeSelect: __scopeSelect , onCloseAutoFocus: onCloseAutoFocus , ...contentProps } = props;
278
+ const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$CONTENT_NAME, __scopeSelect);
279
+ const [contentWrapper, setContentWrapper] = $01b9c$useState(null);
280
+ const [content, setContent] = $01b9c$useState(null);
281
+ const [viewport, setViewport] = $01b9c$useState(null);
282
+ const composedRefs = $01b9c$useComposedRefs(forwardedRef, (node)=>setContent(node)
283
+ );
284
+ const [selectedItem, setSelectedItem] = $01b9c$useState(null);
285
+ const [selectedItemText, setSelectedItemText] = $01b9c$useState(null);
286
+ const getItems = $cc7e05a45900e73f$var$useCollection(__scopeSelect);
287
+ const [isPositioned, setIsPositioned] = $01b9c$useState(false);
288
+ const shouldRepositionRef = $01b9c$useRef(true);
289
+ const shouldExpandOnScrollRef = $01b9c$useRef(false);
290
+ const firstValidItemFoundRef = $01b9c$useRef(false); // aria-hide everything except the content (better supported equivalent to setting aria-modal)
291
+ $01b9c$useEffect(()=>{
292
+ if (content) return $01b9c$hideOthers(content);
293
+ }, [
294
+ content
295
+ ]);
296
+ const focusFirst = $01b9c$useCallback((candidates)=>{
297
+ const [firstItem, ...restItems] = getItems().map((item)=>item.ref.current
298
+ );
299
+ const [lastItem] = restItems.slice(-1);
300
+ const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;
301
+ for (const candidate of candidates){
302
+ // if focus is already where we want to go, we don't want to keep going through the candidates
303
+ if (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;
304
+ candidate === null || candidate === void 0 || candidate.scrollIntoView({
305
+ block: 'nearest'
306
+ }); // viewport might have padding so scroll to its edges when focusing first/last items.
307
+ if (candidate === firstItem && viewport) viewport.scrollTop = 0;
308
+ if (candidate === lastItem && viewport) viewport.scrollTop = viewport.scrollHeight;
309
+ candidate === null || candidate === void 0 || candidate.focus();
310
+ if (document.activeElement !== PREVIOUSLY_FOCUSED_ELEMENT) return;
311
+ }
312
+ }, [
313
+ getItems,
314
+ viewport
315
+ ]);
316
+ const position = $01b9c$useCallback(()=>{
317
+ if (context.trigger && context.valueNode && contentWrapper && content && viewport && selectedItem && selectedItemText) {
318
+ const triggerRect = context.trigger.getBoundingClientRect(); // -----------------------------------------------------------------------------------------
319
+ // Horizontal positioning
320
+ // -----------------------------------------------------------------------------------------
321
+ const contentRect = content.getBoundingClientRect();
322
+ const valueNodeRect = context.valueNode.getBoundingClientRect();
323
+ const itemTextRect = selectedItemText.getBoundingClientRect();
324
+ if (context.dir !== 'rtl') {
325
+ const itemTextOffset = itemTextRect.left - contentRect.left;
326
+ const left = valueNodeRect.left - itemTextOffset;
327
+ const leftDelta = triggerRect.left - left;
328
+ const minContentWidth = triggerRect.width + leftDelta;
329
+ const contentWidth = Math.max(minContentWidth, contentRect.width);
330
+ const rightEdge = window.innerWidth - $cc7e05a45900e73f$var$CONTENT_MARGIN;
331
+ const clampedLeft = $01b9c$clamp(left, [
332
+ $cc7e05a45900e73f$var$CONTENT_MARGIN,
333
+ rightEdge - contentWidth
334
+ ]);
335
+ contentWrapper.style.minWidth = minContentWidth + 'px';
336
+ contentWrapper.style.left = clampedLeft + 'px';
337
+ } else {
338
+ const itemTextOffset = contentRect.right - itemTextRect.right;
339
+ const right = window.innerWidth - valueNodeRect.right - itemTextOffset;
340
+ const rightDelta = window.innerWidth - triggerRect.right - right;
341
+ const minContentWidth = triggerRect.width + rightDelta;
342
+ const contentWidth = Math.max(minContentWidth, contentRect.width);
343
+ const leftEdge = window.innerWidth - $cc7e05a45900e73f$var$CONTENT_MARGIN;
344
+ const clampedRight = $01b9c$clamp(right, [
345
+ $cc7e05a45900e73f$var$CONTENT_MARGIN,
346
+ leftEdge - contentWidth
347
+ ]);
348
+ contentWrapper.style.minWidth = minContentWidth + 'px';
349
+ contentWrapper.style.right = clampedRight + 'px';
350
+ } // -----------------------------------------------------------------------------------------
351
+ // Vertical positioning
352
+ // -----------------------------------------------------------------------------------------
353
+ const items = getItems();
354
+ const availableHeight = window.innerHeight - $cc7e05a45900e73f$var$CONTENT_MARGIN * 2;
355
+ const itemsHeight = viewport.scrollHeight;
356
+ const contentStyles = window.getComputedStyle(content);
357
+ const contentBorderTopWidth = parseInt(contentStyles.borderTopWidth, 10);
358
+ const contentPaddingTop = parseInt(contentStyles.paddingTop, 10);
359
+ const contentBorderBottomWidth = parseInt(contentStyles.borderBottomWidth, 10);
360
+ const contentPaddingBottom = parseInt(contentStyles.paddingBottom, 10);
361
+ const fullContentHeight = contentBorderTopWidth + contentPaddingTop + itemsHeight + contentPaddingBottom + contentBorderBottomWidth; // prettier-ignore
362
+ const minContentHeight = Math.min(selectedItem.offsetHeight * 5, fullContentHeight);
363
+ const viewportStyles = window.getComputedStyle(viewport);
364
+ const viewportPaddingTop = parseInt(viewportStyles.paddingTop, 10);
365
+ const viewportPaddingBottom = parseInt(viewportStyles.paddingBottom, 10);
366
+ const topEdgeToTriggerMiddle = triggerRect.top + triggerRect.height / 2 - $cc7e05a45900e73f$var$CONTENT_MARGIN;
367
+ const triggerMiddleToBottomEdge = availableHeight - topEdgeToTriggerMiddle;
368
+ const selectedItemHalfHeight = selectedItem.offsetHeight / 2;
369
+ const itemOffsetMiddle = selectedItem.offsetTop + selectedItemHalfHeight;
370
+ const contentTopToItemMiddle = contentBorderTopWidth + contentPaddingTop + itemOffsetMiddle;
371
+ const itemMiddleToContentBottom = fullContentHeight - contentTopToItemMiddle;
372
+ const willAlignWithoutTopOverflow = contentTopToItemMiddle <= topEdgeToTriggerMiddle;
373
+ if (willAlignWithoutTopOverflow) {
374
+ const isLastItem = selectedItem === items[items.length - 1].ref.current;
375
+ contentWrapper.style.bottom = "0px";
376
+ const viewportOffsetBottom = content.clientHeight - viewport.offsetTop - viewport.offsetHeight;
377
+ const clampedTriggerMiddleToBottomEdge = Math.max(triggerMiddleToBottomEdge, selectedItemHalfHeight + (isLastItem ? viewportPaddingBottom : 0) + viewportOffsetBottom + contentBorderBottomWidth);
378
+ const height = contentTopToItemMiddle + clampedTriggerMiddleToBottomEdge;
379
+ contentWrapper.style.height = height + 'px';
380
+ } else {
381
+ const isFirstItem = selectedItem === items[0].ref.current;
382
+ contentWrapper.style.top = "0px";
383
+ const clampedTopEdgeToTriggerMiddle = Math.max(topEdgeToTriggerMiddle, contentBorderTopWidth + viewport.offsetTop + (isFirstItem ? viewportPaddingTop : 0) + selectedItemHalfHeight);
384
+ const height = clampedTopEdgeToTriggerMiddle + itemMiddleToContentBottom;
385
+ contentWrapper.style.height = height + 'px';
386
+ viewport.scrollTop = contentTopToItemMiddle - topEdgeToTriggerMiddle + viewport.offsetTop;
387
+ }
388
+ contentWrapper.style.margin = `${$cc7e05a45900e73f$var$CONTENT_MARGIN}px 0`;
389
+ contentWrapper.style.minHeight = minContentHeight + 'px';
390
+ contentWrapper.style.maxHeight = availableHeight + 'px'; // -----------------------------------------------------------------------------------------
391
+ setIsPositioned(true); // we don't want the initial scroll position adjustment to trigger "expand on scroll"
392
+ // so we explicitly turn it on only after they've registered.
393
+ requestAnimationFrame(()=>shouldExpandOnScrollRef.current = true
394
+ );
395
+ }
396
+ }, [
397
+ getItems,
398
+ context.trigger,
399
+ context.valueNode,
400
+ contentWrapper,
401
+ content,
402
+ viewport,
403
+ selectedItem,
404
+ selectedItemText,
405
+ context.dir
406
+ ]);
407
+ $01b9c$useLayoutEffect(()=>position()
408
+ , [
409
+ position
410
+ ]);
411
+ const focusSelectedItem = $01b9c$useCallback(()=>focusFirst([
412
+ selectedItem,
413
+ content
414
+ ])
415
+ , [
416
+ focusFirst,
417
+ selectedItem,
418
+ content
419
+ ]); // Since this is not dependent on layout, we want to ensure this runs at the same time as
420
+ // other effects across components. Hence why we don't call `focusSelectedItem` inside `position`.
421
+ $01b9c$useEffect(()=>{
422
+ if (isPositioned) focusSelectedItem();
423
+ }, [
424
+ isPositioned,
425
+ focusSelectedItem
426
+ ]); // When the viewport becomes scrollable at the top, the scroll up button will mount.
427
+ // Because it is part of the normal flow, it will push down the viewport, thus throwing our
428
+ // trigger => selectedItem alignment off by the amount the viewport was pushed down.
429
+ // We wait for this to happen and then re-run the positining logic one more time to account for it.
430
+ const handleScrollButtonChange = $01b9c$useCallback((node)=>{
431
+ if (node && shouldRepositionRef.current === true) {
432
+ position();
433
+ focusSelectedItem();
434
+ shouldRepositionRef.current = false;
435
+ }
436
+ }, [
437
+ position,
438
+ focusSelectedItem
439
+ ]); // prevent selecting items on `pointerup` in some cases after opening from `pointerdown`
440
+ // and close on `pointerup` outside.
441
+ const { onOpenChange: onOpenChange , triggerPointerDownPosRef: triggerPointerDownPosRef } = context;
442
+ $01b9c$useEffect(()=>{
443
+ if (content) {
444
+ let pointerMoveDelta = {
445
+ x: 0,
446
+ y: 0
447
+ };
448
+ const handlePointerMove = (event)=>{
449
+ var _triggerPointerDownPo, _triggerPointerDownPo2, _triggerPointerDownPo3, _triggerPointerDownPo4;
450
+ pointerMoveDelta = {
451
+ x: Math.abs(Math.round(event.pageX) - ((_triggerPointerDownPo = (_triggerPointerDownPo2 = triggerPointerDownPosRef.current) === null || _triggerPointerDownPo2 === void 0 ? void 0 : _triggerPointerDownPo2.x) !== null && _triggerPointerDownPo !== void 0 ? _triggerPointerDownPo : 0)),
452
+ y: Math.abs(Math.round(event.pageY) - ((_triggerPointerDownPo3 = (_triggerPointerDownPo4 = triggerPointerDownPosRef.current) === null || _triggerPointerDownPo4 === void 0 ? void 0 : _triggerPointerDownPo4.y) !== null && _triggerPointerDownPo3 !== void 0 ? _triggerPointerDownPo3 : 0))
453
+ };
454
+ };
455
+ const handlePointerUp = (event)=>{
456
+ // If the pointer hasn't moved by a certain threshold then we prevent selecting item on `pointerup`.
457
+ if (pointerMoveDelta.x <= 10 && pointerMoveDelta.y <= 10) event.preventDefault();
458
+ else // otherwise, if the event was outside the content, close.
459
+ if (!content.contains(event.target)) onOpenChange(false);
460
+ document.removeEventListener('pointermove', handlePointerMove);
461
+ triggerPointerDownPosRef.current = null;
462
+ };
463
+ if (triggerPointerDownPosRef.current !== null) {
464
+ document.addEventListener('pointermove', handlePointerMove);
465
+ document.addEventListener('pointerup', handlePointerUp, {
466
+ capture: true,
467
+ once: true
468
+ });
469
+ }
470
+ return ()=>{
471
+ document.removeEventListener('pointermove', handlePointerMove);
472
+ document.removeEventListener('pointerup', handlePointerUp, {
473
+ capture: true
474
+ });
475
+ };
476
+ }
477
+ }, [
478
+ content,
479
+ onOpenChange,
480
+ triggerPointerDownPosRef
481
+ ]);
482
+ $01b9c$useEffect(()=>{
483
+ const close = ()=>onOpenChange(false)
484
+ ;
485
+ window.addEventListener('blur', close);
486
+ window.addEventListener('resize', close);
487
+ return ()=>{
488
+ window.removeEventListener('blur', close);
489
+ window.removeEventListener('resize', close);
490
+ };
491
+ }, [
492
+ onOpenChange
493
+ ]);
494
+ const [searchRef, handleTypeaheadSearch] = $cc7e05a45900e73f$var$useTypeaheadSearch((search)=>{
495
+ const enabledItems = getItems().filter((item)=>!item.disabled
496
+ );
497
+ const currentItem = enabledItems.find((item)=>item.ref.current === document.activeElement
498
+ );
499
+ const nextItem = $cc7e05a45900e73f$var$findNextItem(enabledItems, search, currentItem);
500
+ if (nextItem) /**
501
+ * Imperative focus during keydown is risky so we prevent React's batching updates
502
+ * to avoid potential bugs. See: https://github.com/facebook/react/issues/20332
503
+ */ setTimeout(()=>nextItem.ref.current.focus()
504
+ );
505
+ });
506
+ const itemRefCallback = $01b9c$useCallback((node, value, disabled)=>{
507
+ const isFirstValidItem = !firstValidItemFoundRef.current && !disabled;
508
+ const isSelectedItem = context.value !== undefined && context.value === value;
509
+ if (isSelectedItem || isFirstValidItem) {
510
+ setSelectedItem(node);
511
+ if (isFirstValidItem) firstValidItemFoundRef.current = true;
512
+ }
513
+ }, [
514
+ context.value
515
+ ]);
516
+ const handleItemLeave = $01b9c$useCallback(()=>content === null || content === void 0 ? void 0 : content.focus()
517
+ , [
518
+ content
519
+ ]);
520
+ const itemTextRefCallback = $01b9c$useCallback((node, value, disabled)=>{
521
+ const isFirstValidItem = !firstValidItemFoundRef.current && !disabled;
522
+ const isSelectedItem = context.value !== undefined && context.value === value;
523
+ if (isSelectedItem || isFirstValidItem) setSelectedItemText(node);
524
+ }, [
525
+ context.value
526
+ ]);
527
+ return /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$SelectContentContextProvider, {
528
+ scope: __scopeSelect,
529
+ contentWrapper: contentWrapper,
530
+ content: content,
531
+ viewport: viewport,
532
+ onViewportChange: setViewport,
533
+ itemRefCallback: itemRefCallback,
534
+ selectedItem: selectedItem,
535
+ onItemLeave: handleItemLeave,
536
+ itemTextRefCallback: itemTextRefCallback,
537
+ selectedItemText: selectedItemText,
538
+ onScrollButtonChange: handleScrollButtonChange,
539
+ isPositioned: isPositioned,
540
+ shouldExpandOnScrollRef: shouldExpandOnScrollRef,
541
+ searchRef: searchRef
542
+ }, /*#__PURE__*/ $01b9c$createElement($01b9c$Portal, null, /*#__PURE__*/ $01b9c$createElement($01b9c$RemoveScroll, null, /*#__PURE__*/ $01b9c$createElement("div", {
543
+ ref: setContentWrapper,
544
+ style: {
545
+ display: 'flex',
546
+ flexDirection: 'column',
547
+ position: 'fixed',
548
+ zIndex: 0
549
+ }
550
+ }, /*#__PURE__*/ $01b9c$createElement($01b9c$FocusScope, {
551
+ asChild: true // we make sure we're not trapping once it's been closed
552
+ ,
553
+ trapped: context.open,
554
+ onMountAutoFocus: (event)=>{
555
+ // we prevent open autofocus because we manually focus the selected item
556
+ event.preventDefault();
557
+ },
558
+ onUnmountAutoFocus: $01b9c$composeEventHandlers(onCloseAutoFocus, (event)=>{
559
+ var _context$trigger;
560
+ (_context$trigger = context.trigger) === null || _context$trigger === void 0 || _context$trigger.focus({
561
+ preventScroll: true
562
+ });
563
+ event.preventDefault();
564
+ })
565
+ }, /*#__PURE__*/ $01b9c$createElement($01b9c$DismissableLayer, $01b9c$babelruntimehelpersesmextends({
566
+ role: "listbox",
567
+ id: context.contentId,
568
+ "data-state": context.open ? 'open' : 'closed',
569
+ dir: context.dir,
570
+ onContextMenu: (event)=>event.preventDefault()
571
+ }, contentProps, {
572
+ ref: composedRefs,
573
+ style: {
574
+ display: 'flex',
575
+ flexDirection: 'column',
576
+ // When we get the height of the content, it includes borders. If we were to set
577
+ // the height without having `boxSizing: 'border-box'` it would be too big.
578
+ boxSizing: 'border-box',
579
+ maxHeight: '100%',
580
+ outline: 'none',
581
+ ...contentProps.style
582
+ },
583
+ disableOutsidePointerEvents: true // When focus is trapped, a focusout event may still happen.
584
+ ,
585
+ onFocusOutside: (event)=>event.preventDefault()
586
+ ,
587
+ onDismiss: ()=>context.onOpenChange(false)
588
+ ,
589
+ onKeyDown: $01b9c$composeEventHandlers(contentProps.onKeyDown, (event)=>{
590
+ const isModifierKey = event.ctrlKey || event.altKey || event.metaKey; // select should not be navigated using tab key so we prevent it
591
+ if (event.key === 'Tab') event.preventDefault();
592
+ if (!isModifierKey && event.key.length === 1) handleTypeaheadSearch(event.key);
593
+ if ([
594
+ 'ArrowUp',
595
+ 'ArrowDown',
596
+ 'Home',
597
+ 'End'
598
+ ].includes(event.key)) {
599
+ const items = getItems().filter((item)=>!item.disabled
600
+ );
601
+ let candidateNodes = items.map((item)=>item.ref.current
602
+ );
603
+ if ([
604
+ 'ArrowUp',
605
+ 'End'
606
+ ].includes(event.key)) candidateNodes = candidateNodes.slice().reverse();
607
+ if ([
608
+ 'ArrowUp',
609
+ 'ArrowDown'
610
+ ].includes(event.key)) {
611
+ const currentElement = event.target;
612
+ const currentIndex = candidateNodes.indexOf(currentElement);
613
+ candidateNodes = candidateNodes.slice(currentIndex + 1);
614
+ }
615
+ /**
616
+ * Imperative focus during keydown is risky so we prevent React's batching updates
617
+ * to avoid potential bugs. See: https://github.com/facebook/react/issues/20332
618
+ */ setTimeout(()=>focusFirst(candidateNodes)
619
+ );
620
+ event.preventDefault();
621
+ }
622
+ })
623
+ })))))));
624
+ });
625
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$var$SelectContentImpl, {
626
+ displayName: $cc7e05a45900e73f$var$CONTENT_NAME
627
+ });
628
+ /* -------------------------------------------------------------------------------------------------
629
+ * SelectViewport
630
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$VIEWPORT_NAME = 'SelectViewport';
631
+ const $cc7e05a45900e73f$export$9ed6e7b40248d36d = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
632
+ const { __scopeSelect: __scopeSelect , ...viewportProps } = props;
633
+ const contentContext = $cc7e05a45900e73f$var$useSelectContentContext($cc7e05a45900e73f$var$VIEWPORT_NAME, __scopeSelect);
634
+ const composedRefs = $01b9c$useComposedRefs(forwardedRef, contentContext.onViewportChange);
635
+ const prevScrollTopRef = $01b9c$useRef(0);
636
+ return /*#__PURE__*/ $01b9c$createElement($01b9c$Fragment, null, /*#__PURE__*/ $01b9c$createElement("style", {
637
+ dangerouslySetInnerHTML: {
638
+ __html: `[data-radix-select-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-select-viewport]::-webkit-scrollbar{display:none}`
639
+ }
640
+ }), /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$Collection.Slot, {
641
+ scope: __scopeSelect
642
+ }, /*#__PURE__*/ $01b9c$createElement($01b9c$Primitive.div, $01b9c$babelruntimehelpersesmextends({
643
+ "data-radix-select-viewport": "",
644
+ role: "presentation"
645
+ }, viewportProps, {
646
+ ref: composedRefs,
647
+ style: {
648
+ // we use position: 'relative' here on the `viewport` so that when we call
649
+ // `selectedItem.offsetTop` in calculations, the offset is relative to the viewport
650
+ // (independent of the scrollUpButton).
651
+ position: 'relative',
652
+ flex: 1,
653
+ overflow: 'auto',
654
+ ...viewportProps.style
655
+ },
656
+ onScroll: $01b9c$composeEventHandlers(viewportProps.onScroll, (event)=>{
657
+ const viewport = event.currentTarget;
658
+ const { contentWrapper: contentWrapper , shouldExpandOnScrollRef: shouldExpandOnScrollRef } = contentContext;
659
+ if (shouldExpandOnScrollRef !== null && shouldExpandOnScrollRef !== void 0 && shouldExpandOnScrollRef.current && contentWrapper) {
660
+ const scrolledBy = Math.abs(prevScrollTopRef.current - viewport.scrollTop);
661
+ if (scrolledBy > 0) {
662
+ const availableHeight = window.innerHeight - $cc7e05a45900e73f$var$CONTENT_MARGIN * 2;
663
+ const cssMinHeight = parseFloat(contentWrapper.style.minHeight);
664
+ const cssHeight = parseFloat(contentWrapper.style.height);
665
+ const prevHeight = Math.max(cssMinHeight, cssHeight);
666
+ if (prevHeight < availableHeight) {
667
+ const nextHeight = prevHeight + scrolledBy;
668
+ const clampedNextHeight = Math.min(availableHeight, nextHeight);
669
+ const heightDiff = nextHeight - clampedNextHeight;
670
+ contentWrapper.style.height = clampedNextHeight + 'px';
671
+ if (contentWrapper.style.bottom === '0px') {
672
+ viewport.scrollTop = heightDiff > 0 ? heightDiff : 0; // ensure the content stays pinned to the bottom
673
+ contentWrapper.style.justifyContent = 'flex-end';
674
+ }
675
+ }
676
+ }
677
+ }
678
+ prevScrollTopRef.current = viewport.scrollTop;
679
+ })
680
+ }))));
681
+ });
682
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$9ed6e7b40248d36d, {
683
+ displayName: $cc7e05a45900e73f$var$VIEWPORT_NAME
684
+ });
685
+ /* -------------------------------------------------------------------------------------------------
686
+ * SelectGroup
687
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$GROUP_NAME = 'SelectGroup';
688
+ const [$cc7e05a45900e73f$var$SelectGroupContextProvider, $cc7e05a45900e73f$var$useSelectGroupContext] = $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$GROUP_NAME);
689
+ const $cc7e05a45900e73f$export$ee25a334c55de1f4 = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
690
+ const { __scopeSelect: __scopeSelect , ...groupProps } = props;
691
+ const groupId = $01b9c$useId();
692
+ return /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$SelectGroupContextProvider, {
693
+ scope: __scopeSelect,
694
+ id: groupId
695
+ }, /*#__PURE__*/ $01b9c$createElement($01b9c$Primitive.div, $01b9c$babelruntimehelpersesmextends({
696
+ role: "group",
697
+ "aria-labelledby": groupId
698
+ }, groupProps, {
699
+ ref: forwardedRef
700
+ })));
701
+ });
702
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$ee25a334c55de1f4, {
703
+ displayName: $cc7e05a45900e73f$var$GROUP_NAME
704
+ });
705
+ /* -------------------------------------------------------------------------------------------------
706
+ * SelectLabel
707
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$LABEL_NAME = 'SelectLabel';
708
+ const $cc7e05a45900e73f$export$f67338d29bd972f8 = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
709
+ const { __scopeSelect: __scopeSelect , ...labelProps } = props;
710
+ const groupContext = $cc7e05a45900e73f$var$useSelectGroupContext($cc7e05a45900e73f$var$LABEL_NAME, __scopeSelect);
711
+ return /*#__PURE__*/ $01b9c$createElement($01b9c$Primitive.div, $01b9c$babelruntimehelpersesmextends({
712
+ id: groupContext.id
713
+ }, labelProps, {
714
+ ref: forwardedRef
715
+ }));
716
+ });
717
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$f67338d29bd972f8, {
718
+ displayName: $cc7e05a45900e73f$var$LABEL_NAME
719
+ });
720
+ /* -------------------------------------------------------------------------------------------------
721
+ * SelectItem
722
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$ITEM_NAME = 'SelectItem';
723
+ const [$cc7e05a45900e73f$var$SelectItemContextProvider, $cc7e05a45900e73f$var$useSelectItemContext] = $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$ITEM_NAME);
724
+ const $cc7e05a45900e73f$export$13ef48a934230896 = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
725
+ const { __scopeSelect: __scopeSelect , value: value , disabled: disabled = false , textValue: textValueProp , ...itemProps } = props;
726
+ const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$ITEM_NAME, __scopeSelect);
727
+ const contentContext = $cc7e05a45900e73f$var$useSelectContentContext($cc7e05a45900e73f$var$ITEM_NAME, __scopeSelect);
728
+ const isSelected = context.value === value;
729
+ const [textValue, setTextValue] = $01b9c$useState(textValueProp !== null && textValueProp !== void 0 ? textValueProp : '');
730
+ const [isFocused, setIsFocused] = $01b9c$useState(false);
731
+ const composedRefs = $01b9c$useComposedRefs(forwardedRef, (node)=>{
732
+ var _contentContext$itemR;
733
+ return (_contentContext$itemR = contentContext.itemRefCallback) === null || _contentContext$itemR === void 0 ? void 0 : _contentContext$itemR.call(contentContext, node, value, disabled);
734
+ });
735
+ const textId = $01b9c$useId();
736
+ const handleSelect = ()=>{
737
+ if (!disabled) {
738
+ context.onValueChange(value);
739
+ context.onOpenChange(false);
740
+ }
741
+ };
742
+ return /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$SelectItemContextProvider, {
743
+ scope: __scopeSelect,
744
+ value: value,
745
+ disabled: disabled,
746
+ textId: textId,
747
+ isSelected: isSelected,
748
+ onItemTextChange: $01b9c$useCallback((node)=>{
749
+ setTextValue((prevTextValue)=>{
750
+ var _node$textContent;
751
+ return prevTextValue || ((_node$textContent = node === null || node === void 0 ? void 0 : node.textContent) !== null && _node$textContent !== void 0 ? _node$textContent : '').trim();
752
+ });
753
+ }, [])
754
+ }, /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$Collection.ItemSlot, {
755
+ scope: __scopeSelect,
756
+ value: value,
757
+ disabled: disabled,
758
+ textValue: textValue
759
+ }, /*#__PURE__*/ $01b9c$createElement($01b9c$Primitive.div, $01b9c$babelruntimehelpersesmextends({
760
+ role: "option",
761
+ "aria-labelledby": textId,
762
+ "data-highlighted": isFocused ? '' : undefined // `isFocused` caveat fixes stuttering in VoiceOver
763
+ ,
764
+ "aria-selected": isSelected && isFocused,
765
+ "data-state": isSelected ? 'checked' : 'unchecked',
766
+ "aria-disabled": disabled || undefined,
767
+ "data-disabled": disabled ? '' : undefined,
768
+ tabIndex: disabled ? undefined : -1
769
+ }, itemProps, {
770
+ ref: composedRefs,
771
+ onFocus: $01b9c$composeEventHandlers(itemProps.onFocus, ()=>setIsFocused(true)
772
+ ),
773
+ onBlur: $01b9c$composeEventHandlers(itemProps.onBlur, ()=>setIsFocused(false)
774
+ ),
775
+ onPointerUp: $01b9c$composeEventHandlers(itemProps.onPointerUp, handleSelect),
776
+ onPointerMove: $01b9c$composeEventHandlers(itemProps.onPointerMove, (event)=>{
777
+ if (disabled) {
778
+ var _contentContext$onIte;
779
+ (_contentContext$onIte = contentContext.onItemLeave) === null || _contentContext$onIte === void 0 || _contentContext$onIte.call(contentContext);
780
+ } else // even though safari doesn't support this option, it's acceptable
781
+ // as it only means it might scroll a few pixels when using the pointer.
782
+ event.currentTarget.focus({
783
+ preventScroll: true
784
+ });
785
+ }),
786
+ onPointerLeave: $01b9c$composeEventHandlers(itemProps.onPointerLeave, (event)=>{
787
+ if (event.currentTarget === document.activeElement) {
788
+ var _contentContext$onIte2;
789
+ (_contentContext$onIte2 = contentContext.onItemLeave) === null || _contentContext$onIte2 === void 0 || _contentContext$onIte2.call(contentContext);
790
+ }
791
+ }),
792
+ onKeyDown: $01b9c$composeEventHandlers(itemProps.onKeyDown, (event)=>{
793
+ var _contentContext$searc;
794
+ const isTypingAhead = ((_contentContext$searc = contentContext.searchRef) === null || _contentContext$searc === void 0 ? void 0 : _contentContext$searc.current) !== '';
795
+ if (isTypingAhead && event.key === ' ') return;
796
+ if ($cc7e05a45900e73f$var$SELECTION_KEYS.includes(event.key)) handleSelect(); // prevent page scroll if using the space key to select an item
797
+ if (event.key === ' ') event.preventDefault();
798
+ })
799
+ }))));
800
+ });
801
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$13ef48a934230896, {
802
+ displayName: $cc7e05a45900e73f$var$ITEM_NAME
803
+ });
804
+ /* -------------------------------------------------------------------------------------------------
805
+ * SelectItemText
806
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$ITEM_TEXT_NAME = 'SelectItemText';
807
+ const $cc7e05a45900e73f$export$3572fb0fb821ff49 = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
808
+ var _ref$current;
809
+ // We ignore `className` and `style` as this part shouldn't be styled.
810
+ const { __scopeSelect: __scopeSelect , className: className , style: style , ...itemTextProps } = props;
811
+ const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$ITEM_TEXT_NAME, __scopeSelect);
812
+ const contentContext = $cc7e05a45900e73f$var$useSelectContentContext($cc7e05a45900e73f$var$ITEM_TEXT_NAME, __scopeSelect);
813
+ const itemContext = $cc7e05a45900e73f$var$useSelectItemContext($cc7e05a45900e73f$var$ITEM_TEXT_NAME, __scopeSelect);
814
+ const ref = $01b9c$useRef(null);
815
+ const composedRefs = $01b9c$useComposedRefs(forwardedRef, ref, itemContext.onItemTextChange, (node)=>{
816
+ var _contentContext$itemT;
817
+ return (_contentContext$itemT = contentContext.itemTextRefCallback) === null || _contentContext$itemT === void 0 ? void 0 : _contentContext$itemT.call(contentContext, node, itemContext.value, itemContext.disabled);
818
+ });
819
+ return /*#__PURE__*/ $01b9c$createElement($01b9c$Fragment, null, /*#__PURE__*/ $01b9c$createElement($01b9c$Primitive.span, $01b9c$babelruntimehelpersesmextends({
820
+ id: itemContext.textId
821
+ }, itemTextProps, {
822
+ ref: composedRefs
823
+ })), itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren ? /*#__PURE__*/ $01b9c$createPortal(itemTextProps.children, context.valueNode) : null, context.bubbleSelect ? /*#__PURE__*/ $01b9c$createPortal(/*#__PURE__*/ // we use `.textContent` because `option` only support `string` or `number`
824
+ $01b9c$createElement("option", {
825
+ value: itemContext.value
826
+ }, (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.textContent), context.bubbleSelect) : null);
827
+ });
828
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$3572fb0fb821ff49, {
829
+ displayName: $cc7e05a45900e73f$var$ITEM_TEXT_NAME
830
+ });
831
+ /* -------------------------------------------------------------------------------------------------
832
+ * SelectItemIndicator
833
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$ITEM_INDICATOR_NAME = 'SelectItemIndicator';
834
+ const $cc7e05a45900e73f$export$6b9198de19accfe6 = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
835
+ const { __scopeSelect: __scopeSelect , ...itemIndicatorProps } = props;
836
+ const itemContext = $cc7e05a45900e73f$var$useSelectItemContext($cc7e05a45900e73f$var$ITEM_INDICATOR_NAME, __scopeSelect);
837
+ return itemContext.isSelected ? /*#__PURE__*/ $01b9c$createElement($01b9c$Primitive.span, $01b9c$babelruntimehelpersesmextends({
838
+ "aria-hidden": true
839
+ }, itemIndicatorProps, {
840
+ ref: forwardedRef
841
+ })) : null;
842
+ });
843
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$6b9198de19accfe6, {
844
+ displayName: $cc7e05a45900e73f$var$ITEM_INDICATOR_NAME
845
+ });
846
+ /* -------------------------------------------------------------------------------------------------
847
+ * SelectScrollUpButton
848
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$SCROLL_UP_BUTTON_NAME = 'SelectScrollUpButton';
849
+ const $cc7e05a45900e73f$export$d8117927658af6d7 = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
850
+ const contentContext = $cc7e05a45900e73f$var$useSelectContentContext($cc7e05a45900e73f$var$SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
851
+ const [canScrollUp1, setCanScrollUp] = $01b9c$useState(false);
852
+ const composedRefs = $01b9c$useComposedRefs(forwardedRef, contentContext.onScrollButtonChange);
853
+ $01b9c$useLayoutEffect(()=>{
854
+ if (contentContext.viewport && contentContext.isPositioned) {
855
+ const viewport = contentContext.viewport;
856
+ function handleScroll() {
857
+ const canScrollUp = viewport.scrollTop > 0;
858
+ setCanScrollUp(canScrollUp);
859
+ }
860
+ handleScroll();
861
+ viewport.addEventListener('scroll', handleScroll);
862
+ return ()=>viewport.removeEventListener('scroll', handleScroll)
863
+ ;
864
+ }
865
+ }, [
866
+ contentContext.viewport,
867
+ contentContext.isPositioned
868
+ ]);
869
+ return canScrollUp1 ? /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$SelectScrollButtonImpl, $01b9c$babelruntimehelpersesmextends({}, props, {
870
+ ref: composedRefs,
871
+ onAutoScroll: ()=>{
872
+ const { viewport: viewport , selectedItem: selectedItem } = contentContext;
873
+ if (viewport && selectedItem) viewport.scrollTop = viewport.scrollTop - selectedItem.offsetHeight;
874
+ }
875
+ })) : null;
876
+ });
877
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$d8117927658af6d7, {
878
+ displayName: $cc7e05a45900e73f$var$SCROLL_UP_BUTTON_NAME
879
+ });
880
+ /* -------------------------------------------------------------------------------------------------
881
+ * SelectScrollDownButton
882
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$SCROLL_DOWN_BUTTON_NAME = 'SelectScrollDownButton';
883
+ const $cc7e05a45900e73f$export$ff951e476c12189 = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
884
+ const contentContext = $cc7e05a45900e73f$var$useSelectContentContext($cc7e05a45900e73f$var$SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
885
+ const [canScrollDown1, setCanScrollDown] = $01b9c$useState(false);
886
+ const composedRefs = $01b9c$useComposedRefs(forwardedRef, contentContext.onScrollButtonChange);
887
+ $01b9c$useLayoutEffect(()=>{
888
+ if (contentContext.viewport && contentContext.isPositioned) {
889
+ const viewport = contentContext.viewport;
890
+ function handleScroll() {
891
+ const maxScroll = viewport.scrollHeight - viewport.clientHeight; // we use Math.ceil here because if the UI is zoomed-in
892
+ // `scrollTop` is not always reported as an integer
893
+ const canScrollDown = Math.ceil(viewport.scrollTop) < maxScroll;
894
+ setCanScrollDown(canScrollDown);
895
+ }
896
+ handleScroll();
897
+ viewport.addEventListener('scroll', handleScroll);
898
+ return ()=>viewport.removeEventListener('scroll', handleScroll)
899
+ ;
900
+ }
901
+ }, [
902
+ contentContext.viewport,
903
+ contentContext.isPositioned
904
+ ]);
905
+ return canScrollDown1 ? /*#__PURE__*/ $01b9c$createElement($cc7e05a45900e73f$var$SelectScrollButtonImpl, $01b9c$babelruntimehelpersesmextends({}, props, {
906
+ ref: composedRefs,
907
+ onAutoScroll: ()=>{
908
+ const { viewport: viewport , selectedItem: selectedItem } = contentContext;
909
+ if (viewport && selectedItem) viewport.scrollTop = viewport.scrollTop + selectedItem.offsetHeight;
910
+ }
911
+ })) : null;
912
+ });
913
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$ff951e476c12189, {
914
+ displayName: $cc7e05a45900e73f$var$SCROLL_DOWN_BUTTON_NAME
915
+ });
916
+ const $cc7e05a45900e73f$var$SelectScrollButtonImpl = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
917
+ const { __scopeSelect: __scopeSelect , onAutoScroll: onAutoScroll , ...scrollIndicatorProps } = props;
918
+ const contentContext = $cc7e05a45900e73f$var$useSelectContentContext('SelectScrollButton', __scopeSelect);
919
+ const autoScrollTimerRef = $01b9c$useRef(null);
920
+ const getItems = $cc7e05a45900e73f$var$useCollection(__scopeSelect);
921
+ const clearAutoScrollTimer = $01b9c$useCallback(()=>{
922
+ if (autoScrollTimerRef.current !== null) {
923
+ window.clearInterval(autoScrollTimerRef.current);
924
+ autoScrollTimerRef.current = null;
925
+ }
926
+ }, []);
927
+ $01b9c$useEffect(()=>{
928
+ return ()=>clearAutoScrollTimer()
929
+ ;
930
+ }, [
931
+ clearAutoScrollTimer
932
+ ]); // When the viewport becomes scrollable on either side, the relevant scroll button will mount.
933
+ // Because it is part of the normal flow, it will push down (top button) or shrink (bottom button)
934
+ // the viewport, potentially causing the active item to now be partially out of view.
935
+ // We re-run the `scrollIntoView` logic to make sure it stays within the viewport.
936
+ $01b9c$useLayoutEffect(()=>{
937
+ var _activeItem$ref$curre;
938
+ const activeItem = getItems().find((item)=>item.ref.current === document.activeElement
939
+ );
940
+ activeItem === null || activeItem === void 0 || (_activeItem$ref$curre = activeItem.ref.current) === null || _activeItem$ref$curre === void 0 || _activeItem$ref$curre.scrollIntoView({
941
+ block: 'nearest'
942
+ });
943
+ }, [
944
+ getItems
945
+ ]);
946
+ return /*#__PURE__*/ $01b9c$createElement($01b9c$Primitive.div, $01b9c$babelruntimehelpersesmextends({
947
+ "aria-hidden": true
948
+ }, scrollIndicatorProps, {
949
+ ref: forwardedRef,
950
+ style: {
951
+ flexShrink: 0,
952
+ ...scrollIndicatorProps.style
953
+ },
954
+ onPointerMove: $01b9c$composeEventHandlers(scrollIndicatorProps.onPointerMove, ()=>{
955
+ var _contentContext$onIte3;
956
+ (_contentContext$onIte3 = contentContext.onItemLeave) === null || _contentContext$onIte3 === void 0 || _contentContext$onIte3.call(contentContext);
957
+ if (autoScrollTimerRef.current === null) autoScrollTimerRef.current = window.setInterval(onAutoScroll, 50);
958
+ }),
959
+ onPointerLeave: $01b9c$composeEventHandlers(scrollIndicatorProps.onPointerLeave, ()=>{
960
+ clearAutoScrollTimer();
961
+ })
962
+ }));
963
+ });
964
+ /* -------------------------------------------------------------------------------------------------
965
+ * SelectSeparator
966
+ * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$SEPARATOR_NAME = 'SelectSeparator';
967
+ const $cc7e05a45900e73f$export$eba4b1df07cb1d3 = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
968
+ const { __scopeSelect: __scopeSelect , ...separatorProps } = props;
969
+ return /*#__PURE__*/ $01b9c$createElement($01b9c$Primitive.div, $01b9c$babelruntimehelpersesmextends({
970
+ "aria-hidden": true
971
+ }, separatorProps, {
972
+ ref: forwardedRef
973
+ }));
974
+ });
975
+ /*#__PURE__*/ Object.assign($cc7e05a45900e73f$export$eba4b1df07cb1d3, {
976
+ displayName: $cc7e05a45900e73f$var$SEPARATOR_NAME
977
+ });
978
+ /* -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$BubbleSelect = /*#__PURE__*/ $01b9c$forwardRef((props, forwardedRef)=>{
979
+ const { value: value , ...selectProps } = props;
980
+ const ref = $01b9c$useRef(null);
981
+ const composedRefs = $01b9c$useComposedRefs(forwardedRef, ref);
982
+ const prevValue = $01b9c$usePrevious(value); // Bubble value change to parents (e.g form change event)
983
+ $01b9c$useEffect(()=>{
984
+ const select = ref.current;
985
+ const selectProto = window.HTMLSelectElement.prototype;
986
+ const descriptor = Object.getOwnPropertyDescriptor(selectProto, 'value');
987
+ const setValue = descriptor.set;
988
+ if (prevValue !== value && setValue) {
989
+ const event = new Event('change', {
990
+ bubbles: true
991
+ });
992
+ setValue.call(select, value);
993
+ select.dispatchEvent(event);
994
+ }
995
+ }, [
996
+ prevValue,
997
+ value
998
+ ]);
999
+ /**
1000
+ * We purposefully use a `select` here to support form autofill as much
1001
+ * as possible.
1002
+ *
1003
+ * We purposefully do not add the `value` attribute here to allow the value
1004
+ * to be set programatically and bubble to any parent form `onChange` event.
1005
+ * Adding the `value` will cause React to consider the programatic
1006
+ * dispatch a duplicate and it will get swallowed.
1007
+ *
1008
+ * We use `VisuallyHidden` rather than `display: "none"` because Safari autofill
1009
+ * won't work otherwise.
1010
+ */ return /*#__PURE__*/ $01b9c$createElement($01b9c$VisuallyHidden, {
1011
+ asChild: true
1012
+ }, /*#__PURE__*/ $01b9c$createElement("select", $01b9c$babelruntimehelpersesmextends({}, selectProps, {
1013
+ ref: composedRefs,
1014
+ defaultValue: value
1015
+ })));
1016
+ });
1017
+ function $cc7e05a45900e73f$var$useTypeaheadSearch(onSearchChange) {
1018
+ const handleSearchChange = $01b9c$useCallbackRef(onSearchChange);
1019
+ const searchRef = $01b9c$useRef('');
1020
+ const timerRef = $01b9c$useRef(0);
1021
+ const handleTypeaheadSearch = $01b9c$useCallback((key)=>{
1022
+ const search = searchRef.current + key;
1023
+ handleSearchChange(search);
1024
+ (function updateSearch(value) {
1025
+ searchRef.current = value;
1026
+ window.clearTimeout(timerRef.current); // Reset `searchRef` 1 second after it was last updated
1027
+ if (value !== '') timerRef.current = window.setTimeout(()=>updateSearch('')
1028
+ , 1000);
1029
+ })(search);
1030
+ }, [
1031
+ handleSearchChange
1032
+ ]);
1033
+ const resetTypeahead = $01b9c$useCallback(()=>{
1034
+ searchRef.current = '';
1035
+ window.clearTimeout(timerRef.current);
1036
+ }, []);
1037
+ $01b9c$useEffect(()=>{
1038
+ return ()=>window.clearTimeout(timerRef.current)
1039
+ ;
1040
+ }, []);
1041
+ return [
1042
+ searchRef,
1043
+ handleTypeaheadSearch,
1044
+ resetTypeahead
1045
+ ];
1046
+ }
1047
+ /**
1048
+ * This is the "meat" of the typeahead matching logic. It takes in a list of items,
1049
+ * the search and the current item, and returns the next item (or `undefined`).
1050
+ *
1051
+ * We normalize the search because if a user has repeatedly pressed a character,
1052
+ * we want the exact same behavior as if we only had that one character
1053
+ * (ie. cycle through items starting with that character)
1054
+ *
1055
+ * We also reorder the items by wrapping the array around the current item.
1056
+ * This is so we always look forward from the current item, and picking the first
1057
+ * item will always be the correct one.
1058
+ *
1059
+ * Finally, if the normalized search is exactly one character, we exclude the
1060
+ * current item from the values because otherwise it would be the first to match always
1061
+ * and focus would never move. This is as opposed to the regular case, where we
1062
+ * don't want focus to move if the current item still matches.
1063
+ */ function $cc7e05a45900e73f$var$findNextItem(items, search, currentItem) {
1064
+ const isRepeated = search.length > 1 && Array.from(search).every((char)=>char === search[0]
1065
+ );
1066
+ const normalizedSearch = isRepeated ? search[0] : search;
1067
+ const currentItemIndex = currentItem ? items.indexOf(currentItem) : -1;
1068
+ let wrappedItems = $cc7e05a45900e73f$var$wrapArray(items, Math.max(currentItemIndex, 0));
1069
+ const excludeCurrentItem = normalizedSearch.length === 1;
1070
+ if (excludeCurrentItem) wrappedItems = wrappedItems.filter((v)=>v !== currentItem
1071
+ );
1072
+ const nextItem = wrappedItems.find((item)=>item.textValue.toLowerCase().startsWith(normalizedSearch.toLowerCase())
1073
+ );
1074
+ return nextItem !== currentItem ? nextItem : undefined;
1075
+ }
1076
+ /**
1077
+ * Wraps an array around itself at a given start index
1078
+ * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`
1079
+ */ function $cc7e05a45900e73f$var$wrapArray(array, startIndex) {
1080
+ return array.map((_, index)=>array[(startIndex + index) % array.length]
1081
+ );
1082
+ }
1083
+ const $cc7e05a45900e73f$export$be92b6f5f03c0fe9 = $cc7e05a45900e73f$export$ef9b1a59e592288f;
1084
+ const $cc7e05a45900e73f$export$41fb9f06171c75f4 = $cc7e05a45900e73f$export$3ac1e88a1c0b9f1;
1085
+ const $cc7e05a45900e73f$export$4c8d1a57a761ef94 = $cc7e05a45900e73f$export$e288731fd71264f0;
1086
+ const $cc7e05a45900e73f$export$f04a61298a47a40f = $cc7e05a45900e73f$export$99b400cabb58c515;
1087
+ const $cc7e05a45900e73f$export$7c6e2c02157bb7d2 = $cc7e05a45900e73f$export$c973a4b3cb86a03d;
1088
+ const $cc7e05a45900e73f$export$d5c6c08dc2d3ca7 = $cc7e05a45900e73f$export$9ed6e7b40248d36d;
1089
+ const $cc7e05a45900e73f$export$eb2fcfdbd7ba97d4 = $cc7e05a45900e73f$export$ee25a334c55de1f4;
1090
+ const $cc7e05a45900e73f$export$b04be29aa201d4f5 = $cc7e05a45900e73f$export$f67338d29bd972f8;
1091
+ const $cc7e05a45900e73f$export$6d08773d2e66f8f2 = $cc7e05a45900e73f$export$13ef48a934230896;
1092
+ const $cc7e05a45900e73f$export$d6e5bf9c43ea9319 = $cc7e05a45900e73f$export$3572fb0fb821ff49;
1093
+ const $cc7e05a45900e73f$export$c3468e2714d175fa = $cc7e05a45900e73f$export$6b9198de19accfe6;
1094
+ const $cc7e05a45900e73f$export$2f60d3ec9ad468f2 = $cc7e05a45900e73f$export$d8117927658af6d7;
1095
+ const $cc7e05a45900e73f$export$bf1aedc3039c8d63 = $cc7e05a45900e73f$export$ff951e476c12189;
1096
+ const $cc7e05a45900e73f$export$1ff3c3f08ae963c0 = $cc7e05a45900e73f$export$eba4b1df07cb1d3;
1097
+
1098
+
1099
+
1100
+
1101
+ export {$cc7e05a45900e73f$export$286727a75dc039bd as createSelectScope, $cc7e05a45900e73f$export$ef9b1a59e592288f as Select, $cc7e05a45900e73f$export$3ac1e88a1c0b9f1 as SelectTrigger, $cc7e05a45900e73f$export$e288731fd71264f0 as SelectValue, $cc7e05a45900e73f$export$99b400cabb58c515 as SelectIcon, $cc7e05a45900e73f$export$c973a4b3cb86a03d as SelectContent, $cc7e05a45900e73f$export$9ed6e7b40248d36d as SelectViewport, $cc7e05a45900e73f$export$ee25a334c55de1f4 as SelectGroup, $cc7e05a45900e73f$export$f67338d29bd972f8 as SelectLabel, $cc7e05a45900e73f$export$13ef48a934230896 as SelectItem, $cc7e05a45900e73f$export$3572fb0fb821ff49 as SelectItemText, $cc7e05a45900e73f$export$6b9198de19accfe6 as SelectItemIndicator, $cc7e05a45900e73f$export$d8117927658af6d7 as SelectScrollUpButton, $cc7e05a45900e73f$export$ff951e476c12189 as SelectScrollDownButton, $cc7e05a45900e73f$export$eba4b1df07cb1d3 as SelectSeparator, $cc7e05a45900e73f$export$be92b6f5f03c0fe9 as Root, $cc7e05a45900e73f$export$41fb9f06171c75f4 as Trigger, $cc7e05a45900e73f$export$4c8d1a57a761ef94 as Value, $cc7e05a45900e73f$export$f04a61298a47a40f as Icon, $cc7e05a45900e73f$export$7c6e2c02157bb7d2 as Content, $cc7e05a45900e73f$export$d5c6c08dc2d3ca7 as Viewport, $cc7e05a45900e73f$export$eb2fcfdbd7ba97d4 as Group, $cc7e05a45900e73f$export$b04be29aa201d4f5 as Label, $cc7e05a45900e73f$export$6d08773d2e66f8f2 as Item, $cc7e05a45900e73f$export$d6e5bf9c43ea9319 as ItemText, $cc7e05a45900e73f$export$c3468e2714d175fa as ItemIndicator, $cc7e05a45900e73f$export$2f60d3ec9ad468f2 as ScrollUpButton, $cc7e05a45900e73f$export$bf1aedc3039c8d63 as ScrollDownButton, $cc7e05a45900e73f$export$1ff3c3f08ae963c0 as Separator};
4
1102
  //# sourceMappingURL=index.module.js.map