@leafygreen-ui/inline-definition
TypeScript icon, indicating that this package has built-in type declarations

6.0.15 • Public • Published

Inline Definition

npm (scoped)

Installation

Yarn

yarn add @leafygreen-ui/inline-definition

NPM

npm install @leafygreen-ui/inline-definition

Example

<H2>
  <InlineDefinition definition={shardDefinition}>Shard</InlineDefinition> your
  cluster
</H2>

Output HTML

<h2 class="leafygreen-ui-1xwhtk1">
  <span class="leafygreen-ui-1eprrtj" aria-describedby="tooltip-1">Shard</span>
  your cluster
</h2>
<div>
  <div class="leafygreen-ui-10b9mvh">
    <div role="tooltip" id="tooltip-27" class="leafygreen-ui-10d84ei">
      <div class="leafygreen-ui-qlb2bl">
        <div class="leafygreen-ui-3uslxw"></div>
      </div>
      <p class="leafygreen-ui-1s8990i">
        Sharding is a method for horizontally scaling across multiple replica
        sets by breaking up large datasets (e.g. partitioning) into smaller
        parts. Sharding is native to MongoDB.
      </p>
    </div>
  </div>
</div>

Properties

Prop Type Description Default
definition (Required) React.ReactNode Content that describes the term. Will appear inside Tooltip.
children string Text that will appear underlined
className string className will be applied to the trigger element
align 'top', 'bottom', 'left', 'right' Determines the preferred alignment of the tooltip relative to the component's children. 'top'
justify 'start', 'middle', 'end', 'fit' Determines the preferred justification of the tooltip (based on the alignment) relative to the element passed to the component's children. 'start'
darkMode boolean Determines if the component will appear in dark mode. false
tooltipClassName string className to be applied to the tooltip element

Readme

Keywords

none

Package Sidebar

Install

npm i @leafygreen-ui/inline-definition

Weekly Downloads

41,861

Version

6.0.15

License

Apache-2.0

Unpacked Size

61.5 kB

Total Files

18

Last publish

Collaborators

  • stephl3
  • brookescarlett
  • shaneeza
  • hswolff
  • thesonofthomp