@data-slot/dropdown-menu 0.2.55 → 0.2.57

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/README.md CHANGED
@@ -64,6 +64,21 @@ controller.destroy();
64
64
  | `dropdown-menu-item` | Clickable menu item |
65
65
  | `dropdown-menu-separator` | Visual divider |
66
66
  | `dropdown-menu-shortcut` | Keyboard shortcut hint |
67
+ | `dropdown-menu-positioner` | Optional authored positioning wrapper (reused instead of generated wrapper) |
68
+ | `dropdown-menu-portal` | Optional authored portal wrapper that can contain `dropdown-menu-positioner` |
69
+
70
+ ### Composed Portal Markup (Optional)
71
+
72
+ ```html
73
+ <div data-slot="dropdown-menu">
74
+ <button data-slot="dropdown-menu-trigger">Options</button>
75
+ <div data-slot="dropdown-menu-portal">
76
+ <div data-slot="dropdown-menu-positioner">
77
+ <div data-slot="dropdown-menu-content">...</div>
78
+ </div>
79
+ </div>
80
+ </div>
81
+ ```
67
82
 
68
83
  ## Data Attributes
69
84
 
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@data-slot/core`);const t=[`top`,`right`,`bottom`,`left`],n=[`start`,`center`,`end`];function r(r,a={}){let o=(0,e.getPart)(r,`dropdown-menu-trigger`),s=(0,e.getPart)(r,`dropdown-menu-content`);if(!o||!s)throw Error(`DropdownMenu requires trigger and content slots`);let c=a.defaultOpen??(0,e.getDataBool)(r,`defaultOpen`)??!1,l=a.onOpenChange,u=a.onSelect,d=a.closeOnClickOutside??(0,e.getDataBool)(r,`closeOnClickOutside`)??!0,f=a.closeOnEscape??(0,e.getDataBool)(r,`closeOnEscape`)??!0,p=a.closeOnSelect??(0,e.getDataBool)(r,`closeOnSelect`)??!0,m=a.side??(0,e.getDataEnum)(s,`side`,t)??(0,e.getDataEnum)(r,`side`,t)??`bottom`,h=a.align??(0,e.getDataEnum)(s,`align`,n)??(0,e.getDataEnum)(r,`align`,n)??`start`,g=a.sideOffset??(0,e.getDataNumber)(s,`sideOffset`)??(0,e.getDataNumber)(r,`sideOffset`)??4,_=a.alignOffset??(0,e.getDataNumber)(s,`alignOffset`)??(0,e.getDataNumber)(r,`alignOffset`)??0,v=a.avoidCollisions??(0,e.getDataBool)(s,`avoidCollisions`)??(0,e.getDataBool)(r,`avoidCollisions`)??!0,y=a.collisionPadding??(0,e.getDataNumber)(s,`collisionPadding`)??(0,e.getDataNumber)(r,`collisionPadding`)??8,b=a.lockScroll??(0,e.getDataBool)(r,`lockScroll`)??!0,x=!1,S=null,C=-1,w=``,T=null,E=!1,D=[],O=!1,k=(0,e.createPortalLifecycle)({content:s,root:r,wrapperSlot:`dropdown-menu-positioner`}),A=!1,j=[],M=[],N=new Map,P=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,F=(0,e.ensureId)(o,`dropdown-menu-trigger`),I=(0,e.ensureId)(s,`dropdown-menu-content`);o.setAttribute(`aria-haspopup`,`menu`),o.setAttribute(`aria-controls`,I),s.setAttribute(`role`,`menu`),s.setAttribute(`aria-labelledby`,F),s.tabIndex=-1;let L=()=>{j=(0,e.getParts)(s,`dropdown-menu-item`);for(let e of j)e.setAttribute(`role`,`menuitem`),e.hasAttribute(`data-disabled`)||e.hasAttribute(`disabled`)?e.setAttribute(`aria-disabled`,`true`):e.removeAttribute(`aria-disabled`),e.tabIndex=-1;M=j.filter(e=>!P(e)),N=new Map(M.map((e,t)=>[e,t]))},R=()=>{let t=k.container,n=r.ownerDocument.defaultView??window,i=(0,e.computeFloatingPosition)({anchorRect:o.getBoundingClientRect(),contentRect:s.getBoundingClientRect(),side:m,align:h,sideOffset:g,alignOffset:_,avoidCollisions:v,collisionPadding:y});b?(t.style.position=`fixed`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${i.x}px, ${i.y}px, 0)`):(t.style.position=`absolute`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${i.x+n.scrollX}px, ${i.y+n.scrollY}px, 0)`),t.style.willChange=`transform`,t.style.margin=`0`,s.setAttribute(`data-side`,i.side),s.setAttribute(`data-align`,i.align),t!==s&&(t.setAttribute(`data-side`,i.side),t.setAttribute(`data-align`,i.align))},z=(0,e.createPositionSync)({observedElements:[o,s],isActive:()=>x,ancestorScroll:b,onUpdate:R}),B=(t,n=!0)=>{for(let r=0;r<M.length;r++){let i=M[r];r===t?(i.setAttribute(`data-highlighted`,``),(0,e.ensureItemVisibleInContainer)(i,s),n&&i.focus()):i.removeAttribute(`data-highlighted`)}C=t},V=()=>{for(let e of j)e.removeAttribute(`data-highlighted`);C=-1},H=e=>{r.setAttribute(`data-state`,e),s.setAttribute(`data-state`,e),e===`open`?(r.setAttribute(`data-open`,``),s.setAttribute(`data-open`,``),r.removeAttribute(`data-closed`),s.removeAttribute(`data-closed`)):(r.setAttribute(`data-closed`,``),s.setAttribute(`data-closed`,``),r.removeAttribute(`data-open`),s.removeAttribute(`data-open`))},U=()=>{requestAnimationFrame(()=>{S&&document.contains(S)?(0,e.focusElement)(S):o&&document.contains(o)&&(0,e.focusElement)(o),S=null})},W=(0,e.createPresenceLifecycle)({element:s,onExitComplete:()=>{A||(k.restore(),s.hidden=!0,U())}}),G=t=>{x!==t&&(t?(S=document.activeElement,x=!0,(0,e.setAria)(o,`expanded`,!0),k.mount(),s.hidden=!1,H(`open`),W.enter(),b&&!O&&((0,e.lockScroll)(),O=!0),L(),E=!1,V(),z.start(),R(),z.update(),s.focus()):(x=!1,(0,e.setAria)(o,`expanded`,!1),H(`closed`),V(),w=``,E=!1,O&&=((0,e.unlockScroll)(),!1),z.stop(),W.exit()),(0,e.emit)(r,`dropdown-menu:change`,{open:x}),l?.(x))},K=t=>{if(P(t))return;let n=t.dataset.value||t.textContent?.trim()||``;(0,e.emit)(r,`dropdown-menu:select`,{value:n}),u?.(n),p&&G(!1)},q=e=>{let t=M.length;if(t!==0)switch(e.key){case`ArrowDown`:e.preventDefault(),E=!0,B(C===-1?0:(C+1)%t);break;case`ArrowUp`:e.preventDefault(),E=!0,B(C===-1?t-1:(C-1+t)%t);break;case`Home`:e.preventDefault(),E=!0,B(0);break;case`End`:e.preventDefault(),E=!0,B(t-1);break;case`Enter`:case` `:e.preventDefault(),C>=0&&K(M[C]);break;case`Tab`:G(!1);break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey&&(e.preventDefault(),J(e.key.toLowerCase()))}},J=e=>{T&&clearTimeout(T),T=setTimeout(()=>{w=``},500),w+=e;let t=M.findIndex(e=>(e.textContent?.trim().toLowerCase()||``).startsWith(w));if(t===-1&&w.length===1){let n=C+1;for(let r=0;r<M.length;r++){let i=(n+r)%M.length;if((M[i].textContent?.trim().toLowerCase()||``).startsWith(e)){t=i;break}}}t!==-1&&(E=!0,B(t))};return(0,e.setAria)(o,`expanded`,!1),s.hidden=!0,H(`closed`),D.push((0,e.on)(o,`click`,()=>G(!x)),(0,e.on)(o,`keydown`,e=>{(e.key===`Enter`||e.key===` `||e.key===`ArrowDown`)&&!x&&(e.preventDefault(),G(!0))})),D.push((0,e.on)(s,`keydown`,q),(0,e.on)(s,`click`,e=>{let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);t&&K(t)}),(0,e.on)(s,`pointermove`,e=>{let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);if(!(E&&(E=!1,t&&N.get(t)===C)))if(t&&!P(t)){let e=N.get(t);e!==void 0&&e!==C&&B(e,!1)}else V()}),(0,e.on)(s,`pointerleave`,()=>{E||V()})),D.push((0,e.createDismissLayer)({root:r,isOpen:()=>x,onDismiss:()=>G(!1),closeOnClickOutside:d,closeOnEscape:f})),D.push((0,e.on)(r,`dropdown-menu:set`,e=>{let t=e.detail,n;t?.open===void 0?t?.value!==void 0&&(n=t.value):n=t.open,typeof n==`boolean`&&G(n)})),c&&G(!0),{open:()=>G(!0),close:()=>G(!1),toggle:()=>G(!x),get isOpen(){return x},destroy:()=>{A=!0,T&&clearTimeout(T),z.stop(),W.cleanup(),k.cleanup(),O&&=((0,e.unlockScroll)(),!1),D.forEach(e=>e()),D.length=0,i.delete(r)}}}const i=new WeakSet;function a(t=document){let n=[];for(let a of(0,e.getRoots)(t,`dropdown-menu`))i.has(a)||(i.add(a),n.push(r(a)));return n}exports.create=a,exports.createDropdownMenu=r;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@data-slot/core`);const t=[`top`,`right`,`bottom`,`left`],n=[`start`,`center`,`end`];function r(r,a={}){let o=(0,e.getPart)(r,`dropdown-menu-trigger`),s=(0,e.getPart)(r,`dropdown-menu-content`),c=(0,e.getPart)(r,`dropdown-menu-positioner`),l=c&&s&&c.contains(s)?c:null,u=(0,e.getPart)(r,`dropdown-menu-portal`),d=u&&l&&u.contains(l)?u:null;if(!o||!s)throw Error(`DropdownMenu requires trigger and content slots`);let f=a.defaultOpen??(0,e.getDataBool)(r,`defaultOpen`)??!1,p=a.onOpenChange,m=a.onSelect,h=a.closeOnClickOutside??(0,e.getDataBool)(r,`closeOnClickOutside`)??!0,g=a.closeOnEscape??(0,e.getDataBool)(r,`closeOnEscape`)??!0,_=a.closeOnSelect??(0,e.getDataBool)(r,`closeOnSelect`)??!0,v=a.side??(0,e.getDataEnum)(s,`side`,t)??(0,e.getDataEnum)(r,`side`,t)??`bottom`,y=a.align??(0,e.getDataEnum)(s,`align`,n)??(0,e.getDataEnum)(r,`align`,n)??`start`,b=a.sideOffset??(0,e.getDataNumber)(s,`sideOffset`)??(0,e.getDataNumber)(r,`sideOffset`)??4,x=a.alignOffset??(0,e.getDataNumber)(s,`alignOffset`)??(0,e.getDataNumber)(r,`alignOffset`)??0,S=a.avoidCollisions??(0,e.getDataBool)(s,`avoidCollisions`)??(0,e.getDataBool)(r,`avoidCollisions`)??!0,C=a.collisionPadding??(0,e.getDataNumber)(s,`collisionPadding`)??(0,e.getDataNumber)(r,`collisionPadding`)??8,w=a.lockScroll??(0,e.getDataBool)(r,`lockScroll`)??!0,T=!1,E=null,D=-1,O=``,k=null,A=!1,j=[],M=!1,N=(0,e.createPortalLifecycle)({content:s,root:r,wrapperSlot:l?void 0:`dropdown-menu-positioner`,container:l??void 0,mountTarget:l?d??l:void 0}),P=!1,F=[],I=[],L=new Map,R=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,z=(0,e.ensureId)(o,`dropdown-menu-trigger`),B=(0,e.ensureId)(s,`dropdown-menu-content`);o.setAttribute(`aria-haspopup`,`menu`),o.setAttribute(`aria-controls`,B),s.setAttribute(`role`,`menu`),s.setAttribute(`aria-labelledby`,z),s.tabIndex=-1;let V=()=>{F=(0,e.getParts)(s,`dropdown-menu-item`);for(let e of F)e.setAttribute(`role`,`menuitem`),e.hasAttribute(`data-disabled`)||e.hasAttribute(`disabled`)?e.setAttribute(`aria-disabled`,`true`):e.removeAttribute(`aria-disabled`),e.tabIndex=-1;I=F.filter(e=>!R(e)),L=new Map(I.map((e,t)=>[e,t]))},H=()=>{let t=N.container,n=r.ownerDocument.defaultView??window,i=(0,e.computeFloatingPosition)({anchorRect:o.getBoundingClientRect(),contentRect:s.getBoundingClientRect(),side:v,align:y,sideOffset:b,alignOffset:x,avoidCollisions:S,collisionPadding:C});w?(t.style.position=`fixed`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${i.x}px, ${i.y}px, 0)`):(t.style.position=`absolute`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${i.x+n.scrollX}px, ${i.y+n.scrollY}px, 0)`),t.style.willChange=`transform`,t.style.margin=`0`,s.setAttribute(`data-side`,i.side),s.setAttribute(`data-align`,i.align),t!==s&&(t.setAttribute(`data-side`,i.side),t.setAttribute(`data-align`,i.align))},U=(0,e.createPositionSync)({observedElements:[o,s],isActive:()=>T,ancestorScroll:w,onUpdate:H}),W=(t,n=!0)=>{for(let r=0;r<I.length;r++){let i=I[r];r===t?(i.setAttribute(`data-highlighted`,``),(0,e.ensureItemVisibleInContainer)(i,s),n&&i.focus()):i.removeAttribute(`data-highlighted`)}D=t},G=()=>{for(let e of F)e.removeAttribute(`data-highlighted`);D=-1},K=e=>{r.setAttribute(`data-state`,e),s.setAttribute(`data-state`,e),e===`open`?(r.setAttribute(`data-open`,``),s.setAttribute(`data-open`,``),r.removeAttribute(`data-closed`),s.removeAttribute(`data-closed`)):(r.setAttribute(`data-closed`,``),s.setAttribute(`data-closed`,``),r.removeAttribute(`data-open`),s.removeAttribute(`data-open`))},q=()=>{requestAnimationFrame(()=>{E&&document.contains(E)?(0,e.focusElement)(E):o&&document.contains(o)&&(0,e.focusElement)(o),E=null})},J=(0,e.createPresenceLifecycle)({element:s,onExitComplete:()=>{P||(N.restore(),s.hidden=!0,q())}}),Y=t=>{T!==t&&(t?(E=document.activeElement,T=!0,(0,e.setAria)(o,`expanded`,!0),N.mount(),s.hidden=!1,K(`open`),J.enter(),w&&!M&&((0,e.lockScroll)(),M=!0),V(),A=!1,G(),U.start(),H(),U.update(),s.focus()):(T=!1,(0,e.setAria)(o,`expanded`,!1),K(`closed`),G(),O=``,A=!1,M&&=((0,e.unlockScroll)(),!1),U.stop(),J.exit()),(0,e.emit)(r,`dropdown-menu:change`,{open:T}),p?.(T))},X=t=>{if(R(t))return;let n=t.dataset.value||t.textContent?.trim()||``;(0,e.emit)(r,`dropdown-menu:select`,{value:n}),m?.(n),_&&Y(!1)},Z=e=>{let t=I.length;if(t!==0)switch(e.key){case`ArrowDown`:e.preventDefault(),A=!0,W(D===-1?0:(D+1)%t);break;case`ArrowUp`:e.preventDefault(),A=!0,W(D===-1?t-1:(D-1+t)%t);break;case`Home`:e.preventDefault(),A=!0,W(0);break;case`End`:e.preventDefault(),A=!0,W(t-1);break;case`Enter`:case` `:e.preventDefault(),D>=0&&X(I[D]);break;case`Tab`:Y(!1);break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey&&(e.preventDefault(),Q(e.key.toLowerCase()))}},Q=e=>{k&&clearTimeout(k),k=setTimeout(()=>{O=``},500),O+=e;let t=I.findIndex(e=>(e.textContent?.trim().toLowerCase()||``).startsWith(O));if(t===-1&&O.length===1){let n=D+1;for(let r=0;r<I.length;r++){let i=(n+r)%I.length;if((I[i].textContent?.trim().toLowerCase()||``).startsWith(e)){t=i;break}}}t!==-1&&(A=!0,W(t))};return(0,e.setAria)(o,`expanded`,!1),s.hidden=!0,K(`closed`),j.push((0,e.on)(o,`click`,()=>Y(!T)),(0,e.on)(o,`keydown`,e=>{(e.key===`Enter`||e.key===` `||e.key===`ArrowDown`)&&!T&&(e.preventDefault(),Y(!0))})),j.push((0,e.on)(s,`keydown`,Z),(0,e.on)(s,`click`,e=>{let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);t&&X(t)}),(0,e.on)(s,`pointermove`,e=>{let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);if(!(A&&(A=!1,t&&L.get(t)===D)))if(t&&!R(t)){let e=L.get(t);e!==void 0&&e!==D&&W(e,!1)}else G()}),(0,e.on)(s,`pointerleave`,()=>{A||G()})),j.push((0,e.createDismissLayer)({root:r,isOpen:()=>T,onDismiss:()=>Y(!1),closeOnClickOutside:h,closeOnEscape:g})),j.push((0,e.on)(r,`dropdown-menu:set`,e=>{let t=e.detail,n;t?.open===void 0?t?.value!==void 0&&(n=t.value):n=t.open,typeof n==`boolean`&&Y(n)})),f&&Y(!0),{open:()=>Y(!0),close:()=>Y(!1),toggle:()=>Y(!T),get isOpen(){return T},destroy:()=>{P=!0,k&&clearTimeout(k),U.stop(),J.cleanup(),N.cleanup(),M&&=((0,e.unlockScroll)(),!1),j.forEach(e=>e()),j.length=0,i.delete(r)}}}const i=new WeakSet;function a(t=document){let n=[];for(let a of(0,e.getRoots)(t,`dropdown-menu`))i.has(a)||(i.add(a),n.push(r(a)));return n}exports.create=a,exports.createDropdownMenu=r;
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- import{computeFloatingPosition as e,createDismissLayer as t,createPortalLifecycle as n,createPositionSync as r,createPresenceLifecycle as i,emit as a,ensureId as o,ensureItemVisibleInContainer as s,focusElement as c,getDataBool as l,getDataEnum as u,getDataNumber as d,getPart as f,getParts as p,getRoots as m,lockScroll as h,on as g,setAria as _,unlockScroll as v}from"@data-slot/core";const y=[`top`,`right`,`bottom`,`left`],b=[`start`,`center`,`end`];function x(m,x={}){let C=f(m,`dropdown-menu-trigger`),w=f(m,`dropdown-menu-content`);if(!C||!w)throw Error(`DropdownMenu requires trigger and content slots`);let T=x.defaultOpen??l(m,`defaultOpen`)??!1,E=x.onOpenChange,D=x.onSelect,O=x.closeOnClickOutside??l(m,`closeOnClickOutside`)??!0,ee=x.closeOnEscape??l(m,`closeOnEscape`)??!0,te=x.closeOnSelect??l(m,`closeOnSelect`)??!0,ne=x.side??u(w,`side`,y)??u(m,`side`,y)??`bottom`,re=x.align??u(w,`align`,b)??u(m,`align`,b)??`start`,ie=x.sideOffset??d(w,`sideOffset`)??d(m,`sideOffset`)??4,ae=x.alignOffset??d(w,`alignOffset`)??d(m,`alignOffset`)??0,oe=x.avoidCollisions??l(w,`avoidCollisions`)??l(m,`avoidCollisions`)??!0,k=x.collisionPadding??d(w,`collisionPadding`)??d(m,`collisionPadding`)??8,A=x.lockScroll??l(m,`lockScroll`)??!0,j=!1,M=null,N=-1,P=``,F=null,I=!1,L=[],R=!1,z=n({content:w,root:m,wrapperSlot:`dropdown-menu-positioner`}),B=!1,V=[],H=[],U=new Map,W=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,G=o(C,`dropdown-menu-trigger`),se=o(w,`dropdown-menu-content`);C.setAttribute(`aria-haspopup`,`menu`),C.setAttribute(`aria-controls`,se),w.setAttribute(`role`,`menu`),w.setAttribute(`aria-labelledby`,G),w.tabIndex=-1;let ce=()=>{V=p(w,`dropdown-menu-item`);for(let e of V)e.setAttribute(`role`,`menuitem`),e.hasAttribute(`data-disabled`)||e.hasAttribute(`disabled`)?e.setAttribute(`aria-disabled`,`true`):e.removeAttribute(`aria-disabled`),e.tabIndex=-1;H=V.filter(e=>!W(e)),U=new Map(H.map((e,t)=>[e,t]))},K=()=>{let t=z.container,n=m.ownerDocument.defaultView??window,r=e({anchorRect:C.getBoundingClientRect(),contentRect:w.getBoundingClientRect(),side:ne,align:re,sideOffset:ie,alignOffset:ae,avoidCollisions:oe,collisionPadding:k});A?(t.style.position=`fixed`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${r.x}px, ${r.y}px, 0)`):(t.style.position=`absolute`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${r.x+n.scrollX}px, ${r.y+n.scrollY}px, 0)`),t.style.willChange=`transform`,t.style.margin=`0`,w.setAttribute(`data-side`,r.side),w.setAttribute(`data-align`,r.align),t!==w&&(t.setAttribute(`data-side`,r.side),t.setAttribute(`data-align`,r.align))},q=r({observedElements:[C,w],isActive:()=>j,ancestorScroll:A,onUpdate:K}),J=(e,t=!0)=>{for(let n=0;n<H.length;n++){let r=H[n];n===e?(r.setAttribute(`data-highlighted`,``),s(r,w),t&&r.focus()):r.removeAttribute(`data-highlighted`)}N=e},Y=()=>{for(let e of V)e.removeAttribute(`data-highlighted`);N=-1},X=e=>{m.setAttribute(`data-state`,e),w.setAttribute(`data-state`,e),e===`open`?(m.setAttribute(`data-open`,``),w.setAttribute(`data-open`,``),m.removeAttribute(`data-closed`),w.removeAttribute(`data-closed`)):(m.setAttribute(`data-closed`,``),w.setAttribute(`data-closed`,``),m.removeAttribute(`data-open`),w.removeAttribute(`data-open`))},le=()=>{requestAnimationFrame(()=>{M&&document.contains(M)?c(M):C&&document.contains(C)&&c(C),M=null})},Z=i({element:w,onExitComplete:()=>{B||(z.restore(),w.hidden=!0,le())}}),Q=e=>{j!==e&&(e?(M=document.activeElement,j=!0,_(C,`expanded`,!0),z.mount(),w.hidden=!1,X(`open`),Z.enter(),A&&!R&&(h(),R=!0),ce(),I=!1,Y(),q.start(),K(),q.update(),w.focus()):(j=!1,_(C,`expanded`,!1),X(`closed`),Y(),P=``,I=!1,R&&=(v(),!1),q.stop(),Z.exit()),a(m,`dropdown-menu:change`,{open:j}),E?.(j))},$=e=>{if(W(e))return;let t=e.dataset.value||e.textContent?.trim()||``;a(m,`dropdown-menu:select`,{value:t}),D?.(t),te&&Q(!1)},ue=e=>{let t=H.length;if(t!==0)switch(e.key){case`ArrowDown`:e.preventDefault(),I=!0,J(N===-1?0:(N+1)%t);break;case`ArrowUp`:e.preventDefault(),I=!0,J(N===-1?t-1:(N-1+t)%t);break;case`Home`:e.preventDefault(),I=!0,J(0);break;case`End`:e.preventDefault(),I=!0,J(t-1);break;case`Enter`:case` `:e.preventDefault(),N>=0&&$(H[N]);break;case`Tab`:Q(!1);break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey&&(e.preventDefault(),de(e.key.toLowerCase()))}},de=e=>{F&&clearTimeout(F),F=setTimeout(()=>{P=``},500),P+=e;let t=H.findIndex(e=>(e.textContent?.trim().toLowerCase()||``).startsWith(P));if(t===-1&&P.length===1){let n=N+1;for(let r=0;r<H.length;r++){let i=(n+r)%H.length;if((H[i].textContent?.trim().toLowerCase()||``).startsWith(e)){t=i;break}}}t!==-1&&(I=!0,J(t))};return _(C,`expanded`,!1),w.hidden=!0,X(`closed`),L.push(g(C,`click`,()=>Q(!j)),g(C,`keydown`,e=>{(e.key===`Enter`||e.key===` `||e.key===`ArrowDown`)&&!j&&(e.preventDefault(),Q(!0))})),L.push(g(w,`keydown`,ue),g(w,`click`,e=>{let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);t&&$(t)}),g(w,`pointermove`,e=>{let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);if(!(I&&(I=!1,t&&U.get(t)===N)))if(t&&!W(t)){let e=U.get(t);e!==void 0&&e!==N&&J(e,!1)}else Y()}),g(w,`pointerleave`,()=>{I||Y()})),L.push(t({root:m,isOpen:()=>j,onDismiss:()=>Q(!1),closeOnClickOutside:O,closeOnEscape:ee})),L.push(g(m,`dropdown-menu:set`,e=>{let t=e.detail,n;t?.open===void 0?t?.value!==void 0&&(n=t.value):n=t.open,typeof n==`boolean`&&Q(n)})),T&&Q(!0),{open:()=>Q(!0),close:()=>Q(!1),toggle:()=>Q(!j),get isOpen(){return j},destroy:()=>{B=!0,F&&clearTimeout(F),q.stop(),Z.cleanup(),z.cleanup(),R&&=(v(),!1),L.forEach(e=>e()),L.length=0,S.delete(m)}}}const S=new WeakSet;function C(e=document){let t=[];for(let n of m(e,`dropdown-menu`))S.has(n)||(S.add(n),t.push(x(n)));return t}export{C as create,x as createDropdownMenu};
1
+ import{computeFloatingPosition as e,createDismissLayer as t,createPortalLifecycle as n,createPositionSync as r,createPresenceLifecycle as i,emit as a,ensureId as o,ensureItemVisibleInContainer as s,focusElement as c,getDataBool as l,getDataEnum as u,getDataNumber as d,getPart as f,getParts as ee,getRoots as p,lockScroll as m,on as h,setAria as g,unlockScroll as _}from"@data-slot/core";const v=[`top`,`right`,`bottom`,`left`],y=[`start`,`center`,`end`];function b(p,b={}){let S=f(p,`dropdown-menu-trigger`),C=f(p,`dropdown-menu-content`),w=f(p,`dropdown-menu-positioner`),T=w&&C&&w.contains(C)?w:null,E=f(p,`dropdown-menu-portal`),te=E&&T&&E.contains(T)?E:null;if(!S||!C)throw Error(`DropdownMenu requires trigger and content slots`);let ne=b.defaultOpen??l(p,`defaultOpen`)??!1,re=b.onOpenChange,D=b.onSelect,O=b.closeOnClickOutside??l(p,`closeOnClickOutside`)??!0,k=b.closeOnEscape??l(p,`closeOnEscape`)??!0,A=b.closeOnSelect??l(p,`closeOnSelect`)??!0,ie=b.side??u(C,`side`,v)??u(p,`side`,v)??`bottom`,ae=b.align??u(C,`align`,y)??u(p,`align`,y)??`start`,oe=b.sideOffset??d(C,`sideOffset`)??d(p,`sideOffset`)??4,se=b.alignOffset??d(C,`alignOffset`)??d(p,`alignOffset`)??0,ce=b.avoidCollisions??l(C,`avoidCollisions`)??l(p,`avoidCollisions`)??!0,le=b.collisionPadding??d(C,`collisionPadding`)??d(p,`collisionPadding`)??8,j=b.lockScroll??l(p,`lockScroll`)??!0,M=!1,N=null,P=-1,F=``,I=null,L=!1,R=[],z=!1,B=n({content:C,root:p,wrapperSlot:T?void 0:`dropdown-menu-positioner`,container:T??void 0,mountTarget:T?te??T:void 0}),V=!1,H=[],U=[],W=new Map,G=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,ue=o(S,`dropdown-menu-trigger`),de=o(C,`dropdown-menu-content`);S.setAttribute(`aria-haspopup`,`menu`),S.setAttribute(`aria-controls`,de),C.setAttribute(`role`,`menu`),C.setAttribute(`aria-labelledby`,ue),C.tabIndex=-1;let fe=()=>{H=ee(C,`dropdown-menu-item`);for(let e of H)e.setAttribute(`role`,`menuitem`),e.hasAttribute(`data-disabled`)||e.hasAttribute(`disabled`)?e.setAttribute(`aria-disabled`,`true`):e.removeAttribute(`aria-disabled`),e.tabIndex=-1;U=H.filter(e=>!G(e)),W=new Map(U.map((e,t)=>[e,t]))},K=()=>{let t=B.container,n=p.ownerDocument.defaultView??window,r=e({anchorRect:S.getBoundingClientRect(),contentRect:C.getBoundingClientRect(),side:ie,align:ae,sideOffset:oe,alignOffset:se,avoidCollisions:ce,collisionPadding:le});j?(t.style.position=`fixed`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${r.x}px, ${r.y}px, 0)`):(t.style.position=`absolute`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${r.x+n.scrollX}px, ${r.y+n.scrollY}px, 0)`),t.style.willChange=`transform`,t.style.margin=`0`,C.setAttribute(`data-side`,r.side),C.setAttribute(`data-align`,r.align),t!==C&&(t.setAttribute(`data-side`,r.side),t.setAttribute(`data-align`,r.align))},q=r({observedElements:[S,C],isActive:()=>M,ancestorScroll:j,onUpdate:K}),J=(e,t=!0)=>{for(let n=0;n<U.length;n++){let r=U[n];n===e?(r.setAttribute(`data-highlighted`,``),s(r,C),t&&r.focus()):r.removeAttribute(`data-highlighted`)}P=e},Y=()=>{for(let e of H)e.removeAttribute(`data-highlighted`);P=-1},X=e=>{p.setAttribute(`data-state`,e),C.setAttribute(`data-state`,e),e===`open`?(p.setAttribute(`data-open`,``),C.setAttribute(`data-open`,``),p.removeAttribute(`data-closed`),C.removeAttribute(`data-closed`)):(p.setAttribute(`data-closed`,``),C.setAttribute(`data-closed`,``),p.removeAttribute(`data-open`),C.removeAttribute(`data-open`))},pe=()=>{requestAnimationFrame(()=>{N&&document.contains(N)?c(N):S&&document.contains(S)&&c(S),N=null})},Z=i({element:C,onExitComplete:()=>{V||(B.restore(),C.hidden=!0,pe())}}),Q=e=>{M!==e&&(e?(N=document.activeElement,M=!0,g(S,`expanded`,!0),B.mount(),C.hidden=!1,X(`open`),Z.enter(),j&&!z&&(m(),z=!0),fe(),L=!1,Y(),q.start(),K(),q.update(),C.focus()):(M=!1,g(S,`expanded`,!1),X(`closed`),Y(),F=``,L=!1,z&&=(_(),!1),q.stop(),Z.exit()),a(p,`dropdown-menu:change`,{open:M}),re?.(M))},$=e=>{if(G(e))return;let t=e.dataset.value||e.textContent?.trim()||``;a(p,`dropdown-menu:select`,{value:t}),D?.(t),A&&Q(!1)},me=e=>{let t=U.length;if(t!==0)switch(e.key){case`ArrowDown`:e.preventDefault(),L=!0,J(P===-1?0:(P+1)%t);break;case`ArrowUp`:e.preventDefault(),L=!0,J(P===-1?t-1:(P-1+t)%t);break;case`Home`:e.preventDefault(),L=!0,J(0);break;case`End`:e.preventDefault(),L=!0,J(t-1);break;case`Enter`:case` `:e.preventDefault(),P>=0&&$(U[P]);break;case`Tab`:Q(!1);break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey&&(e.preventDefault(),he(e.key.toLowerCase()))}},he=e=>{I&&clearTimeout(I),I=setTimeout(()=>{F=``},500),F+=e;let t=U.findIndex(e=>(e.textContent?.trim().toLowerCase()||``).startsWith(F));if(t===-1&&F.length===1){let n=P+1;for(let r=0;r<U.length;r++){let i=(n+r)%U.length;if((U[i].textContent?.trim().toLowerCase()||``).startsWith(e)){t=i;break}}}t!==-1&&(L=!0,J(t))};return g(S,`expanded`,!1),C.hidden=!0,X(`closed`),R.push(h(S,`click`,()=>Q(!M)),h(S,`keydown`,e=>{(e.key===`Enter`||e.key===` `||e.key===`ArrowDown`)&&!M&&(e.preventDefault(),Q(!0))})),R.push(h(C,`keydown`,me),h(C,`click`,e=>{let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);t&&$(t)}),h(C,`pointermove`,e=>{let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);if(!(L&&(L=!1,t&&W.get(t)===P)))if(t&&!G(t)){let e=W.get(t);e!==void 0&&e!==P&&J(e,!1)}else Y()}),h(C,`pointerleave`,()=>{L||Y()})),R.push(t({root:p,isOpen:()=>M,onDismiss:()=>Q(!1),closeOnClickOutside:O,closeOnEscape:k})),R.push(h(p,`dropdown-menu:set`,e=>{let t=e.detail,n;t?.open===void 0?t?.value!==void 0&&(n=t.value):n=t.open,typeof n==`boolean`&&Q(n)})),ne&&Q(!0),{open:()=>Q(!0),close:()=>Q(!1),toggle:()=>Q(!M),get isOpen(){return M},destroy:()=>{V=!0,I&&clearTimeout(I),q.stop(),Z.cleanup(),B.cleanup(),z&&=(_(),!1),R.forEach(e=>e()),R.length=0,x.delete(p)}}}const x=new WeakSet;function S(e=document){let t=[];for(let n of p(e,`dropdown-menu`))x.has(n)||(x.add(n),t.push(b(n)));return t}export{S as create,b as createDropdownMenu};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@data-slot/dropdown-menu",
3
- "version": "0.2.55",
3
+ "version": "0.2.57",
4
4
  "type": "module",
5
5
  "sideEffects": false,
6
6
  "main": "./dist/index.cjs",
@@ -39,6 +39,6 @@
39
39
  ],
40
40
  "license": "MIT",
41
41
  "dependencies": {
42
- "@data-slot/core": "0.2.55"
42
+ "@data-slot/core": "0.2.57"
43
43
  }
44
44
  }