@data-slot/tooltip 0.2.90 → 0.2.91
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 +1 -0
- package/dist/index.cjs +1 -1
- package/dist/index.js +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -173,6 +173,7 @@ The component sets these attributes automatically:
|
|
|
173
173
|
Position is computed in JavaScript and applied to the positioner as `position: absolute` + `transform: translate3d(...)`.
|
|
174
174
|
By default, content is portaled to `document.body` while open.
|
|
175
175
|
Use `data-open` / `data-closed`, `data-side`, and `data-align` for styling and animations.
|
|
176
|
+
Placement uses layout dimensions, so `scale`/`zoom` animations on `tooltip-content` remain stable without adding an extra wrapper.
|
|
176
177
|
|
|
177
178
|
### Recommended CSS
|
|
178
179
|
|
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:
|
|
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;
|
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
|
|
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};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@data-slot/tooltip",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.91",
|
|
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.
|
|
41
|
+
"@data-slot/core": "0.2.91"
|
|
42
42
|
}
|
|
43
43
|
}
|