Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 4 Current »

🔹 Description

A component that gives an informative message and appears when the user hovers with the item that has a tooltip enabled..

🔹System Dependencies

🔹 Installation

The package can be installed via npm:

npm install empower-display --save

🔹 Standard Tooltip

Configuration

import { Tooltip } from 'empower-display';

..............

  const configToolTipTop = {
      delay:600, 
      direction: 'top',
      content:'This is the content for tooltop'
  }
    
..............

  return (
    <> 
      <Tooltip {...configToolTipTop}>
          Sample Tooltip
          <span className="example-emoji " role="img" aria-label="cowboy emoji ">
              🤠
          </span>
      </Tooltip>
    </>
  )

🔹  Properties

Parameter

Data Type

Constraint

Description

delay

Integer

Optional

Delay in milliseconds before the displaying of tool tip. The default delay value is 400.

direction

String

Optional

It is the direction where the tool tip will display. It can be top, right, left or bottom.

content

String

Required

The text displayed inside the tool tip.

🔹 References

Repository Link: https://bitbucket.org/empowerteams/empower-display

NPM Package: https://www.npmjs.com/package/empower-display

Demo Repo: git@bitbucket.org:empowerteams/mfe-sub-application-template.git

  • No labels