Sha256: f4f714527dfd04ccb001a0bbe632e4a1534ea0e0059dac4678ea5f4a364a4696
Contents?: true
Size: 913 Bytes
Versions: 4
Compression:
Stored size: 913 Bytes
Contents
// @flow
import React, { useState } from 'react'
import { Button, Body, Flex, FlexItem, Tooltip } from 'playbook-ui'
const TooltipShowTooltipReact = (props) => {
const [showTooltip, setShowTooltip] = useState(true);
return (
<Flex
flexDirection='column'
gap='md'
wrap
>
<FlexItem>
<Button
onClick={()=> setShowTooltip(!showTooltip)}
text="Toggle state"
/>
</FlexItem>
<FlexItem>
<Body >
<p>
{'Tooltip is: '}
<code>{showTooltip ? "enabled" : "disabled"}</code>
</p>
</Body>
</FlexItem>
<FlexItem>
<Tooltip
placement='right'
showTooltip={showTooltip}
text='Tooltip is enabled'
zIndex={10}
{...props}
>
{'Hover me.'}
</Tooltip>
</FlexItem>
</Flex>
)
}
export default TooltipShowTooltipReact
Version data entries
4 entries across 4 versions & 2 rubygems