@radix-ui/react-select 0.1.2-rc.2 → 0.1.2-rc.20

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,1087 @@
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-primitive").Primitive,s=require("@radix-ui/react-portal").Portal,u=require("@radix-ui/react-label").useLabelContext,d=require("@radix-ui/react-id").useId,p=require("@radix-ui/react-focus-scope").FocusScope,f=require("@radix-ui/react-dismissable-layer").DismissableLayer,m=require("@radix-ui/react-context").createContextScope,v=require("@radix-ui/react-compose-refs").useComposedRefs,h=require("@radix-ui/react-collection").createCollection,g=require("@radix-ui/primitive").composeEventHandlers,x=require("@radix-ui/number").clamp,S=y({},require("react-dom")),w=y({},require("react")),b=(e=require("@babel/runtime/helpers/extends"))&&e.__esModule?e.default:e;function y(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 E=[" ","Enter","ArrowUp","ArrowDown"],C=[" ","Enter"],[I,T,_]=h("Select"),[R,P]=m("Select",[_]);exports.createSelectScope=P;const[D,L]=R("Select"),k=e=>{const{__scopeSelect:t,children:r,open:n,defaultOpen:o,onOpenChange:l,value:a,defaultValue:i,onValueChange:s,dir:u,name:p,autoComplete:f}=e,[m,v]=w.useState(null),[h,g]=w.useState(null),[x,S]=w.useState(!1),[b=!1,y]=c({prop:n,defaultProp:o,onChange:l}),[E="",C]=c({prop:a,defaultProp:i,onChange:s}),T=!m||Boolean(m.closest("form")),[_,R]=w.useState(null),P=w.useRef(null);/*#__PURE__*/return w.createElement(D,{scope:t,trigger:m,onTriggerChange:v,valueNode:h,onValueNodeChange:g,valueNodeHasChildren:x,onValueNodeHasChildrenChange:S,contentId:d(),value:E,onValueChange:C,open:b,onOpenChange:y,dir:u,bubbleSelect:_,triggerPointerDownPosRef:P},/*#__PURE__*/w.createElement(I.Provider,{scope:t},r),T?/*#__PURE__*/w.createElement(ee,{ref:R,"aria-hidden":!0,tabIndex:-1,name:p,autoComplete:f,value:E,onChange:e=>C(e.target.value)}):null)};exports.Select=k;const H=/*#__PURE__*/w.forwardRef(((e,t)=>{const{__scopeSelect:r,disabled:n=!1,"aria-labelledby":o,...l}=e,c=L("SelectTrigger",r),a=v(t,c.onTriggerChange),s=T(r),d=u(c.trigger),p=o||d,[f,m,h]=te((e=>{const t=s().filter((e=>!e.disabled)),r=t.find((e=>e.value===c.value)),n=re(t,e,r);void 0!==n&&c.onValueChange(n.value)})),x=()=>{n||(c.onOpenChange(!0),h())};/*#__PURE__*/return w.createElement(i.button,b({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:g(l.onPointerDown,(e=>{e.target.releasePointerCapture(e.pointerId),0===e.button&&!1===e.ctrlKey&&(x(),c.triggerPointerDownPosRef.current={x:Math.round(e.pageX),y:Math.round(e.pageY)},e.preventDefault())})),onKeyDown:g(l.onKeyDown,(e=>{const t=""!==f.current;e.ctrlKey||e.altKey||e.metaKey||1!==e.key.length||m(e.key),t&&" "===e.key||E.includes(e.key)&&(x(),e.preventDefault())}))}))}));exports.SelectTrigger=H;const M=/*#__PURE__*/w.forwardRef(((e,t)=>{const{__scopeSelect:r,className:n,style:o,...l}=e,c=L("SelectValue",r),{onValueNodeHasChildrenChange:a}=c,s=void 0!==e.children,u=v(t,c.onValueNodeChange);return w.useEffect((()=>{a(s)}),[a,s]),/*#__PURE__*/w.createElement(i.span,b({},l,{ref:u,style:{pointerEvents:"none"}}))}));exports.SelectValue=M;const V=/*#__PURE__*/w.forwardRef(((e,t)=>{const{__scopeSelect:r,children:n,...o}=e;/*#__PURE__*/return w.createElement(i.span,b({"aria-hidden":!0},o,{ref:t}),n||"▼")}));exports.SelectIcon=V;const q=/*#__PURE__*/w.forwardRef(((e,t)=>{const r=L("SelectContent",e.__scopeSelect),[n,o]=w.useState();return l((()=>{o(new DocumentFragment)}),[]),r.open?/*#__PURE__*/w.createElement(A,b({},e,{ref:t})):n?/*#__PURE__*/S.createPortal(/*#__PURE__*/
2
- w.createElement(B,{scope:e.__scopeSelect},/*#__PURE__*/w.createElement(I.Slot,{scope:e.__scopeSelect},/*#__PURE__*/w.createElement("div",null,e.children))),n):null}));exports.SelectContent=q;const[B,O]=R("SelectContent"),A=/*#__PURE__*/w.forwardRef(((e,n)=>{const{__scopeSelect:o,onCloseAutoFocus:c,...a}=e,i=L("SelectContent",o),[u,d]=w.useState(null),[m,h]=w.useState(null),[S,y]=w.useState(null),E=v(n,(e=>h(e))),[C,I]=w.useState(null),[_,R]=w.useState(null),P=T(o),[D,k]=w.useState(!1),H=w.useRef(!0),M=w.useRef(!1);w.useEffect((()=>{if(m)return r(m)}),[m]);const V=w.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&&S&&(S.scrollTop=0),r===n&&S&&(S.scrollTop=S.scrollHeight),null==r||r.focus(),document.activeElement!==o)return}}),[P,S]),q=w.useCallback((()=>{if(i.trigger&&i.valueNode&&u&&m&&S&&C&&_){const e=i.trigger.getBoundingClientRect(),t=m.getBoundingClientRect(),r=i.valueNode.getBoundingClientRect(),n=_.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),s=window.innerWidth-10,d=x(l,[10,s-i]);u.style.minWidth=a+"px",u.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),s=window.innerWidth-10,d=x(l,[10,s-i]);u.style.minWidth=a+"px",u.style.right=d+"px"}const o=window.innerHeight-20,l=5*C.offsetHeight,c=S.scrollHeight,a=window.getComputedStyle(m),s=parseInt(a.borderTopWidth,10),d=parseInt(a.paddingTop,10),p=parseInt(a.borderBottomWidth,10),f=s+d+c+parseInt(a.paddingBottom,10)+p,v=e.top+e.height/2-10,h=o-v,g=C.offsetHeight/2,w=s+d+(C.offsetTop+g),b=f-w;if(w<=v){u.style.bottom="0px";const e=m.clientHeight-S.offsetTop-S.offsetHeight,t=w+Math.max(h,g+e+p);u.style.height=t+"px"}else{u.style.top="0px";const e=Math.max(v,s+S.offsetTop+g)+b;u.style.height=e+"px",S.scrollTop=w-v+S.offsetTop}u.style.margin="10px 0",u.style.minHeight=l+"px",u.style.maxHeight=o+"px",k(!0),requestAnimationFrame((()=>M.current=!0))}}),[i.trigger,i.valueNode,u,m,S,C,_,i.dir]);l((()=>q()),[q]);const O=w.useCallback((()=>V([C,m])),[V,C,m]);w.useEffect((()=>{D&&O()}),[D,O]);const A=w.useCallback((e=>{e&&!0===H.current&&(q(),O(),H.current=!1)}),[q,O]),{onOpenChange:N,triggerPointerDownPosRef:F}=i;w.useEffect((()=>{if(m){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():m.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})}}}),[m,N,F]),w.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]=te((e=>{const t=P().filter((e=>!e.disabled)),r=t.find((e=>e.ref.current===document.activeElement)),n=re(t,e,r);n&&setTimeout((()=>n.ref.current.focus()))})),U=w.useCallback((()=>null==m?void 0:m.focus()),[m]);/*#__PURE__*/return w.createElement(B,{scope:o,contentWrapper:u,content:m,viewport:S,onViewportChange:y,selectedItem:C,onSelectedItemChange:I,selectedItemText:_,onSelectedItemTextChange:R,onScrollButtonChange:A,onItemLeave:U,isPositioned:D,shouldExpandOnScrollRef:M,searchRef:K},/*#__PURE__*/w.createElement(s,null,/*#__PURE__*/w.createElement(t,null,/*#__PURE__*/w.createElement("div",{ref:d,style:{display:"flex",flexDirection:"column",position:"fixed",zIndex:0}},/*#__PURE__*/w.createElement(p,{asChild:!0,trapped:i.open,onMountAutoFocus:e=>{e.preventDefault()},onUnmountAutoFocus:g(c,(e=>{var t;null===(t=i.trigger)||void 0===t||t.focus({preventScroll:!0}),e.preventDefault()}))},/*#__PURE__*/w.createElement(f,b({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:g(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()}}))})))))))})),N=/*#__PURE__*/w.forwardRef(((e,t)=>{const{__scopeSelect:r,...n}=e,o=O("SelectViewport",r),l=v(t,o.onViewportChange),c=w.useRef(0);/*#__PURE__*/return w.createElement(w.Fragment,null,/*#__PURE__*/w.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__*/w.createElement(I.Slot,{scope:r},/*#__PURE__*/w.createElement(i.div,b({"data-radix-select-viewport":"",role:"presentation"},n,{ref:l,style:{position:"relative",flex:1,overflow:"auto",...n.style},onScroll:g(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=N;const[F,K]=R("SelectGroup"),W=/*#__PURE__*/w.forwardRef(((e,t)=>{const{__scopeSelect:r,...n}=e,o=d();/*#__PURE__*/return w.createElement(F,{scope:r,id:o},/*#__PURE__*/w.createElement(i.div,b({role:"group","aria-labelledby":o},n,{ref:t})))}));exports.SelectGroup=W;const U=/*#__PURE__*/w.forwardRef(((e,t)=>{const{__scopeSelect:r,...n}=e,o=K("SelectLabel",r);/*#__PURE__*/return w.createElement(i.div,b({id:o.id},n,{ref:t}))}));exports.SelectLabel=U;const[j,z]=R("SelectItem"),G=/*#__PURE__*/w.forwardRef(((e,t)=>{const{__scopeSelect:r,value:n,disabled:o=!1,textValue:l,...c}=e,a=L("SelectItem",r),s=O("SelectItem",r),u=a.value===n,[p,f]=w.useState(null!=l?l:""),[m,h]=w.useState(!1),x=v(t,u?s.onSelectedItemChange:void 0),S=d(),y=()=>{o||(a.onValueChange(n),a.onOpenChange(!1))};/*#__PURE__*/return w.createElement(j,{scope:r,value:n,textId:S,isSelected:u,onItemTextChange:w.useCallback((e=>{f((t=>{var r;return t||(null!==(r=null==e?void 0:e.textContent)&&void 0!==r?r:"").trim()}))}),[])},/*#__PURE__*/w.createElement(I.ItemSlot,{scope:r,value:n,disabled:o,textValue:p},/*#__PURE__*/w.createElement(i.div,b({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:x,onFocus:g(c.onFocus,(()=>h(!0))),onBlur:g(c.onBlur,(()=>h(!1))),onPointerUp:g(c.onPointerUp,y),onPointerMove:g(c.onPointerMove,(e=>{o?s.onItemLeave():e.currentTarget.focus({preventScroll:!0})})),onPointerLeave:g(c.onPointerLeave,(e=>{e.currentTarget===document.activeElement&&s.onItemLeave()})),onKeyDown:g(c.onKeyDown,(e=>{""!==s.searchRef.current&&" "===e.key||(C.includes(e.key)&&y()," "===e.key&&e.preventDefault())}))}))))}));exports.SelectItem=G;const X=/*#__PURE__*/w.forwardRef(((e,t)=>{var r;const{__scopeSelect:n,className:o,style:l,...c}=e,a=L("SelectItemText",n),s=O("SelectItemText",n),u=z("SelectItemText",n),d=w.useRef(null),p=v(t,d,u.onItemTextChange,u.isSelected?s.onSelectedItemTextChange:void 0);/*#__PURE__*/return w.createElement(w.Fragment,null,/*#__PURE__*/w.createElement(i.span,b({id:u.textId},c,{ref:p})),u.isSelected&&a.valueNode&&!a.valueNodeHasChildren?/*#__PURE__*/S.createPortal(c.children,a.valueNode):null,a.bubbleSelect?/*#__PURE__*/S.createPortal(/*#__PURE__*/
3
- w.createElement("option",{value:u.value},null===(r=d.current)||void 0===r?void 0:r.textContent),a.bubbleSelect):null)}));exports.SelectItemText=X;const Y=/*#__PURE__*/w.forwardRef(((e,t)=>{const{__scopeSelect:r,...n}=e;return z("SelectItemIndicator",r).isSelected?/*#__PURE__*/w.createElement(i.span,b({"aria-hidden":!0},n,{ref:t})):null}));exports.SelectItemIndicator=Y;const J=/*#__PURE__*/w.forwardRef(((e,t)=>{const r=O("SelectScrollUpButton",e.__scopeSelect),[n,o]=w.useState(!1),l=v(t,r.onScrollButtonChange);return w.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__*/w.createElement(Z,b({},e,{ref:l,onAutoScroll:()=>{const{viewport:e,selectedItem:t}=r;e&&t&&(e.scrollTop=e.scrollTop-t.offsetHeight)}})):null}));exports.SelectScrollUpButton=J;const Q=/*#__PURE__*/w.forwardRef(((e,t)=>{const r=O("SelectScrollDownButton",e.__scopeSelect),[n,o]=w.useState(!1),l=v(t,r.onScrollButtonChange);return w.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__*/w.createElement(Z,b({},e,{ref:l,onAutoScroll:()=>{const{viewport:e,selectedItem:t}=r;e&&t&&(e.scrollTop=e.scrollTop+t.offsetHeight)}})):null}));exports.SelectScrollDownButton=Q;const Z=/*#__PURE__*/w.forwardRef(((e,t)=>{const{__scopeSelect:r,onAutoScroll:n,...o}=e,c=O("SelectScrollButton",r),a=w.useRef(null),s=T(r),u=w.useCallback((()=>{null!==a.current&&(window.clearInterval(a.current),a.current=null)}),[]);return w.useEffect((()=>()=>u()),[u]),l((()=>{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__*/w.createElement(i.div,b({"aria-hidden":!0},o,{ref:t,style:{flexShrink:0,...o.style},onPointerMove:g(o.onPointerMove,(()=>{c.onItemLeave(),null===a.current&&(a.current=window.setInterval(n,50))})),onPointerLeave:g(o.onPointerLeave,(()=>{u()}))}))})),$=/*#__PURE__*/w.forwardRef(((e,t)=>{const{__scopeSelect:r,...n}=e;/*#__PURE__*/return w.createElement(i.div,b({"aria-hidden":!0},n,{ref:t}))}));exports.SelectSeparator=$;const ee=/*#__PURE__*/w.forwardRef(((e,t)=>{const{value:r,...l}=e,c=w.useRef(null),a=v(t,c),i=o(r);return w.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__*/w.createElement(n,{asChild:!0},/*#__PURE__*/w.createElement("select",b({},l,{ref:a,defaultValue:r})))}));function te(e){const t=a(e),r=w.useRef(""),n=w.useRef(0),o=w.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=w.useCallback((()=>{r.current="",window.clearTimeout(n.current)}),[]);return w.useEffect((()=>()=>window.clearTimeout(n.current)),[]),[r,o,l]}function re(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 ne=k;exports.Root=ne;const oe=H;exports.Trigger=oe;const le=M;exports.Value=le;const ce=V;exports.Icon=ce;const ae=q;exports.Content=ae;const ie=N;exports.Viewport=ie;const se=W;exports.Group=se;const ue=U;exports.Label=ue;const de=G;exports.Item=de;const pe=X;exports.ItemText=pe;const fe=Y;exports.ItemIndicator=fe;const me=J;exports.ScrollUpButton=me;const ve=Q;exports.ScrollDownButton=ve;const he=$;exports.Separator=he;
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 items = getItems();
371
+ const availableHeight = window.innerHeight - $1345bda09ffc1bc6$var$CONTENT_MARGIN * 2;
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 minContentHeight = Math.min(selectedItem.offsetHeight * 5, fullContentHeight);
380
+ const viewportStyles = window.getComputedStyle(viewport);
381
+ const viewportPaddingTop = parseInt(viewportStyles.paddingTop, 10);
382
+ const viewportPaddingBottom = parseInt(viewportStyles.paddingBottom, 10);
383
+ const topEdgeToTriggerMiddle = triggerRect.top + triggerRect.height / 2 - $1345bda09ffc1bc6$var$CONTENT_MARGIN;
384
+ const triggerMiddleToBottomEdge = availableHeight - topEdgeToTriggerMiddle;
385
+ const selectedItemHalfHeight = selectedItem.offsetHeight / 2;
386
+ const itemOffsetMiddle = selectedItem.offsetTop + selectedItemHalfHeight;
387
+ const contentTopToItemMiddle = contentBorderTopWidth + contentPaddingTop + itemOffsetMiddle;
388
+ const itemMiddleToContentBottom = fullContentHeight - contentTopToItemMiddle;
389
+ const willAlignWithoutTopOverflow = contentTopToItemMiddle <= topEdgeToTriggerMiddle;
390
+ if (willAlignWithoutTopOverflow) {
391
+ const isLastItem = selectedItem === items[items.length - 1].ref.current;
392
+ contentWrapper.style.bottom = "0px";
393
+ const viewportOffsetBottom = content.clientHeight - viewport.offsetTop - viewport.offsetHeight;
394
+ const clampedTriggerMiddleToBottomEdge = Math.max(triggerMiddleToBottomEdge, selectedItemHalfHeight + (isLastItem ? viewportPaddingBottom : 0) + viewportOffsetBottom + contentBorderBottomWidth);
395
+ const height = contentTopToItemMiddle + clampedTriggerMiddleToBottomEdge;
396
+ contentWrapper.style.height = height + 'px';
397
+ } else {
398
+ const isFirstItem = selectedItem === items[0].ref.current;
399
+ contentWrapper.style.top = "0px";
400
+ const clampedTopEdgeToTriggerMiddle = Math.max(topEdgeToTriggerMiddle, contentBorderTopWidth + viewport.offsetTop + (isFirstItem ? viewportPaddingTop : 0) + selectedItemHalfHeight);
401
+ const height = clampedTopEdgeToTriggerMiddle + itemMiddleToContentBottom;
402
+ contentWrapper.style.height = height + 'px';
403
+ viewport.scrollTop = contentTopToItemMiddle - topEdgeToTriggerMiddle + viewport.offsetTop;
404
+ }
405
+ contentWrapper.style.margin = `${$1345bda09ffc1bc6$var$CONTENT_MARGIN}px 0`;
406
+ contentWrapper.style.minHeight = minContentHeight + 'px';
407
+ contentWrapper.style.maxHeight = availableHeight + 'px'; // -----------------------------------------------------------------------------------------
408
+ setIsPositioned(true); // we don't want the initial scroll position adjustment to trigger "expand on scroll"
409
+ // so we explicitly turn it on only after they've registered.
410
+ requestAnimationFrame(()=>shouldExpandOnScrollRef.current = true
411
+ );
412
+ }
413
+ }, [
414
+ getItems,
415
+ context.trigger,
416
+ context.valueNode,
417
+ contentWrapper,
418
+ content,
419
+ viewport,
420
+ selectedItem,
421
+ selectedItemText,
422
+ context.dir
423
+ ]);
424
+ $cg2C9$radixuireactuselayouteffect.useLayoutEffect(()=>position()
425
+ , [
426
+ position
427
+ ]);
428
+ const focusSelectedItem = $cg2C9$react.useCallback(()=>focusFirst([
429
+ selectedItem,
430
+ content
431
+ ])
432
+ , [
433
+ focusFirst,
434
+ selectedItem,
435
+ content
436
+ ]); // Since this is not dependent on layout, we want to ensure this runs at the same time as
437
+ // other effects across components. Hence why we don't call `focusSelectedItem` inside `position`.
438
+ $cg2C9$react.useEffect(()=>{
439
+ if (isPositioned) focusSelectedItem();
440
+ }, [
441
+ isPositioned,
442
+ focusSelectedItem
443
+ ]); // When the viewport becomes scrollable at the top, the scroll up button will mount.
444
+ // Because it is part of the normal flow, it will push down the viewport, thus throwing our
445
+ // trigger => selectedItem alignment off by the amount the viewport was pushed down.
446
+ // We wait for this to happen and then re-run the positining logic one more time to account for it.
447
+ const handleScrollButtonChange = $cg2C9$react.useCallback((node)=>{
448
+ if (node && shouldRepositionRef.current === true) {
449
+ position();
450
+ focusSelectedItem();
451
+ shouldRepositionRef.current = false;
452
+ }
453
+ }, [
454
+ position,
455
+ focusSelectedItem
456
+ ]); // prevent selecting items on `pointerup` in some cases after opening from `pointerdown`
457
+ // and close on `pointerup` outside.
458
+ const { onOpenChange: onOpenChange , triggerPointerDownPosRef: triggerPointerDownPosRef } = context;
459
+ $cg2C9$react.useEffect(()=>{
460
+ if (content) {
461
+ let pointerMoveDelta = {
462
+ x: 0,
463
+ y: 0
464
+ };
465
+ const handlePointerMove = (event)=>{
466
+ var _triggerPointerDownPo, _triggerPointerDownPo2, _triggerPointerDownPo3, _triggerPointerDownPo4;
467
+ pointerMoveDelta = {
468
+ 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)),
469
+ 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))
470
+ };
471
+ };
472
+ const handlePointerUp = (event)=>{
473
+ // If the pointer hasn't moved by a certain threshold then we prevent selecting item on `pointerup`.
474
+ if (pointerMoveDelta.x <= 10 && pointerMoveDelta.y <= 10) event.preventDefault();
475
+ else // otherwise, if the event was outside the content, close.
476
+ if (!content.contains(event.target)) onOpenChange(false);
477
+ document.removeEventListener('pointermove', handlePointerMove);
478
+ triggerPointerDownPosRef.current = null;
479
+ };
480
+ if (triggerPointerDownPosRef.current !== null) {
481
+ document.addEventListener('pointermove', handlePointerMove);
482
+ document.addEventListener('pointerup', handlePointerUp, {
483
+ capture: true,
484
+ once: true
485
+ });
486
+ }
487
+ return ()=>{
488
+ document.removeEventListener('pointermove', handlePointerMove);
489
+ document.removeEventListener('pointerup', handlePointerUp, {
490
+ capture: true
491
+ });
492
+ };
493
+ }
494
+ }, [
495
+ content,
496
+ onOpenChange,
497
+ triggerPointerDownPosRef
498
+ ]);
499
+ $cg2C9$react.useEffect(()=>{
500
+ const close = ()=>onOpenChange(false)
501
+ ;
502
+ window.addEventListener('blur', close);
503
+ window.addEventListener('resize', close);
504
+ return ()=>{
505
+ window.removeEventListener('blur', close);
506
+ window.removeEventListener('resize', close);
507
+ };
508
+ }, [
509
+ onOpenChange
510
+ ]);
511
+ const [searchRef, handleTypeaheadSearch] = $1345bda09ffc1bc6$var$useTypeaheadSearch((search)=>{
512
+ const enabledItems = getItems().filter((item)=>!item.disabled
513
+ );
514
+ const currentItem = enabledItems.find((item)=>item.ref.current === document.activeElement
515
+ );
516
+ const nextItem = $1345bda09ffc1bc6$var$findNextItem(enabledItems, search, currentItem);
517
+ if (nextItem) /**
518
+ * Imperative focus during keydown is risky so we prevent React's batching updates
519
+ * to avoid potential bugs. See: https://github.com/facebook/react/issues/20332
520
+ */ setTimeout(()=>nextItem.ref.current.focus()
521
+ );
522
+ });
523
+ const handleItemLeave = $cg2C9$react.useCallback(()=>content === null || content === void 0 ? void 0 : content.focus()
524
+ , [
525
+ content
526
+ ]);
527
+ return /*#__PURE__*/ $cg2C9$react.createElement($1345bda09ffc1bc6$var$SelectContentContextProvider, {
528
+ scope: __scopeSelect,
529
+ contentWrapper: contentWrapper,
530
+ content: content,
531
+ viewport: viewport,
532
+ onViewportChange: setViewport,
533
+ selectedItem: selectedItem,
534
+ onSelectedItemChange: setSelectedItem,
535
+ selectedItemText: selectedItemText,
536
+ onSelectedItemTextChange: setSelectedItemText,
537
+ onScrollButtonChange: handleScrollButtonChange,
538
+ onItemLeave: handleItemLeave,
539
+ isPositioned: isPositioned,
540
+ shouldExpandOnScrollRef: shouldExpandOnScrollRef,
541
+ searchRef: searchRef
542
+ }, /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$radixuireactportal.Portal, null, /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$reactremovescroll.RemoveScroll, null, /*#__PURE__*/ $cg2C9$react.createElement("div", {
543
+ ref: setContentWrapper,
544
+ style: {
545
+ display: 'flex',
546
+ flexDirection: 'column',
547
+ position: 'fixed',
548
+ zIndex: 0
549
+ }
550
+ }, /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$radixuireactfocusscope.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: $cg2C9$radixuiprimitive.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__*/ $cg2C9$react.createElement($cg2C9$radixuireactdismissablelayer.DismissableLayer, ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({
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: $cg2C9$radixuiprimitive.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($1345bda09ffc1bc6$var$SelectContentImpl, {
626
+ displayName: $1345bda09ffc1bc6$var$CONTENT_NAME
627
+ });
628
+ /* -------------------------------------------------------------------------------------------------
629
+ * SelectViewport
630
+ * -----------------------------------------------------------------------------------------------*/ const $1345bda09ffc1bc6$var$VIEWPORT_NAME = 'SelectViewport';
631
+ const $1345bda09ffc1bc6$export$9ed6e7b40248d36d = /*#__PURE__*/ $cg2C9$react.forwardRef((props, forwardedRef)=>{
632
+ const { __scopeSelect: __scopeSelect , ...viewportProps } = props;
633
+ const contentContext = $1345bda09ffc1bc6$var$useSelectContentContext($1345bda09ffc1bc6$var$VIEWPORT_NAME, __scopeSelect);
634
+ const composedRefs = $cg2C9$radixuireactcomposerefs.useComposedRefs(forwardedRef, contentContext.onViewportChange);
635
+ const prevScrollTopRef = $cg2C9$react.useRef(0);
636
+ return /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$react.Fragment, null, /*#__PURE__*/ $cg2C9$react.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__*/ $cg2C9$react.createElement($1345bda09ffc1bc6$var$Collection.Slot, {
641
+ scope: __scopeSelect
642
+ }, /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$radixuireactprimitive.Primitive.div, ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({
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: $cg2C9$radixuiprimitive.composeEventHandlers(viewportProps.onScroll, (event)=>{
657
+ const viewport = event.currentTarget;
658
+ const { contentWrapper: contentWrapper , shouldExpandOnScrollRef: shouldExpandOnScrollRef } = contentContext;
659
+ if (shouldExpandOnScrollRef.current && contentWrapper) {
660
+ const scrolledBy = Math.abs(prevScrollTopRef.current - viewport.scrollTop);
661
+ if (scrolledBy > 0) {
662
+ const availableHeight = window.innerHeight - $1345bda09ffc1bc6$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($1345bda09ffc1bc6$export$9ed6e7b40248d36d, {
683
+ displayName: $1345bda09ffc1bc6$var$VIEWPORT_NAME
684
+ });
685
+ /* -------------------------------------------------------------------------------------------------
686
+ * SelectGroup
687
+ * -----------------------------------------------------------------------------------------------*/ const $1345bda09ffc1bc6$var$GROUP_NAME = 'SelectGroup';
688
+ const [$1345bda09ffc1bc6$var$SelectGroupContextProvider, $1345bda09ffc1bc6$var$useSelectGroupContext] = $1345bda09ffc1bc6$var$createSelectContext($1345bda09ffc1bc6$var$GROUP_NAME);
689
+ const $1345bda09ffc1bc6$export$ee25a334c55de1f4 = /*#__PURE__*/ $cg2C9$react.forwardRef((props, forwardedRef)=>{
690
+ const { __scopeSelect: __scopeSelect , ...groupProps } = props;
691
+ const groupId = $cg2C9$radixuireactid.useId();
692
+ return /*#__PURE__*/ $cg2C9$react.createElement($1345bda09ffc1bc6$var$SelectGroupContextProvider, {
693
+ scope: __scopeSelect,
694
+ id: groupId
695
+ }, /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$radixuireactprimitive.Primitive.div, ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({
696
+ role: "group",
697
+ "aria-labelledby": groupId
698
+ }, groupProps, {
699
+ ref: forwardedRef
700
+ })));
701
+ });
702
+ /*#__PURE__*/ Object.assign($1345bda09ffc1bc6$export$ee25a334c55de1f4, {
703
+ displayName: $1345bda09ffc1bc6$var$GROUP_NAME
704
+ });
705
+ /* -------------------------------------------------------------------------------------------------
706
+ * SelectLabel
707
+ * -----------------------------------------------------------------------------------------------*/ const $1345bda09ffc1bc6$var$LABEL_NAME = 'SelectLabel';
708
+ const $1345bda09ffc1bc6$export$f67338d29bd972f8 = /*#__PURE__*/ $cg2C9$react.forwardRef((props, forwardedRef)=>{
709
+ const { __scopeSelect: __scopeSelect , ...labelProps } = props;
710
+ const groupContext = $1345bda09ffc1bc6$var$useSelectGroupContext($1345bda09ffc1bc6$var$LABEL_NAME, __scopeSelect);
711
+ return /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$radixuireactprimitive.Primitive.div, ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({
712
+ id: groupContext.id
713
+ }, labelProps, {
714
+ ref: forwardedRef
715
+ }));
716
+ });
717
+ /*#__PURE__*/ Object.assign($1345bda09ffc1bc6$export$f67338d29bd972f8, {
718
+ displayName: $1345bda09ffc1bc6$var$LABEL_NAME
719
+ });
720
+ /* -------------------------------------------------------------------------------------------------
721
+ * SelectItem
722
+ * -----------------------------------------------------------------------------------------------*/ const $1345bda09ffc1bc6$var$ITEM_NAME = 'SelectItem';
723
+ const [$1345bda09ffc1bc6$var$SelectItemContextProvider, $1345bda09ffc1bc6$var$useSelectItemContext] = $1345bda09ffc1bc6$var$createSelectContext($1345bda09ffc1bc6$var$ITEM_NAME);
724
+ const $1345bda09ffc1bc6$export$13ef48a934230896 = /*#__PURE__*/ $cg2C9$react.forwardRef((props, forwardedRef)=>{
725
+ const { __scopeSelect: __scopeSelect , value: value , disabled: disabled = false , textValue: textValueProp , ...itemProps } = props;
726
+ const context = $1345bda09ffc1bc6$var$useSelectContext($1345bda09ffc1bc6$var$ITEM_NAME, __scopeSelect);
727
+ const contentContext = $1345bda09ffc1bc6$var$useSelectContentContext($1345bda09ffc1bc6$var$ITEM_NAME, __scopeSelect);
728
+ const isSelected = context.value === value;
729
+ const [textValue, setTextValue] = $cg2C9$react.useState(textValueProp !== null && textValueProp !== void 0 ? textValueProp : '');
730
+ const [isFocused, setIsFocused] = $cg2C9$react.useState(false);
731
+ const composedRefs = $cg2C9$radixuireactcomposerefs.useComposedRefs(forwardedRef, isSelected ? contentContext.onSelectedItemChange : undefined);
732
+ const textId = $cg2C9$radixuireactid.useId();
733
+ const handleSelect = ()=>{
734
+ if (!disabled) {
735
+ context.onValueChange(value);
736
+ context.onOpenChange(false);
737
+ }
738
+ };
739
+ return /*#__PURE__*/ $cg2C9$react.createElement($1345bda09ffc1bc6$var$SelectItemContextProvider, {
740
+ scope: __scopeSelect,
741
+ value: value,
742
+ textId: textId,
743
+ isSelected: isSelected,
744
+ onItemTextChange: $cg2C9$react.useCallback((node)=>{
745
+ setTextValue((prevTextValue)=>{
746
+ var _node$textContent;
747
+ return prevTextValue || ((_node$textContent = node === null || node === void 0 ? void 0 : node.textContent) !== null && _node$textContent !== void 0 ? _node$textContent : '').trim();
748
+ });
749
+ }, [])
750
+ }, /*#__PURE__*/ $cg2C9$react.createElement($1345bda09ffc1bc6$var$Collection.ItemSlot, {
751
+ scope: __scopeSelect,
752
+ value: value,
753
+ disabled: disabled,
754
+ textValue: textValue
755
+ }, /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$radixuireactprimitive.Primitive.div, ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({
756
+ role: "option",
757
+ "aria-labelledby": textId // `isFocused` caveat fixes stuttering in VoiceOver
758
+ ,
759
+ "aria-selected": isSelected && isFocused,
760
+ "data-state": isSelected ? 'active' : 'inactive',
761
+ "aria-disabled": disabled || undefined,
762
+ "data-disabled": disabled ? '' : undefined,
763
+ tabIndex: disabled ? undefined : -1
764
+ }, itemProps, {
765
+ ref: composedRefs,
766
+ onFocus: $cg2C9$radixuiprimitive.composeEventHandlers(itemProps.onFocus, ()=>setIsFocused(true)
767
+ ),
768
+ onBlur: $cg2C9$radixuiprimitive.composeEventHandlers(itemProps.onBlur, ()=>setIsFocused(false)
769
+ ),
770
+ onPointerUp: $cg2C9$radixuiprimitive.composeEventHandlers(itemProps.onPointerUp, handleSelect),
771
+ onPointerMove: $cg2C9$radixuiprimitive.composeEventHandlers(itemProps.onPointerMove, (event)=>{
772
+ if (disabled) contentContext.onItemLeave();
773
+ else // even though safari doesn't support this option, it's acceptable
774
+ // as it only means it might scroll a few pixels when using the pointer.
775
+ event.currentTarget.focus({
776
+ preventScroll: true
777
+ });
778
+ }),
779
+ onPointerLeave: $cg2C9$radixuiprimitive.composeEventHandlers(itemProps.onPointerLeave, (event)=>{
780
+ if (event.currentTarget === document.activeElement) contentContext.onItemLeave();
781
+ }),
782
+ onKeyDown: $cg2C9$radixuiprimitive.composeEventHandlers(itemProps.onKeyDown, (event)=>{
783
+ const isTypingAhead = contentContext.searchRef.current !== '';
784
+ if (isTypingAhead && event.key === ' ') return;
785
+ if ($1345bda09ffc1bc6$var$SELECTION_KEYS.includes(event.key)) handleSelect(); // prevent page scroll if using the space key to select an item
786
+ if (event.key === ' ') event.preventDefault();
787
+ })
788
+ }))));
789
+ });
790
+ /*#__PURE__*/ Object.assign($1345bda09ffc1bc6$export$13ef48a934230896, {
791
+ displayName: $1345bda09ffc1bc6$var$ITEM_NAME
792
+ });
793
+ /* -------------------------------------------------------------------------------------------------
794
+ * SelectItemText
795
+ * -----------------------------------------------------------------------------------------------*/ const $1345bda09ffc1bc6$var$ITEM_TEXT_NAME = 'SelectItemText';
796
+ const $1345bda09ffc1bc6$export$3572fb0fb821ff49 = /*#__PURE__*/ $cg2C9$react.forwardRef((props, forwardedRef)=>{
797
+ var _ref$current;
798
+ // We ignore `className` and `style` as this part shouldn't be styled.
799
+ const { __scopeSelect: __scopeSelect , className: className , style: style , ...itemTextProps } = props;
800
+ const context = $1345bda09ffc1bc6$var$useSelectContext($1345bda09ffc1bc6$var$ITEM_TEXT_NAME, __scopeSelect);
801
+ const contentContext = $1345bda09ffc1bc6$var$useSelectContentContext($1345bda09ffc1bc6$var$ITEM_TEXT_NAME, __scopeSelect);
802
+ const itemContext = $1345bda09ffc1bc6$var$useSelectItemContext($1345bda09ffc1bc6$var$ITEM_TEXT_NAME, __scopeSelect);
803
+ const ref = $cg2C9$react.useRef(null);
804
+ const composedRefs = $cg2C9$radixuireactcomposerefs.useComposedRefs(forwardedRef, ref, itemContext.onItemTextChange, itemContext.isSelected ? contentContext.onSelectedItemTextChange : undefined);
805
+ return /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$react.Fragment, null, /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$radixuireactprimitive.Primitive.span, ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({
806
+ id: itemContext.textId
807
+ }, itemTextProps, {
808
+ ref: composedRefs
809
+ })), 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`
810
+ $cg2C9$react.createElement("option", {
811
+ value: itemContext.value
812
+ }, (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.textContent), context.bubbleSelect) : null);
813
+ });
814
+ /*#__PURE__*/ Object.assign($1345bda09ffc1bc6$export$3572fb0fb821ff49, {
815
+ displayName: $1345bda09ffc1bc6$var$ITEM_TEXT_NAME
816
+ });
817
+ /* -------------------------------------------------------------------------------------------------
818
+ * SelectItemIndicator
819
+ * -----------------------------------------------------------------------------------------------*/ const $1345bda09ffc1bc6$var$ITEM_INDICATOR_NAME = 'SelectItemIndicator';
820
+ const $1345bda09ffc1bc6$export$6b9198de19accfe6 = /*#__PURE__*/ $cg2C9$react.forwardRef((props, forwardedRef)=>{
821
+ const { __scopeSelect: __scopeSelect , ...itemIndicatorProps } = props;
822
+ const itemContext = $1345bda09ffc1bc6$var$useSelectItemContext($1345bda09ffc1bc6$var$ITEM_INDICATOR_NAME, __scopeSelect);
823
+ return itemContext.isSelected ? /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$radixuireactprimitive.Primitive.span, ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({
824
+ "aria-hidden": true
825
+ }, itemIndicatorProps, {
826
+ ref: forwardedRef
827
+ })) : null;
828
+ });
829
+ /*#__PURE__*/ Object.assign($1345bda09ffc1bc6$export$6b9198de19accfe6, {
830
+ displayName: $1345bda09ffc1bc6$var$ITEM_INDICATOR_NAME
831
+ });
832
+ /* -------------------------------------------------------------------------------------------------
833
+ * SelectScrollUpButton
834
+ * -----------------------------------------------------------------------------------------------*/ const $1345bda09ffc1bc6$var$SCROLL_UP_BUTTON_NAME = 'SelectScrollUpButton';
835
+ const $1345bda09ffc1bc6$export$d8117927658af6d7 = /*#__PURE__*/ $cg2C9$react.forwardRef((props, forwardedRef)=>{
836
+ const contentContext = $1345bda09ffc1bc6$var$useSelectContentContext($1345bda09ffc1bc6$var$SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
837
+ const [canScrollUp1, setCanScrollUp] = $cg2C9$react.useState(false);
838
+ const composedRefs = $cg2C9$radixuireactcomposerefs.useComposedRefs(forwardedRef, contentContext.onScrollButtonChange);
839
+ $cg2C9$radixuireactuselayouteffect.useLayoutEffect(()=>{
840
+ if (contentContext.viewport && contentContext.isPositioned) {
841
+ const viewport = contentContext.viewport;
842
+ function handleScroll() {
843
+ const canScrollUp = viewport.scrollTop > 0;
844
+ setCanScrollUp(canScrollUp);
845
+ }
846
+ handleScroll();
847
+ viewport.addEventListener('scroll', handleScroll);
848
+ return ()=>viewport.removeEventListener('scroll', handleScroll)
849
+ ;
850
+ }
851
+ }, [
852
+ contentContext.viewport,
853
+ contentContext.isPositioned
854
+ ]);
855
+ return canScrollUp1 ? /*#__PURE__*/ $cg2C9$react.createElement($1345bda09ffc1bc6$var$SelectScrollButtonImpl, ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({}, props, {
856
+ ref: composedRefs,
857
+ onAutoScroll: ()=>{
858
+ const { viewport: viewport , selectedItem: selectedItem } = contentContext;
859
+ if (viewport && selectedItem) viewport.scrollTop = viewport.scrollTop - selectedItem.offsetHeight;
860
+ }
861
+ })) : null;
862
+ });
863
+ /*#__PURE__*/ Object.assign($1345bda09ffc1bc6$export$d8117927658af6d7, {
864
+ displayName: $1345bda09ffc1bc6$var$SCROLL_UP_BUTTON_NAME
865
+ });
866
+ /* -------------------------------------------------------------------------------------------------
867
+ * SelectScrollDownButton
868
+ * -----------------------------------------------------------------------------------------------*/ const $1345bda09ffc1bc6$var$SCROLL_DOWN_BUTTON_NAME = 'SelectScrollDownButton';
869
+ const $1345bda09ffc1bc6$export$ff951e476c12189 = /*#__PURE__*/ $cg2C9$react.forwardRef((props, forwardedRef)=>{
870
+ const contentContext = $1345bda09ffc1bc6$var$useSelectContentContext($1345bda09ffc1bc6$var$SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
871
+ const [canScrollDown1, setCanScrollDown] = $cg2C9$react.useState(false);
872
+ const composedRefs = $cg2C9$radixuireactcomposerefs.useComposedRefs(forwardedRef, contentContext.onScrollButtonChange);
873
+ $cg2C9$radixuireactuselayouteffect.useLayoutEffect(()=>{
874
+ if (contentContext.viewport && contentContext.isPositioned) {
875
+ const viewport = contentContext.viewport;
876
+ function handleScroll() {
877
+ const maxScroll = viewport.scrollHeight - viewport.clientHeight; // we use Math.ceil here because if the UI is zoomed-in
878
+ // `scrollTop` is not always reported as an integer
879
+ const canScrollDown = Math.ceil(viewport.scrollTop) < maxScroll;
880
+ setCanScrollDown(canScrollDown);
881
+ }
882
+ handleScroll();
883
+ viewport.addEventListener('scroll', handleScroll);
884
+ return ()=>viewport.removeEventListener('scroll', handleScroll)
885
+ ;
886
+ }
887
+ }, [
888
+ contentContext.viewport,
889
+ contentContext.isPositioned
890
+ ]);
891
+ return canScrollDown1 ? /*#__PURE__*/ $cg2C9$react.createElement($1345bda09ffc1bc6$var$SelectScrollButtonImpl, ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({}, props, {
892
+ ref: composedRefs,
893
+ onAutoScroll: ()=>{
894
+ const { viewport: viewport , selectedItem: selectedItem } = contentContext;
895
+ if (viewport && selectedItem) viewport.scrollTop = viewport.scrollTop + selectedItem.offsetHeight;
896
+ }
897
+ })) : null;
898
+ });
899
+ /*#__PURE__*/ Object.assign($1345bda09ffc1bc6$export$ff951e476c12189, {
900
+ displayName: $1345bda09ffc1bc6$var$SCROLL_DOWN_BUTTON_NAME
901
+ });
902
+ const $1345bda09ffc1bc6$var$SelectScrollButtonImpl = /*#__PURE__*/ $cg2C9$react.forwardRef((props, forwardedRef)=>{
903
+ const { __scopeSelect: __scopeSelect , onAutoScroll: onAutoScroll , ...scrollIndicatorProps } = props;
904
+ const contentContext = $1345bda09ffc1bc6$var$useSelectContentContext('SelectScrollButton', __scopeSelect);
905
+ const autoScrollTimerRef = $cg2C9$react.useRef(null);
906
+ const getItems = $1345bda09ffc1bc6$var$useCollection(__scopeSelect);
907
+ const clearAutoScrollTimer = $cg2C9$react.useCallback(()=>{
908
+ if (autoScrollTimerRef.current !== null) {
909
+ window.clearInterval(autoScrollTimerRef.current);
910
+ autoScrollTimerRef.current = null;
911
+ }
912
+ }, []);
913
+ $cg2C9$react.useEffect(()=>{
914
+ return ()=>clearAutoScrollTimer()
915
+ ;
916
+ }, [
917
+ clearAutoScrollTimer
918
+ ]); // When the viewport becomes scrollable on either side, the relevant scroll button will mount.
919
+ // Because it is part of the normal flow, it will push down (top button) or shrink (bottom button)
920
+ // the viewport, potentially causing the active item to now be partially out of view.
921
+ // We re-run the `scrollIntoView` logic to make sure it stays within the viewport.
922
+ $cg2C9$radixuireactuselayouteffect.useLayoutEffect(()=>{
923
+ var _activeItem$ref$curre;
924
+ const activeItem = getItems().find((item)=>item.ref.current === document.activeElement
925
+ );
926
+ activeItem === null || activeItem === void 0 || (_activeItem$ref$curre = activeItem.ref.current) === null || _activeItem$ref$curre === void 0 || _activeItem$ref$curre.scrollIntoView({
927
+ block: 'nearest'
928
+ });
929
+ }, [
930
+ getItems
931
+ ]);
932
+ return /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$radixuireactprimitive.Primitive.div, ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({
933
+ "aria-hidden": true
934
+ }, scrollIndicatorProps, {
935
+ ref: forwardedRef,
936
+ style: {
937
+ flexShrink: 0,
938
+ ...scrollIndicatorProps.style
939
+ },
940
+ onPointerMove: $cg2C9$radixuiprimitive.composeEventHandlers(scrollIndicatorProps.onPointerMove, ()=>{
941
+ contentContext.onItemLeave();
942
+ if (autoScrollTimerRef.current === null) autoScrollTimerRef.current = window.setInterval(onAutoScroll, 50);
943
+ }),
944
+ onPointerLeave: $cg2C9$radixuiprimitive.composeEventHandlers(scrollIndicatorProps.onPointerLeave, ()=>{
945
+ clearAutoScrollTimer();
946
+ })
947
+ }));
948
+ });
949
+ /* -------------------------------------------------------------------------------------------------
950
+ * SelectSeparator
951
+ * -----------------------------------------------------------------------------------------------*/ const $1345bda09ffc1bc6$var$SEPARATOR_NAME = 'SelectSeparator';
952
+ const $1345bda09ffc1bc6$export$eba4b1df07cb1d3 = /*#__PURE__*/ $cg2C9$react.forwardRef((props, forwardedRef)=>{
953
+ const { __scopeSelect: __scopeSelect , ...separatorProps } = props;
954
+ return /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$radixuireactprimitive.Primitive.div, ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({
955
+ "aria-hidden": true
956
+ }, separatorProps, {
957
+ ref: forwardedRef
958
+ }));
959
+ });
960
+ /*#__PURE__*/ Object.assign($1345bda09ffc1bc6$export$eba4b1df07cb1d3, {
961
+ displayName: $1345bda09ffc1bc6$var$SEPARATOR_NAME
962
+ });
963
+ /* -----------------------------------------------------------------------------------------------*/ const $1345bda09ffc1bc6$var$BubbleSelect = /*#__PURE__*/ $cg2C9$react.forwardRef((props, forwardedRef)=>{
964
+ const { value: value , ...selectProps } = props;
965
+ const ref = $cg2C9$react.useRef(null);
966
+ const composedRefs = $cg2C9$radixuireactcomposerefs.useComposedRefs(forwardedRef, ref);
967
+ const prevValue = $cg2C9$radixuireactuseprevious.usePrevious(value); // Bubble value change to parents (e.g form change event)
968
+ $cg2C9$react.useEffect(()=>{
969
+ const select = ref.current;
970
+ const selectProto = window.HTMLSelectElement.prototype;
971
+ const descriptor = Object.getOwnPropertyDescriptor(selectProto, 'value');
972
+ const setValue = descriptor.set;
973
+ if (prevValue !== value && setValue) {
974
+ const event = new Event('change', {
975
+ bubbles: true
976
+ });
977
+ setValue.call(select, value);
978
+ select.dispatchEvent(event);
979
+ }
980
+ }, [
981
+ prevValue,
982
+ value
983
+ ]);
984
+ /**
985
+ * We purposefully use a `select` here to support form autofill as much
986
+ * as possible.
987
+ *
988
+ * We purposefully do not add the `value` attribute here to allow the value
989
+ * to be set programatically and bubble to any parent form `onChange` event.
990
+ * Adding the `value` will cause React to consider the programatic
991
+ * dispatch a duplicate and it will get swallowed.
992
+ *
993
+ * We use `VisuallyHidden` rather than `display: "none"` because Safari autofill
994
+ * won't work otherwise.
995
+ */ return /*#__PURE__*/ $cg2C9$react.createElement($cg2C9$radixuireactvisuallyhidden.VisuallyHidden, {
996
+ asChild: true
997
+ }, /*#__PURE__*/ $cg2C9$react.createElement("select", ($parcel$interopDefault($cg2C9$babelruntimehelpersextends))({}, selectProps, {
998
+ ref: composedRefs,
999
+ defaultValue: value
1000
+ })));
1001
+ });
1002
+ function $1345bda09ffc1bc6$var$useTypeaheadSearch(onSearchChange) {
1003
+ const handleSearchChange = $cg2C9$radixuireactusecallbackref.useCallbackRef(onSearchChange);
1004
+ const searchRef = $cg2C9$react.useRef('');
1005
+ const timerRef = $cg2C9$react.useRef(0);
1006
+ const handleTypeaheadSearch = $cg2C9$react.useCallback((key)=>{
1007
+ const search = searchRef.current + key;
1008
+ handleSearchChange(search);
1009
+ (function updateSearch(value) {
1010
+ searchRef.current = value;
1011
+ window.clearTimeout(timerRef.current); // Reset `searchRef` 1 second after it was last updated
1012
+ if (value !== '') timerRef.current = window.setTimeout(()=>updateSearch('')
1013
+ , 1000);
1014
+ })(search);
1015
+ }, [
1016
+ handleSearchChange
1017
+ ]);
1018
+ const resetTypeahead = $cg2C9$react.useCallback(()=>{
1019
+ searchRef.current = '';
1020
+ window.clearTimeout(timerRef.current);
1021
+ }, []);
1022
+ $cg2C9$react.useEffect(()=>{
1023
+ return ()=>window.clearTimeout(timerRef.current)
1024
+ ;
1025
+ }, []);
1026
+ return [
1027
+ searchRef,
1028
+ handleTypeaheadSearch,
1029
+ resetTypeahead
1030
+ ];
1031
+ }
1032
+ /**
1033
+ * This is the "meat" of the typeahead matching logic. It takes in a list of items,
1034
+ * the search and the current item, and returns the next item (or `undefined`).
1035
+ *
1036
+ * We normalize the search because if a user has repeatedly pressed a character,
1037
+ * we want the exact same behavior as if we only had that one character
1038
+ * (ie. cycle through items starting with that character)
1039
+ *
1040
+ * We also reorder the items by wrapping the array around the current item.
1041
+ * This is so we always look forward from the current item, and picking the first
1042
+ * item will always be the correct one.
1043
+ *
1044
+ * Finally, if the normalized search is exactly one character, we exclude the
1045
+ * current item from the values because otherwise it would be the first to match always
1046
+ * and focus would never move. This is as opposed to the regular case, where we
1047
+ * don't want focus to move if the current item still matches.
1048
+ */ function $1345bda09ffc1bc6$var$findNextItem(items, search, currentItem) {
1049
+ const isRepeated = search.length > 1 && Array.from(search).every((char)=>char === search[0]
1050
+ );
1051
+ const normalizedSearch = isRepeated ? search[0] : search;
1052
+ const currentItemIndex = currentItem ? items.indexOf(currentItem) : -1;
1053
+ let wrappedItems = $1345bda09ffc1bc6$var$wrapArray(items, Math.max(currentItemIndex, 0));
1054
+ const excludeCurrentItem = normalizedSearch.length === 1;
1055
+ if (excludeCurrentItem) wrappedItems = wrappedItems.filter((v)=>v !== currentItem
1056
+ );
1057
+ const nextItem = wrappedItems.find((item)=>item.textValue.toLowerCase().startsWith(normalizedSearch.toLowerCase())
1058
+ );
1059
+ return nextItem !== currentItem ? nextItem : undefined;
1060
+ }
1061
+ /**
1062
+ * Wraps an array around itself at a given start index
1063
+ * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`
1064
+ */ function $1345bda09ffc1bc6$var$wrapArray(array, startIndex) {
1065
+ return array.map((_, index)=>array[(startIndex + index) % array.length]
1066
+ );
1067
+ }
1068
+ const $1345bda09ffc1bc6$export$be92b6f5f03c0fe9 = $1345bda09ffc1bc6$export$ef9b1a59e592288f;
1069
+ const $1345bda09ffc1bc6$export$41fb9f06171c75f4 = $1345bda09ffc1bc6$export$3ac1e88a1c0b9f1;
1070
+ const $1345bda09ffc1bc6$export$4c8d1a57a761ef94 = $1345bda09ffc1bc6$export$e288731fd71264f0;
1071
+ const $1345bda09ffc1bc6$export$f04a61298a47a40f = $1345bda09ffc1bc6$export$99b400cabb58c515;
1072
+ const $1345bda09ffc1bc6$export$7c6e2c02157bb7d2 = $1345bda09ffc1bc6$export$c973a4b3cb86a03d;
1073
+ const $1345bda09ffc1bc6$export$d5c6c08dc2d3ca7 = $1345bda09ffc1bc6$export$9ed6e7b40248d36d;
1074
+ const $1345bda09ffc1bc6$export$eb2fcfdbd7ba97d4 = $1345bda09ffc1bc6$export$ee25a334c55de1f4;
1075
+ const $1345bda09ffc1bc6$export$b04be29aa201d4f5 = $1345bda09ffc1bc6$export$f67338d29bd972f8;
1076
+ const $1345bda09ffc1bc6$export$6d08773d2e66f8f2 = $1345bda09ffc1bc6$export$13ef48a934230896;
1077
+ const $1345bda09ffc1bc6$export$d6e5bf9c43ea9319 = $1345bda09ffc1bc6$export$3572fb0fb821ff49;
1078
+ const $1345bda09ffc1bc6$export$c3468e2714d175fa = $1345bda09ffc1bc6$export$6b9198de19accfe6;
1079
+ const $1345bda09ffc1bc6$export$2f60d3ec9ad468f2 = $1345bda09ffc1bc6$export$d8117927658af6d7;
1080
+ const $1345bda09ffc1bc6$export$bf1aedc3039c8d63 = $1345bda09ffc1bc6$export$ff951e476c12189;
1081
+ const $1345bda09ffc1bc6$export$1ff3c3f08ae963c0 = $1345bda09ffc1bc6$export$eba4b1df07cb1d3;
1082
+
1083
+
1084
+ $parcel$exportWildcard(module.exports, $1345bda09ffc1bc6$exports);
1085
+
1086
+
4
1087
  //# sourceMappingURL=index.js.map