open-index/open-npm huggingface dataset:
npm package: @johh/eslint-config
Description: Opinionated typescript eslint config based on airbnb
Author: johh
Latest version: 0.0.5

# @johh/eslint-config

An opinionated ESLint config based on [`eslint-config-airbnb`](https://www.npmjs.com/package/eslint-config-airbnb) with support for TypeScript and rules for JSX, React hooks, Jasmine, JSDoc and JSON.

## Usage

First, install the package _and_ its `peerDependencies` to your projects `devDependencies` using

```
npx install-peerdeps @johh/eslint-config --dev
```

This is required because ESLint will try to resolve plugins in the current working directory. `yarn` will be used if there's a `yarn.lock` file already present in your project.

Then add the following `.eslintrc` file to your projects root:

```json
{
  "extends": "@johh"
}
```

By default, ESLint will look for your `tsconfig` at `./tsconfig.eslint.json`. This enables you to run ESLint with a separate `tsconfig`, e.g. one including config files which you want to lint, but exclude from your actual project.

To override this behaviour, add a `parserOptions.project` entry to your `.eslintrc`, pointing to your desired `tsconfig`:

```json
{
  "extends": "@johh",
  "parserOptions": {
    "project": "./tsconfig.json"
  }
}
```
npm package: @johh/three-effectcomposer
Description: three.js's EffectComposer ported to ES6
Author: JohH
Latest version: 0.1.0
Deprecated: Starting with three.js r105, EffectComposer is included in the three package and installing @johh/three-effectcomposer is no longer necessary. It can be accessed from 'three/examples/jsm/postprocessing/EffectComposer.js'

# three.js EffectComposer
![three.js version](https://img.shields.io/badge/three.js-v0.105.0-green.svg?style=flat-square)
[![GitHub issues](https://img.shields.io/github/issues/johh/three-effectcomposer.svg?style=flat-square)](https://github.com/johh/three-effectcomposer/issues)

## Note for `three` >= v0.105.0
Please note, that starting with three.js r105, `EffectComposer` is included in the `three` package and installing `@johh/three-effectcomposer` is no longer necessary.

It can be accessed via

```javascript
import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js';
```
This package is deprecated and unmaintained.

## Installation
```
yarn add @johh/three-effectcomposer
```
```
npm i --save @johh/three-effectcomposer
```


## Description
three.js's r105 [EffectComposer](https://github.com/mrdoob/three.js/blob/dev/examples/js/postprocessing/EffectComposer.js) ported to ES6 for easy importing.


## Usage
```javascript
import { WebGLRenderer } from 'three';
import EffectComposer, {
	Pass,
	RenderPass,
	ShaderPass,
	TexturePass,
	ClearPass,
	MaskPass,
	ClearMaskPass,
	CopyShader,
} from '@johh/three-effectcomposer';

const renderer = new WebGLRenderer();
const composer = new EffectComposer( renderer );
```


## Differences to the original
- This package does not rely on namespace pollution, so `THREE.EffectComposer`, `THREE.Pass`, etc. remain undefined.

- An additional Pass, called `RenderingPass`, is exported. It includes a standard rendering setup, i.e. a scene (as `this.scene`), including an orthographic camera (`this.camera`) and quad (`this.quad`). This is useful if your custom pass requires said setup, but a customized rendering function. Since r103 this pass has been made redundant by Pass.FullScreenQuad, but remains for backwards compatibility.


## Testing
Testing is done with mocha in a Chromium environment using puppeteer.

The structure of each class, as well as its visual output, is compared to its original counterpart.

Due to the virtually infinite number of possible combinations it is pretty much impossible to cover **every** use case.


## Credits
This package is heavily based on code that was originally written by [alteredq](https://github.com/alteredq) and is licensed **MIT** © 2010-2019 three.js authors.
npm package: @johly/motion
Description: Svelte animation library inspired by the React library framer-motion.
Author: JonathonRP
Latest version: 0.0.1

<p align="center">
 <img align="center" src="https://raw.githubusercontent.com/JonathonRP/motion-start/main/static/logo.webp" height="96" />
 <h1 align="center">
  Motion Start
 </h1>
</p>

<div align="center">

An animation library inspired by [framer-motion](https://www.framer.com/motion/)

[![Discord](https://img.shields.io/discord/1288125623570530334?logo=discord&logoColor=white&label=discord&labelColor=5865F2")](https://discord.gg/bTa32kj9T3)
[![Build Status](https://img.shields.io/github/actions/workflow/status/JonathonRP/motion-start/main.yaml)](https://github.com/JonathonRP/motion-start/actions)
[![License](https://img.shields.io/npm/l/%40johly%2Fmotion.svg?color=blue)](https://github.com/JonathonRP/motion-start/blob/main/LICENSE.md)
[![Latest Release](https://img.shields.io/npm/v/%40johly%2Fmotion.svg)](https://www.npmjs.com/package/@johly/motion)
[![Downloads](https://img.shields.io/npm/dt/%40johly%2Fmotion.svg)](https://www.npmjs.com/package/@johly/motion)
</div>

---

Temporary scoped fork of the rewrite branch, published as `@johly/motion` until the upstream rewrite is published.

> [!WARNING]
> **Note:** 🚧 This library is currently in alpha. Features and APIs may change. expect bugs and please report or make PRs to fix bugs.

> **Note:** This is svelte-motion ported to typescript currently. We have plans to evolve it to include modern features in framer-motion and to use svelte/motion to implement animations in the future.

## Installation

```sh
npm install --save-dev @johly/motion
```

```sh
pnpm install --save-dev @johly/motion
```

```sh
yarn install --save-dev @johly/motion
```

```sh
bun install --save-dev @johly/motion
```

## Usage

Corresponding to a `MotionDiv` in framer-motion is this:

```javascript


import { motion } from '@johly/motion'

<motion.div></motion.div>
```
For svg elements like 'g', 'path' or 'circle', use:

```javascript
<motion.g></motion.g>
```


# Community
Join the Discord server to ask questions, find collaborators, or say hi!

<a href="https://discord.gg/bTa32kj9T3" alt="Motion Start">
<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://invidget.switchblade.xyz/bTa32kj9T3">
  <img alt="Motion Start Discord Community" src="https://invidget.switchblade.xyz/bTa32kj9T3?theme=light">
</picture>
</a>
npm package: @johly/vaul-svelte
Description: Everything you need to build a Svelte library, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/main/packages/create-svelte).
Latest version: 1.0.0-next.23

# create-svelte

Everything you need to build a Svelte library, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/main/packages/create-svelte).

Read more about creating a library [in the docs](https://kit.svelte.dev/docs/packaging).

## Creating a project

If you're seeing this, you've probably already done this step. Congrats!

```bash
# create a new project in the current directory
npm create svelte@latest

# create a new project in my-app
npm create svelte@latest my-app
```

## Developing

Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:

```bash
npm run dev

# or start the server and open the app in a new browser tab
npm run dev -- --open
```

Everything inside `src/lib` is part of your library, everything inside `src/routes` can be used as a showcase or preview app.

## Building

To build your library:

```bash
npm run package
```

To create a production version of your showcase app:

```bash
npm run build
```

You can preview the production build with `npm run preview`.

> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.

## Publishing

Go into the `package.json` and give your package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).

To publish your library to [npm](https://www.npmjs.com):

```bash
npm publish
```
npm package: @johman/helper
Description: Joined mini functions to help minimize duplicated coding between projects
Author: JohMan
Latest version: 0.1.0

# johman-helper
Joined mini functions to help minimize duplicated coding between projects


## Installation

```
npm install @johman/helper
```

## Peer Dependencies
- [lodash](https://github.com/lodash/lodash): A modern JavaScript utility library delivering modularity, performance & extras.
- [iconv-lite](https://github.com/ashtuchkin/iconv-lite): Convert character encodings in pure javascript.
- [opencc](https://github.com/BYVoid/OpenCC): Conversion between Traditional and Simplified Chinese.

`Note: Peer dependencies are not required for general functionality.`

## Documentation
- General
    - Functions
        - delay: Delay in milliseconds with promise
        - getWebsiteName: Get name of the website by checking the src
    - String.prototype
        - capitalize: Capitalize first character in the string
        - escapeRegExp: Escape all characters for regular expression
        - extractBetween: Extract the string between the start and end string. Return empty if no match found
- Required for `lodash`
    - Functions
        - getHeadersCookie: Extract cookie from the headers. Using filter for specific cookie
        - getCookieExpireDate: Extract the expire date from cookie string
        - getHeadersCookieExpireDate: Extract cookie expire date from the headers. Using filter for specific cookie
        - convertToByReference: Pass in function arguments and return as pass by reference
        - convertArgumentsToByReference: Same as `convertToByReference` but return in Promise
        - compactObject: Compact object
- Required for `assert`
    - Functions
        - handleTestError: Log the test error and assert for false
- Required for `iconv-lite`
    - String.prototype/Buffer.prototype
        - encode: Encode string/buffer with charset
    - Buffer.prototype.decode: Decode buffer with charset
- Required for `opencc`
    - String.prototype.toTraditional: Translate string to traditional chinese
    - String.prototype.toSimplified: Translate string to simplified chinese

## License
[MIT](LICENSE)
npm package: @johmara/openclaude
Description: A full-featured TUI for Claude Code
Author: johmara
Latest version: 0.1.4

# @johmara/openclaude

A full-featured terminal UI for [Claude Code](https://docs.anthropic.com/en/docs/claude-code).

## Quick start

```sh
npx @johmara/openclaude
```

## Prerequisites

The [Claude Code CLI](https://docs.anthropic.com/en/docs/claude-code) must be installed and authenticated before running OpenClaude.

## Documentation

See the [main repository](https://github.com/johmara/openclaude) for full documentation, keybindings, themes, and configuration options.
npm package: @johmun/vue-tags-input
Description: A tags input component for VueJS with autocompletion, custom validation, templating and much more
Author: Johannes Munari
Latest version: 2.1.0

# vue-tags-input

A tags input component for VueJS with autocompletion, custom validation, templating and much more

[Demo & Docs](http://www.vue-tags-input.com)

## Features

* No dependencies
* Custom validation rules
* Hooks: Before adding, Before deleting ...
* Edit tags after creation
* Fast setup
* Works with Vuex
* Small size: 34kb minified (css included) | gzipped 9kb
* Autocompletion
* Many customization options
* Own templates
* Delete tags on backspace
* Add tags on paste
* Examples & Docs

## Install

NPM
```
npm install @johmun/vue-tags-input
```

CDN
```
<script src="https://unpkg.com/@johmun/vue-tags-input/dist/vue-tags-input.js"></script>
```

## Usage

```html
<template>
  <div>
    <vue-tags-input
      v-model="tag"
      :tags="tags"
      @tags-changed="newTags => tags = newTags"
    />
  </div>
</template>
```

```javascript
<script>
import VueTagsInput from '@johmun/vue-tags-input';

export default {
  components: {
    VueTagsInput,
  },
  data() {
    return {
      tag: '',
      tags: [],
    };
  },
};
</script>
```

## License

[MIT](https://opensource.org/licenses/MIT)

Copyright (c) 2019 Johannes Munari