@barelyreaper/rlayouts

<div align="center"> <br> <br> <h1>rlayouts</h1> <p> <b>Simple Layout Components for React</b> </p> <br> <br> <br> </div>

Usage no npm install needed!

<script type="module">
  import barelyreaperRlayouts from 'https://cdn.skypack.dev/@barelyreaper/rlayouts';
</script>

README



rlayouts

Simple Layout Components for React




Motivation

I copy paste the same set of components for layout in almost every react project that I work on so this is going to act as a base from now. I still prefer copying the original code around to make it easier to modify and fix when needed.

You can find the web code snippets here reaper.im/collections

Installation

npm i @barelyreaper/rlayouts
#or
yarn add @barelyreaper/rlayouts

Usage

I'm still writing proper docs, you can use the below type defs to understand the gist.

declare type IPadding = {
  children: React.ReactNode;
  x: number;
  y: number;
  all: number;
};

declare type ISpacer = {
  inline: boolean;
  x: number;
  y: number;
};

Roadmap

  • Padding
  • Spacer
  • Row
  • Col
  • Card

Dev

npm i
npm run dev

Build

npm run build