2019-08-09 13:10:24 +00:00
|
|
|
# Label
|
|
|
|
|
|
|
|
|
|
Component displays the field name in the form
|
|
|
|
|
|
2019-11-21 13:22:41 +00:00
|
|
|
### Usage
|
2019-08-09 13:10:24 +00:00
|
|
|
|
|
|
|
|
```js
|
2022-07-22 19:01:25 +00:00
|
|
|
import Label from "@docspace/components/label";
|
2019-11-21 13:22:41 +00:00
|
|
|
```
|
2019-08-09 13:10:24 +00:00
|
|
|
|
2019-11-21 13:22:41 +00:00
|
|
|
```jsx
|
|
|
|
|
<Label
|
|
|
|
|
text="First name:"
|
|
|
|
|
title="first name"
|
|
|
|
|
htmlFor="firstNameField"
|
|
|
|
|
display="block"
|
2019-08-13 08:39:16 +00:00
|
|
|
/>
|
2019-08-09 13:10:24 +00:00
|
|
|
```
|
|
|
|
|
|
2019-11-21 13:22:41 +00:00
|
|
|
### Properties
|
|
|
|
|
|
2019-11-28 13:13:16 +00:00
|
|
|
| Props | Type | Required | Values | Default | Description |
|
|
|
|
|
| ------------ | :------------: | :------: | :----: | :-----: | --------------------------------------------------------------------------- |
|
|
|
|
|
| `className` | `string` | - | - | - | Class name |
|
|
|
|
|
| `display` | `string` | - | - | - | Sets the 'display' property |
|
|
|
|
|
| `error` | `bool` | - | - | - | Indicates that the field to which the label is attached is incorrect |
|
|
|
|
|
| `htmlFor` | `string` | - | - | - | The field ID to which the label is attached |
|
|
|
|
|
| `id` | `string` | - | - | - | Accepts id |
|
|
|
|
|
| `isInline` | `bool` | - | - | `false` | Sets the 'display: inline-block' property |
|
|
|
|
|
| `isRequired` | `bool` | - | - | `false` | Indicates that the field to which the label is attached is required to fill |
|
|
|
|
|
| `style` | `obj`, `array` | - | - | - | Accepts css style |
|
|
|
|
|
| `text` | `string` | - | - | - | Text |
|
|
|
|
|
| `title` | `string` | - | - | - | Title |
|
|
|
|
|
| `truncate` | `bool` | - | - | `false` | Disables word wrapping |
|
