@radix-ui/react-select 0.1.2-rc.10 → 0.1.2-rc.13

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