@data-slot/tooltip 0.2.91 → 0.2.93

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 |
@@ -172,6 +179,7 @@ The component sets these attributes automatically:
172
179
 
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.
182
+ The positioned element (`tooltip-positioner`, or `tooltip-content` when `portal` is disabled) gets `--transform-origin`, which `tooltip-content` can use for transform animations via CSS inheritance.
175
183
  Use `data-open` / `data-closed`, `data-side`, and `data-align` for styling and animations.
176
184
  Placement uses layout dimensions, so `scale`/`zoom` animations on `tooltip-content` remain stable without adding an extra wrapper.
177
185
 
@@ -185,7 +193,7 @@ The visibility transition trick keeps the tooltip visible during fade-out, then
185
193
  opacity: 0;
186
194
  visibility: hidden;
187
195
  pointer-events: none;
188
- transform-origin: center;
196
+ transform-origin: var(--transform-origin, center);
189
197
  transition: opacity 0.15s ease, visibility 0s linear 0.15s;
190
198
  }
191
199
 
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:(0,e.measurePopupContentRect)(s),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=o.getBoundingClientRect(),a=(0,e.computeFloatingPosition)({anchorRect:r,contentRect:(0,e.measurePopupContentRect)(s),side:y,align:b,sideOffset:x,alignOffset:S,avoidCollisions:C,collisionPadding:w}),c=(0,e.computeFloatingTransformOrigin)({side:a.side,align:a.align,anchorRect:r,popupX:a.x,popupY:a.y});t.style.position=`absolute`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${a.x+n.scrollX}px, ${a.y+n.scrollY}px, 0)`,t.style.setProperty(`--transform-origin`,c),t.style.willChange=`transform`,t.style.margin=`0`,s.setAttribute(`data-side`,a.side),s.setAttribute(`data-align`,a.align),t!==s&&(t.setAttribute(`data-side`,a.side),t.setAttribute(`data-align`,a.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,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=_.side??c(y,`side`,h)??c(d,`side`,h)??`top`,k=_.align??c(y,`align`,g)??c(d,`align`,g)??`center`,A=_.sideOffset??l(y,`sideOffset`)??l(d,`sideOffset`)??4,j=_.alignOffset??l(y,`alignOffset`)??l(d,`alignOffset`)??0,M=_.avoidCollisions??s(y,`avoidCollisions`)??s(d,`avoidCollisions`)??!0,N=_.collisionPadding??l(y,`collisionPadding`)??l(d,`collisionPadding`)??8,P=!1,F=!1,I=!1,L=!1,R=null,z=[],B=n({content:y,root:d,enabled:D,wrapperSlot:x?void 0:`tooltip-positioner`,container:x??void 0,mountTarget:x?C??x:void 0}),V=o(y,`tooltip-content`);y.setAttribute(`role`,`tooltip`),y.setAttribute(`data-side`,O),y.setAttribute(`data-align`,k);let H=e=>{let t=B.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`,``),F?(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`)},U=()=>{let t=B.container,n=d.ownerDocument.defaultView??window,r=e({anchorRect:v.getBoundingClientRect(),contentRect:f(y),side:O,align:k,sideOffset:A,alignOffset:j,avoidCollisions:M,collisionPadding:N});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))},W=i({element:y,onExitComplete:()=>{L||(B.restore(),y.hidden=!0)}}),G=r({observedElements:[v,y],isActive:()=>P,ancestorScroll:!1,onUpdate:U}),K=()=>v.hasAttribute(`disabled`)||v.getAttribute(`aria-disabled`)===`true`,q=(e,t,n=!1)=>{P!==e&&(!e&&P&&T>0&&(m=Date.now()+T),F=e?n:!1,P=e,P?(v.setAttribute(`aria-describedby`,V),y.setAttribute(`aria-hidden`,`false`),B.mount(),y.hidden=!1,H(`open`),W.enter(),U(),G.start(),G.update()):(H(`closed`),v.removeAttribute(`aria-describedby`),y.setAttribute(`aria-hidden`,`true`),W.exit(),G.stop()),a(d,`tooltip:change`,{open:P,trigger:v,content:y,reason:t}),E?.(P))},J=e=>{if(R&&=(clearTimeout(R),null),Date.now()<m){q(!0,e,!0);return}R=setTimeout(()=>{q(!0,e),R=null},w)},Y=e=>{R&&=(clearTimeout(R),null),q(!1,e)};return y.hidden=!0,y.setAttribute(`aria-hidden`,`true`),H(`closed`),z.push(p(v,`pointerenter`,e=>{e.pointerType!==`touch`&&(K()||J(`pointer`))}),p(v,`pointerleave`,e=>{if(e.pointerType===`touch`||I)return;let t=e.relatedTarget;t&&y.contains(t)||Y(`pointer`)}),p(v,`focus`,()=>{I=!0,!K()&&J(`focus`)}),p(v,`blur`,()=>{I=!1,Y(`blur`)})),z.push(p(y,`pointerleave`,e=>{if(e.pointerType===`touch`||I)return;let t=e.relatedTarget;t&&v.contains(t)||Y(`pointer`)})),z.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(K())return;R&&=(clearTimeout(R),null),q(!0,`api`)}else Y(`api`)})),z.push(t({root:d,isOpen:()=>P,onDismiss:()=>Y(`escape`),closeOnClickOutside:!1,closeOnEscape:!0,preventEscapeDefault:!1})),{show:()=>{K()||(R&&=(clearTimeout(R),null),q(!0,`api`))},hide:()=>Y(`api`),get isOpen(){return P},destroy:()=>{L=!0,R&&clearTimeout(R),G.stop(),W.cleanup(),B.cleanup(),z.forEach(e=>e()),z.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};
1
+ import{computeFloatingPosition as e,computeFloatingTransformOrigin as t,createDismissLayer as n,createPortalLifecycle as r,createPositionSync as i,createPresenceLifecycle as a,emit as o,ensureId as s,getDataBool as c,getDataEnum as l,getDataNumber as u,getPart as d,getRoots as f,measurePopupContentRect as p,on as m}from"@data-slot/core";let h=0;const g=[`top`,`right`,`bottom`,`left`],_=[`start`,`center`,`end`];function v(f,v={}){let y=d(f,`tooltip-trigger`),b=d(f,`tooltip-content`),x=d(f,`tooltip-positioner`),S=x&&b&&x.contains(b)?x:null,C=d(f,`tooltip-portal`),w=C&&S&&C.contains(S)?C:null;if(!y||!b)throw Error(`Tooltip requires trigger and content slots`);let T=v.delay??u(f,`delay`)??300,E=v.skipDelayDuration??u(f,`skipDelayDuration`)??300,D=v.onOpenChange,O=v.portal??c(b,`portal`)??c(f,`portal`)??!0,k=(e,t)=>l(b,e,t)??(S?l(S,e,t):void 0)??l(f,e,t),A=e=>u(b,e)??(S?u(S,e):void 0)??u(f,e),j=e=>c(b,e)??(S?c(S,e):void 0)??c(f,e),M=v.side??k(`side`,g)??`top`,N=v.align??k(`align`,_)??`center`,P=v.sideOffset??A(`sideOffset`)??4,F=v.alignOffset??A(`alignOffset`)??0,I=v.avoidCollisions??j(`avoidCollisions`)??!0,L=v.collisionPadding??A(`collisionPadding`)??8,R=!1,z=!1,B=!1,V=!1,H=null,U=[],W=r({content:b,root:f,enabled:O,wrapperSlot:S?void 0:`tooltip-positioner`,container:S??void 0,mountTarget:S?w??S:void 0}),G=s(b,`tooltip-content`);b.setAttribute(`role`,`tooltip`),b.setAttribute(`data-side`,M),b.setAttribute(`data-align`,N);let K=e=>{let t=W.container;if(f.setAttribute(`data-state`,e),b.setAttribute(`data-state`,e),t!==b&&t.setAttribute(`data-state`,e),e===`open`){f.setAttribute(`data-open`,``),b.setAttribute(`data-open`,``),t!==b&&t.setAttribute(`data-open`,``),z?(f.setAttribute(`data-instant`,``),b.setAttribute(`data-instant`,``),t!==b&&t.setAttribute(`data-instant`,``)):(f.removeAttribute(`data-instant`),b.removeAttribute(`data-instant`),t!==b&&t.removeAttribute(`data-instant`)),f.removeAttribute(`data-closed`),b.removeAttribute(`data-closed`),t!==b&&t.removeAttribute(`data-closed`);return}f.setAttribute(`data-closed`,``),b.setAttribute(`data-closed`,``),t!==b&&t.setAttribute(`data-closed`,``),f.removeAttribute(`data-instant`),b.removeAttribute(`data-instant`),t!==b&&t.removeAttribute(`data-instant`),f.removeAttribute(`data-open`),b.removeAttribute(`data-open`),t!==b&&t.removeAttribute(`data-open`)},q=()=>{let n=W.container,r=f.ownerDocument.defaultView??window,i=y.getBoundingClientRect(),a=e({anchorRect:i,contentRect:p(b),side:M,align:N,sideOffset:P,alignOffset:F,avoidCollisions:I,collisionPadding:L}),o=t({side:a.side,align:a.align,anchorRect:i,popupX:a.x,popupY:a.y});n.style.position=`absolute`,n.style.top=`0px`,n.style.left=`0px`,n.style.transform=`translate3d(${a.x+r.scrollX}px, ${a.y+r.scrollY}px, 0)`,n.style.setProperty(`--transform-origin`,o),n.style.willChange=`transform`,n.style.margin=`0`,b.setAttribute(`data-side`,a.side),b.setAttribute(`data-align`,a.align),n!==b&&(n.setAttribute(`data-side`,a.side),n.setAttribute(`data-align`,a.align))},J=a({element:b,onExitComplete:()=>{V||(W.restore(),b.hidden=!0)}}),Y=i({observedElements:[y,b],isActive:()=>R,ancestorScroll:!1,onUpdate:q}),X=()=>y.hasAttribute(`disabled`)||y.getAttribute(`aria-disabled`)===`true`,Z=(e,t,n=!1)=>{R!==e&&(!e&&R&&E>0&&(h=Date.now()+E),z=e?n:!1,R=e,R?(y.setAttribute(`aria-describedby`,G),b.setAttribute(`aria-hidden`,`false`),W.mount(),b.hidden=!1,K(`open`),J.enter(),q(),Y.start(),Y.update()):(K(`closed`),y.removeAttribute(`aria-describedby`),b.setAttribute(`aria-hidden`,`true`),J.exit(),Y.stop()),o(f,`tooltip:change`,{open:R,trigger:y,content:b,reason:t}),D?.(R))},Q=e=>{if(H&&=(clearTimeout(H),null),Date.now()<h){Z(!0,e,!0);return}H=setTimeout(()=>{Z(!0,e),H=null},T)},$=e=>{H&&=(clearTimeout(H),null),Z(!1,e)};return b.hidden=!0,b.setAttribute(`aria-hidden`,`true`),K(`closed`),U.push(m(y,`pointerenter`,e=>{e.pointerType!==`touch`&&(X()||Q(`pointer`))}),m(y,`pointerleave`,e=>{if(e.pointerType===`touch`||B)return;let t=e.relatedTarget;t&&b.contains(t)||$(`pointer`)}),m(y,`focus`,()=>{B=!0,!X()&&Q(`focus`)}),m(y,`blur`,()=>{B=!1,$(`blur`)})),U.push(m(b,`pointerleave`,e=>{if(e.pointerType===`touch`||B)return;let t=e.relatedTarget;t&&y.contains(t)||$(`pointer`)})),U.push(m(f,`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(X())return;H&&=(clearTimeout(H),null),Z(!0,`api`)}else $(`api`)})),U.push(n({root:f,isOpen:()=>R,onDismiss:()=>$(`escape`),closeOnClickOutside:!1,closeOnEscape:!0,preventEscapeDefault:!1})),{show:()=>{X()||(H&&=(clearTimeout(H),null),Z(!0,`api`))},hide:()=>$(`api`),get isOpen(){return R},destroy:()=>{V=!0,H&&clearTimeout(H),Y.stop(),J.cleanup(),W.cleanup(),U.forEach(e=>e()),U.length=0}}}const y=new WeakSet;function b(e=document){let t=[];for(let n of f(e,`tooltip`))y.has(n)||(y.add(n),t.push(v(n)));return t}export{b as create,v as createTooltip};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@data-slot/tooltip",
3
- "version": "0.2.91",
3
+ "version": "0.2.93",
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.91"
41
+ "@data-slot/core": "0.2.93"
42
42
  }
43
43
  }