@spectrum-web-components/help-text NPM

Description

An <sp-help-text> provides either an informative description or an error message that gives more context about what a user needs to input. It's commonly used in forms.

Usage

yarn add @spectrum-web-components/help-text

Import the side effectful registration of <sp-help-text> via:

import '@spectrum-web-components/help-text/sp-help-text.js';

When looking to leverage the HelpText base class as a type and/or for extension purposes, do so via:

import { HelpText } from '@spectrum-web-components/help-text';

Sizes

<sp-help-text size="s">Passwords must be at least 8 characters.</sp-help-text>

<sp-help-text size="m">Passwords must be at least 8 characters.</sp-help-text>

<sp-help-text size="l">Passwords must be at least 8 characters.</sp-help-text>

<sp-help-text size="xl">Passwords must be at least 8 characters.</sp-help-text>

Negative

The negative variant of <sp-help-text> is used to convey error messages. An error message should be different than the informative message otherwise delivers to the visitor and should show a solution for correcting the error that has been encountered.

<sp-help-text variant="negative">
    Create a password with at least 8 characters.
</sp-help-text>

Icon

When associated with content that does not supply an icon outlining the presence of an error, use the icon attribute to display one as part of the <sp-help-text> element.

<sp-help-text variant="negative" icon>
    Create a password with at least 8 characters.
</sp-help-text>

Disabled

When associated to content the is disabled, use the disabled attribute to match the delivery of the <sp-help-text> element to that content.

<sp-help-text disabled>Passwords must be at least 8 characters.</sp-help-text>

spectrum css web components lit-element lit-html

@spectrum-web-components/base @spectrum-web-components/shared @spectrum-web-components/icons-workflow

@infinitebrahmanuniverse/nolb-_spe @everything-registry/sub-chunk-857 @spectrum-web-components/field-group @spectrum-web-components/radio @spectrum-web-components/textfield @spectrum-web-components/bundle @swc-react/help-text @uxds-web-components/textfield @uxds-web-components/field-group @uxds-web-components/radio

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

9 months ago

9 months ago

9 months ago

9 months ago

9 months ago

1 year ago

9 months ago

11 months ago

11 months ago

10 months ago

1 year ago

10 months ago

9 months ago

10 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

0.2.9-overlay-warning.19

2 years ago

3 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago