Skip to content

Commit

Permalink
docs: improve options table spacing
Browse files Browse the repository at this point in the history
  • Loading branch information
@gabrieljablonski
gabrieljablonski committed Oct 31, 2023
1 parent 9606cfe commit 96dec1c
Showing 1 changed file with 7 additions and 7 deletions.
14 changes: 7 additions & 7 deletions docs/docs/options.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,8 +91,8 @@ import { Tooltip } from 'react-tooltip';
| ----------------------- | -------------------------------------- | -------- | ------------------------- | --------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `className` | `string` | no | | | Class name to customize tooltip element. You can also use the default class `react-tooltip` which is set internally |
| `classNameArrow` | `string` | no | | | Class name to customize tooltip arrow element. You can also use the default class `react-tooltip-arrow` which is set internally |
| `content` | `string` | no | | | Content to de displayed in tooltip (`html` prop is priorized over `content`) |
| ~~`html`~~ | ~~`string`~~ | ~~no~~ | | | ~~HTML content to de displayed in tooltip~~ <br/>**DEPRECATED**<br/>Use `children` or `render` instead |
| `content` | `string` | no | | | Content to be displayed in tooltip (`html` prop is priorized over `content`) |
| ~~`html`~~ | ~~`string`~~ | ~~no~~ | | | ~~HTML content to be displayed in tooltip~~ <br/>**DEPRECATED**<br/>Use `children` or `render` instead |
| `render` | `function` | no | | | A function which receives a ref to the currently active anchor element and returns the content for the tooltip. Check the [examples](./examples/render.mdx) |
| `place` | `string` | no | `top` | `top` `top-start` `top-end` `right` `right-start` `right-end` `bottom` `bottom-start` `bottom-end` `left` `left-start` `left-end` | Position relative to the anchor element where the tooltip will be rendered (if possible) |
| `offset` | `number` | no | `10` | any `number` | Space between the tooltip element and anchor element (arrow not included in calculation) |
Expand All @@ -116,12 +116,12 @@ import { Tooltip } from 'react-tooltip';
| `closeOnResize` | `boolean` | no | `false` | `true` `false` | Resizing the window will close the tooltip |
| `style` | `CSSProperties` | no | | a CSS style object | Add inline styles directly to the tooltip |
| `position` | `{ x: number; y: number }` | no | | any `number` value for both `x` and `y` | Override the tooltip position on the DOM |
| `isOpen` | `boolean` | no | handled by internal state | `true` `false` | The tooltip can be controlled or uncontrolled, this attribute can be used to handle show and hide tooltip outside tooltip (can be used **without** `setIsOpen`) |
| `isOpen` | `boolean` | no | | `true` `false` | The tooltip can be controlled or uncontrolled, this attribute can be used to handle show and hide tooltip outside tooltip (can be used **without** `setIsOpen`) |
| `setIsOpen` | `function` | no | | | The tooltip can be controlled or uncontrolled, this attribute can be used to handle show and hide tooltip outside tooltip |
| `afterShow` | `function` | no | | | A function to be called after the tooltip is shown |
| `afterHide` | `function` | no | | | A function to be called after the tooltip is hidden |
| `middlewares` | `Middleware[]` | no | | array of valid `floating-ui` middlewares | Allows for advanced customization. Check the [`floating-ui` docs](https://floating-ui.com/docs/middleware) for more information |
| `border` | `CSSProperties['border']` | no | | a CSS border style | Change the style of the tooltip border (including the arrow) |
| `opacity` | `CSSProperties['opacity']` | no | `0.9` | a CSS opacity value | Change the opacity of the tooltip |
| `arrowColor` | `CSSProperties['backgroundColor']` | no | | a CSS background color | Change color of the tooltip arrow |
| `disableStyleInjection` | <code>`boolean` &#124; `'core'`</code> | no | `false` | `true` `false` `'core'` | Whether to disable automatic style injection. Do not set dynamically. Check the [styling page](./examples/styling#disabling-reacttooltip-css) for more details |
| `border` | CSS border | no | | a CSS border style | Change the style of the tooltip border (including the arrow) |
| `opacity` | CSS opacity | no | `0.9` | a CSS opacity value | Change the opacity of the tooltip |
| `arrowColor` | CSS color | no | | a CSS background color | Change color of the tooltip arrow |
| `disableStyleInjection` | `boolean` or `'core'` | no | `false` | `true` `false` `'core'` | Whether to disable automatic style injection. Do not set dynamically. Check the [styling page](./examples/styling#disabling-reacttooltip-css) for more details |

0 comments on commit 96dec1c

Please sign in to comment.