@contentful/f36-tooltip - npm Package Compare versions

Comparing version 4.0.1-next-v4-8833.2358 to 4.0.1-next-v4-8846.2359

dist/main.js

		@@ -1,2 +0,2 @@
		var e=d(require("@babel/runtime/helpers/extends")),{cx:t,css:o}=require("emotion"),n=require("react"),a=d(n),{useRef:r,useEffect:l,useState:i}=n,{usePopper:s}=require("react-popper"),p=d(require("@contentful/f36-tokens")),{Portal:c}=require("@contentful/f36-utils"),{useId:u,Box:m}=require("@contentful/f36-core");function d(e){return e&&e.__esModule?e.default:e}var f,g,b,y,h={};f=h,g="Tooltip",b=()=>v,Object.defineProperty(f,g,{get:b,set:y,enumerable:!0,configurable:!0});const E=`calc(-1 * ((1rem * (10 / ${p.fontBaseDefault})) / 2))`,x=`calc(1rem * (10 / ${p.fontBaseDefault}))`;const v=({children:n,className:d,as:f="span",content:g,id:b,isVisible:y,hideDelay:h=0,onBlur:v,onFocus:M,onMouseLeave:I,onMouseOver:N,onKeyDown:k,targetWrapperClassName:q,maxWidth:w=360,testId:z="cf-ui-tooltip",placement:D="auto",usePortal:S=!1,isDisabled:B=!1,...T})=>{const W={tooltipTargetWrapper:o({name:"b3pn3b",styles:"display:inline-block;position:relative;"}),tooltip:o({background:p.gray900,fontFamily:p.fontStackPrimary,fontSize:p.fontSizeS,fontWeight:p.fontWeightNormal,fontStyle:"normal",textDecoration:"none",color:p.colorWhite,textAlign:"center",lineHeight:p.lineHeightM,padding:`${p.spacingXs} calc(1rem * (10 / ${p.fontBaseDefault}))`,borderRadius:p.borderRadiusMedium,whiteSpace:"normal"},""),tooltipHidden:o({visibility:"hidden",pointerEvents:"none",zIndex:p.zIndexNegative},""),tooltipContainer:o({name:"1nqn0g6",styles:"& > button[disabled]{pointer-events:none;}"}),tooltipArrow:o({position:"absolute",'&[data-placement="top"]':{bottom:0,left:0,marginBottom:E},'&[data-placement="right"]':{left:0,marginLeft:E},'&[data-placement="bottom"]':{left:0,top:0,marginTop:E},'&[data-placement="left"]':{right:0,marginRight:E},"&::before":{content:'""',display:"block",height:x,width:x,backgroundColor:p.gray900,transform:"rotate3d(0, 0, 1, 45deg)",zIndex:p.zIndexNegative}},"")},[F,P]=i(!1),C=u(b,"tooltip"),R=r(null),$=r(null),[L,O]=i(null),{styles:_,attributes:j,forceUpdate:A}=s(R.current,$.current,{placement:D,modifiers:[{name:"arrow",options:{element:L,padding:parseFloat(p.borderRadiusSmall)}},{name:"offset",options:{offset:[0,10]}}]});l((()=>{null!==A&&A()}),[g,A]);const[H,K]=i(!1),[V,U]=i(!1);l((()=>{P(V\|\|H)}),[H,V]),l((()=>{y&&P(!0)}),[]);const X="string"==typeof w?w:`${w}px`,G={zIndex:p.zIndexTooltip,maxWidth:X,..._.popper};if(!g\|\|B)return a.createElement(m,{as:f,className:q},n);const J=a.createElement(m,e({as:"span",id:C,ref:$,role:"tooltip",style:G,className:t(W.tooltip,d),testId:z,onMouseEnter:()=>{U(!0)},onMouseLeave:()=>{U(!1)}},j.popper),a.createElement("span",null,g),a.createElement("span",{className:W.tooltipArrow,"data-placement":j.popper&&j.popper["data-popper-placement"],ref:O,style:_.arrow}));return a.createElement(a.Fragment,null,F?a.createElement(a.Fragment,null,S?a.createElement(c,null,J):J):null,a.createElement(m,e({as:f,ref:R,className:t(W.tooltipContainer,q),onMouseEnter:e=>{K(!0),N&&N(e)},onMouseLeave:e=>{setTimeout((()=>K(!1)),h),I&&I(e)},onFocus:e=>{K(!0),M&&M(e)},onBlur:e=>{setTimeout((()=>K(!1)),h),v&&v(e)},onKeyDown:e=>{"Escape"===e.key&&setTimeout((()=>K(!1)),h),k&&k(e)}},T),a.Children.map(n,(e=>{if(a.isValidElement(e))return a.cloneElement(e,{"aria-describedby":C})}))))};var M,I;M=module.exports,I=h,Object.keys(I).forEach((function(e){"default"!==e&&"__esModule"!==e&&Object.defineProperty(M,e,{enumerable:!0,get:function(){return I[e]}})}));
		var e=d(require("@babel/runtime/helpers/extends")),{cx:t,css:o}=require("emotion"),n=require("react"),a=d(n),{useEffect:r,useRef:l,useState:i}=n,{usePopper:s}=require("react-popper"),p=d(require("@contentful/f36-tokens")),{Portal:c}=require("@contentful/f36-utils"),{Box:u,useId:m}=require("@contentful/f36-core");function d(e){return e&&e.__esModule?e.default:e}var f,g,b,y,h={};f=h,g="Tooltip",b=()=>v,Object.defineProperty(f,g,{get:b,set:y,enumerable:!0,configurable:!0});const E=`calc(-1 * ((1rem * (10 / ${p.fontBaseDefault})) / 2))`,x=`calc(1rem * (10 / ${p.fontBaseDefault}))`;const v=({children:n,className:d,as:f="span",content:g,id:b,isVisible:y,hideDelay:h=0,onBlur:v,onFocus:M,onMouseLeave:I,onMouseOver:N,onKeyDown:k,targetWrapperClassName:q,maxWidth:w=360,testId:z="cf-ui-tooltip",placement:D="auto",usePortal:S=!1,isDisabled:B=!1,...T})=>{const W={tooltipTargetWrapper:o({name:"b3pn3b",styles:"display:inline-block;position:relative;"}),tooltip:o({background:p.gray900,fontFamily:p.fontStackPrimary,fontSize:p.fontSizeS,fontWeight:p.fontWeightNormal,fontStyle:"normal",textDecoration:"none",color:p.colorWhite,textAlign:"center",lineHeight:p.lineHeightM,padding:`${p.spacingXs} calc(1rem * (10 / ${p.fontBaseDefault}))`,borderRadius:p.borderRadiusMedium,whiteSpace:"normal"},""),tooltipHidden:o({visibility:"hidden",pointerEvents:"none",zIndex:p.zIndexNegative},""),tooltipContainer:o({name:"1nqn0g6",styles:"& > button[disabled]{pointer-events:none;}"}),tooltipArrow:o({position:"absolute",'&[data-placement="top"]':{bottom:0,left:0,marginBottom:E},'&[data-placement="right"]':{left:0,marginLeft:E},'&[data-placement="bottom"]':{left:0,top:0,marginTop:E},'&[data-placement="left"]':{right:0,marginRight:E},"&::before":{content:'""',display:"block",height:x,width:x,backgroundColor:p.gray900,transform:"rotate3d(0, 0, 1, 45deg)",zIndex:p.zIndexNegative}},"")},[F,P]=i(!1),C=m(b,"tooltip"),R=l(null),$=l(null),[L,O]=i(null),{styles:_,attributes:j,forceUpdate:A}=s(R.current,$.current,{placement:D,modifiers:[{name:"arrow",options:{element:L,padding:parseFloat(p.borderRadiusSmall)}},{name:"offset",options:{offset:[0,10]}}]});r((()=>{null!==A&&A()}),[g,A]);const[H,K]=i(!1),[V,U]=i(!1);r((()=>{P(V\|\|H)}),[H,V]),r((()=>{y&&P(!0)}),[]);const X="string"==typeof w?w:`${w}px`,G={zIndex:p.zIndexTooltip,maxWidth:X,..._.popper};if(!g\|\|B)return a.createElement(u,{as:f,className:q},n);const J=a.createElement(u,e({as:"span",id:C,ref:$,role:"tooltip",style:G,className:t(W.tooltip,d),testId:z,onMouseEnter:()=>{U(!0)},onMouseLeave:()=>{U(!1)}},j.popper),a.createElement("span",null,g),a.createElement("span",{className:W.tooltipArrow,"data-placement":j.popper&&j.popper["data-popper-placement"],ref:O,style:_.arrow}));return a.createElement(a.Fragment,null,F?a.createElement(a.Fragment,null,S?a.createElement(c,null,J):J):null,a.createElement(u,e({as:f,ref:R,className:t(W.tooltipContainer,q),onMouseEnter:e=>{K(!0),N&&N(e)},onMouseLeave:e=>{setTimeout((()=>K(!1)),h),I&&I(e)},onFocus:e=>{K(!0),M&&M(e)},onBlur:e=>{setTimeout((()=>K(!1)),h),v&&v(e)},onKeyDown:e=>{"Escape"===e.key&&setTimeout((()=>K(!1)),h),k&&k(e)}},T),a.Children.map(n,(e=>{if(a.isValidElement(e))return a.cloneElement(e,{"aria-describedby":C})}))))};var M,I;M=module.exports,I=h,Object.keys(I).forEach((function(e){"default"!==e&&"__esModule"!==e&&Object.defineProperty(M,e,{enumerable:!0,get:function(){return I[e]}})}));
		//# sourceMappingURL=main.js.map

