import { ArgTypes } from '@storybook/blocks'; import { InlineLabel } from './InlineLabel';

InlineLabel

A horizontal variant of Label, primarily used in query editors. Can be combined with form components that expect a label, eg. Input, Checkbox, Combobox. If you need to add additional explanation, use the tooltip prop, which will render an info icon with tooltip inside the label. For query editor readability, the label text should be as short as possible (4 words or fewer).

Usage

jsx

<InlineLabel width="auto" tooltip="Tooltip content">
  Simple label
</InlineLabel>