IlyaSobolev/DocSpace-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: Components: fixed tooltip docs

Browse Source
This commit is contained in:
DmitrySychugov 2023-05-30 17:11:09 +05:00
parent fe6f9e07eb
commit ae70d0b274
2 changed files with 15 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
packages/components/tooltip/tooltip.mdx
View File

@ -1,4 +1,10 @@
import { Story, ArgsTable, Canvas, Meta } from "@storybook/addon-docs/blocks"; import {
Story,
ArgsTable,
Canvas,
Meta,
Controls,
} from "@storybook/addon-docs/blocks";
import * as stories from "./tooltip.stories.js"; import * as stories from "./tooltip.stories.js";
import Tooltip from "./"; import Tooltip from "./";
@ -19,12 +25,6 @@ Custom tooltip
#### See documentation: https://github.com/wwayne/react-tooltip #### See documentation: https://github.com/wwayne/react-tooltip
<Canvas>
<Story story={stories.basic} name="Default" />
</Canvas>
<ArgsTable story="Default" />
<Canvas> <Canvas>
<Story story={stories.all} name="All" /> <Story story={stories.all} name="All" />
</Canvas> </Canvas>
@ -123,12 +123,6 @@ const arrayUsers = [
/> />
``` ```
### YouComponent Properties ### Properties
| Props | Type | Required | Values | Default | Description | <Controls />
| ------------- | :------: | :------: | :------------------------------: | :-----: | --------------------------------- |
| `data-event` | `string` | - | `click, focus` | - | Custom event to trigger tooltip |
| `data-for` | `string` | ✅ | - | - | Corresponds to the id of Tooltip |
| `data-offset` | `string` | - | `top`, `left`, `right`, `bottom` | - | Offset of current tooltip |
| `data-place` | `string` | - | `top`, `right`, `bottom`, `left` | - | Tooltip placement |
| `data-tip` | `string` | - | - | - | Required if you need to component |

6
packages/components/tooltip/tooltip.stories.js
View File

@ -2,10 +2,16 @@ import React from "react";
import Link from "../link"; import Link from "../link";
import Text from "../text"; import Text from "../text";
import Tooltip from "./"; import Tooltip from "./";
import TooltipDocs from "./tooltip.mdx";
export default { export default {
title: "Components/Tooltip", title: "Components/Tooltip",
component: Tooltip, component: Tooltip,
parameters: {
docs: {
page: TooltipDocs,
},
},
}; };
const BodyStyle = { marginTop: 100, marginLeft: 200, position: "absolute" }; const BodyStyle = { marginTop: 100, marginLeft: 200, position: "absolute" };