@data-slot/tooltip 0.2.90 → 0.2.92

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
@@ -74,12 +74,19 @@ const tooltip = createTooltip(element, {
74
74
 
75
75
  Options can also be set via data attributes. JS options take precedence.
76
76
 
77
+ Placement attributes (`data-side`, `data-align`, `data-side-offset`, `data-align-offset`, `data-avoid-collisions`, `data-collision-padding`) resolve in this order:
78
+
79
+ 1. JavaScript option
80
+ 2. `tooltip-content`
81
+ 3. `tooltip-positioner`
82
+ 4. `tooltip` root (fallback)
83
+
77
84
  | Attribute | Type | Default | Description |
78
85
  |-----------|------|---------|-------------|
79
86
  | `data-delay` | number | `300` | Delay before showing tooltip (ms) |
80
87
  | `data-skip-delay-duration` | number | `300` | Duration to skip delay after closing (ms) |
81
- | `data-side` | string | `"top"` | Side relative to trigger (checked on content first, then root) |
82
- | `data-align` | string | `"center"` | Alignment along the side (checked on content first, then root) |
88
+ | `data-side` | string | `"top"` | Side relative to trigger |
89
+ | `data-align` | string | `"center"` | Alignment along the side |
83
90
  | `data-side-offset` | number | `4` | Distance from trigger (px) |
84
91
  | `data-align-offset` | number | `0` | Alignment edge offset (px) |
85
92
  | `data-avoid-collisions` | boolean | `true` | Collision handling |
@@ -173,6 +180,7 @@ The component sets these attributes automatically:
173
180
  Position is computed in JavaScript and applied to the positioner as `position: absolute` + `transform: translate3d(...)`.
174
181
  By default, content is portaled to `document.body` while open.
175
182
  Use `data-open` / `data-closed`, `data-side`, and `data-align` for styling and animations.
183
+ Placement uses layout dimensions, so `scale`/`zoom` animations on `tooltip-content` remain stable without adding an extra wrapper.
176
184
 
177
185
  ### Recommended CSS
178
186
 
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@data-slot/core`),t=0;const n=[`top`,`right`,`bottom`,`left`],r=[`start`,`center`,`end`];function i(i,a={}){let o=(0,e.getPart)(i,`tooltip-trigger`),s=(0,e.getPart)(i,`tooltip-content`),c=(0,e.getPart)(i,`tooltip-positioner`),l=c&&s&&c.contains(s)?c:null,u=(0,e.getPart)(i,`tooltip-portal`),d=u&&l&&u.contains(l)?u:null;if(!o||!s)throw Error(`Tooltip requires trigger and content slots`);let f=a.delay??(0,e.getDataNumber)(i,`delay`)??300,p=a.skipDelayDuration??(0,e.getDataNumber)(i,`skipDelayDuration`)??300,m=a.onOpenChange,h=a.portal??(0,e.getDataBool)(s,`portal`)??(0,e.getDataBool)(i,`portal`)??!0,g=a.side??(0,e.getDataEnum)(s,`side`,n)??(0,e.getDataEnum)(i,`side`,n)??`top`,_=a.align??(0,e.getDataEnum)(s,`align`,r)??(0,e.getDataEnum)(i,`align`,r)??`center`,v=a.sideOffset??(0,e.getDataNumber)(s,`sideOffset`)??(0,e.getDataNumber)(i,`sideOffset`)??4,y=a.alignOffset??(0,e.getDataNumber)(s,`alignOffset`)??(0,e.getDataNumber)(i,`alignOffset`)??0,b=a.avoidCollisions??(0,e.getDataBool)(s,`avoidCollisions`)??(0,e.getDataBool)(i,`avoidCollisions`)??!0,x=a.collisionPadding??(0,e.getDataNumber)(s,`collisionPadding`)??(0,e.getDataNumber)(i,`collisionPadding`)??8,S=!1,C=!1,w=!1,T=!1,E=null,D=[],O=(0,e.createPortalLifecycle)({content:s,root:i,enabled:h,wrapperSlot:l?void 0:`tooltip-positioner`,container:l??void 0,mountTarget:l?d??l:void 0}),k=(0,e.ensureId)(s,`tooltip-content`);s.setAttribute(`role`,`tooltip`),s.setAttribute(`data-side`,g),s.setAttribute(`data-align`,_);let A=e=>{let t=O.container;if(i.setAttribute(`data-state`,e),s.setAttribute(`data-state`,e),t!==s&&t.setAttribute(`data-state`,e),e===`open`){i.setAttribute(`data-open`,``),s.setAttribute(`data-open`,``),t!==s&&t.setAttribute(`data-open`,``),C?(i.setAttribute(`data-instant`,``),s.setAttribute(`data-instant`,``),t!==s&&t.setAttribute(`data-instant`,``)):(i.removeAttribute(`data-instant`),s.removeAttribute(`data-instant`),t!==s&&t.removeAttribute(`data-instant`)),i.removeAttribute(`data-closed`),s.removeAttribute(`data-closed`),t!==s&&t.removeAttribute(`data-closed`);return}i.setAttribute(`data-closed`,``),s.setAttribute(`data-closed`,``),t!==s&&t.setAttribute(`data-closed`,``),i.removeAttribute(`data-instant`),s.removeAttribute(`data-instant`),t!==s&&t.removeAttribute(`data-instant`),i.removeAttribute(`data-open`),s.removeAttribute(`data-open`),t!==s&&t.removeAttribute(`data-open`)},j=()=>{let t=O.container,n=i.ownerDocument.defaultView??window,r=(0,e.computeFloatingPosition)({anchorRect:o.getBoundingClientRect(),contentRect:s.getBoundingClientRect(),side:g,align:_,sideOffset:v,alignOffset:y,avoidCollisions:b,collisionPadding:x});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`,s.setAttribute(`data-side`,r.side),s.setAttribute(`data-align`,r.align),t!==s&&(t.setAttribute(`data-side`,r.side),t.setAttribute(`data-align`,r.align))},M=(0,e.createPresenceLifecycle)({element:s,onExitComplete:()=>{T||(O.restore(),s.hidden=!0)}}),N=(0,e.createPositionSync)({observedElements:[o,s],isActive:()=>S,ancestorScroll:!1,onUpdate:j}),P=()=>o.hasAttribute(`disabled`)||o.getAttribute(`aria-disabled`)===`true`,F=(n,r,a=!1)=>{S!==n&&(!n&&S&&p>0&&(t=Date.now()+p),C=n?a:!1,S=n,S?(o.setAttribute(`aria-describedby`,k),s.setAttribute(`aria-hidden`,`false`),O.mount(),s.hidden=!1,A(`open`),M.enter(),j(),N.start(),N.update()):(A(`closed`),o.removeAttribute(`aria-describedby`),s.setAttribute(`aria-hidden`,`true`),M.exit(),N.stop()),(0,e.emit)(i,`tooltip:change`,{open:S,trigger:o,content:s,reason:r}),m?.(S))},I=e=>{if(E&&=(clearTimeout(E),null),Date.now()<t){F(!0,e,!0);return}E=setTimeout(()=>{F(!0,e),E=null},f)},L=e=>{E&&=(clearTimeout(E),null),F(!1,e)};return s.hidden=!0,s.setAttribute(`aria-hidden`,`true`),A(`closed`),D.push((0,e.on)(o,`pointerenter`,e=>{e.pointerType!==`touch`&&(P()||I(`pointer`))}),(0,e.on)(o,`pointerleave`,e=>{if(e.pointerType===`touch`||w)return;let t=e.relatedTarget;t&&s.contains(t)||L(`pointer`)}),(0,e.on)(o,`focus`,()=>{w=!0,!P()&&I(`focus`)}),(0,e.on)(o,`blur`,()=>{w=!1,L(`blur`)})),D.push((0,e.on)(s,`pointerleave`,e=>{if(e.pointerType===`touch`||w)return;let t=e.relatedTarget;t&&o.contains(t)||L(`pointer`)})),D.push((0,e.on)(i,`tooltip:set`,e=>{let t=e.detail,n;if(t?.open===void 0?t?.value!==void 0&&(n=t.value):n=t.open,typeof n==`boolean`)if(n){if(P())return;E&&=(clearTimeout(E),null),F(!0,`api`)}else L(`api`)})),D.push((0,e.createDismissLayer)({root:i,isOpen:()=>S,onDismiss:()=>L(`escape`),closeOnClickOutside:!1,closeOnEscape:!0,preventEscapeDefault:!1})),{show:()=>{P()||(E&&=(clearTimeout(E),null),F(!0,`api`))},hide:()=>L(`api`),get isOpen(){return S},destroy:()=>{T=!0,E&&clearTimeout(E),N.stop(),M.cleanup(),O.cleanup(),D.forEach(e=>e()),D.length=0}}}const a=new WeakSet;function o(t=document){let n=[];for(let r of(0,e.getRoots)(t,`tooltip`))a.has(r)||(a.add(r),n.push(i(r)));return n}exports.create=o,exports.createTooltip=i;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@data-slot/core`),t=0;const n=[`top`,`right`,`bottom`,`left`],r=[`start`,`center`,`end`];function i(i,a={}){let o=(0,e.getPart)(i,`tooltip-trigger`),s=(0,e.getPart)(i,`tooltip-content`),c=(0,e.getPart)(i,`tooltip-positioner`),l=c&&s&&c.contains(s)?c:null,u=(0,e.getPart)(i,`tooltip-portal`),d=u&&l&&u.contains(l)?u:null;if(!o||!s)throw Error(`Tooltip requires trigger and content slots`);let f=a.delay??(0,e.getDataNumber)(i,`delay`)??300,p=a.skipDelayDuration??(0,e.getDataNumber)(i,`skipDelayDuration`)??300,m=a.onOpenChange,h=a.portal??(0,e.getDataBool)(s,`portal`)??(0,e.getDataBool)(i,`portal`)??!0,g=(t,n)=>(0,e.getDataEnum)(s,t,n)??(l?(0,e.getDataEnum)(l,t,n):void 0)??(0,e.getDataEnum)(i,t,n),_=t=>(0,e.getDataNumber)(s,t)??(l?(0,e.getDataNumber)(l,t):void 0)??(0,e.getDataNumber)(i,t),v=t=>(0,e.getDataBool)(s,t)??(l?(0,e.getDataBool)(l,t):void 0)??(0,e.getDataBool)(i,t),y=a.side??g(`side`,n)??`top`,b=a.align??g(`align`,r)??`center`,x=a.sideOffset??_(`sideOffset`)??4,S=a.alignOffset??_(`alignOffset`)??0,C=a.avoidCollisions??v(`avoidCollisions`)??!0,w=a.collisionPadding??_(`collisionPadding`)??8,T=!1,E=!1,D=!1,O=!1,k=null,A=[],j=(0,e.createPortalLifecycle)({content:s,root:i,enabled:h,wrapperSlot:l?void 0:`tooltip-positioner`,container:l??void 0,mountTarget:l?d??l:void 0}),M=(0,e.ensureId)(s,`tooltip-content`);s.setAttribute(`role`,`tooltip`),s.setAttribute(`data-side`,y),s.setAttribute(`data-align`,b);let N=e=>{let t=j.container;if(i.setAttribute(`data-state`,e),s.setAttribute(`data-state`,e),t!==s&&t.setAttribute(`data-state`,e),e===`open`){i.setAttribute(`data-open`,``),s.setAttribute(`data-open`,``),t!==s&&t.setAttribute(`data-open`,``),E?(i.setAttribute(`data-instant`,``),s.setAttribute(`data-instant`,``),t!==s&&t.setAttribute(`data-instant`,``)):(i.removeAttribute(`data-instant`),s.removeAttribute(`data-instant`),t!==s&&t.removeAttribute(`data-instant`)),i.removeAttribute(`data-closed`),s.removeAttribute(`data-closed`),t!==s&&t.removeAttribute(`data-closed`);return}i.setAttribute(`data-closed`,``),s.setAttribute(`data-closed`,``),t!==s&&t.setAttribute(`data-closed`,``),i.removeAttribute(`data-instant`),s.removeAttribute(`data-instant`),t!==s&&t.removeAttribute(`data-instant`),i.removeAttribute(`data-open`),s.removeAttribute(`data-open`),t!==s&&t.removeAttribute(`data-open`)},P=()=>{let t=j.container,n=i.ownerDocument.defaultView??window,r=(0,e.computeFloatingPosition)({anchorRect:o.getBoundingClientRect(),contentRect:(0,e.measurePopupContentRect)(s),side:y,align:b,sideOffset:x,alignOffset:S,avoidCollisions:C,collisionPadding:w});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`,s.setAttribute(`data-side`,r.side),s.setAttribute(`data-align`,r.align),t!==s&&(t.setAttribute(`data-side`,r.side),t.setAttribute(`data-align`,r.align))},F=(0,e.createPresenceLifecycle)({element:s,onExitComplete:()=>{O||(j.restore(),s.hidden=!0)}}),I=(0,e.createPositionSync)({observedElements:[o,s],isActive:()=>T,ancestorScroll:!1,onUpdate:P}),L=()=>o.hasAttribute(`disabled`)||o.getAttribute(`aria-disabled`)===`true`,R=(n,r,a=!1)=>{T!==n&&(!n&&T&&p>0&&(t=Date.now()+p),E=n?a:!1,T=n,T?(o.setAttribute(`aria-describedby`,M),s.setAttribute(`aria-hidden`,`false`),j.mount(),s.hidden=!1,N(`open`),F.enter(),P(),I.start(),I.update()):(N(`closed`),o.removeAttribute(`aria-describedby`),s.setAttribute(`aria-hidden`,`true`),F.exit(),I.stop()),(0,e.emit)(i,`tooltip:change`,{open:T,trigger:o,content:s,reason:r}),m?.(T))},z=e=>{if(k&&=(clearTimeout(k),null),Date.now()<t){R(!0,e,!0);return}k=setTimeout(()=>{R(!0,e),k=null},f)},B=e=>{k&&=(clearTimeout(k),null),R(!1,e)};return s.hidden=!0,s.setAttribute(`aria-hidden`,`true`),N(`closed`),A.push((0,e.on)(o,`pointerenter`,e=>{e.pointerType!==`touch`&&(L()||z(`pointer`))}),(0,e.on)(o,`pointerleave`,e=>{if(e.pointerType===`touch`||D)return;let t=e.relatedTarget;t&&s.contains(t)||B(`pointer`)}),(0,e.on)(o,`focus`,()=>{D=!0,!L()&&z(`focus`)}),(0,e.on)(o,`blur`,()=>{D=!1,B(`blur`)})),A.push((0,e.on)(s,`pointerleave`,e=>{if(e.pointerType===`touch`||D)return;let t=e.relatedTarget;t&&o.contains(t)||B(`pointer`)})),A.push((0,e.on)(i,`tooltip:set`,e=>{let t=e.detail,n;if(t?.open===void 0?t?.value!==void 0&&(n=t.value):n=t.open,typeof n==`boolean`)if(n){if(L())return;k&&=(clearTimeout(k),null),R(!0,`api`)}else B(`api`)})),A.push((0,e.createDismissLayer)({root:i,isOpen:()=>T,onDismiss:()=>B(`escape`),closeOnClickOutside:!1,closeOnEscape:!0,preventEscapeDefault:!1})),{show:()=>{L()||(k&&=(clearTimeout(k),null),R(!0,`api`))},hide:()=>B(`api`),get isOpen(){return T},destroy:()=>{O=!0,k&&clearTimeout(k),I.stop(),F.cleanup(),j.cleanup(),A.forEach(e=>e()),A.length=0}}}const a=new WeakSet;function o(t=document){let n=[];for(let r of(0,e.getRoots)(t,`tooltip`))a.has(r)||(a.add(r),n.push(i(r)));return n}exports.create=o,exports.createTooltip=i;
package/dist/index.d.cts CHANGED
@@ -47,7 +47,7 @@ interface TooltipController {
47
47
  * </div>
48
48
  * ```
49
49
  *
50
- * Data attributes (checked on content first, then root):
50
+ * Placement data attributes are resolved as: content -> authored positioner -> root.
51
51
  * - `data-side`: 'top' | 'right' | 'bottom' | 'left' (bind-time preferred side)
52
52
  * - `data-align`: 'start' | 'center' | 'end' (bind-time preferred align)
53
53
  * - `data-side-offset`: number (px)
package/dist/index.d.ts CHANGED
@@ -47,7 +47,7 @@ interface TooltipController {
47
47
  * </div>
48
48
  * ```
49
49
  *
50
- * Data attributes (checked on content first, then root):
50
+ * Placement data attributes are resolved as: content -> authored positioner -> root.
51
51
  * - `data-side`: 'top' | 'right' | 'bottom' | 'left' (bind-time preferred side)
52
52
  * - `data-align`: 'start' | 'center' | 'end' (bind-time preferred align)
53
53
  * - `data-side-offset`: number (px)
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,getDataBool as s,getDataEnum as c,getDataNumber as l,getPart as u,getRoots as d,on as f}from"@data-slot/core";let p=0;const m=[`top`,`right`,`bottom`,`left`],h=[`start`,`center`,`end`];function g(d,g={}){let _=u(d,`tooltip-trigger`),v=u(d,`tooltip-content`),y=u(d,`tooltip-positioner`),b=y&&v&&y.contains(v)?y:null,x=u(d,`tooltip-portal`),S=x&&b&&x.contains(b)?x:null;if(!_||!v)throw Error(`Tooltip requires trigger and content slots`);let C=g.delay??l(d,`delay`)??300,w=g.skipDelayDuration??l(d,`skipDelayDuration`)??300,T=g.onOpenChange,E=g.portal??s(v,`portal`)??s(d,`portal`)??!0,D=g.side??c(v,`side`,m)??c(d,`side`,m)??`top`,O=g.align??c(v,`align`,h)??c(d,`align`,h)??`center`,k=g.sideOffset??l(v,`sideOffset`)??l(d,`sideOffset`)??4,A=g.alignOffset??l(v,`alignOffset`)??l(d,`alignOffset`)??0,j=g.avoidCollisions??s(v,`avoidCollisions`)??s(d,`avoidCollisions`)??!0,M=g.collisionPadding??l(v,`collisionPadding`)??l(d,`collisionPadding`)??8,N=!1,P=!1,F=!1,I=!1,L=null,R=[],z=n({content:v,root:d,enabled:E,wrapperSlot:b?void 0:`tooltip-positioner`,container:b??void 0,mountTarget:b?S??b:void 0}),B=o(v,`tooltip-content`);v.setAttribute(`role`,`tooltip`),v.setAttribute(`data-side`,D),v.setAttribute(`data-align`,O);let V=e=>{let t=z.container;if(d.setAttribute(`data-state`,e),v.setAttribute(`data-state`,e),t!==v&&t.setAttribute(`data-state`,e),e===`open`){d.setAttribute(`data-open`,``),v.setAttribute(`data-open`,``),t!==v&&t.setAttribute(`data-open`,``),P?(d.setAttribute(`data-instant`,``),v.setAttribute(`data-instant`,``),t!==v&&t.setAttribute(`data-instant`,``)):(d.removeAttribute(`data-instant`),v.removeAttribute(`data-instant`),t!==v&&t.removeAttribute(`data-instant`)),d.removeAttribute(`data-closed`),v.removeAttribute(`data-closed`),t!==v&&t.removeAttribute(`data-closed`);return}d.setAttribute(`data-closed`,``),v.setAttribute(`data-closed`,``),t!==v&&t.setAttribute(`data-closed`,``),d.removeAttribute(`data-instant`),v.removeAttribute(`data-instant`),t!==v&&t.removeAttribute(`data-instant`),d.removeAttribute(`data-open`),v.removeAttribute(`data-open`),t!==v&&t.removeAttribute(`data-open`)},H=()=>{let t=z.container,n=d.ownerDocument.defaultView??window,r=e({anchorRect:_.getBoundingClientRect(),contentRect:v.getBoundingClientRect(),side:D,align:O,sideOffset:k,alignOffset:A,avoidCollisions:j,collisionPadding:M});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`,v.setAttribute(`data-side`,r.side),v.setAttribute(`data-align`,r.align),t!==v&&(t.setAttribute(`data-side`,r.side),t.setAttribute(`data-align`,r.align))},U=i({element:v,onExitComplete:()=>{I||(z.restore(),v.hidden=!0)}}),W=r({observedElements:[_,v],isActive:()=>N,ancestorScroll:!1,onUpdate:H}),G=()=>_.hasAttribute(`disabled`)||_.getAttribute(`aria-disabled`)===`true`,K=(e,t,n=!1)=>{N!==e&&(!e&&N&&w>0&&(p=Date.now()+w),P=e?n:!1,N=e,N?(_.setAttribute(`aria-describedby`,B),v.setAttribute(`aria-hidden`,`false`),z.mount(),v.hidden=!1,V(`open`),U.enter(),H(),W.start(),W.update()):(V(`closed`),_.removeAttribute(`aria-describedby`),v.setAttribute(`aria-hidden`,`true`),U.exit(),W.stop()),a(d,`tooltip:change`,{open:N,trigger:_,content:v,reason:t}),T?.(N))},q=e=>{if(L&&=(clearTimeout(L),null),Date.now()<p){K(!0,e,!0);return}L=setTimeout(()=>{K(!0,e),L=null},C)},J=e=>{L&&=(clearTimeout(L),null),K(!1,e)};return v.hidden=!0,v.setAttribute(`aria-hidden`,`true`),V(`closed`),R.push(f(_,`pointerenter`,e=>{e.pointerType!==`touch`&&(G()||q(`pointer`))}),f(_,`pointerleave`,e=>{if(e.pointerType===`touch`||F)return;let t=e.relatedTarget;t&&v.contains(t)||J(`pointer`)}),f(_,`focus`,()=>{F=!0,!G()&&q(`focus`)}),f(_,`blur`,()=>{F=!1,J(`blur`)})),R.push(f(v,`pointerleave`,e=>{if(e.pointerType===`touch`||F)return;let t=e.relatedTarget;t&&_.contains(t)||J(`pointer`)})),R.push(f(d,`tooltip:set`,e=>{let t=e.detail,n;if(t?.open===void 0?t?.value!==void 0&&(n=t.value):n=t.open,typeof n==`boolean`)if(n){if(G())return;L&&=(clearTimeout(L),null),K(!0,`api`)}else J(`api`)})),R.push(t({root:d,isOpen:()=>N,onDismiss:()=>J(`escape`),closeOnClickOutside:!1,closeOnEscape:!0,preventEscapeDefault:!1})),{show:()=>{G()||(L&&=(clearTimeout(L),null),K(!0,`api`))},hide:()=>J(`api`),get isOpen(){return N},destroy:()=>{I=!0,L&&clearTimeout(L),W.stop(),U.cleanup(),z.cleanup(),R.forEach(e=>e()),R.length=0}}}const _=new WeakSet;function v(e=document){let t=[];for(let n of d(e,`tooltip`))_.has(n)||(_.add(n),t.push(g(n)));return t}export{v as create,g as createTooltip};
1
+ import{computeFloatingPosition as e,createDismissLayer as t,createPortalLifecycle as n,createPositionSync as r,createPresenceLifecycle as i,emit as a,ensureId as o,getDataBool as s,getDataEnum as c,getDataNumber as l,getPart as u,getRoots as d,measurePopupContentRect as f,on as p}from"@data-slot/core";let m=0;const h=[`top`,`right`,`bottom`,`left`],g=[`start`,`center`,`end`];function _(d,_={}){let v=u(d,`tooltip-trigger`),y=u(d,`tooltip-content`),b=u(d,`tooltip-positioner`),x=b&&y&&b.contains(y)?b:null,S=u(d,`tooltip-portal`),C=S&&x&&S.contains(x)?S:null;if(!v||!y)throw Error(`Tooltip requires trigger and content slots`);let w=_.delay??l(d,`delay`)??300,T=_.skipDelayDuration??l(d,`skipDelayDuration`)??300,E=_.onOpenChange,D=_.portal??s(y,`portal`)??s(d,`portal`)??!0,O=(e,t)=>c(y,e,t)??(x?c(x,e,t):void 0)??c(d,e,t),k=e=>l(y,e)??(x?l(x,e):void 0)??l(d,e),A=e=>s(y,e)??(x?s(x,e):void 0)??s(d,e),j=_.side??O(`side`,h)??`top`,M=_.align??O(`align`,g)??`center`,N=_.sideOffset??k(`sideOffset`)??4,P=_.alignOffset??k(`alignOffset`)??0,F=_.avoidCollisions??A(`avoidCollisions`)??!0,I=_.collisionPadding??k(`collisionPadding`)??8,L=!1,R=!1,z=!1,B=!1,V=null,H=[],U=n({content:y,root:d,enabled:D,wrapperSlot:x?void 0:`tooltip-positioner`,container:x??void 0,mountTarget:x?C??x:void 0}),W=o(y,`tooltip-content`);y.setAttribute(`role`,`tooltip`),y.setAttribute(`data-side`,j),y.setAttribute(`data-align`,M);let G=e=>{let t=U.container;if(d.setAttribute(`data-state`,e),y.setAttribute(`data-state`,e),t!==y&&t.setAttribute(`data-state`,e),e===`open`){d.setAttribute(`data-open`,``),y.setAttribute(`data-open`,``),t!==y&&t.setAttribute(`data-open`,``),R?(d.setAttribute(`data-instant`,``),y.setAttribute(`data-instant`,``),t!==y&&t.setAttribute(`data-instant`,``)):(d.removeAttribute(`data-instant`),y.removeAttribute(`data-instant`),t!==y&&t.removeAttribute(`data-instant`)),d.removeAttribute(`data-closed`),y.removeAttribute(`data-closed`),t!==y&&t.removeAttribute(`data-closed`);return}d.setAttribute(`data-closed`,``),y.setAttribute(`data-closed`,``),t!==y&&t.setAttribute(`data-closed`,``),d.removeAttribute(`data-instant`),y.removeAttribute(`data-instant`),t!==y&&t.removeAttribute(`data-instant`),d.removeAttribute(`data-open`),y.removeAttribute(`data-open`),t!==y&&t.removeAttribute(`data-open`)},K=()=>{let t=U.container,n=d.ownerDocument.defaultView??window,r=e({anchorRect:v.getBoundingClientRect(),contentRect:f(y),side:j,align:M,sideOffset:N,alignOffset:P,avoidCollisions:F,collisionPadding:I});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`,y.setAttribute(`data-side`,r.side),y.setAttribute(`data-align`,r.align),t!==y&&(t.setAttribute(`data-side`,r.side),t.setAttribute(`data-align`,r.align))},q=i({element:y,onExitComplete:()=>{B||(U.restore(),y.hidden=!0)}}),J=r({observedElements:[v,y],isActive:()=>L,ancestorScroll:!1,onUpdate:K}),Y=()=>v.hasAttribute(`disabled`)||v.getAttribute(`aria-disabled`)===`true`,X=(e,t,n=!1)=>{L!==e&&(!e&&L&&T>0&&(m=Date.now()+T),R=e?n:!1,L=e,L?(v.setAttribute(`aria-describedby`,W),y.setAttribute(`aria-hidden`,`false`),U.mount(),y.hidden=!1,G(`open`),q.enter(),K(),J.start(),J.update()):(G(`closed`),v.removeAttribute(`aria-describedby`),y.setAttribute(`aria-hidden`,`true`),q.exit(),J.stop()),a(d,`tooltip:change`,{open:L,trigger:v,content:y,reason:t}),E?.(L))},Z=e=>{if(V&&=(clearTimeout(V),null),Date.now()<m){X(!0,e,!0);return}V=setTimeout(()=>{X(!0,e),V=null},w)},Q=e=>{V&&=(clearTimeout(V),null),X(!1,e)};return y.hidden=!0,y.setAttribute(`aria-hidden`,`true`),G(`closed`),H.push(p(v,`pointerenter`,e=>{e.pointerType!==`touch`&&(Y()||Z(`pointer`))}),p(v,`pointerleave`,e=>{if(e.pointerType===`touch`||z)return;let t=e.relatedTarget;t&&y.contains(t)||Q(`pointer`)}),p(v,`focus`,()=>{z=!0,!Y()&&Z(`focus`)}),p(v,`blur`,()=>{z=!1,Q(`blur`)})),H.push(p(y,`pointerleave`,e=>{if(e.pointerType===`touch`||z)return;let t=e.relatedTarget;t&&v.contains(t)||Q(`pointer`)})),H.push(p(d,`tooltip:set`,e=>{let t=e.detail,n;if(t?.open===void 0?t?.value!==void 0&&(n=t.value):n=t.open,typeof n==`boolean`)if(n){if(Y())return;V&&=(clearTimeout(V),null),X(!0,`api`)}else Q(`api`)})),H.push(t({root:d,isOpen:()=>L,onDismiss:()=>Q(`escape`),closeOnClickOutside:!1,closeOnEscape:!0,preventEscapeDefault:!1})),{show:()=>{Y()||(V&&=(clearTimeout(V),null),X(!0,`api`))},hide:()=>Q(`api`),get isOpen(){return L},destroy:()=>{B=!0,V&&clearTimeout(V),J.stop(),q.cleanup(),U.cleanup(),H.forEach(e=>e()),H.length=0}}}const v=new WeakSet;function y(e=document){let t=[];for(let n of d(e,`tooltip`))v.has(n)||(v.add(n),t.push(_(n)));return t}export{y as create,_ as createTooltip};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@data-slot/tooltip",
3
- "version": "0.2.90",
3
+ "version": "0.2.92",
4
4
  "type": "module",
5
5
  "sideEffects": false,
6
6
  "main": "./dist/index.cjs",
@@ -38,6 +38,6 @@
38
38
  ],
39
39
  "license": "MIT",
40
40
  "dependencies": {
41
- "@data-slot/core": "0.2.90"
41
+ "@data-slot/core": "0.2.92"
42
42
  }
43
43
  }