2.2.8 • Published 6 years ago

@crave/farmblocks-hoc-disabled-tooltip v2.2.8

Weekly downloads
4
License
MIT
Repository
github
Last release
6 years ago

Farmblocks Disabled Tooltip HOC

A Higher Order Component that adds the behaviour of displaying a tooltip when a component is disabled (disabled property true)

Installation

npm install @crave/farmblocks-hoc-disabled-tooltip

Usage

import React from "react";
import ReactDOM from "react-dom";
import disabledTooltip from "@crave/farmblocks-hoc-disabled-tooltip";

const MyComponent = ({ children, ...props }) => (
  <button {...props}>{children}</button>
);
const ButtonWithDisabledTooltip = disabledTooltip(MyComponent);

const root = document.createElement("div");

ReactDOM.render(
  <div>
    <ButtonWithDisabledTooltip>
      My Button
    </ButtonWithDisabledTooltip>
    <ButtonWithDisabledTooltip
      disabled
      tooltipText="my custom text"
      tooltipAlign="right"
    >
      My Disabled Button
    </ButtonWithDisabledTooltip>
  </div>,
  root
);

document.body.appendChild(root);

See more examples in the stories file.

API

This HOC will add the following properties to a given component:

PropertyTypeDescription
disabledBooleana flag that indicates that the element is disabled, and so should display the tooltip
tooltipAlignString, one of "left" or "right"Which side to align the disabled tooltip balloon
tooltipTextStringA custom text to display as tooltip when the component is disabled
displayBlockBooleanuse this flag to override the default css style of the resulting element from inline-block to block

License

MIT

2.2.8

6 years ago

2.2.7

6 years ago

2.2.6

6 years ago

2.2.5

6 years ago

2.2.4

6 years ago

2.2.3

6 years ago

2.2.3-alpha.9

6 years ago

2.2.3-4211.1.8

6 years ago

2.2.3-4212.1.8

6 years ago

2.2.3-4209.1.8

6 years ago

2.2.3-4208.1.8

6 years ago

2.2.2

6 years ago

2.2.2-alpha.26

6 years ago

2.2.1

6 years ago

2.2.0

6 years ago

2.1.2-alpha.1

6 years ago

2.1.1

6 years ago

2.1.1-alpha.13

6 years ago

2.1.1-alpha.12

6 years ago

2.1.0

7 years ago

2.0.11-alpha.4

7 years ago

2.0.11-alpha.9

7 years ago

2.0.11-alpha.7

7 years ago

2.0.10

7 years ago

2.0.9

7 years ago

2.0.8

7 years ago

2.0.7

7 years ago

2.0.6

7 years ago

2.0.5

7 years ago

2.0.4

7 years ago

2.0.3

7 years ago

2.0.2

7 years ago

2.0.1

7 years ago

2.0.0

7 years ago

1.2.1

7 years ago

1.2.0

7 years ago

1.1.13

7 years ago

1.1.12

7 years ago

1.1.11

7 years ago

1.1.10

7 years ago

1.1.10-alpha.0

7 years ago

1.1.9

7 years ago

1.1.8

7 years ago

1.1.7

7 years ago

1.1.6

7 years ago

1.1.5

7 years ago

1.1.4

7 years ago

1.1.3

7 years ago

1.1.2

7 years ago

1.1.1

7 years ago

1.1.0

7 years ago

1.0.3

7 years ago

1.0.2

7 years ago

1.0.1

7 years ago

1.0.0

7 years ago

0.2.0

8 years ago