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

    1.0.9 • Public • Published

    react-children-addons

    React children utilities and addons

    npm install react-children-addons -S
     
    # or 
     
    yarn add react-children-addons -S

    API Methods

    toFlatArray

    Takes children and flattens all React.Fragments into a single array

    import { toFlatArray } from 'react-children-addons';
     
    function List({ children }) {
      console.log(toFlatArray(children));
    }
     
    <List>
      <li>Item</li>
      <>
        <li>Another Item</li>
      </>
    </List>
    [<li>Item</li>, <li>Another Item</li>]

    mapFlat

    Same as toFlatArray but with a map function

    import React from 'react';
    import { mapFlat } from 'react-children-addons';
     
    function List({ children }) {
      return (
        <ul>
          {mapFlat(children, child => React.cloneElement(child, { className: 'link' }))}
        </ul>
      );
    }
     
    <List>
      <li>Item</li>
      <>
        <li>Another Item</li>
      </>
      <React.Fragment>
        <>
          <li>Nested Item</li>
        </>
      </React.Fragment>
    </List>
    <ul>
      <li class="link">Item</li>
      <li class="link">Another Item</li>
      <li class="link">Nested Item</li>
    </ul>

    Todo

    Add tests, changelog and more ideas for addons.

    Install

    npm i react-children-addons

    DownloadsWeekly Downloads

    130

    Version

    1.0.9

    License

    MIT

    Unpacked Size

    7.59 kB

    Total Files

    13

    Last publish

    Collaborators

    • birkir