@ebay/ui-core-react
Version:
Skin components build off React
2 lines (1 loc) • 3.65 kB
JavaScript
const _=require("./tslib.es6-C4EgNkz1.js"),a=require("react"),b=require("classnames"),T=require("./forwardRef-DBQKIlPy.js"),i=require("./utils-C9NL3q0j.js"),h=require("./icon-CR8ApQBy.js"),u=s=>{var{children:o,className:n,forwardedRef:e}=s,t=_.__rest(s,["children","className","forwardedRef"]);return a.Children.only(o),a.cloneElement(o,Object.assign(Object.assign({ref:e},t),{className:b(n,o.props.className)}))},g=s=>{var o,{className:n,type:e,isExpanded:t,children:r,forwardedRef:p}=s,m=_.__rest(s,["className","type","isExpanded","children","forwardedRef"]);const l=i.findComponent(r,u),c=i.excludeComponent(r,u)[0];if(!l)throw new Error("Tooltip: Please use a TooltipHost that defines the host of the tooltip");const d=a.cloneElement(l,Object.assign({className:`${e}__host`,"aria-expanded":t,"aria-describedby":(o=c?.props)===null||o===void 0?void 0:o.id},l.props));return a.createElement("span",Object.assign({},m,{ref:p,className:b(n,e,{[`${e}--expanded`]:t})}),d,c)},N=T.withForwardRef(g),x="bottom",v={tooltip:"tooltip",tourtip:"region",infotip:""},E={left:{transform:"translateX(16px) translateY(-50%) scale3d(1,1,1)",left:"100%",right:"auto",top:"-6px",bottom:"auto"},"left-top":{transform:"translateX(16px) scale3d(1,1,1)",left:"100%",right:"auto",top:"-100%",bottom:"auto"},"left-bottom":{transform:"translateX(16px) scale3d(1,1,1)",left:"100%",right:"auto",top:"auto",bottom:"-10px"},right:{transform:"translateX(-16px) translateY(-50%) scale3d(1,1,1)",left:"auto",right:"100%",top:"-6px",bottom:"auto"},"right-top":{transform:"translateX(-16px) scale3d(1,1,1)",left:"auto",right:"100%",top:"-100%",bottom:"auto"},"right-bottom":{transform:"translateX(-16px) scale3d(1,1,1)",left:"auto",right:"100%",top:"auto",bottom:"-50%"},top:{transform:"translateX(-50%) scale3d(1,1,1)",left:"50%",right:"auto",top:"calc(100% + 2px)",bottom:"auto"},"top-left":{transform:"scale3d(1,1,1)",left:"-10px",right:"auto",top:"calc(100% + 2px)",bottom:"auto"},"top-right":{transform:"scale3d(1,1,1)",left:"auto",right:"-10px",top:"calc(100% + 2px)",bottom:"auto"},"bottom-right":{transform:"scale3d(1,1,1)",left:"auto",right:"-10px",top:"auto",bottom:"calc(100% + 12px)"},"bottom-left":{transform:"scale3d(1,1,1)",left:"-10px",right:"auto",top:"auto",bottom:"calc(100% + 12px)"},bottom:{transform:"translateX(-50%) scale3d(1,1,1)",left:"50%",right:"auto",top:"auto",bottom:"calc(100% + 12px)"}},O=()=>null,f=({children:s,className:o,type:n="tourtip"})=>a.createElement("div",{className:b(`${n}__footer`,o)},s),C=({id:s,style:o,pointer:n=x,children:e,type:t="tooltip",showCloseButton:r,a11yCloseText:p,onClose:m})=>{const l=i.findComponent(e,O),c=i.findComponent(e,f),d=i.excludeComponent(e,f);return a.createElement("span",{className:`${t}__overlay`,id:s,role:v[t]||null,style:Object.assign(Object.assign({},E[n]),o)},a.createElement("span",{className:`${t}__pointer ${t}__pointer--${n}`}),a.createElement("span",{className:`${t}__mask`},a.createElement("span",{className:`${t}__cell`},a.createElement("span",{className:`${t}__content`},d),r?a.createElement("button",Object.assign({},l?.props,{className:`icon-btn icon-btn--transparent ${t}__close`,type:"button","aria-label":p,onClick:m}),a.createElement(h.EbayIcon,{name:"close16"})):null,c)))},R=({onExpand:s,onCollapse:o,initialExpanded:n=!1,hostRef:e})=>{const[t,r]=a.useState(n);return{isExpanded:t,expandTooltip:()=>{r(!0),s&&s()},collapseTooltip:()=>{var l;r(!1),o&&o(),(l=e?.current)===null||l===void 0||l.focus()}}};exports.DEFAULT_POINTER_DIRECTION=x;exports.POINTER_STYLES=E;exports.Tooltip=N;exports.TooltipContent=C;exports.TooltipFooter=f;exports.TooltipHost=u;exports.useTooltip=R;
;