# uland

> A uhtml based neverland fork

Latest version **1.0.1** (published 2022-05-23) · ISC license · 0 weekly downloads

## Install

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

## Health

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

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2022-05-23 |
| First published | 2020-06-20 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 5 |
| Unpacked size | 159 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 111 |
| Author | Andrea Giammarchi |
| Maintainers | webreflection |
| Keywords | micro, react, hooks, neverland, µland |

## Links

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

## Dependencies (5)

- [umap](https://npm.io/package/umap.md) ^1.0.2
- [uhtml](https://npm.io/package/uhtml.md) ^3.0.1
- [uarray](https://npm.io/package/uarray.md) ^1.0.0
- [jsx2tag](https://npm.io/package/jsx2tag.md) ^0.3.0
- [uhooks-dom](https://npm.io/package/uhooks-dom.md) ^0.5.0

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.0.1 (latest) — 2022-05-23
- 1.0.0 — 2022-05-09
- 0.12.0 — 2022-05-05
- 0.10.3 — 2021-09-22
- 0.11.0 — 2021-06-26
- 0.10.2 — 2021-06-15
- 0.10.1 — 2021-06-15
- 0.10.0 — 2021-05-06
- 0.9.1 — 2021-04-08
- 0.9.0 — 2021-03-05
- 0.8.3 — 2021-02-20
- 0.8.2 — 2021-02-20
- 0.8.1 — 2021-02-19
- 0.8.0 — 2021-02-17
- 0.7.0 — 2021-02-11
- … 26 more at https://npm.io/package/uland/versions

## README

# 🦄 <em>µ</em>land

[![CSP strict](https://webreflection.github.io/csp/strict.svg)](https://webreflection.github.io/csp/#-csp-strict)

![tiny island](./uland-head.jpg)

<sup>**Social Media Photo by [Ben Klea](https://unsplash.com/@benkleaphoto) on [Unsplash](https://unsplash.com/)**</sup>

*micro* land, or *unicorn* land, is a [µhtml](https://github.com/WebReflection/uhtml#readme) take at [neverland](https://github.com/WebReflection/neverland/#readme).


### 📣 Community Announcement

Please ask questions in the [dedicated discussions repository](https://github.com/WebReflection/discussions), to help the community around this project grow ♥

---

Same API, except the exports are `{Component, render, html, svg}`, where `Component` is a function you can use either as `new Component(...)` or just `Component(...)` which is the equivalent of _neverland_ default export.

This module exports same utilities via `uland/async`, which is based on `uhooks-dom/async` for asynchronous hooks.


### Announcement

Are you looking for something even more similar to *React*? Then don't miss [🐪 kaboobie](https://github.com/WebReflection/kaboobie/#readme) out!

Are you looking for *SSR* components? Then check [🦄 µland-ssr](https://github.com/WebReflection/uland-ssr#readme) out!


## API

The concept is exactly the same as the _neverland_ one, the `render(...)` accepts a node to render, and either a *component* or a *callback* that returns some content.

[Live demo](https://codepen.io/WebReflection/pen/dyGvNdg?editors=0010).

```js
import {Component, render, html, useState} from 'uland';

const Counter = Component((initialState) => {
  const [count, setCount] = useState(initialState);
  return html`
  <button onclick=${() => setCount(count + 1)}>
    Count: ${count}
  </button>`;
});

// basic example, show two independent counters
render(document.body, () => html`
  <div>
    A bounce of counters.<hr>
    ${Counter(0)} ${Counter(1)}
  </div>
`);
```

Please [check neverland](https://github.com/WebReflection/neverland/#concept) to know more about this module usage.

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