@govuk-react/document-footer-metadata

Renders styled document footer metadata from props provided.

Stats

StarsIssuesVersionUpdatedCreatedSize
@govuk-react/document-footer-metadata
0.9.114 days ago4 years agoMinified + gzip package size for @govuk-react/document-footer-metadata in KB

Readme

DocumentFooterMetadata

Import

  import DocumentFooterMetadata from '@govuk-react/document-footer-metadata';

Usage

Simple

import { DocumentFooterMetadata, Link } from 'govuk-react'

const fromData = [
  <Link href="/government/organisations/ministry-of-defence">
    Ministry of Defence
  </Link>,
];

<DocumentFooterMetadata from={fromData} />

DFM From & part of example

import { DocumentFooterMetadata, Link } from 'govuk-react'

const fromData = [
  <Link href="/government/organisations/ministry-of-defence">
    Ministry of Defence
  </Link>,
];
const partOfData = [
  <Link href="/government/topics/energy">Energy</Link>,
  <Link href="/government/topics/environment">Environment</Link>,
];

<DocumentFooterMetadata from={fromData} partOf={partOfData} />

DFM From & other data example

import { DocumentFooterMetadata, Link } from 'govuk-react'

const fromData = [
  <Link href="/government/organisations/ministry-of-defence">
    Ministry of Defence
  </Link>,
];
const otherData = [
  {
    id: 0,
    title: 'Consultation type',
    content: <Link href="/government/publications">Open</Link>,
  },
  {
    id: 1,
    title: 'Published',
    content: '20 January 2012',
  },
];

<DocumentFooterMetadata from={fromData} other={otherData} />

References:

Properties

Prop Required Default Type Description
from undefined arrayOf[object Object] Array of JSX nodes to render underneath the from: title
other undefined arrayOf[object Object] Array of Objects for any additional items, each object should contain an id, title and content property
partOf undefined arrayOf[object Object] Array of JSX nodes to render underneath the part of: title

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.