open-index/open-npm huggingface dataset:
npm package: @slidy/easing
Description: Simple easing functions for inertion scrolling
Author: Valexr
Latest version: 1.0.7

[![npm version](https://img.shields.io/npm/v/@slidy/easing)](https://www.npmjs.com/package/@slidy/easing)
[![npm bundle size](https://img.shields.io/bundlephobia/minzip/@slidy/easing?label=minzip)](https://bundlephobia.com/package/@slidy/easing)
[![npm downloads](https://img.shields.io/npm/dt/@slidy/easing)](https://www.npmjs.com/package/@slidy/easing)
[![github issues](https://img.shields.io/github/issues/valexr/slidy)](https://github.com/Valexr/slidy/issues)
[![npm license](https://img.shields.io/npm/l/@slidy/easing)](https://www.npmjs.com/package/@slidy/easing)

# @slidy/easing

Simple easings function for inertion scrolling.

#### Try the [DEMO]

> - [Getting started](#getting-started-)
> - [Usage](#usage)


## Getting started 🚀

The package is available via [NPM]:

```sh
npm i -D @slidy/easing
```
or from [CDN]:

```html
<script src="https://unpkg.com/@slidy/easing"></script>
```


## Usage

Easing functions available via named import as `MJS/CJS` module or via global `Window.Slidy` object props as `IIFE`.  
Includes `linear, quad, cubic, quart, quint, bounce, sine, expo, elastic, circ, back` as EaseIn functions.  
More info: https://easings.net.

> ⚠️ For proper operation minimal `duration: 450` needed.

```ts
/** Easing function.
 * @param t value from 0 to 1
 * @returns value from 0 to 1
 * @default linear
 * @see https://easings.net
 */

type Easing = (t: number) => number;
```


### MJS/CJS module import

```html
<head>
   <script type="module">
        import * as easing from 'https://unpkg.com/@slidy/easing/dist/index.mjs'; // MJS module
        // OR
        import * as easing from 'https://unpkg.com/@slidy/easing/dist/index.cjs'; // CJS module
    </script>
</head>
```

### IIFE as `Window` Object

```html
<head>
    <script src="https://unpkg.com/@slidy/easing/dist/index.js"></script>
</head>

<script>
    window.onload = () => easing = SlidyEasing.linear()
</script>
```

### As third party module in any frameworks

```svelte
<!-- Svelte -->

<script>
    import { linear } from '@slidy/easing';

    <Slidy easing={linear} />
</script>
```


MIT &copy; [Valexr](https://github.com/Valexr)

[DEMO]: https://slidy-core.surge.sh
[NPM]: https://www.npmjs.com/package/@slidy/easing
[CDN]: https://unpkg.com/@slidy/easing/
[REPL]: https://svelte.dev/repl/e7a3683b13b342dc8ecfc1d9b2b806f6
npm package: @slidy/plugins
Description: Simple plugins functions for @slidy/core
Author: Valexr
Latest version: 1.3.0

[![npm version](https://img.shields.io/npm/v/@slidy/plugins)](https://www.npmjs.com/package/@slidy/plugins)
[![npm bundle size](https://img.shields.io/bundlephobia/minzip/@slidy/plugins?label=minzip)](https://bundlephobia.com/package/@slidy/plugins)
[![npm downloads](https://img.shields.io/npm/dt/@slidy/plugins)](https://www.npmjs.com/package/@slidy/plugins)
[![github issues](https://img.shields.io/github/issues/valexr/slidy)](https://github.com/Valexr/slidy/issues)
[![npm license](https://img.shields.io/npm/l/@slidy/plugins)](https://www.npmjs.com/package/@slidy/plugins)

# @slidy/plugins

Plugins functions for @slidy/core script.

#### Try the [DEMO]

> - [Getting started](#getting-started-)
> - [Usage](#usage)


## Getting started 🚀

The package is available via [NPM]:

```sh
npm i -D @slidy/plugins
```
or from [CDN]:

```html
<script src="https://unpkg.com/@slidy/plugins"></script>
```


## Usage

Plugin functions available via named import as `MJS/CJS` module or via global `Window.Slidy` object props as `IIFE`. 

```ts
export type PluginArgs = {
    node: HTMLElement,
    options: Options,
    instance: SlidyInstance
}

type PluginFunc = (args: PluginArgs) => void;
```


### MJS/CJS module import

```html
<head>
   <script type="module">
        import * as plugins from 'https://unpkg.com/@slidy/plugins/dist/index.mjs'; // MJS module
        // OR
        import * as plugins from 'https://unpkg.com/@slidy/plugins/dist/index.cjs'; // CJS module
    </script>
</head>
```

### IIFE as `Window` Object

```html
<head>
    <script src="https://unpkg.com/@slidy/plugins/dist/index.js"></script>
</head>

<script>
    window.onload = () => marquee = SlidyPlugins.marquee()
</script>
```

### As third party module in any frameworks

```svelte
<!-- Svelte -->

<script>
    import { marquee } from '@slidy/plugins';

    <Slidy plugins={[marquee]} />
</script>
```


MIT &copy; [Valexr](https://github.com/Valexr)

[DEMO]: https://slidy-core.surge.sh
[NPM]: https://www.npmjs.com/package/@slidy/plugins
[CDN]: https://unpkg.com/@slidy/plugins/
[REPL]: https://svelte.dev/repl/e7a3683b13b342dc8ecfc1d9b2b806f6
npm package: @slietar/decorator
Description: A toolkit for building ES16 decorators
Latest version: 0.2.0-beta.2

# Decorator

## Example

```js
import { Decorator, TargetKind } from 'decorator';

let transform = decorator({
  [TargetKind.Parameter]: function (type) {
    this.cover(function (arg) {
      if (type === 'uppercase') return arg.toUpperCase();
      else if (type === 'lowercase') return arg.toLowerCase();
      // nothing
    });
  }
});
```

```js
class A {
  setLastName(@transform('uppercase') name) {
    this.lastName = name;
  }
}

let a = new A();
a.setName('Doe');

console.log(a.lastName); // outputs `DOE`
```

Note: you must include the `decorate` library first

## Patterns

| Agent method                 | Pattern                 |
|------------------------------|-------------------------|
| `ClassAgent#cover()`         | `(A) ⟼ A`             |
| `ClassAgent#method()`        | `(N) ⟼ MethodAgent`   |
| `ClassAgent#override()`      | `(A) ⟼ R`             |
| `ClassAgent#wrap()`          | `(R) ⟼ R`             |
| `MethodAgent#toProperty()`   | `( ) ⟼ void`          |
| `ParameterAgent#getMethod()` | `( ) ⟼ MethodAgent`   |

## Order

On method:

```
class A {
  @cover1()
  @cover2()
  @wrap()
  @cover3()
  method() {

  }
}
```

Final order:

```
⟼ cover1(input) ⟼ A
⟼ cover2() ⟼ A
⟼ cover3() ⟼ A
⟼ method() ⟼ R
⟼ wrap()   ⟼ output
```

## With TSD

```sh
$ npm install @slietar/decorator
$ tsd link
```
npm package: @slietar/iterator-stream
Description: Stream <-> iterator functions
Latest version: 0.1.0

# Iterator <-> stream utilities

[![Build Status](https://travis-ci.org/slietar/iterator-stream.svg?branch=master)](https://travis-ci.org/slietar/iterator-stream)
[![Coverage Status](https://coveralls.io/repos/slietar/iterator-stream/badge.svg?branch=master&service=github)](https://coveralls.io/github/slietar/iterator-stream?branch=master)


## createReadStreamFromIterator

```js
createReadStreamFromIterator(...'abc').pipe(process.stdout);
```

Options:

* type:
  * `sync`: asynchronous elements (promises, streams) are executed after the previous one ended
  * `async` (default): asynchronous elements are executed immediately, but the order in which they were given is kept
  * `disordered`: asynchronous elements are executed immediately and written to the stream just after they end

```js
let delay = function (d, v) {
  return new Promise((resolve) => {
    setTimeout(() => resolve(v), d);
  });
};

let generator = function* () {
  yield delay(400, 'a');
  yield 'b';
  yield delay(200, 'c');
};

createReadStreamFromIterator(generator(), { type: 'sync' });       // 600ms: [a, b, c] [400, 400, 600]
createReadStreamFromIterator(generator(), { type: 'async' });      // 400ms: [a, b, c] [400, 400, 400]
createReadStreamFromIterator(generator(), { type: 'disordered' }); // 400ms: [b, c, a] [0, 200, 400]
```


## createIteratorFromReadStream

```js
let iterator = createIteratorFromReadStream(process.stdin);

for (let chunk of iterator) {
  ...
}
```


## consumeReadStreamWithIterator

```js
consumeReadStreamWithIterator(process.stdin, (function* () {
  let chunk0 = yield 3;
  let chunk1 = yield;
})());
```
npm package: @slietar/jsx-dom
Author: Simon Liétar
Latest version: 0.1.2

# jsx-dom


## example

```js
/** @jsx createElement */
/** @jsxFrag Fragment */

import { Fragment, createElement, getReferences } from 'jsx-dom';

let tree = (
  <div>
    <h1>Title</h1>
    <p>Text</p>
  </div>
);

document.body.appendChild(getReferences(tree).self);
```


## features

### references

```js
let tree = (
  <div>
    <h1 ref="title">Title</h1>
  </div>
);

let refs = getReferences(tree);

// replace children with a single text node
refs.title = 'Updated title';

// replace element (reference will be kept)
// for now, global references in children are ignored
refs.title = <h1>Updated title</h1>;

// replace children
// for now, all references in children are ignored
refs.title = [<strong>Updated</strong>, ' title'];
refs.title = <><strong>Updated</strong> title</>;

// retreive element
let h1 = refs.title.self;
```

### subreferences

```js
let tree = (
  <ul>
    <li ref="item1">
      <div>
        <!-- refers to the closest parent reference -->
        <div ref=".title">Title item 1</div>
      </div>
    </li>
    <li ref="item2">
      <div>
        <div ref=".title">Title item 2</div>
      </div>
    </li>
  </ul>
);

let refs = getReferences(tree);

// update subreference
refs.item1.title = 'Updated title item 1';
refs.item2.title = 'Updated title item 2';

// retreive subreference element
let title1 = refs.item1.title.self;
```

### event listeners

```js
let handler = (event) => {
  // ...
};

let tree = (
  <a href="#" onclick={handler}>Link</a>
);
```