open-index/open-npm huggingface dataset:
npm package: @michellbrito/vue3-tags-input-2
Description: A tags input component for Vue 3 with autocompletion, custom validation, templating and much more
Author: Johannes Munari
Latest version: 3.0.3

# vue-tags-input

A tags input component for Vue 3 with autocompletion, custom validation, templating and much more

Forked from [@johmun/vue-tags-input](https://www.npmjs.com/package/@johmun/vue-tags-input), which you should use instead if your project is on Vue 2. 

[Demo & Docs](http://www.vue-tags-input.com) (for the original version)

## 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 @sipec/vue3-tags-input
```

CDN
```
<script src="https://unpkg.com/@sipec/vue3-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 "@sipec/vue3-tags-input";

export default {
  components: {
    VueTagsInput,
  },
  data() {
    return {
      tag: '',
      tags: [],
    };
  },
};
</script>
```

## Migration From Vue 2

This version is faithful to the original spec. The only thing you'll have to change is replacing any usages of `tags.sync` with `vmodel:tags` in the props

## License

[MIT](https://opensource.org/licenses/MIT)

Copyright (c) 2019 Johannes Munari
npm package: @michellesanver/nuxt-cookie-control
Description: Nuxt Cookie Control Module with option to manage
Author: Michelle Sanver
Latest version: 7.1.1

# Nuxt Cookie Control
This is a fork of dargmuesli/nuxt-cookie-control that adds an option to remove the button to manage your cookies. This could be good if you want to have only an accept terms of services button for now where cookies are mentioned. But still have the flexibility of the cookies consent for a later date. 

🚩 Trying to keep this package up to date with the main branch, so go there for documentation [gitlab.com/dargmuesli/nuxt-cookie-control](https://gitlab.com/dargmuesli/nuxt-cookie-control), make sure to read the README!

Only added thing in this repository is an "isManageable" boolean module option.
npm package: @michellocana/react-scrolllock
Description: Prevent scroll on the body when component is mounted.
Author: Joss Mackison
Latest version: 1.0.1

# React Scroll Lock

_🚨 Not Maintained_
[![No Maintenance Intended](http://unmaintained.tech/badge.svg)](http://unmaintained.tech/)

This project is a fork of [react-scrolllock](https://www.npmjs.com/package/react-scrolllock), which is now unmantained. This version keeps almost all of the original code, but updates the `react` and `react-dom` peer dependencies and moves from Flow to TypeScript.

Prevent scroll on the `<body />` when a component is mounted.

## Install

```bash
yarn add react-scrolllock
```

## Usage

```js
import { ScrollLock, TouchScrollable } from 'react-scrolllock'

class Modal extends Component {
  state = { lockScroll: false }
  render() {
    return (
      <div>
        ... // the lock accepts a single child element, which supports touch-scrolling.
        <ScrollLock>
          <ElementWithScrollableContent>...</ElementWithScrollableContent>
        </ScrollLock>
        // if your app structure doesn't allow wrapping like above, the `TouchScrollable` // component is exposed as a
        named export.
        <ScrollLock />
        <TouchScrollable>
          <ElementWithScrollableContent>...</ElementWithScrollableContent>
        </TouchScrollable>
        // you can also toggle the lock based on some state.
        <ScrollLock isActive={this.state.lockScroll} />
      </div>
    )
  }
}
```

## Props

#### ScrollLock

| Property                       | Description                                                                             |
| ------------------------------ | --------------------------------------------------------------------------------------- |
| accountForScrollbars `boolean` | Default: `true` -- Whether or not to replace the scrollbar width when active.           |
| isActive `boolean`             | Default: `true` -- Whether or not the lock is active.                                   |
| children `element`             | Default: `null` -- This element is wrapped internally by the TouchScrollable component. |

#### TouchScrollable

Wrap an element in the `TouchScrollable` component if you need an area that supports scroll on mobile.

This is necessary because the `touchmove` event is explicitly cancelled &mdash; iOS doesn't observe `overflow: hidden;` when applied to the `<body />` element 😢

| Property           | Description      | -                                              |
| ------------------ | ---------------- | ---------------------------------------------- |
| children `element` | `ref => element` | **Required** The element that can be scrolled. |
npm package: @michelo11/botjs
Description: BotJS
Latest version: 1.0.11

<h1 align="center">Welcome to Bot.js 👋</h1>
<p>
  <a href="https://botjs.michelemanna.me" target="_blank">
    <img alt="Documentation" src="https://img.shields.io/badge/documentation-yes-brightgreen.svg" />
  </a>
  <a href="https://twitter.com/Michelo117" target="_blank">
    <img alt="Twitter: Michelo117" src="https://img.shields.io/twitter/follow/Michelo117.svg?style=social" />
  </a>
</p>

> Code your bot once and run it everywhere

### 🏠 [Homepage](https://github.com/Michelo11/botjs)

## Install

```sh
npm i bot.js
```

## Usage

```sh
botjs dev/build
```

## Using a template 
Use the following command to create a project with a template:

```sh
pnpm create botjs
```

## Author

👤 **Michelo11**

* Website: michelemanna.me
* Twitter: [@Michelo117](https://twitter.com/Michelo117)
* Github: [@Michelo11](https://github.com/Michelo11)

## 🤝 Contributing

Contributions, issues and feature requests are welcome!<br />Feel free to check [issues page](https://github.com/Michelo11/botjs/issues). 

## Show your support

Give a ⭐️ if this project helped you!
npm package: @michelo11/expensify-sdk
Description: An sdk to integrate with expesify APIs
Author: Michelo11
Latest version: 1.0.2

﻿
# expensify-sdk
An sdk to integrate with expensify APIs

## Installation
```bash
npm install @michelo11/expensify-sdk
# OR
yarn add @michelo11/expensify-sdk
# OR
pnpm install @michelo11/expensify-sdk
```

## Usage
```typescript
import { createTransaction } "@michelo11/expensify-sdk";

createTransaction(
    [
        {
            description: "Example transaction",
            amount: 100,
            createdAt: new Date(),
            action: "DEPOSIT",
        },
    ],
    "ORGANIZATION ID",
    "API KEY"
).then(console.log);
```
npm package: @michgonch/sure
Description: Etude on Promise implementation, bundled with Rollup and published to NPM.
Author: Michael Goncharov
Latest version: 1.0.1

[![npm (scoped)](https://img.shields.io/npm/v/@michgonch/sure.svg)](https://github.com/michgonch/sure)
[![npm bundle size](https://img.shields.io/bundlephobia/min/@michgonch/sure.svg)](https://github.com/michgonch/sure)

# Sure

Implementing Thenable.

## Install

```
npm install @michgonch/sure
```

## Usage

```js
const Sure = require("./sure");

new Sure(resolve => {
  setTimeout(() => {
    resolve(`Hello, Promise!`);
  }, 1000);
}).then(msg => console.log(msg));

(async () => {
  const msg = await new Sure(resolve => {
    setTimeout(() => {
      resolve(`Hello, Async!`);
    }, 2000);
  });

  console.log(msg);
})();
```

## Inspiration

[How to make a beautiful, tiny npm package and publish it](https://medium.freecodecamp.org/how-to-make-a-beautiful-tiny-npm-package-and-publish-it-2881d4307f78)

[Write Your Own Node.js Promise Library from Scratch](https://thecodebarbarian.com/write-your-own-node-js-promise-library-from-scratch.html)

## License

MIT.
npm package: @michiel.goetahls/examenopdracht
Description: ![npm badge](https://img.shields.io/badge/npm-v1.1.0-brightgreen.svg) ![ESLint](../../workflows/ESLint/badge.svg?branch=master) ![Markdown Linter](../../workflows/Markdown%20Linter/badge.svg?branch=master) ![Tests](../../workflows/Tests/badge.svg?branch=m
Author: Michiel Goethals
Latest version: 1.1.0

# Examenopdracht

![npm badge](https://img.shields.io/badge/npm-v1.1.0-brightgreen.svg)
![ESLint](../../workflows/ESLint/badge.svg?branch=master)
![Markdown Linter](../../workflows/Markdown%20Linter/badge.svg?branch=master)
![Tests](../../workflows/Tests/badge.svg?branch=master)

## LCD Temperature

This repository has the functionality to display temperature in LCD Style.

### Description

When only using the first argument of the constructor and so you only pass the temperature, you get a default output. This means you get small digits (height: 2, width: 3) and you don't get a border around the temperature.

When using the first two arguments of the constructor, you pass the temperature and enable the border when entering true.

When using the first three arguments of the constructor, you pass the temperature, enable the border (when entering true) and enable the big format when entering true (height: 4, width: 5).

### Installation instructions

1. Simply clone this repository

2. Run the following command in the folder where you cloned the project

```bash
ts-node index.ts
```

### Multiple usage instructions and examples

1. Small format digits without border (Default):

    - Index.ts:

        ![Default](img/default.png)

    - Output:

        ![Default output](img/output_default.png)

2. Small format digits with border:

    - Index.ts:

        ![Small with border](img/small_with_border.png)

    - Output:

        ![Small with border output](img/output_border.png)

3. Big format digits without border:

    - Index.ts:

        ![Big without border](img/big_without_border.png)

    - Output:

        ![Big without border output](img/output_big_without_border.png)

4. Big format digits with border:

   - Index.ts:

        ![Big with border](img/big_with_border.png)

   - Output:

        ![Big without border output](img/output_big_with_border.png)

### License

Licensed under MIT because it does not state changes and you can use any other license.

### Author information

Wrote by Michiel Goethals, Student electronics & ict @ Vives Brugge
npm package: @michiel.goetahls/home-automation
Description: ![npm badge](https://img.shields.io/badge/npm-v0.6-brightgreen.svg) ![ESLint](../../workflows/ESLint/badge.svg?branch=master) ![Markdown Linter](../../workflows/Markdown%20Linter/badge.svg?branch=master) ![Tests](../../workflows/Tests/badge.svg?branch=mas
Author: Michiel Goethals
Latest version: 0.8.0

# Home automation

![npm badge](https://img.shields.io/badge/npm-v0.6-brightgreen.svg)
![ESLint](../../workflows/ESLint/badge.svg?branch=master)
![Markdown Linter](../../workflows/Markdown%20Linter/badge.svg?branch=master)
![Tests](../../workflows/Tests/badge.svg?branch=master)

## Thermostat

This repository is a simple typescript program that includes the basic functionality of a thermostat.

### Description

 You can set the wanted temperature and range with a JSON Object. You can also use the 'update' function to set the current room temperature. Its also possible to provide a unit to the JSON Object. These temperature are then been send to the JSON Thermostat' class. This class processes the JSON Objects to numbers and passes these values to the 'thermostat' class. Based on the unit, the class 'temperature' processes the values to one unit (celsius) so the 'thermostat' class can calculate a result.
 The finished result looks like this:

 ```bash
{
  "cooling": true,
  "heating": false
}
 ```

### Installation instructions

1; Simply clone this repository

2; Run the following command in the folder where you cloned the project

```bash
ts-node index.ts
```

### Multiple usage instructions and examples

#### v0.4

1; You first need to set the themostat to wanted values wich can be set in the settings (wanted temperature and range) in the 'app' class. It could look something like this:

```typescript
    let settings =  {
        temperature: 22.0,
        range: 1.0,
        unit: "celsius"
    }
```

2; After that you can set a current room temperature. Wich could look like this:

```typescript
    let updateSettings =  {
        temperature: 300.0,
        unit: "kelvin"
    }
```

#### v0.6

1; You first need to set the themostat to wanted values wich can be set in the settings (wanted temperature and range) in the 'app' class. It could look something like this:

```typescript
    let settings =  {
        temperature: 22.0,
        range: 1.0,
        unit: "celsius"
    }
```

2; In this version the current temperature is updated via an api.

### License

Licensed under MIT because it does not state changes and you can use any other license.

### Author information

Wrote by Michiel Goethals, Student electronics & ict @ Vives Brugge
npm package: @michieldecoster/home-automation
Description: home automation software in typescript
Author: Michiel Decoster
Latest version: 0.8.1

# Home-automation

![NPM-badge]( http://img.shields.io/badge/npm-v0.8.1-blue.svg )

![ESLint](../../workflows/ESLint/badge.svg?branch=master)

![Markdown Linter](../../workflows/Markdown%20Linter/badge.svg?branch=master)

![Tests](../../workflows/Tests/badge.svg?branch=master)

## Description

This is a repository for the use of home-automation.

Its developed in typescript and uses npm package manager to install.

## Installation instructions

Uses npm to install

Command:

```bash
npm install michieldecoster/home-automation
```

## Usage instructions and examples

### Creating a Thermostat

Create a JSONThermostat with the 3 required parameters:

- Temperature
- Range
- Unit: with the choice of
  - Celsius
  - Fahrenheit
  - Kelvin

Example 1 :

```typescript
const thermo = new JSONThermostat( { temperature: 75,range: 1, unit: "Fahrenheit" } )
```

Example 2 :

```typescript
const thermo = new JSONThermostat( { temperature: 30,range: 5, unit: "Celsius" } )
```

### Updating the Thermostat

The termostat can be updated through the use of the `update` method.

There are 3 values you can update:

- Temperature
- Range
- Unit: with the choice of
  - Celsius
  - Fahrenheit
  - Kelvin

Example 1: Updating the temperature

```typescript
thermo.update( { temperature:15 } )
```

Example 2: Updating the temperature and range

```typescript
thermo.update( { temperature:20, range: 5 } )
```

Example 3: Updating the temperature, range and unit

```typescript
thermo.update( { temperature:15, range:5, unit: "Celsius" } )
```

## Running the coded tests

```bash
npm run tests
```

## Licence

MIT

## Github Pages

[Github Pages link](https://vives-software-engineering-2020.github.io/home-automation-MichielDecoster/)

## Author Information

Author: Michiel Decoster

Student at Vives Hogeschool Brugge
npm package: @michieldemey/strapi-blurhash
Description: A plugin that generates blurhash for your uploaded images
Author: Emil Petras
Latest version: 2.0.0

# Strapi plugin strapi-blurhash

A plugin for <a href="https://github.com/strapi/strapi">Strapi CMS</a> that generates blurhash for your uploaded images

## Installation

To install, run:

```bash
npm install strapi-blurhash
```

Open/create file `config/plugins.js`. Enable this plugin by adding:

```js
module.exports = {
    ...
    'strapi-blurhash': {
      enabled: true,
      config: {
        regenerateOnUpdate: true,
        forceRegenerateOnUpdate: false,
      }
    },
  }
```

## How to generate blurhash for an image

In the Strapi Dashboard open Content Manager. Edit one collection/single type. Add or edit a Media field type and save the collection/single type.

## How to get blurhash

Target a Strapi REST API endpoint. For example:

```
localhost:1337/api/products?populate=Image.*
```

The response will be a JSON containing blurhash along with rest of the image data:

```js
{
  "data": [
    {
      "id": 6,
      "attributes": {
        "name": "Test",
        "createdAt": "2022-10-27T14:52:04.393Z",
        "updatedAt": "2022-10-28T09:58:22.238Z",
        "Image": {
          "data": {
            "id": 80,
            "attributes": {
              "name": "image.png",
              "alternativeText": "image.png",
              "caption": "image.png",
              "width": 960,
              "height": 168,
              "formats": {
                ...
              },
              "hash": "image_ed1fbcdba0",
              "ext": ".png",
              "mime": "image/png",
              "size": 4.63,
              "url": "/uploads/image_ed1fbcdba0.png",
              "previewUrl": null,
              "provider": "local",
              "provider_metadata": null,
              "createdAt": "2022-10-28T09:42:02.471Z",
              "updatedAt": "2022-10-28T09:42:02.471Z",
              "blurhash": "U{Nd,T?bof?u_Nxuj[x[objZayoe_Mxuj[x["
            }
          }
        }
      }
    }
  ],
  "meta": {
    "pagination": {
      "page": 1,
      "pageSize": 25,
      "pageCount": 1,
      "total": 1
    }
  }
}
```

## Regenerating Existing Content

If you've recently installed this plugin and already have existing media content, you can easily update the blurhash for these items. Use the **Regenerator** plugin to efficiently handle this task:

- [Regenerator Plugin](https://github.com/emil-petras/strapi-regenerator?tab=readme-ov-file)

This additional plugin can automate the process.

## Changelog
All notable changes to this project will be documented in this section.

### [1.2.1]
#### Changed
- now using `sharp` instead of canvas due to issues with .webp images.

### [1.2.2]
#### Added
- `forceRegenerateOnUpdate` configuration option to force the regeneration of blurhash on every update, regardless of the existing blurhash.

### [1.2.3]
#### Fixed
- fixed a bug with the image url

### [1.2.4]
#### Fixed
- fixed a bug with the image url var

### [1.2.5]
#### Changed
- updated the readme file
npm package: @michieljs/execute-as-promise
Description: A simple package that allows you to execute any function as if it were a `Promise` (even if it isn't!)
Author: Michiel van der Geest
Latest version: 1.0.0

# Execute As Promise (executeAsPromise)

_executeAsPromise_ is a simple package that allows you to execute any function as if it were a `Promise` (even if it isn't!).

This can be useful when you don't know in advance whether a function will be a `Promise` or not, but still want to keep a
clean `then().catch()`-chain in your code.

_executeAsPromise_ works by executing the function that is being passed, and then evaluating the result.

If it _looks_ like a `Promise` it will return the Promise itself. If the function result _doesn't look_ like a `Promise`,
it will wrap it inside a `new Promise` and return that instead.

## Installation

Install _executeAsPromise_ through NPM:

```sh
npm install @michieljs/execute-as-promise
```

## Usage

Import _executeAsPromise_ in your code:

```js
import executeAsPromise from '@michieljs/execute-as-promise'
```

Next you can use it in your code:

```js
const normalFunction = () => {
  return 'my result'
}

executeAsPromise(normalFunction).then(console.log)

const promiseFunction = new Promise((resolve, reject) => {
  let rand = Math.random()
  if (rand >= 0.5) {
    resolve('Failure')
  } else {
    reject('Success!')
  }
})

executeAsPromise(promiseFunction)
  .then(console.log)
  .catch(console.error)

const valueNotAFunctionAtAll = 10

executeAsPromise(valueNotAFunctionAtAll).then(console.log)
```

The `executeAsPromise`-method accepts 3 parameters:

- function to execute (a `Promise`, a normal `Function` or even a `String` or `Number`)
- array of arguments to be `apply`-ed to the function (optional, defaults to `null`)
- context (or scope) for the function execution (optional, default to `null`)

```js
const fullName = function(firstName, lastName) {
  return firstName + ' ' + lastName
}

executeAsPromise(myFunction, ['John', 'Doe])
```


## Tests

To execute the unit tests run:

```sh
npm run test
```

## License

[MIT](https://opensource.org/licenses/MIT)

Copyright (c) Michiel van der Geest
npm package: @michielkn/express-http-exceptions
Description: A library to handle exceptions as http status codes
Author: michielkn
Latest version: 1.0.1

# Express HTTP Exceptions

## Description
This is a simple module that adds the functionality to throw an Exception in your express application that gets
converted to an HTTP Response

## Installation
```shell
    yarn add @michielkn/express-http-exceptions
```

## Setup
```javascript
    import { HttpExceptionMiddleware } from '@michielkn/express-http-exceptions'    // import the express middleware
    import express from 'express';                                                  // import express
    const app = express();
    
    // add your own code here
    
    app.use(HttpExceptionMiddleware); // add the middleware after your custom code


    app.listen(3000, () => { // Start the app
        console.log(`App listening on port 3000`);
    });
```

## Usage
Throw an Exception in your express application
```javascript
    import { HttpException } from '@michielkn/express-http-exceptions' // import the HttpException class

    throw New HttpException(404); // Will return a http response with code 404
    
    // or

    throw New HttpException(404, httpExceptionData); // Will return a 404 with some added data (see underneath)
```

### HttpExceptionData
The data object is used to add some custom data to the response. The data object itself is optional as are all the fields in data
```typescript
type HttpExceptionData = {
    message?: string                                    // This string that becomes the response message
    body?: unknown                                      // This will become the body
    headers?: HttpExceptionDataHeader[]                 // A list of headers that should be set (See HttpExceptionDataHeader)
}

// The header object used in the HttpExceptionData
type HttpExceptionDataHeader = {
    name: string,                                       // The name of the header
    value: number | string | ReadonlyArray<string>      // The value of the header
}
```

## HttpStatusCodes enums
Instead of entering the http status-code as a number, there are also a couple of enums available that can be used.
They are split up into the 5 types of status-codes and one "enum" that combines all enums together
```javascript
import {
    InformationHttpStatusCodes,
    RedirectionHttpStatusCodes,
    SuccessHttpStatusCodes,
    ClientErrorHttpStatusCodes,
    ServerErrorHttpStatusCodes,
    HttpStatusCodes,
} from '@michielkn/express-http-exceptions';

throw New HttpException(HttpStatusCodes.NOT_FOUND); // ==> 404
// or
throw New HttpException(ClientErrorHttpStatusCodes.NOT_FOUND); // ==> 404
```
npm package: @michielpauw/stay-or-go-feat-intro
Description: Webcomponent stay-or-go-feat-intro following open-wc recommendations
Author: stay-or-go-feat-intro
Latest version: 0.0.1

# \<stay-or-go-feat-intro>

This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.

## Installation
```bash
npm i stay-or-go-feat-intro
```

## Usage
```html
<script type="module">
  import 'stay-or-go-feat-intro/stay-or-go-feat-intro.js';
</script>

<stay-or-go-feat-intro></stay-or-go-feat-intro>
```

## Linting with ESLint, Prettier, and Types
To scan the project for linting errors, run
```bash
npm run lint
```

You can lint with ESLint and Prettier individually as well
```bash
npm run lint:eslint
```
```bash
npm run lint:prettier
```

To automatically fix many linting errors, run
```bash
npm run format
```

You can format using ESLint and Prettier individually as well
```bash
npm run format:eslint
```
```bash
npm run format:prettier
```

## Testing with Web Test Runner
To run the suite of Web Test Runner tests, run
```bash
npm run test
```

To run the tests in watch mode (for &lt;abbr title=&#34;test driven development&#34;&gt;TDD&lt;/abbr&gt;, for example), run

```bash
npm run test:watch
```

## Demoing with Storybook
To run a local instance of Storybook for your component, run
```bash
npm run storybook
```

To build a production version of Storybook, run
```bash
npm run storybook:build
```


## Tooling configs

For most of the tools, the configuration is in the `package.json` to reduce the amount of files in your project.

If you customize the configuration a lot, you can consider moving them to individual files.

## Local Demo with `web-dev-server`
```bash
npm start
```
To run a local development server that serves the basic demo located in `demo/index.html`
npm package: @michielwesterbeek/browser
Description: <p align="center">   <img src="./misc/logo.svg" width=450 /> </p>
Author: Evan Conrad
Latest version: 0.8.4-0

<p align="center">
  <img src="./misc/logo.svg" width=450 />
</p>

# @roomservice/browser

[Room Service](https://www.roomservice.dev/) helps you add real-time collaboration to your app. It's a real-time service with a built-in [CRDT](https://en.wikipedia.org/wiki/Conflict-free_replicated_data_type) that automatically merges multiple people's state together without horrifying nightmare bugs. To learn more, see [roomservice.dev](https://www.roomservice.dev).

This is the official, javascript SDK.

## Install

```bash
npm install --save @roomservice/browser
```

## Usage

To get started, create a client with your [Auth Endpoint](https://docs.roomservice.dev/auth).

```ts
import RoomService from "@roomservice/browser";

const client = new RoomService({
  authUrl: "https://mysite.com/auth/roomservice"
});
```

Next, we'll create a room client and try to connect to
the room:

```ts
const room = client.room("my-room");
const { doc } = await room.init();
```

Then, you can publish changes to the room:

```ts
room.publishDoc(doc => {
  doc.title = "LaTeX: a Method of Obscuring Redundancy";
});
```

And listen for any incoming changes:

```ts
room.onUpdate(newDoc => {
  console.log(newDoc);
});
```

## Server Side Rendering

To render on the server, you must include any headers that should be passed along to your
auth endpoint. In most cases, this is just your session cookie.

For example, in Next.js:

```ts
const room = client.room("my-room");

MyComponent.getInitialProps = async ctx => {
  const { doc } = await room.init({
    headers: {
      cookie: ctx.req.headers
    }
  });

  return { doc };
};
```
npm package: @michigg/component-library
Description: - Vue 3 + Typescript + Vite
Author: Michael Götz
Latest version: 0.3.1

# @michigg/component-library 
- Vue 3 + Typescript + Vite

This is just another component library. The components are used in [michigg/web-sense](https://github.com/michigg/web-sense)
npm package: @michijs/color-converter
Description: A conversion utility for color spaces.
Author: Lucas M. Segurado
Latest version: 1.0.3

# Color converter
A conversion utility for color spaces.

![npm][version] [![license][github-license]][github-license-url] ![npm][npm-downloads] ![npm][repo-size]
  [![CodeQL](https://github.com/michijs/color-converter/actions/workflows/codeql.yml/badge.svg)](https://github.com/michijs/color-converter/actions/workflows/codeql.yml)
  [![Tests](https://github.com/michijs/color-converter/actions/workflows/tests.yml/badge.svg)](https://github.com/michijs/color-converter/actions/workflows/tests.yml)

Based on [CSS color module 4 draft](https://www.w3.org/TR/css-color-4/#color-converter-code) and [Easy RGB documentation](http://www.easyrgb.com/en/math.php)

## Color spaces conversion
Conversion can be made from the following spaces:
- hex ↔ rgba or rgb ↔ xyz ↔ lab ↔ lch
- rgba or rgb ↔ lch (a shorcut for the previous one)
- hex ↔ rgba or rgb ↔ hsl
- hex ↔ rgba or rgb ↔ hsv

## Color spaces support
We offer support for the following spaces:
- [lch (HCL)](https://en.wikipedia.org/wiki/HCL_color_space)
- [lab (CIE LAB)](https://en.wikipedia.org/wiki/CIELAB_color_space)
- [RGB](https://en.wikipedia.org/wiki/RGB_color_model)
- [RGBA](https://en.wikipedia.org/wiki/RGBA_color_model)
- [HEX](https://en.wikipedia.org/wiki/Web_colors) (only with 3, 4, 6 or 8 digits) (FE: #FFF, #FFF0, #FFFFFF, #FFFFFF00)
- [XYZ (CIE 1931)](https://en.wikipedia.org/wiki/CIE_1931_color_space)
- [HSL](https://en.wikipedia.org/wiki/HSL_and_HSV)
- [HSV](https://en.wikipedia.org/wiki/HSL_and_HSV)

## License
 - [MIT](https://github.com/michijs/color-converter/blob/master/LICENSE.md)

[repo-size]: https://img.shields.io/github/repo-size/michijs/color-converter
[npm-downloads]: https://img.shields.io/npm/dt/@michijs/color-converter
[version]: https://img.shields.io/npm/v/@michijs/color-converter
[github-license]: https://img.shields.io/github/license/michijs/color-converter
[github-license-url]: https://github.com/michijs/color-converter/blob/master/LICENSE.md