open-index/open-npm huggingface dataset:
npm package: @microstates/react
Description: Provides useType hook
Author: Taras Mankovski
Latest version: 0.12.0

# @microstates/react

[![Build Status](https://travis-ci.org/microstates/react.svg?branch=master)](https://travis-ci.org/microstates/react) [![Greenkeeper badge](https://badges.greenkeeper.io/microstates/react.svg)](https://greenkeeper.io/)

This package provides `useType` hook for React that supports `useState` hook. 

*If your version of React doesn't have `useState`, don't install this package. Go to [Microstates with React Class Components](#microstates-with-react-class-components) section.*

## Installation

```bash
npm install --save @microstates/react

# or

yarn add @microstates/react
```

## Usage

`useType` takes the same arguements as Microstates `create` but it provides you with a microstate
that will re-render the component on every transition.

```jsx
function App() {
  let number = useType(Number, 42);

  return (
    <>
      <span>{number.state}</span>
      <button onClick={() => number.increment()}>Increment</button>
    </>
  );
}
```

## Microstates with React Class Components

It's easier to setup Microstates with React Class Component than to install a package 
that provides a component that does this. Here is how it's done.

```jsx
import React from 'react';
import { create, Store } from 'microstates';

let initial = create(Number, 42);

class App extends React.Component {
  // this function will be invoked when transition is called
  // it will receive the next microstate. Set it onto your state.
  update = $ => this.setState({ $ });

  state = {
    // I'm using $ cause I'm bling like that, 
    // but you can use anything you want
    $: Store(initial, this.update)
  }

  render() {
    return this.state.$.state;
  } 
}
```

That's it.
npm package: @microstates/todomvc
Description: Microstate for TodoMVC Components
Author: Taras Mankovski
Latest version: 0.12.0

[![Build Status](https://travis-ci.com/microstates/todomvc.svg?branch=master)](https://travis-ci.com/microstates/todomvc) [![Coverage Status](https://coveralls.io/repos/github/microstates/todomvc/badge.svg?branch=tm%2Fupgrade-microstates)](https://coveralls.io/github/microstates/todomvc?branch=tm%2Fupgrade-microstates)

# TodoMVC Microstate

This package provides a Microstate model for state of a TodoMVC component. It includes tests and is published as `@microstates/todomvc` package. The purpose of this package is to show how a Microstate can be distributed via NPM. The state can be consumed by projects in different frameworks.

* [TodoMVC Microstate](todomvc.js)
* [TodoMVC in React.js](sandboxes/react/App.js) - [create React sandbox](https://codesandbox.io/s/github/microstates/todomvc/tree/master/sandboxes/react)
* [TodoMVC in Vue.js](sandboxes/vue/src/App.vue) - [create Vue sandbox](https://codesandbox.io/s/github/microstates/todomvc/tree/master/sandboxes/vue)

Learn more about Microstates.js at [microstates/microstates.js](http://github.com/microstates/microstates.js).

## Installation

`npm install --save @microstates/todomvc`

or

`yarn add @microstates/todomvc`

## Getting Started

To use this model, you can import it and create a Microstate.

```js
import { create } from 'microstates'
import TodoMVC from '@microstate/todomvc'

let todomvc = create(TodoMVC)
```

## Tests

The Microstate comes with [tests](tests/todomvc-test.js) with 100% coverage.

```js
git clone git@github.com:microstates/todomvc.git
cd todomvc
npm install
npm test
```
npm package: @microstates/union
Description: Crisply modeled state machines with tagged union types for Microstates.
Author: Charles Lowell
Latest version: 0.1.0

## @microstates/union

Crisply represent state machines using union types.

``` javascript

import Union from '@microstates/union';

const Task = Union({
  Pending: Task => class extends Task {
    resolve(result) {
      return this.toResolved(result);
    }
    reject(error) {
      return this.toRejected(error);
    }
  },
  Resolved: Task => class extends Task {},
  Rejected: Task => class extends Task {}
});

let pending = Task.Pending.create();
pending instanceof Task //=> true
pending instanceof Task.Pending //=> true
pending.isPending //=> true
pending.isResolved //=> false
pending.isRejected //=> false;


let resolved = pending.resolve('here is some data');
resolved instanceof Task //=> true
resolved instanceof Task.Resolved //=> true
resolved.isPending //=> false
resolved.isResolved //=> true
resolved.isRejected //=> false


let rejected = pending.reject(new Error('something not good happened'));
resolved instanceof Task //=> true
resolved instanceof Task.Rejected //=> true
resolved.isPending //=> false
resolved.isResolved //=> false
resolved.isRejected //=> true
```
npm package: @microstore/common
Description: Shared code between microstore services
Author: Frank Gerold
Latest version: 1.2.3

# Microstore-Common
### Code shared between services in my Microstore app.

## Errors
Code related to error handling. 
Custom error classes for standardized responses and serialization.

## Middleware
Various reusable middlewares for the Express request handling.

## Messaging
NATS Streaming Server events live here. Define all messages and subjects, and abstract classes & interfaces for listeners and publishers to subclass in the serevices.