Components

Birth details

Full information on a birth.

Joan Narcissus Ouroboros SMITH 08/08/2008

Child
System number	123456789
Surname	SMITH
Forename(s)	Joan Narcissus Ouroboros
Date of birth	08/08/2008
Sex	Indeterminate
Place of birth	888 Birth House, 8 Birth way, Bournemouth
Mother
Name
Maiden name
Surname at marriage if different from maiden name
Place of birth
Father / Parent
Name
Place of birth
Registration
Birth registered by
Registration district
Sub-district
Administrative area
Date of registration

HTML
React

<div class="ho-lev-birth-details">
  <h1 class="govuk-heading-l">
    Joan Narcissus Ouroboros SMITH 08/08/2008
  </h1>
  <table class="ho-lev-birth-details__data">
    <tbody>
      <tr>
        <th>System number</th>
        <td>123456789</td>
      </tr>
      <tr class="section-head">
        <th colspan="2">Child</th>
      </tr>
      <tr>
        <th>Surname</th>
        <td>SMITH</td>
      </tr>
      <tr>
        <th>Forename(s)</th>
        <td>Joan Narcissus Ouroboros</td>
      </tr>
      <tr>
        <th>Date of birth</th>
        <td>08/08/2008</td>
      </tr>
      <tr>
        <th>Sex</th>
        <td>Indeterminate</td>
      </tr>
      <tr>
        <th>Place of birth</th>
        <td>
          888 Birth House, 8 Birth way, Bournemouth
        </td>
      </tr>
      <tr class="section-head">
        <th colspan="2">Mother</th>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Mother&#x27;s
          </span>
          Name
        </th>
        <td></td>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Mother&#x27;s
          </span>
          Maiden name
        </th>
        <td></td>
      </tr>
      <tr
        class="ho-lev-birth-details__mother-marriage-name"
      >
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Mother&#x27;s
          </span>
          Surname at marriage
          <span
            class="ho-lev-birth-details__additional"
          >
            <br />
            if different from maiden name
          </span>
        </th>
        <td></td>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Mother&#x27;s
          </span>
          Place of birth
        </th>
        <td></td>
      </tr>
      <tr class="section-head">
        <th colspan="2">Father / Parent</th>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Father&#x27;s
          </span>
          Name
        </th>
        <td></td>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Father&#x27;s
          </span>
          Place of birth
        </th>
        <td></td>
      </tr>
      <tr class="section-head">
        <th colspan="2">Registration</th>
      </tr>
      <tr>
        <th>Birth registered by</th>
        <td></td>
      </tr>
      <tr>
        <th>Registration district</th>
        <td></td>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Registration
          </span>
          Sub-district
        </th>
        <td></td>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Registration
          </span>
          Administrative area
        </th>
        <td></td>
      </tr>
      <tr>
        <th>Date of registration</th>
        <td></td>
      </tr>
    </tbody>
  </table>
</div>

Props

Name	Type	Default	Description
id	string	-	'id' attribute to place on the base HTML element
classBlock	string	-	Block name override in BEM style classes applied to all elements
classModifiers	other	-	BEM style modifiers to apply to the base HTML element
className	string	-	Extra classes to apply to the base HTML element
birthplace	string	-	REQUIRED. Child's place of birth
dob	string	-	REQUIRED. Child's date of birth
father	other	-	REQUIRED. Child's father
forenames	string	-	REQUIRED. Child's forenames
mother	other	-	REQUIRED. Child's mother
nextRegistration	other	-	The registration that procedes this one
registered	other	-	REQUIRED. Details on who conducted the registration
sex	enum	-	REQUIRED. Child's sex
systemNumber	number	-	REQUIRED. Registration's identifer
surname	string	-	REQUIRED. Child's surname
previousRegistration	other	-	The registration that precedes this one
status	other	-	REQUIRED. Status of the birth record

Stories

Standard

A standard Birth details.

Joan Narcissus Ouroboros SMITH 08/08/2008

Child
System number	123456789
Surname	SMITH
Forename(s)	Joan Narcissus Ouroboros
Date of birth	08/08/2008
Sex	Indeterminate
Place of birth	888 Birth House, 8 Birth way, Bournemouth
Mother
Name
Maiden name
Surname at marriage if different from maiden name
Place of birth
Father / Parent
Name
Place of birth
Registration
Birth registered by
Registration district
Sub-district
Administrative area
Date of registration

HTML
React

<div class="ho-lev-birth-details">
  <h1 class="govuk-heading-l">
    Joan Narcissus Ouroboros SMITH 08/08/2008
  </h1>
  <table class="ho-lev-birth-details__data">
    <tbody>
      <tr>
        <th>System number</th>
        <td>123456789</td>
      </tr>
      <tr class="section-head">
        <th colspan="2">Child</th>
      </tr>
      <tr>
        <th>Surname</th>
        <td>SMITH</td>
      </tr>
      <tr>
        <th>Forename(s)</th>
        <td>Joan Narcissus Ouroboros</td>
      </tr>
      <tr>
        <th>Date of birth</th>
        <td>08/08/2008</td>
      </tr>
      <tr>
        <th>Sex</th>
        <td>Indeterminate</td>
      </tr>
      <tr>
        <th>Place of birth</th>
        <td>
          888 Birth House, 8 Birth way, Bournemouth
        </td>
      </tr>
      <tr class="section-head">
        <th colspan="2">Mother</th>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Mother&#x27;s
          </span>
          Name
        </th>
        <td></td>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Mother&#x27;s
          </span>
          Maiden name
        </th>
        <td></td>
      </tr>
      <tr
        class="ho-lev-birth-details__mother-marriage-name"
      >
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Mother&#x27;s
          </span>
          Surname at marriage
          <span
            class="ho-lev-birth-details__additional"
          >
            <br />
            if different from maiden name
          </span>
        </th>
        <td></td>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Mother&#x27;s
          </span>
          Place of birth
        </th>
        <td></td>
      </tr>
      <tr class="section-head">
        <th colspan="2">Father / Parent</th>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Father&#x27;s
          </span>
          Name
        </th>
        <td></td>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Father&#x27;s
          </span>
          Place of birth
        </th>
        <td></td>
      </tr>
      <tr class="section-head">
        <th colspan="2">Registration</th>
      </tr>
      <tr>
        <th>Birth registered by</th>
        <td></td>
      </tr>
      <tr>
        <th>Registration district</th>
        <td></td>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Registration
          </span>
          Sub-district
        </th>
        <td></td>
      </tr>
      <tr>
        <th>
          <span
            class="govuk-visually-hidden"
            aria-hidden="true"
          >
            Registration
          </span>
          Administrative area
        </th>
        <td></td>
      </tr>
      <tr>
        <th>Date of registration</th>
        <td></td>
      </tr>
    </tbody>
  </table>
</div>