Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[WNMGDS-281] Move hint error outside legend #546

Closed
wants to merge 11 commits into from
Prev Previous commit
Next Next commit
Update FormLabel example
Bernard Wang committed Nov 4, 2019

Unverified

This commit is not signed, but one or more authors requires that any commit attributed to them is signed.
commit d3b166010ef9472fd019251635f9495d83f10887
37 changes: 28 additions & 9 deletions packages/core/src/components/FormLabel/FormLabel.example.jsx
Original file line number Diff line number Diff line change
@@ -1,15 +1,34 @@
import React, { Fragment } from 'react';
import FormLabel from './FormLabel';
import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
<FormLabel
errorMessage="Please enter a valid phone number."
hint="We'll use this number as a backup if we need to contact you about your application."
fieldId="number-field-id"
requirementLabel="Optional"
>
Phone number
</FormLabel>,
<Fragment>
<div>
<FormLabel
component="label"
errorMessage="Please enter a valid phone number."
hint="We'll use this number as a backup if we need to contact you about your application."
fieldId="number-field-id"
requirementLabel="Optional"
>
Phone number
</FormLabel>
</div>
<fieldset className="ds-c-fieldset">
<FormLabel
component="legend"
hint={
<span>
Select all that apply.{' '}
<a href="void:javascript(0)">Learn more about these documents.</a>
</span>
}
fieldId="document-field-id"
>
Select a document type
</FormLabel>
</fieldset>
</Fragment>,
document.getElementById('js-example')
);