cf-component-tooltip
Cloudflare Tooltip Component
Installation
Installation with yarn is recommended
$ yarn add cf-component-tooltip
Usage
import React from 'react';import Tooltip from 'cf-component-tooltip';import Icon from 'cf-component-icon';import Button from 'cf-component-button';import Box from 'cf-component-box'; const Jsx = <span> <h4> <Icon ="exclamation-sign" ="danger" ="tooltip" /> Sure No problem! </h4> Important Info </span>; const TooltipComponent = <div> <div> <h4>Standard tooltip with text</h4> Lorem Ipsum is simply dummy text of the printing and typesetting industry' ' More Info' ' <Box ="inline-block"> <Tooltip ="top" ="It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged." > <Icon ="info-sign" ="primary" ="tooltip" /> </Tooltip> </Box> </div> <h4> You can add a tooltip to any element you want You can also use delayHide to delay the hiding of the tooltip </h4> <Box ="inline-block"> <Tooltip = ="top" => <Button ="primary">Button Info</Button> </Tooltip> </Box> <h4>Can you do jsx?</h4> <Box ="inline-block"> <Tooltip ="top" => <span>Fancy Tooltip</span> <div /> </Tooltip> </Box> </div>); ;