dist/module.js

		@@ -1,2 +0,2 @@
		import e from"@babel/runtime/helpers/esm/extends";import{cx as t,css as o}from"emotion";import n,{useEffect as a,useRef as r,useState as l}from"react";import{usePopper as i}from"react-popper";import s from"@contentful/f36-tokens";import{Portal as p}from"@contentful/f36-utils";import{useId as m,Box as c}from"@contentful/f36-core";var d,u,f,g;d={},u="Tooltip",f=()=>h,Object.defineProperty(d,u,{get:f,set:g,enumerable:!0,configurable:!0});const b=`calc(-1 * ((1rem * (10 / ${s.fontBaseDefault})) / 2))`,y=`calc(1rem * (10 / ${s.fontBaseDefault}))`;const h=({children:d,className:u,as:f="span",content:g,id:h,isVisible:x,hideDelay:E=0,onBlur:v,onFocus:I,onMouseLeave:N,onMouseOver:w,onKeyDown:z,targetWrapperClassName:D,maxWidth:M=360,testId:S="cf-ui-tooltip",placement:T="auto",usePortal:k=!1,isDisabled:B=!1,...W})=>{const F={tooltipTargetWrapper:o({name:"b3pn3b",styles:"display:inline-block;position:relative;"}),tooltip:o({background:s.gray900,fontFamily:s.fontStackPrimary,fontSize:s.fontSizeS,fontWeight:s.fontWeightNormal,fontStyle:"normal",textDecoration:"none",color:s.colorWhite,textAlign:"center",lineHeight:s.lineHeightM,padding:`${s.spacingXs} calc(1rem * (10 / ${s.fontBaseDefault}))`,borderRadius:s.borderRadiusMedium,whiteSpace:"normal"},""),tooltipHidden:o({visibility:"hidden",pointerEvents:"none",zIndex:s.zIndexNegative},""),tooltipContainer:o({name:"1nqn0g6",styles:"& > button[disabled]{pointer-events:none;}"}),tooltipArrow:o({position:"absolute",'&[data-placement="top"]':{bottom:0,left:0,marginBottom:b},'&[data-placement="right"]':{left:0,marginLeft:b},'&[data-placement="bottom"]':{left:0,top:0,marginTop:b},'&[data-placement="left"]':{right:0,marginRight:b},"&::before":{content:'""',display:"block",height:y,width:y,backgroundColor:s.gray900,transform:"rotate3d(0, 0, 1, 45deg)",zIndex:s.zIndexNegative}},"")},[C,P]=l(!1),R=m(h,"tooltip"),$=r(null),L=r(null),[A,H]=l(null),{styles:K,attributes:O,forceUpdate:V}=i($.current,L.current,{placement:T,modifiers:[{name:"arrow",options:{element:A,padding:parseFloat(s.borderRadiusSmall)}},{name:"offset",options:{offset:[0,10]}}]});a((()=>{null!==V&&V()}),[g,V]);const[j,q]=l(!1),[U,X]=l(!1);a((()=>{P(U\|\|j)}),[j,U]),a((()=>{x&&P(!0)}),[]);const G="string"==typeof M?M:`${M}px`,J={zIndex:s.zIndexTooltip,maxWidth:G,...K.popper};if(!g\|\|B)return n.createElement(c,{as:f,className:D},d);const Q=n.createElement(c,e({as:"span",id:R,ref:L,role:"tooltip",style:J,className:t(F.tooltip,u),testId:S,onMouseEnter:()=>{X(!0)},onMouseLeave:()=>{X(!1)}},O.popper),n.createElement("span",null,g),n.createElement("span",{className:F.tooltipArrow,"data-placement":O.popper&&O.popper["data-popper-placement"],ref:H,style:K.arrow}));return n.createElement(n.Fragment,null,C?n.createElement(n.Fragment,null,k?n.createElement(p,null,Q):Q):null,n.createElement(c,e({as:f,ref:$,className:t(F.tooltipContainer,D),onMouseEnter:e=>{q(!0),w&&w(e)},onMouseLeave:e=>{setTimeout((()=>q(!1)),E),N&&N(e)},onFocus:e=>{q(!0),I&&I(e)},onBlur:e=>{setTimeout((()=>q(!1)),E),v&&v(e)},onKeyDown:e=>{"Escape"===e.key&&setTimeout((()=>q(!1)),E),z&&z(e)}},W),n.Children.map(d,(e=>{if(n.isValidElement(e))return n.cloneElement(e,{"aria-describedby":R})}))))};export{h as Tooltip};
		import e from"@babel/runtime/helpers/esm/extends";import{cx as t,css as o}from"emotion";import n,{useRef as a,useEffect as r,useState as l}from"react";import{usePopper as i}from"react-popper";import s from"@contentful/f36-tokens";import{Portal as p}from"@contentful/f36-utils";import{Box as m,useId as c}from"@contentful/f36-core";var d,u,f,g;d={},u="Tooltip",f=()=>h,Object.defineProperty(d,u,{get:f,set:g,enumerable:!0,configurable:!0});const b=`calc(-1 * ((1rem * (10 / ${s.fontBaseDefault})) / 2))`,y=`calc(1rem * (10 / ${s.fontBaseDefault}))`;const h=({children:d,className:u,as:f="span",content:g,id:h,isVisible:x,hideDelay:E=0,onBlur:v,onFocus:I,onMouseLeave:N,onMouseOver:w,onKeyDown:z,targetWrapperClassName:D,maxWidth:M=360,testId:S="cf-ui-tooltip",placement:T="auto",usePortal:k=!1,isDisabled:B=!1,...W})=>{const F={tooltipTargetWrapper:o({name:"b3pn3b",styles:"display:inline-block;position:relative;"}),tooltip:o({background:s.gray900,fontFamily:s.fontStackPrimary,fontSize:s.fontSizeS,fontWeight:s.fontWeightNormal,fontStyle:"normal",textDecoration:"none",color:s.colorWhite,textAlign:"center",lineHeight:s.lineHeightM,padding:`${s.spacingXs} calc(1rem * (10 / ${s.fontBaseDefault}))`,borderRadius:s.borderRadiusMedium,whiteSpace:"normal"},""),tooltipHidden:o({visibility:"hidden",pointerEvents:"none",zIndex:s.zIndexNegative},""),tooltipContainer:o({name:"1nqn0g6",styles:"& > button[disabled]{pointer-events:none;}"}),tooltipArrow:o({position:"absolute",'&[data-placement="top"]':{bottom:0,left:0,marginBottom:b},'&[data-placement="right"]':{left:0,marginLeft:b},'&[data-placement="bottom"]':{left:0,top:0,marginTop:b},'&[data-placement="left"]':{right:0,marginRight:b},"&::before":{content:'""',display:"block",height:y,width:y,backgroundColor:s.gray900,transform:"rotate3d(0, 0, 1, 45deg)",zIndex:s.zIndexNegative}},"")},[C,P]=l(!1),R=c(h,"tooltip"),$=a(null),L=a(null),[A,H]=l(null),{styles:K,attributes:O,forceUpdate:V}=i($.current,L.current,{placement:T,modifiers:[{name:"arrow",options:{element:A,padding:parseFloat(s.borderRadiusSmall)}},{name:"offset",options:{offset:[0,10]}}]});r((()=>{null!==V&&V()}),[g,V]);const[j,q]=l(!1),[U,X]=l(!1);r((()=>{P(U\|\|j)}),[j,U]),r((()=>{x&&P(!0)}),[]);const G="string"==typeof M?M:`${M}px`,J={zIndex:s.zIndexTooltip,maxWidth:G,...K.popper};if(!g\|\|B)return n.createElement(m,{as:f,className:D},d);const Q=n.createElement(m,e({as:"span",id:R,ref:L,role:"tooltip",style:J,className:t(F.tooltip,u),testId:S,onMouseEnter:()=>{X(!0)},onMouseLeave:()=>{X(!1)}},O.popper),n.createElement("span",null,g),n.createElement("span",{className:F.tooltipArrow,"data-placement":O.popper&&O.popper["data-popper-placement"],ref:H,style:K.arrow}));return n.createElement(n.Fragment,null,C?n.createElement(n.Fragment,null,k?n.createElement(p,null,Q):Q):null,n.createElement(m,e({as:f,ref:$,className:t(F.tooltipContainer,D),onMouseEnter:e=>{q(!0),w&&w(e)},onMouseLeave:e=>{setTimeout((()=>q(!1)),E),N&&N(e)},onFocus:e=>{q(!0),I&&I(e)},onBlur:e=>{setTimeout((()=>q(!1)),E),v&&v(e)},onKeyDown:e=>{"Escape"===e.key&&setTimeout((()=>q(!1)),E),z&&z(e)}},W),n.Children.map(d,(e=>{if(n.isValidElement(e))return n.cloneElement(e,{"aria-describedby":R})}))))};export{h as Tooltip};
		//# sourceMappingURL=module.js.map

