@ta-interaktiv/react-publication-info

API

Table of Contents

• NameValueItem

-   [Parameters](#parameters)
-   [Examples](#examples)

• PublicationInfo

-   [Parameters](#parameters-1)

• TimestampFormatter

-   [Parameters](#parameters-2)
-   [Examples](#examples-1)

• VersionFormatter

-   [Parameters](#parameters-3)
-   [Examples](#examples-2)

NameValueItem

Parameters

• props object

-   `props.name` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** The name or key of the information.
-   `props.value` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** The value. If null or undefined, the component will not render.
-   `props.itemClassName` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Class name(s) for the whole item. (optional, default `''`)
-   `props.nameClassName` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Class names(s) for the key  part. (optional, default `''`)
-   `props.valueClassName` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Class names(s) for the value part. (optional, default `''`)

Examples

import { NameValueItem }from '@ta-interaktiv/react-publication-info'

function Component(props) {
  return(
    <NameValueItem
      name='Version'
      value='1.0.0'
      itemClassName='ui label'
      valueClassName='detail'
    />
  )
}

// returns <span className="name-value-item ui label">
//           <span className="name ">Version</span>
//           <span className="value detail">1.0.0</span>
//         </span>

PublicationInfo

Parameters

• props object

-   `props.publicationDate` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Unix timestamp when the project has been first published (optional, default `window.project.publicationDate`)
-   `props.changeDate` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Unix timestamp when the project has been last updated. (optional, default `window.project.changeDate`)
-   `props.version` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Version number of the project (optional, default `window.project.version`)
-   `props.className` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** CSS class name of the whole object. (optional, default `''`)
-   `props.itemClassName` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** CSS class names for the individual items. (optional, default `''`)
-   `props.nameClassName` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** CSS class names for the key/name of the individual items. (optional, default `''`)
-   `props.valueClassName` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** CSS class names for the value of the individual items. (optional, default `''`)

TimestampFormatter

• See: NameValueItem for additional className parameters to be passed into this component.

Parameters

• props object

-   `props.timestamp` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)?** A UNIX timestamp, in seconds. If not provided, the element will not render.
-   `props.prefix` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** A string that precedes the date, like "Erstellt:" or "Aktualisiert:"
-   `props.locale` **(`"de"` \| `"fr"`)** The locale to use to format the
    string. (optional, default `de`)

Examples

import { TimestampFormatter } from '@ta-interaktiv/react-publication-date'

function Component (props) {
  return (
    <TimestampFormatter prefix='Erstellt:' timestamp={1500986249} />
  )
}

-   `props.version` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)** A semantic version string. If not provided, the element will not render.
-   `props.prefix` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** A string that precedes the version. (optional, default `Version`)

import { VersionFormatter } from '@ta-interaktiv/react-publication-date'

function Component (props) {
  return (
    <VersionFormatter version='1.0.0' />
  )
}

yarn run storybook

yarn run fix

Building & Releasing

yarn run dist

yarn run docs