Label

KLabel provides a wrapper around general label tags.

Standard Input

Input Title

<KLabel>Input Title</KLabel>

With Help

Input Title

This is an example

<KLabel help="This is an example">Input Title</KLabel>

Long Input Title

This is a really long tooltip. Hopefully we won't have anything this long but we might. I wonder how it handles long inputs

<KLabel
  help="This is a really long tooltip. Hopefully we won't have anything this long but we might. I wonder how it handles long inputs"
>
  Long Input Title
</KLabel>

With Info

Input Title

This is an example

<KLabel info="This is an example">Input Title</KLabel>

With for attribute

Service Name

<KLabel for="service" help="A service is an API that you want to offer">Service Name</KLabel>
<KInput id="service"/>

Sample input with a tooltip

Service Name

A service is an API that you want to offer

<KLabel help="A service is an API that you want to offer">Service Name</KLabel>
<KInput />

With tooltipAttributes

With Tooltip Attributes

I wonder how it handles long inputs. I wonder how it handles long inputs. I wonder how it handles long inputs. I wonder how it handles long inputs.

<KLabel
  :tooltip-attributes="{ placement: 'right', 'max-width': '200' }"
  help="I wonder how it handles long inputs"
>
  With Tooltip Attributes
</KLabel>