Nominally Patriotic Meathead

    react-and
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.2 • Public • Published

    react-and

    CI npm NPM Size

    A lightweight React component for joining multiple components in a grammatically correct way. Joins components using commas, "and", "&", "or", or any other term you specify.

    Written in Typscript with zero dependencies.

    Installation

    yarn add react-and
    npm install --save react-and

    Usage

    ReactAnd accepts any number of children and will render them with the correct grammar.

    <ReactAnd>
      {[
        'apples',
        'oranges',
        'bananas',
      ]}
    </ReactAnd>

    Renders as:

    apples, oranges, and bananas

    You can pass any valid React components as children:

    <ReactAnd>
      <a href="/apples">apples</a>
      <a href="/oranges">oranges</a>
    </ReactAnd>

    Renders as:

    <a href="/apples>apples</a> and <a href="/oranges">oranges</a>

    Props

    conjuction

    This is the string to be used to join the last child when there is more than one child. Default: "and".

    <ReactAnd conjuction="and/or">
      {[
        'apples',
        'oranges',
      ]}
    </ReactAnd>

    Renders as:

    apples and/or oranges

    oxfordComma

    Determinses whether an Oxford comma will be used when joining the items. Default: true.

    <ReactAnd oxfordComma={false}>
      {[
        'apples',
        'oranges',
        'bananas',
      ]}
    </ReactAnd>

    Renders as:

    apples, oranges and bananas

    Demo

    https://react-and.surge.sh/

    License

    Licensed under MIT.

    Install

    npm i react-and

    DownloadsWeekly Downloads

    214

    Version

    1.0.2

    License

    MIT

    Unpacked Size

    9.89 kB

    Total Files

    7

    Last publish

    Collaborators

    • lukehansford