Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@contentful/f36-tooltip

Package Overview
Dependencies
Maintainers
142
Versions
342
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@contentful/f36-tooltip - npm Package Compare versions

Comparing version 4.21.5 to 4.21.6

4

dist/esm/index.js

@@ -8,5 +8,5 @@ import s, { useState, useRef, useEffect } from 'react';

var ie=Object.defineProperty;var d=Object.getOwnPropertySymbols;var L=Object.prototype.hasOwnProperty,K=Object.prototype.propertyIsEnumerable;var A=(t,o,e)=>o in t?ie(t,o,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[o]=e,g=(t,o)=>{for(var e in o||(o={}))L.call(o,e)&&A(t,e,o[e]);if(d)for(var e of d(o))K.call(o,e)&&A(t,e,o[e]);return t};var V=(t,o)=>{var e={};for(var n in t)L.call(t,n)&&o.indexOf(n)<0&&(e[n]=t[n]);if(t!=null&&d)for(var n of d(t))o.indexOf(n)<0&&K.call(t,n)&&(e[n]=t[n]);return e};var j=(t,o,e)=>new Promise((n,u)=>{var b=a=>{try{p(e.next(a));}catch(l){u(l);}},m=a=>{try{p(e.throw(a));}catch(l){u(l);}},p=a=>a.done?n(a.value):Promise.resolve(a.value).then(b,m);p((e=e.apply(t,o)).next());});var v=`calc(-1 * ((1rem * (10 / ${i.fontBaseDefault})) / 2))`,X=`calc(1rem * (10 / ${i.fontBaseDefault}))`;function q(){return {tooltipTargetWrapper:css({display:"inline-block",position:"relative"}),tooltip:css({background:i.gray900,fontFamily:i.fontStackPrimary,fontSize:i.fontSizeS,fontWeight:i.fontWeightNormal,fontStyle:"normal",textDecoration:"none",color:i.colorWhite,textAlign:"center",lineHeight:i.lineHeightM,padding:`${i.spacingXs} calc(1rem * (10 / ${i.fontBaseDefault}))`,borderRadius:i.borderRadiusMedium,whiteSpace:"normal"}),tooltipHidden:css({visibility:"hidden",pointerEvents:"none",zIndex:i.zIndexNegative}),tooltipContainer:css({"& > button[disabled]":{pointerEvents:"none"}}),tooltipArrow:css({position:"absolute",'&[data-placement*="top"]':{bottom:0,left:0,marginBottom:v},'&[data-placement*="right"]':{left:0,marginLeft:v},'&[data-placement*="bottom"]':{left:0,top:0,marginTop:v},'&[data-placement*="left"]':{right:0,marginRight:v},"&::before":{content:'""',display:"block",height:X,width:X,backgroundColor:i.gray900,transform:"rotate3d(0, 0, 1, 45deg)",zIndex:i.zIndexNegative}})}}var le=me=>{var N=me,{children:t,className:o,as:e="span",content:n,id:u,isVisible:b,hideDelay:m=0,onBlur:p,onFocus:a,onMouseLeave:l,onMouseOver:M,onKeyDown:C,showDelay:w=0,targetWrapperClassName:I,maxWidth:x=360,testId:Q="cf-ui-tooltip",placement:U="auto",usePortal:Y=!1,isDisabled:Z=!1}=N,_=V(N,["children","className","as","content","id","isVisible","hideDelay","onBlur","onFocus","onMouseLeave","onMouseOver","onKeyDown","showDelay","targetWrapperClassName","maxWidth","testId","placement","usePortal","isDisabled"]);let S=q(),[ee,z]=useState(!1),B=useId(u,"tooltip"),k=useRef(null),F=useRef(null),[te,oe]=useState(null),{styles:H,attributes:E,update:P}=usePopper(k.current,F.current,{placement:U,modifiers:[{name:"arrow",options:{element:te,padding:parseFloat(i.borderRadiusSmall)}},{name:"offset",options:{offset:[0,10]}}]});useEffect(()=>{(()=>j(void 0,null,function*(){P!==null&&(yield P());}))();},[n,P]);let[R,f]=useState(!1),[W,D]=useState(!1);useEffect(()=>{z(W||R);},[R,W]),useEffect(()=>{b&&z(!0);},[]);let ne=typeof x=="string"?x:`${x}px`,re=g({zIndex:i.zIndexTooltip,maxWidth:ne},H.popper);if(!n||Z)return s.createElement(Box,{as:e,className:I},t);let $=s.createElement(Box,g({as:"span",id:B,ref:F,role:"tooltip",style:re,className:cx(S.tooltip,o),testId:Q,onMouseEnter:()=>{D(!0);},onMouseLeave:()=>{D(!1);}},E.popper),s.createElement("span",null,n),s.createElement("span",{className:S.tooltipArrow,"data-placement":E.popper&&E.popper["data-popper-placement"],ref:oe,style:H.arrow}));return s.createElement(s.Fragment,null,ee?s.createElement(s.Fragment,null,Y?s.createElement(Portal,null,$):$):null,s.createElement(Box,g({as:e,ref:k,className:cx(S.tooltipContainer,I),onMouseEnter:r=>{setTimeout(()=>f(!0),w),M&&M(r);},onMouseLeave:r=>{setTimeout(()=>f(!1),m),l&&l(r);},onFocus:r=>{setTimeout(()=>f(!0),w),a&&a(r);},onBlur:r=>{setTimeout(()=>f(!1),m),p&&p(r);},onKeyDown:r=>{r.key==="Escape"&&setTimeout(()=>f(!1),m),C&&C(r);}},_),s.Children.map(t,r=>{if(s.isValidElement(r))return s.cloneElement(r,{"aria-describedby":B})})))};
var se=Object.defineProperty;var d=Object.getOwnPropertySymbols;var L=Object.prototype.hasOwnProperty,H=Object.prototype.propertyIsEnumerable;var A=(t,o,e)=>o in t?se(t,o,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[o]=e,y=(t,o)=>{for(var e in o||(o={}))L.call(o,e)&&A(t,e,o[e]);if(d)for(var e of d(o))H.call(o,e)&&A(t,e,o[e]);return t};var K=(t,o)=>{var e={};for(var n in t)L.call(t,n)&&o.indexOf(n)<0&&(e[n]=t[n]);if(t!=null&&d)for(var n of d(t))o.indexOf(n)<0&&H.call(t,n)&&(e[n]=t[n]);return e};var V=(t,o,e)=>new Promise((n,u)=>{var b=a=>{try{p(e.next(a));}catch(l){u(l);}},h=a=>{try{p(e.throw(a));}catch(l){u(l);}},p=a=>a.done?n(a.value):Promise.resolve(a.value).then(b,h);p((e=e.apply(t,o)).next());});var v=`calc(-1 * ((1rem * (10 / ${i.fontBaseDefault})) / 2))`,j=`calc(1rem * (10 / ${i.fontBaseDefault}))`;function X(){return {tooltipTargetWrapper:css({display:"inline-block",position:"relative"}),tooltip:css({background:i.gray900,fontFamily:i.fontStackPrimary,fontSize:i.fontSizeS,fontWeight:i.fontWeightNormal,fontStyle:"normal",textDecoration:"none",color:i.colorWhite,textAlign:"center",lineHeight:i.lineHeightM,padding:`${i.spacingXs} calc(1rem * (10 / ${i.fontBaseDefault}))`,borderRadius:i.borderRadiusMedium,whiteSpace:"normal"}),tooltipHidden:css({visibility:"hidden",pointerEvents:"none",zIndex:i.zIndexNegative}),tooltipContainer:css({"& > button[disabled]":{pointerEvents:"none"}}),tooltipArrow:css({position:"absolute",'&[data-placement*="top"]':{bottom:0,left:0,marginBottom:v},'&[data-placement*="right"]':{left:0,marginLeft:v},'&[data-placement*="bottom"]':{left:0,top:0,marginTop:v},'&[data-placement*="left"]':{right:0,marginRight:v},"&::before":{content:'""',display:"block",height:j,width:j,backgroundColor:i.gray900,transform:"rotate3d(0, 0, 1, 45deg)",zIndex:i.zIndexNegative}})}}var me=ce=>{var N=ce,{children:t,className:o,as:e="span",content:n,id:u,isVisible:b=!1,hideDelay:h=0,onBlur:p,onFocus:a,onMouseLeave:l,onMouseOver:M,onKeyDown:C,showDelay:Q=0,targetWrapperClassName:R,maxWidth:x=360,testId:U="cf-ui-tooltip",placement:Y="auto",usePortal:Z=!1,isDisabled:_=!1}=N,ee=K(N,["children","className","as","content","id","isVisible","hideDelay","onBlur","onFocus","onMouseLeave","onMouseOver","onKeyDown","showDelay","targetWrapperClassName","maxWidth","testId","placement","usePortal","isDisabled"]);let S=X(),[te,f]=useState(b),z=useId(u,"tooltip"),B=useRef(null),I=useRef(null),[oe,ne]=useState(null),{styles:k,attributes:T,update:E}=usePopper(B.current,I.current,{placement:Y,modifiers:[{name:"arrow",options:{element:oe,padding:parseFloat(i.borderRadiusSmall)}},{name:"offset",options:{offset:[0,10]}}]});useEffect(()=>{(()=>V(void 0,null,function*(){E!==null&&(yield E());}))();},[n,E]);let D=useRef(),F=useRef(),m=()=>{clearTimeout(D.current),clearTimeout(F.current);};useEffect(()=>m);let W=()=>{m(),D.current=setTimeout(()=>f(!0),Q);},P=()=>{m(),F.current=setTimeout(()=>f(!1),h);},re=typeof x=="string"?x:`${x}px`,ie=y({zIndex:i.zIndexTooltip,maxWidth:re},k.popper);if(!n||_)return s.createElement(Box,{as:e,className:R},t);let $=s.createElement(Box,y({as:"span",id:z,ref:I,role:"tooltip",style:ie,className:cx(S.tooltip,o),testId:U,onMouseEnter:()=>{m(),f(!0);},onMouseLeave:()=>{m(),f(!1);}},T.popper),s.createElement("span",null,n),s.createElement("span",{className:S.tooltipArrow,"data-placement":T.popper&&T.popper["data-popper-placement"],ref:ne,style:k.arrow}));return s.createElement(s.Fragment,null,te?s.createElement(s.Fragment,null,Z?s.createElement(Portal,null,$):$):null,s.createElement(Box,y({as:e,ref:B,className:cx(S.tooltipContainer,R),onMouseEnter:r=>{W(),M&&M(r);},onMouseLeave:r=>{P(),l&&l(r);},onFocus:r=>{W(),a&&a(r);},onBlur:r=>{P(),p&&p(r);},onKeyDown:r=>{r.key==="Escape"&&P(),C&&C(r);}},ee),s.Children.map(t,r=>{if(s.isValidElement(r))return s.cloneElement(r,{"aria-describedby":z})})))};
export { le as Tooltip };
export { me as Tooltip };
//# sourceMappingURL=index.js.map

@@ -17,5 +17,5 @@ 'use strict';

var ie=Object.defineProperty;var d=Object.getOwnPropertySymbols;var L=Object.prototype.hasOwnProperty,K=Object.prototype.propertyIsEnumerable;var A=(t,o,e)=>o in t?ie(t,o,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[o]=e,g=(t,o)=>{for(var e in o||(o={}))L.call(o,e)&&A(t,e,o[e]);if(d)for(var e of d(o))K.call(o,e)&&A(t,e,o[e]);return t};var V=(t,o)=>{var e={};for(var n in t)L.call(t,n)&&o.indexOf(n)<0&&(e[n]=t[n]);if(t!=null&&d)for(var n of d(t))o.indexOf(n)<0&&K.call(t,n)&&(e[n]=t[n]);return e};var j=(t,o,e)=>new Promise((n,u)=>{var b=a=>{try{p(e.next(a));}catch(l){u(l);}},m=a=>{try{p(e.throw(a));}catch(l){u(l);}},p=a=>a.done?n(a.value):Promise.resolve(a.value).then(b,m);p((e=e.apply(t,o)).next());});var v=`calc(-1 * ((1rem * (10 / ${i__default["default"].fontBaseDefault})) / 2))`,X=`calc(1rem * (10 / ${i__default["default"].fontBaseDefault}))`;function q(){return {tooltipTargetWrapper:emotion.css({display:"inline-block",position:"relative"}),tooltip:emotion.css({background:i__default["default"].gray900,fontFamily:i__default["default"].fontStackPrimary,fontSize:i__default["default"].fontSizeS,fontWeight:i__default["default"].fontWeightNormal,fontStyle:"normal",textDecoration:"none",color:i__default["default"].colorWhite,textAlign:"center",lineHeight:i__default["default"].lineHeightM,padding:`${i__default["default"].spacingXs} calc(1rem * (10 / ${i__default["default"].fontBaseDefault}))`,borderRadius:i__default["default"].borderRadiusMedium,whiteSpace:"normal"}),tooltipHidden:emotion.css({visibility:"hidden",pointerEvents:"none",zIndex:i__default["default"].zIndexNegative}),tooltipContainer:emotion.css({"& > button[disabled]":{pointerEvents:"none"}}),tooltipArrow:emotion.css({position:"absolute",'&[data-placement*="top"]':{bottom:0,left:0,marginBottom:v},'&[data-placement*="right"]':{left:0,marginLeft:v},'&[data-placement*="bottom"]':{left:0,top:0,marginTop:v},'&[data-placement*="left"]':{right:0,marginRight:v},"&::before":{content:'""',display:"block",height:X,width:X,backgroundColor:i__default["default"].gray900,transform:"rotate3d(0, 0, 1, 45deg)",zIndex:i__default["default"].zIndexNegative}})}}var le=me=>{var N=me,{children:t,className:o,as:e="span",content:n,id:u,isVisible:b,hideDelay:m=0,onBlur:p,onFocus:a,onMouseLeave:l,onMouseOver:M,onKeyDown:C,showDelay:w=0,targetWrapperClassName:I,maxWidth:x=360,testId:Q="cf-ui-tooltip",placement:U="auto",usePortal:Y=!1,isDisabled:Z=!1}=N,_=V(N,["children","className","as","content","id","isVisible","hideDelay","onBlur","onFocus","onMouseLeave","onMouseOver","onKeyDown","showDelay","targetWrapperClassName","maxWidth","testId","placement","usePortal","isDisabled"]);let S=q(),[ee,z]=s.useState(!1),B=f36Core.useId(u,"tooltip"),k=s.useRef(null),F=s.useRef(null),[te,oe]=s.useState(null),{styles:H,attributes:E,update:P}=reactPopper.usePopper(k.current,F.current,{placement:U,modifiers:[{name:"arrow",options:{element:te,padding:parseFloat(i__default["default"].borderRadiusSmall)}},{name:"offset",options:{offset:[0,10]}}]});s.useEffect(()=>{(()=>j(void 0,null,function*(){P!==null&&(yield P());}))();},[n,P]);let[R,f]=s.useState(!1),[W,D]=s.useState(!1);s.useEffect(()=>{z(W||R);},[R,W]),s.useEffect(()=>{b&&z(!0);},[]);let ne=typeof x=="string"?x:`${x}px`,re=g({zIndex:i__default["default"].zIndexTooltip,maxWidth:ne},H.popper);if(!n||Z)return s__default["default"].createElement(f36Core.Box,{as:e,className:I},t);let $=s__default["default"].createElement(f36Core.Box,g({as:"span",id:B,ref:F,role:"tooltip",style:re,className:emotion.cx(S.tooltip,o),testId:Q,onMouseEnter:()=>{D(!0);},onMouseLeave:()=>{D(!1);}},E.popper),s__default["default"].createElement("span",null,n),s__default["default"].createElement("span",{className:S.tooltipArrow,"data-placement":E.popper&&E.popper["data-popper-placement"],ref:oe,style:H.arrow}));return s__default["default"].createElement(s__default["default"].Fragment,null,ee?s__default["default"].createElement(s__default["default"].Fragment,null,Y?s__default["default"].createElement(f36Utils.Portal,null,$):$):null,s__default["default"].createElement(f36Core.Box,g({as:e,ref:k,className:emotion.cx(S.tooltipContainer,I),onMouseEnter:r=>{setTimeout(()=>f(!0),w),M&&M(r);},onMouseLeave:r=>{setTimeout(()=>f(!1),m),l&&l(r);},onFocus:r=>{setTimeout(()=>f(!0),w),a&&a(r);},onBlur:r=>{setTimeout(()=>f(!1),m),p&&p(r);},onKeyDown:r=>{r.key==="Escape"&&setTimeout(()=>f(!1),m),C&&C(r);}},_),s__default["default"].Children.map(t,r=>{if(s__default["default"].isValidElement(r))return s__default["default"].cloneElement(r,{"aria-describedby":B})})))};
var se=Object.defineProperty;var d=Object.getOwnPropertySymbols;var L=Object.prototype.hasOwnProperty,H=Object.prototype.propertyIsEnumerable;var A=(t,o,e)=>o in t?se(t,o,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[o]=e,y=(t,o)=>{for(var e in o||(o={}))L.call(o,e)&&A(t,e,o[e]);if(d)for(var e of d(o))H.call(o,e)&&A(t,e,o[e]);return t};var K=(t,o)=>{var e={};for(var n in t)L.call(t,n)&&o.indexOf(n)<0&&(e[n]=t[n]);if(t!=null&&d)for(var n of d(t))o.indexOf(n)<0&&H.call(t,n)&&(e[n]=t[n]);return e};var V=(t,o,e)=>new Promise((n,u)=>{var b=a=>{try{p(e.next(a));}catch(l){u(l);}},h=a=>{try{p(e.throw(a));}catch(l){u(l);}},p=a=>a.done?n(a.value):Promise.resolve(a.value).then(b,h);p((e=e.apply(t,o)).next());});var v=`calc(-1 * ((1rem * (10 / ${i__default["default"].fontBaseDefault})) / 2))`,j=`calc(1rem * (10 / ${i__default["default"].fontBaseDefault}))`;function X(){return {tooltipTargetWrapper:emotion.css({display:"inline-block",position:"relative"}),tooltip:emotion.css({background:i__default["default"].gray900,fontFamily:i__default["default"].fontStackPrimary,fontSize:i__default["default"].fontSizeS,fontWeight:i__default["default"].fontWeightNormal,fontStyle:"normal",textDecoration:"none",color:i__default["default"].colorWhite,textAlign:"center",lineHeight:i__default["default"].lineHeightM,padding:`${i__default["default"].spacingXs} calc(1rem * (10 / ${i__default["default"].fontBaseDefault}))`,borderRadius:i__default["default"].borderRadiusMedium,whiteSpace:"normal"}),tooltipHidden:emotion.css({visibility:"hidden",pointerEvents:"none",zIndex:i__default["default"].zIndexNegative}),tooltipContainer:emotion.css({"& > button[disabled]":{pointerEvents:"none"}}),tooltipArrow:emotion.css({position:"absolute",'&[data-placement*="top"]':{bottom:0,left:0,marginBottom:v},'&[data-placement*="right"]':{left:0,marginLeft:v},'&[data-placement*="bottom"]':{left:0,top:0,marginTop:v},'&[data-placement*="left"]':{right:0,marginRight:v},"&::before":{content:'""',display:"block",height:j,width:j,backgroundColor:i__default["default"].gray900,transform:"rotate3d(0, 0, 1, 45deg)",zIndex:i__default["default"].zIndexNegative}})}}var me=ce=>{var N=ce,{children:t,className:o,as:e="span",content:n,id:u,isVisible:b=!1,hideDelay:h=0,onBlur:p,onFocus:a,onMouseLeave:l,onMouseOver:M,onKeyDown:C,showDelay:Q=0,targetWrapperClassName:R,maxWidth:x=360,testId:U="cf-ui-tooltip",placement:Y="auto",usePortal:Z=!1,isDisabled:_=!1}=N,ee=K(N,["children","className","as","content","id","isVisible","hideDelay","onBlur","onFocus","onMouseLeave","onMouseOver","onKeyDown","showDelay","targetWrapperClassName","maxWidth","testId","placement","usePortal","isDisabled"]);let S=X(),[te,f]=s.useState(b),z=f36Core.useId(u,"tooltip"),B=s.useRef(null),I=s.useRef(null),[oe,ne]=s.useState(null),{styles:k,attributes:T,update:E}=reactPopper.usePopper(B.current,I.current,{placement:Y,modifiers:[{name:"arrow",options:{element:oe,padding:parseFloat(i__default["default"].borderRadiusSmall)}},{name:"offset",options:{offset:[0,10]}}]});s.useEffect(()=>{(()=>V(void 0,null,function*(){E!==null&&(yield E());}))();},[n,E]);let D=s.useRef(),F=s.useRef(),m=()=>{clearTimeout(D.current),clearTimeout(F.current);};s.useEffect(()=>m);let W=()=>{m(),D.current=setTimeout(()=>f(!0),Q);},P=()=>{m(),F.current=setTimeout(()=>f(!1),h);},re=typeof x=="string"?x:`${x}px`,ie=y({zIndex:i__default["default"].zIndexTooltip,maxWidth:re},k.popper);if(!n||_)return s__default["default"].createElement(f36Core.Box,{as:e,className:R},t);let $=s__default["default"].createElement(f36Core.Box,y({as:"span",id:z,ref:I,role:"tooltip",style:ie,className:emotion.cx(S.tooltip,o),testId:U,onMouseEnter:()=>{m(),f(!0);},onMouseLeave:()=>{m(),f(!1);}},T.popper),s__default["default"].createElement("span",null,n),s__default["default"].createElement("span",{className:S.tooltipArrow,"data-placement":T.popper&&T.popper["data-popper-placement"],ref:ne,style:k.arrow}));return s__default["default"].createElement(s__default["default"].Fragment,null,te?s__default["default"].createElement(s__default["default"].Fragment,null,Z?s__default["default"].createElement(f36Utils.Portal,null,$):$):null,s__default["default"].createElement(f36Core.Box,y({as:e,ref:B,className:emotion.cx(S.tooltipContainer,R),onMouseEnter:r=>{W(),M&&M(r);},onMouseLeave:r=>{P(),l&&l(r);},onFocus:r=>{W(),a&&a(r);},onBlur:r=>{P(),p&&p(r);},onKeyDown:r=>{r.key==="Escape"&&P(),C&&C(r);}},ee),s__default["default"].Children.map(t,r=>{if(s__default["default"].isValidElement(r))return s__default["default"].cloneElement(r,{"aria-describedby":z})})))};
exports.Tooltip = le;
exports.Tooltip = me;
//# sourceMappingURL=index.js.map
{
"name": "@contentful/f36-tooltip",
"version": "4.21.5",
"version": "4.21.6",
"description": "Forma 36: Tooltip component",

@@ -9,5 +9,5 @@ "scripts": {

"dependencies": {
"@contentful/f36-core": "^4.21.5",
"@contentful/f36-core": "^4.21.6",
"@contentful/f36-tokens": "^4.0.1",
"@contentful/f36-utils": "^4.21.5",
"@contentful/f36-utils": "^4.21.6",
"@popperjs/core": "^2.11.5",

@@ -14,0 +14,0 @@ "csstype": "^3.1.1",

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc