@start-base/start-ui/Dropdown/index.mjs

<p align="center"> <a href="https://startbase.dev" target="_blank"> <img src="https://startbase.dev/apple-touch-icon.png" width="60px" style="padding-top: 60px" /> </a> </p>

import*as e from"react";import t,{createContext as n,forwardRef as o,useState as l,useRef as r,useContext as a,useEffect as i,useMemo as s}from"react";import{useFloatingTree as c,useFloatingNodeId as d,useFloatingParentNodeId as m,useListItem as u,useFloating as p,offset as v,shift as f,flip as g,autoUpdate as I,useHover as b,safePolygon as h,useClick as x,useRole as E,useDismiss as w,useListNavigation as y,useTypeahead as O,useInteractions as F,FloatingNode as P,useMergeRefs as N,FloatingList as M,FloatingPortal as C,FloatingFocusManager as k,FloatingTree as j}from"@floating-ui/react";import R from"clsx";var A=Object.defineProperty,S=Object.defineProperties,z=Object.getOwnPropertyDescriptors,H=Object.getOwnPropertySymbols,D=Object.prototype.hasOwnProperty,U=Object.prototype.propertyIsEnumerable,q=(e,t,n)=>t in e?A(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,B=(e,t)=>{for(var n in t||(t={}))D.call(t,n)&&q(e,n,t[n]);if(H)for(var n of H(t))U.call(t,n)&&q(e,n,t[n]);return e},L=(e,t)=>S(e,z(t)),Q=(e,t)=>{var n={};for(var o in e)D.call(e,o)&&t.indexOf(o)<0&&(n[o]=e[o]);if(null!=e&&H)for(var o of H(e))t.indexOf(o)<0&&U.call(e,o)&&(n[o]=e[o]);return n};function V(t){var n=t,{size:o,width:l,height:r}=n,a=Q(n,["size","width","height"]);return e.createElement("svg",B({xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",stroke:"currentColor",strokeWidth:0,viewBox:"0 0 24 24",width:null!=o?o:l,height:null!=o?o:r},a),e.createElement("path",{fill:"none",stroke:"none",d:"M0 0h24v24H0V0z"}),e.createElement("path",{stroke:"none",d:"M6.23 20.23 8 22l10-10L8 2 6.23 3.77 14.46 12z"}))}var W=n({getItemProps:()=>({}),activeIndex:null,setActiveIndex:()=>({}),setHasFocusInside:()=>({}),isOpen:!1});W.displayName="FloatingMenuContext";var X=W,G="SUI-FloatingMenu-module-menu-S6X1q",J="SUI-FloatingMenu-module-menuItem-QvCb8",K=o(((e,n)=>{var o=e,{children:j,component:A,label:S,className:z,menuClassName:H,placement:D,icon:U}=o,q=Q(o,["children","component","label","className","menuClassName","placement","icon"]);const[W,K]=l(!1),[T,Y]=l(!1),[Z,$]=l(null),_=r([]),ee=r([]),te=a(X),ne=c(),oe=d(),le=m(),re=u(),ae=null!=le,{floatingStyles:ie,refs:se,context:ce}=p({nodeId:oe,open:W,onOpenChange:K,placement:ae?"right-start":D||"bottom-end",middleware:[v({mainAxis:ae?8:4,alignmentAxis:ae?-4:0}),f({padding:4,crossAxis:!0}),g({padding:4})],whileElementsMounted:I}),de=b(ce,{enabled:ae,delay:{open:75},handleClose:h({blockPointerEvents:!0})}),me=x(ce,{event:"mousedown",toggle:!ae,ignoreMouse:ae}),ue=E(ce,{role:"menu"}),pe=w(ce,{bubbles:!0}),ve=y(ce,{listRef:_,activeIndex:Z,nested:ae,onNavigate:$}),fe=O(ce,{listRef:ee,onMatch:W?$:void 0,activeIndex:Z}),{getReferenceProps:ge,getFloatingProps:Ie,getItemProps:be}=F([de,me,ue,pe,ve,fe]);i((()=>{if(ne)return ne.events.on("click",e),ne.events.on("menuopen",t),()=>{ne.events.off("click",e),ne.events.off("menuopen",t)};function e(){K(!1)}function t(e){e.nodeId!==oe&&e.parentId===le&&K(!1)}}),[ne,oe,le]),i((()=>{W&&ne&&ne.events.emit("menuopen",{parentId:le,nodeId:oe})}),[ne,W,oe,le]);const he=s((()=>({activeIndex:Z,setActiveIndex:$,getItemProps:be,setHasFocusInside:Y,isOpen:W})),[]);return t.createElement(P,{id:oe},t.createElement("div",B({ref:N([se.setReference,re.ref,n]),tabIndex:ae?te.activeIndex===re.index?0:-1:void 0,role:ae?"menuitem":void 0,"data-open":W?"":void 0,"data-nested":ae?"":void 0,"data-focus-inside":T?"":void 0,className:R({[J]:ae},z&&{[z]:!0})},ge(te.getItemProps(L(B({},q),{onFocus:e=>{var t;null==(t=q.onFocus)||t.call(q,e),Y(!1),te.setHasFocusInside(!0)}})))),A||S,ae&&(U||t.createElement(V,null))),t.createElement(X.Provider,{value:he},t.createElement(M,{elementsRef:_,labelsRef:ee},W&&t.createElement(C,null,t.createElement(k,{context:ce,modal:!1,initialFocus:ae?-1:0,returnFocus:!ae},t.createElement("div",B({ref:se.setFloating,className:R(G,H&&{[H]:!0}),style:ie},Ie()),j))))))}));K.displayName="FloatingMenu";var T=K,Y=o(((e,n)=>null===m()?t.createElement(j,null,t.createElement(T,L(B({},e),{ref:n}))):t.createElement(T,L(B({},e),{ref:n}))));Y.displayName="Dropdown";var Z=Y;export{Z as default};