package.json

		{
		"name": "@contentful/f36-tooltip",
		"version": "4.0.1-next-v4-8833.2358+af70ad0c",
		"version": "4.0.1-next-v4-8846.2359+3923eeac",
		"description": "Forma 36: Tooltip component",
		@@ -10,5 +10,5 @@ "scripts": {
		"@babel/runtime": "^7.6.2",
		"@contentful/f36-core": "4.0.1-next-v4-8833.2358+af70ad0c",
		"@contentful/f36-tokens": "4.0.1-next-v4-8833.2358+af70ad0c",
		"@contentful/f36-utils": "4.0.1-next-v4-8833.2358+af70ad0c",
		"@contentful/f36-core": "4.0.1-next-v4-8846.2359+3923eeac",
		"@contentful/f36-tokens": "4.0.1-next-v4-8846.2359+3923eeac",
		"@contentful/f36-utils": "4.0.1-next-v4-8846.2359+3923eeac",
		"@popperjs/core": "^2.4.4",
		@@ -40,3 +40,3 @@ "csstype": "^3.0.5",
		},
		"gitHead": "af70ad0cf28270b7ed279bd3e1cb5449fe86d9c1"
		"gitHead": "3923eeacefff259b5ee0cf9fc916006f3d240e8d"
		}

@contentful/f36-tooltip - npm Package Compare versions

New alerts

Fixed alerts

Dependency changes