react-useful-components v0.2.4

React Useful Components

This library is meant to add some components that uses generic logic to render, those are some that I use myself on almost all of my React projects.

Usage

You can use this lib installing it with NPM or Yarn:

npm i react-useful-components or yarn add react-useful-components

Or you can use CDN link:

<script src="https://cdn.jsdelivr.net/npm/react-useful-components@0.2.3/lib/cjs/index.min.js"></script>

Components

Currently, these are all components that this lib provides:

• Conditional Renderer: This component receive a condition, if it is a truthy value, this components renders onSuccess function, otherwise, renders onFailure;

  Example:

  import { ConditionalRenderer } from "react-useful-components";
  
  export default function SuccessOrError() {
    return (
      <ConditionalRenderer
        condition={false}
        onSuccess={() => <p>Success</p>}
        onFailure={() => <p>Error</p>}
      />
    );
  }

• Iterator: This component is useful to interate over a list of data and render a list of JSX.Element.

  Example:

  import { Iterator } from "react-useful-components";
  
  export default function SuccessOrError() {
    return (
      <Iterator
        list={["one", "two"]}
        onRender={(prop, index) => <p>{prop}</p>}
      />
    );
  }

• Repeater - Beta:

  ---

  :warning: This component is currently on its beta version

  ---

  Repeater is a componente which is meant to create X times of the same component. Currently this component does not have an update function, but it will have on its final version.

  Example:

  import { Repeater } from "react-useful-components";
  
  export default function RepeatParagraph() {
    return (
      <Repeater htmlTag="p" startsWith={3} />,
    );
  }

Bugs or extra info

If you find any bug, or have any questions to make, do it on the issue section. Feel free to contributing as well by forking and open a PR, just open a issue before to request it, if you have an idea but don't want or can't implement it, also write a issue describing it.