# rendez

> brings order to the galaxy

Latest version **1.0.0** (published 2019-02-09) · LGPL-3.0 license · 0 weekly downloads

## Install

```sh
npm install rendez
pnpm add rendez
yarn add rendez
bun add rendez
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2019-02-09 |
| First published | 2019-02-09 |
| Weekly downloads | 0 |
| License | LGPL-3.0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 10.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Arpad Borsos |
| Maintainers | swatinem |

## Links

- npm: https://www.npmjs.com/package/rendez
- Repository: https://github.com/Swatinem/rendez
- Homepage: https://github.com/Swatinem/rendez#readme
- Issues: https://github.com/Swatinem/rendez/issues
- npm.io page: https://npm.io/package/rendez

## Recent versions

- 1.0.0 (latest) — 2019-02-09

## README

# rendez

[![Build Status](https://img.shields.io/travis/Swatinem/rendez.svg)](https://travis-ci.org/Swatinem/rendez)
[![Coverage Status](https://img.shields.io/codecov/c/github/Swatinem/rendez.svg)](https://codecov.io/gh/Swatinem/rendez)

Rendez means
[to order / to arrange](https://en.bab.la/dictionary/hungarian-english/rendez)
in hungarian, and brings order to your react subtrees.

It will merge two react subtrees, `A` and `B`, while arranging the elements from
subtree `B` into the order given by subtree `A`, based on their `key`, and
merging their props.

This was created as a way to make `React Overlays` possible in
[intl-codegen](https://github.com/eversport/intl-codegen/issues/15)

## Example

### A

```tsx
<>
  <em key="a" className="a-has-precedence">
    A
  </em>{" "}
  will provide the surrounding non-element nodes, as well as the <em key="order" /> in which to arrange the elements,
  and <em>B</em> will provide: <div key="provide" />
</>
```

### B

```tsx
<>
  <em key="order">*order*</em>
  <ul key="provide">
    <li>the element type</li>
    <li>some props, unless overridden by A</li>
    <li>and some children, unless overridden by A</li>
  </ul>
  <em key="a" className="sad-b">
    has both its className and children overridden :-(
  </em>
</>
```

### Result

```html
<em class="a-has-precedence">A</em> will provide the surrounding non-element nodes, as well as the <em>*order*</em> in
which to arrange the elements, and <em>B</em> will provide:
<ul>
  <li>the element type</li>
  <li>some props, unless overridden by A</li>
  <li>and some children, unless overridden by A</li>
</ul>
```

---
_Source: https://npm.io/package/rendez · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._