open-index/open-npm huggingface dataset:
npm package: @hyperx/avatar
Description: generates a slack-like avatar
Latest version: 1.0.3

## @hyperx/avatar

generates a slack-like avatar

## API

```js
const HyperAv = require("@hyperx/avatar");
const path = require("path");

HyperAv(path.join("image.png")).then(function () {
  console.log("saved!");
});
```

## Example

![Example](https://i.ibb.co/P9PTzNS/image.png)
npm package: @hyperz111/prettier-config
Description: Prettier configuration by @hyperz111
Author: Hyper-Z11
Latest version: 1.1.0

# @hyperz111/prettier-config

[`prettier`](https://prettier.io/) configuration by [`@hyperz111`](https://github.com/hyperz111/).

> [!NOTE]
> Please read [configuration options](https://prettier.io/docs/options) & [shared configuration](https://prettier.io/docs/sharing-configurations) for more information about prettier configuration.

## Install

```text
npm install -D @hyperz111/prettier-config
```

## Usage

```js
import config from "@hyperz111/prettier-config";

export default config;
```

## Entry points

- Main: `@hyperz111/prettier-config`
- Svelte: `@hyperz111/prettier-config/svelte`

## License

[MIT](https://opensource.org/license/mit/)
npm package: @hyperz111/tsconfig
Description: Shared tsconfig.json file for @hyperz111
Author: Hyper-Z11
Latest version: 1.0.0

# @hyperz111/tsconfig

Shared `tsconfig` file for [`@hyperz111`](https://github.com/hyperz111/).

## Install

```text
npm install -D @hyperz111/tsconfig
```

## Usage

In `tsconfig.json`:

```jsonc
{
	// ...
	"extends": "@hyperz111/tsconfig",
	// ...
}
```

## Copyright

[MIT](https://opensource.org/license/mit/)
npm package: @hyperzlib/huixinghao-frame-api
Description: Iframe api for huixinghao.cn plugin development.
Author: Hyperzlib
Latest version: 1.0.2

# 彗星号创意工坊 Frame API

用于彗星号创意工坊插件开发的 Frame API。

## 开始

### 通过包管理器安装

使用 npm, yarn 或 pnpm 安装：

```bash
npm install @hyperzlib/huixinghao-frame-api --save
yarn add @hyperzlib/huixinghao-frame-api
pnpm add @hyperzlib/huixinghao-frame-api
```

在项目中引入：

```typescript
import { HxhFrameAPI } from '@hyperzlib/huixinghao-frame-api';

const api = new HxhFrameAPI();
```

### 通过 CDN 引入

在 HTML 文件中通过 `<script>` 标签引入：

```html
<script src="https://cdn.jsdelivr.net/npm/@hyperzlib/huixinghao-frame-api/dist/huixinghao-frame-api.umd.min.js"></script>
```

然后可以通过全局变量 `HxhFrameApi.HxhFrameApi` 访问 API：

```javascript
const api = new HxhFrameApi.HxhFrameApi();
```

## 基础用法

### 获取插件配置和彗星号用户信息

```typescript
import { HxhFrameAPI } from '@hyperzlib/huixinghao-frame-api'
const api = new HxhFrameAPI()

api.on('update.option', () => {
    console.log('插件配置已更新:', api.widgetConfig);
})

api.on('update.user', () => {
    console.log('当前用户信息已更新:', api.currentUserInfo);
})
```

### 监听弹幕

```typescript
import { HxhFrameAPI } from '@hyperzlib/huixinghao-frame-api'
const api = new HxhFrameAPI()

api.on('event.LIVE_OPEN_PLATFORM_DM', (data) => {
    let danmakuData = data[0]
    console.log('收到弹幕:', danmakuData);
})

api.on('event.LIVE_OPEN_PLATFORM_SEND_GIFT', (data) => {
    let giftData = data[0]
    console.log('收到礼物:', giftData);
})

api.on('event.LIVE_OPEN_PLATFORM_GUARD', (data) => {
    let userData = data[0]
    console.log('收到舰长:', userData);
})

api.on('event.LIVE_OPEN_PLATFORM_SUPER_CHAT', (data) => {
    let followData = data[0]
    console.log('收到SC:', followData);
})
```


## 常见问题

### Q: 如何使用彗星号创意工坊的字体配置？

A: 可以通过以下方法使用字体配置：

先在 HTML 中引入字体样式：

```html
<link href="https://static.huixinghao.cn/stylesheets/fonts.css" rel="stylesheet"/>
```

监听配置更新事件，获取字体样式：

```typescript
api.on('update.option', () => {
    const fontFamily = api.widgetConfig.fontFamily;
    // 应用字体样式，你可以将其设置到你的组件或页面中，例如：
    document.body.style.fontFamily = fontFamily;
    // 或使用 CSS 变量
    document.documentElement.style.setProperty('--hxh-font-family', fontFamily);
});
```

### Q: 时间戳的格式是什么？

A: 所有时间戳都是秒级 Unix 时间戳。可以通过 `new Date(timestamp * 1000)` 转换为 JavaScript Date 对象。

### Q: 如何在生产环境中卸载组件？

A: 一定要调用 `api.destroy()` 来移除事件监听器，防止内存泄漏。

### Q: 如何处理来自不同平台的数据？

A: 每个事件都包含 `platform` 字段，可以用来区分不同直播平台（如 bili、dou_yin 等）。

## 插件配置定义

详见 [插件配置定义](./docs/options-def.md)

## API 文档

详见 [API 文档](./docs/api.md)
npm package: @hyperzlib/node-dglab-pulse-helper
Description: DGLab Pulse QRCode parser
Author: Hyperzlib
Latest version: 1.0.0

# Node DG-Lab Pulse Helper

用于使用Nodejs读取DG-Lab的波形二维码，以及从波形二维码生成 [Coyote-Game-Hub](https://github.com/hyperzlib/DG-Lab-Coyote-Game-Hub) 使用的波形数据。

## 命令行用法

```text
Usage: dglab-pulse-cli generate [options] <pulseQRDir>

Generate pulse data for Coyote Game Hub

Options:
  -o, --output <outputFile>  Output pulse file
  -h, --help                 display help for command
```

## 用法示例

```bash
dglab-pulse-cli generate -o pulse.json5 ./examples/pulse-qrcode
```

## Nodejs API

```typescript
/** 读取二维码信息 */
export declare function loadQRCode(filePath: string): Promise<string>;

/** 解析DG-Lab波形URL */
export declare function parseDGLabPulseUrl(url: string): Promise<DGLabPulseInfo>;

/** 从DG-Lab波形二维码文件加载波形信息 */
export declare function loadDGLabPulseQRCode(filePath: string): Promise<DGLabPulseInfo>;

/** 从波形信息生成hex字符串形式的波形数据，用于WebSocket API */
export declare function generateDGLabHexPulse(pulse: DGLabPulseInfo): string[];
```
npm package: @hypesimlabs/edr
Description: **EDR**, or **Ethereum Development Runtime** in full, is a library for creating developer tooling on top of the Ethereum Virtual Machine (EVM), such as an EVM debugger or state inspector. EDR provides a performant API, written in Rust, with bindings for t
Latest version: 0.12.1

# EDR - Ethereum Development Runtime

**EDR**, or **Ethereum Development Runtime** in full, is a library for creating developer tooling on top of the Ethereum Virtual Machine (EVM), such as an EVM debugger or state inspector. EDR provides a performant API, written in Rust, with bindings for the Node API (TypeScript).

At the moment, EDR is only meant to be consumed from [Hardhat](https://hardhat.org/), but we plan to have a stable API that can be used from any other tooling. If you are interested in this, please reach out.
npm package: @hypesimlabs/hardhat
Description: Hardhat is an extensible developer tool that helps smart contract developers increase productivity by reliably bringing together the tools they want.
Author: Nomic Labs LLC
Latest version: 5.0.6

![](https://user-images.githubusercontent.com/176499/96893278-ebc67580-1460-11eb-9530-d5df3a3d65d0.png) [![NPM Package](https://img.shields.io/npm/v/hardhat.svg?style=flat-square)](https://www.npmjs.org/package/hardhat) [![GitPOAP Badge](https://public-api.gitpoap.io/v1/repo/NomicFoundation/hardhat/badge)](https://www.gitpoap.io/gh/NomicFoundation/hardhat)

---

> **🚀 Hardhat 3 alpha release is out! [Learn more.](https://hardhat.org/hardhat3-alpha)**

Hardhat is an Ethereum development environment for professionals. It facilitates performing frequent tasks, such as running tests, automatically checking code for mistakes or interacting with a smart contract. Check out the [plugin list](https://hardhat.org/plugins/) to use it with your existing tools.

Built by the [Nomic Foundation](https://nomic.foundation/) for the Ethereum community.

Join our [Hardhat Support Discord server](https://hardhat.org/discord) to stay up to date on new releases, plugins and tutorials.

---

> 💡 **The Nomic Foundation is hiring! Check [our open positions](https://www.nomic.foundation/jobs?utm_source=myALpQnzlM).**

---

## Installation

To install Hardhat, go to an empty folder, initialize an `npm` project (i.e. `npm init`), and run

```
npm install --save-dev hardhat
```

Once it's installed, just run this command and follow its instructions:

```
npx hardhat init
```

## Documentation

On [Hardhat's website](https://hardhat.org) you will find:

- [Guides to get started](https://hardhat.org/getting-started/)
- [Hardhat Network](https://hardhat.org/hardhat-network/)
- [Plugin list](https://hardhat.org/plugins/)

## Contributing

Contributions are always welcome! Feel free to open any issue or send a pull request.

Go to [CONTRIBUTING.md](https://github.com/NomicFoundation/hardhat/blob/main/CONTRIBUTING.md) to learn about how to set up Hardhat's development environment.

## Feedback, help and news

[Hardhat Support Discord server](https://hardhat.org/discord): for questions and feedback.

[Follow Hardhat on Twitter.](https://twitter.com/HardhatHQ)

## Happy building!

👷‍♀️👷‍♂️👷‍♀️👷‍♂️👷‍♀️👷‍♂️👷‍♀️👷‍♂️👷‍♀️👷‍♂️👷‍♀️👷‍♂️👷‍♀️👷‍♂️


### Run hardhat node for demo project

Run the command from `./hardhat/demo` to start the hardhat node.

```sh 
node ../packages/hardhat-core/internal/cli/bootstrap.js node --hostname 0.0.0.0 --port 8545
```
npm package: @hypesimlabs/hardhat-chai-matchers
Description: Hardhat utils for testing
Author: Nomic Foundation
Latest version: 2.1.4

[![npm](https://img.shields.io/npm/v/@nomicfoundation/hardhat-chai-matchers.svg)](https://www.npmjs.com/package/@nomicfoundation/hardhat-chai-matchers)

# Hardhat Chai Matchers

This plugin adds Ethereum-specific capabilities to the [Chai](https://chaijs.com/) assertion library, making your smart contract tests easy to write and read.

Check [its documentation](https://hardhat.org/hardhat-chai-matchers/docs) to learn more.

### Installation

We recommend using npm 7 or later. If you do that, then you just need to install the plugin itself:

```bash
npm install --save-dev @nomicfoundation/hardhat-chai-matchers
```

If you are using an older version of npm, you'll also need to install all the packages used by the plugin.

```bash
npm install --save-dev @nomicfoundation/hardhat-chai-matchers chai@4 @nomicfoundation/hardhat-ethers ethers
```

That's also the case if you are using yarn:

```bash
yarn add --dev @nomicfoundation/hardhat-chai-matchers chai@4 @nomicfoundation/hardhat-ethers ethers
```

### Usage

After installing it, add the plugin to your Hardhat config:

```js
require("@nomicfoundation/hardhat-chai-matchers");
```

Then you'll be able to use the matchers in your tests:

```js
expect(await token.totalSupply()).to.equal(1_000_000);

await expect(token.transfer(token, 1000)).to.be.revertedWith(
  "Cannot transfer to the contract itself"
);

await expect(token.transfer(recipient, 1000))
  .to.emit(token, "Transfer")
  .withArgs(owner, recipient, 1000);
```

### Known issues

#### Chaining Async Matchers

Currently, the following matchers do not support chaining:

- `reverted`
- `revertedWith`
- `revertedWithCustomError`
- `revertedWithoutReason`
- `revertedWithPanic`
- `changeEtherBalance`
- `changeEtherBalances`
- `changeTokenBalance`
- `changeTokenBalances`
- `emit` (with the only exception of chaining multiple `emit` matchers)

Which means you can't do:

```js
await expect(contract.f(...))
  .to.changeEtherBalance(...)
  .and.to.changeTokenBalance(...)
```

To work around this limitation, write separate assertions for each matcher:

```js
const tx = contract.f(...);
await expect(tx).to.changeEtherBalance(...)
await expect(tx).to.changeTokenBalance(...)
```

If you are interested in seeing an implementation of chaining for async matchers, please visit the GitHub issue [#4235](https://github.com/NomicFoundation/hardhat/issues/4235) and leave an upvote or comment.
npm package: @hypesimlabs/hardhat-ignition-ethers
Description: The Ethers extension to Hardhat Ignition. Hardhat Ignition is a declarative system for deploying smart contracts on Ethereum. It enables you to define smart contract instances you want to deploy, and any operation you want to run on them. By taking over t
Author: Nomic Foundation
Latest version: 0.15.17

![hardhat_Ignition_banner](https://github.com/NomicFoundation/hardhat-ignition/assets/24030/cc73227b-8791-4bb3-bc9a-a39be69d215f) [![npm](https://img.shields.io/npm/v/@nomicfoundation/hardhat-ignition.svg)](https://www.npmjs.com/package/@nomicfoundation/hardhat-ignition) [![hardhat](https://hardhat.org/buidler-plugin-badge.svg?1)](https://hardhat.org)

---

# Hardhat Ignition with Ethers

> **Note:** This package includes support for [Ethers](https://docs.ethers.org/v5/). To use Hardhat Ignition with Viem instead, see the [Hardhat Ignition Viem plugin](https://www.npmjs.com/search?q=%40nomicfoundation%2Fhardhat-ignition-viem).

Hardhat Ignition is a declarative system for deploying smart contracts on Ethereum. It enables you to define smart contract instances you want to deploy, and any operation you want to run on them. By taking over the deployment and execution, Hardhat Ignition lets you focus on your project instead of getting caught up in the deployment details.

Built by the [Nomic Foundation](https://nomic.foundation/) for the Ethereum community.

Join the Hardhat Ignition channel of our [Hardhat Community Discord server](https://hardhat.org/ignition-discord) to stay up to date on new releases and tutorials.

## Installation

```bash
npm install --save-dev @nomicfoundation/hardhat-ignition-ethers
```

Import the plugin in your `hardhat.config.js``:

```js
require("@nomicfoundation/hardhat-ignition-ethers");
```

Or if you are using TypeScript, in your `hardhat.config.ts``:

```js
import "@nomicfoundation/hardhat-ignition-ethers";
```

## Documentation

On [Hardhat Ignition's website](https://hardhat.org/ignition) you will find guides for:

- [Getting started](https://hardhat.org/ignition/docs/getting-started)
- [Creating Modules](https://hardhat.org/ignition/docs/guides/creating-modules)
- [Deploying a module](https://hardhat.org/ignition/docs/guides/deploy)
- [Visualizing your module](https://hardhat.org/ignition/docs/guides/visualize)
- [Handling errors](https://hardhat.org/ignition/docs/guides/error-handling)
- [Modifying an existing module](https://hardhat.org/ignition/docs/guides/modifications)
- [Using Hardhat Ignition in your tests](https://hardhat.org/ignition/docs/guides/tests)

## Contributing

Contributions are always welcome! Feel free to open any issue or send a pull request.

Go to [CONTRIBUTING.md](https://github.com/NomicFoundation/hardhat-ignition/blob/main/CONTRIBUTING.md) to learn about how to set up Hardhat Ignition's development environment.

## Feedback, help and news

[Hardhat Ignition on Discord](https://hardhat.org/ignition-discord): for questions and feedback.

Follow [Hardhat](https://twitter.com/HardhatHQ) and [Nomic Foundation](https://twitter.com/NomicFoundation) on Twitter.
npm package: @hypesimlabs/hardhat-network-helpers
Description: Hardhat utils for testing
Author: Nomic Foundation
Latest version: 1.1.2

[![npm](https://img.shields.io/npm/v/@nomicfoundation/hardhat-network-helpers.svg)](https://www.npmjs.com/package/@nomicfoundation/hardhat-network-helpers)

# Hardhat Network Helpers

Hardhat Network Helpers is a library that provides a set of utility functions to interact with the [Hardhat Network](https://hardhat.org/hardhat-network/docs). You can read their full documentation [here](https://hardhat.org/hardhat-network-helpers/docs).

### Installation

We recommend using npm 7 or later:

```
npm install --save-dev @nomicfoundation/hardhat-network-helpers
```

### Usage

Import it and use it in any of your files. For example, this [Hardhat script](https://hardhat.org/hardhat-runner/docs/advanced/scripts) mines some blocks and then prints the block number.

```js
const helpers = require("@nomicfoundation/hardhat-network-helpers");

async function main() {
  // mine 100 blocks
  await helpers.mine(100);

  console.log("The current block number is", await helpers.time.latestBlock());
}

main().catch((error) => {
  console.error(error);
  process.exitCode = 1;
});
```
npm package: @hypesimlabs/hardhat-toolbox
Description: Nomic Foundation's recommended bundle of Hardhat plugins (ethers based)
Author: Nomic Foundation
Latest version: 6.1.10

[![npm](https://img.shields.io/npm/v/@nomicfoundation/hardhat-toolbox.svg)](https://www.npmjs.com/package/@nomicfoundation/hardhat-toolbox) [![hardhat](https://hardhat.org/buidler-plugin-badge.svg?1)](https://hardhat.org)

# Hardhat Toolbox

The `@nomicfoundation/hardhat-toolbox` plugin bundles all the commonly used packages and Hardhat plugins we recommend to start developing with Hardhat.

When you use this plugin, you'll be able to:

- Interact with your contracts using [ethers.js](https://docs.ethers.org/v6/) and the [`hardhat-ethers`](https://hardhat.org/hardhat-runner/plugins/nomicfoundation-hardhat-ethers) plugin.
- Test your contracts with [Mocha](https://mochajs.org/), [Chai](https://chaijs.com/) and our own [Hardhat Chai Matchers](https://hardhat.org/hardhat-chai-matchers) plugin.
- Deploy your contracts with [Hardhat Ignition](https://hardhat.org/ignition).
- Interact with Hardhat Network with our [Hardhat Network Helpers](https://hardhat.org/hardhat-network-helpers).
- Verify the source code of your contracts with the [hardhat-verify](https://hardhat.org/hardhat-runner/plugins/nomicfoundation-hardhat-verify) plugin.
- Get metrics on the gas used by your contracts with the [hardhat-gas-reporter](https://github.com/cgewecke/hardhat-gas-reporter) plugin.
- Measure your tests coverage with [solidity-coverage](https://github.com/sc-forks/solidity-coverage).
- And, if you are using TypeScript, get type bindings for your contracts with [Typechain](https://github.com/dethcrypto/TypeChain/).

### Usage

To create a new project that uses the Toolbox, check our [Setting up a project guide](https://hardhat.org/hardhat-runner/docs/guides/project-setup).

If you want to migrate an existing Hardhat project to use the Toolbox, read [our migration guide](https://hardhat.org/hardhat-runner/docs/guides/migrating-from-hardhat-waffle).

### Network Helpers

When the Toolbox is installed using npm 7 or later, its peer dependencies are automatically installed. However, these dependencies won't be listed in the `package.json`. As a result, directly importing the Network Helpers can be problematic for certain tools or IDEs. To address this issue, the Toolbox re-exports the Hardhat Network Helpers. You can use them like this:

```ts
import helpers from "@nomicfoundation/hardhat-toolbox/network-helpers";
```
npm package: @hypesync/layout
Description: Layout components for landing pages built with React and Material UI.
Author: HypeSync Inc.
Latest version: 1.0.3

# HypeSync Layout Components

> Layout components for landing pages built with React and Material UI.

## ↪️ Dependencies

* React 16.x or newer
* Material UI 4.x or newer

## 🚀 Getting Started

```bash
npm install --save @hypesync/layout
```

```bash
yarn add @hypesync/layout
```

## ⚛️ Components

Name | Description
------ | ------
**PageLayout** | Creates the basic page structure.
**PageContainer** | Content container with the necessary default padding.

## 💻 Usage

```tsx
import {Header, Footer} from '@example/header-footer'
import {PageLayout, PageContainer} from '@hypesync/layout'

export function MyLandingPage() {
  return (
    <PageLayout>
      <Header>Landing Page Co.</Header>
      <PageContainer>
        My Properly Styled Content Container
      </PageContainer>
      <Footer>Copyright © Landing Page Co. All rights reserved.</Footer>
    </PageLayout>
  )
}
```

## License

MIT © [HypeSync Inc.](https://hypesync.io)
npm package: @hypesync/seo
Description: SEO component for landing pages built with React.
Author: HypeSync Inc.
Latest version: 1.0.9

# HypeSync SEO Component

> SEO component for landing pages built with React.

## 🚀 Getting Started

```bash
npm install --save @hypesync/seo
```

```bash
yarn add @hypesync/seo
```

## ⚛️ Component Properties

Name | Type | Description
------ | ------ | ------
**siteName** _(optional)_ | **String** | Name of the website (e.g: Good Company, My Company, etc.)
**title** _(optional)_ | **String** | Title of the current page (e.g: Home, Contact, etc.)
**description** _(optional)_ | **String** | Description of the page (e.g: Learn more about what and how we work, etc.)
**titleSeparator** _(optional)_ | **String** | Separator between the title and the site name. By default it's the `\|` character.
**url** _(optional)_ | **String** | URL used as Open Graph URL for link previews.
**imageUrl** _(optional)_ | **String** | Image URL used as Open Graph Image for link previews.
**lang** _(optional)_ | **String** | Language of the page which will be appended to the HTML tag. By default it's `en`.
**keywords** _(optional)_ | **String[]** | Meta keywords of your page.
**meta** _(optional)_ | **MetaData[]** | Additional meta data to be appended to the <head> as meta tags.

## 💻 Usage

```tsx
import SEO from '@hypesync/seo'

export function MyLandingPage() {
  return (
    <div>
      <SEO
        siteName="Landing Page Co."
        title="My Landing Page"
        description="Lorem ipsum dolor sit amet consectetur adipiscing elit."
        titleSeparator="|"
        url="https://landingpageco.com"
        imageUrl="https://static.landingpageco.com/link-preview.png"
        lang="en"
        keywords={['landing', 'page', 'website']}
        meta={[
          {
            property: 'og:type',
            content: 'website'
          }
        ]}
      />
    </div>
  )
}
```

## License

MIT © [HypeSync Inc.](https://hypesync.io)
npm package: @hypetech/eslint-config-strapi
Description: ESlint configuration for Strapi based projects according to HypeTech Coding Standards
Latest version: 0.1.0

# HypeTech - eslint-config

The HypeTech eslint configuration for Strapi based projects

## Installation

The configuration can be installed via your preferred package manager.

With PNPM (preferred):

```bash
pnpm add @hypetech/eslint-config-strapi -D
```

With Yarn:

```bash
yarn add -D @hypetech/eslint-config-strapi
```

With NPM:

```bash
npm install --dev @hypetech/prettier-config
```

To inform eslint of this configuration, you have to add the `eslint` property to your `package.json` file:

```json
"eslintConfig": {
   "extends": "@hypetech/eslint-config-strapi"
}
```

Instead of manually editing your `package.json`, you can also utilize the `npm pkg` subcommand:

```bash
npm pkg set eslintConfig.extends=@hypetech/eslint-config-strapi
```

Alternatively, you can also create a `.eslintrc.cjs` file in your project root and add the following content:

```js
module.exports = {
    root: true,
    extends: '@hypetech/eslint-config-strapi',
}
```

> Notice: You should add configuration to your `package.json` if you are creating a library, and use a `.eslintrc.cjs` file if you are creating an application. And you should avoid both ways in the same project.

## Extending

To extend the configuration, you will have to create a `.eslintrc.js` file (or `.eslintrc.cjs` if your package is a `"type": "module"`) and import the HypeTech configuration using `require`:

```js
module.exports = {
    ...require('@hypetech/eslint-config-strapi'),
    rules: {
        'no-console': 'warn',
    },
}
```

# Contributing

Contributions are welcome! Open a pull request to fix a bug, or open an issue to discuss a new feature or change.

# License

This project is licensed under the terms of the [MIT license](/LICENSE).
npm package: @hypetech/prettier-config
Description: HypeTech Prettier Configuration
Author: HypeTech
Latest version: 2.0.0

# HypeTech - Prettier Configuration

The official HypeTech prettier configuration, part of Frontend Coding Standards.

> **Note**: Version 2.0.0+ requires Prettier 3.0.0 or higher. For Prettier 2.x, use version 1.x of this package.

## Installation

The configuration can be installed via package manager.

With PNPM:

```bash
## Preferred way
pnpm add @hypetech/prettier-config -D
```

With Yarn:

```bash
yarn add -D @hypetech/prettier-config
```

With NPM:

```bash
npm install --dev @hypetech/prettier-config
```

## Usage

### Method 1: package.json (Recommended for simple usage)

To inform prettier of this configuration, you have to add the `prettier` property to your `package.json` file:

```json
"prettier": "@hypetech/prettier-config"
```

Instead of manually editing your `package.json`, you can also utilize the `npm pkg` subcommand:

```bash
npm pkg set prettier=@hypetech/prettier-config
```

### Method 2: .prettierrc.js (Required for extending)

For Prettier 3, create a `.prettierrc.js` file:

```js
module.exports = require('@hypetech/prettier-config');
```

## Extending

To extend the configuration, you will have to create a `.prettierrc.js` file (or `.prettierrc.cjs` if your package is a `"type": "module"`) and import the HypeTech configuration:

```js
module.exports = {
    ...require('@hypetech/prettier-config'),
    // Your custom overrides
    semi: true,
}
```

## Configuration Details

This configuration includes the following settings:

- **semi**: `false` - No semicolons at the end of statements
- **singleQuote**: `false` - Use double quotes
- **printWidth**: `120` - Line wrap at 120 characters
- **tabWidth**: `4` - Use 4 spaces for indentation
- **quoteProps**: `"preserve"` - Only add quotes around object properties where necessary
- **endOfLine**: `"auto"` - Maintain existing line endings
- **trailingComma**: `"es5"` - Trailing commas where valid in ES5 (objects, arrays, etc.)

If you have previously added the configuration to your `package.json`, via the `prettier` property, you can now remove it.
You can also utilize the `npm pkg`:

```bash
npm pkg delete prettier
```
npm package: @hyphaene/nextjs-utils
Description: Smoking hot React Notifications. Lightweight, customizable and beautiful by default.
Author: Maximilien Garenne
Latest version: 1.0.1

## Installation

yoo

#### With npm

```sh
npm install @hyphaene/nextjs-utils
```

#### With yarn

```sh
yarn add @hyphaene/nextjs-utils
```

#### With NPM

```sh
npm install @hyphaene/nextjs-utils
```

## Getting Started
npm package: @hyphaene/test-lib
Description: Smoking hot React Notifications. Lightweight, customizable and beautiful by default.
Author: Maximilien Garenne
Latest version: 0.0.7

<a href="https://react-hot-toast.com/"><img alt="react-hot-toast - Try it out" src="https://github.com/timolins/react-hot-toast/raw/main/assets/header.svg"/></a>

<div align="center">
    <img src="https://badgen.net/npm/v/react-hot-toast" alt="NPM Version" />
  <img src="https://badgen.net/bundlephobia/minzip/react-hot-toast" alt="minzipped size"/>
    <img src="https://github.com/timolins/react-hot-toast/workflows/CI/badge.svg" alt="Build Status" />
</a>
</div>
<br />
<div align="center"><strong>Smoking hot  Notifications for React.</strong></div>
<div align="center"> Lightweight, customizable and beautiful by default.</div>
<br />
<div align="center">
<a href="https://react-hot-toast.com/">Website</a> 
<span> · </span>
<a href="https://react-hot-toast.com/docs">Documentation</a> 
<span> · </span>
<a href="https://twitter.com/timolins">Twitter</a>
</div>

<br />
<div align="center">
  <sub>Cooked by <a href="https://twitter.com/timolins">Timo Lins</a> 👨‍🍳</sub>
</div>

<br />

## Features

- 🔥 **Hot by default**
- 🔩 **Easily Customizable**
- ⏳ **Promise API** - _Automatic loader from a promise_
- 🕊 **Lightweight** - _less than 5kb including styles_
- ✅ **Accessible**
- 🤯 **Headless Hooks** - _Create your own with [`useToaster()`](https://react-hot-toast.com/docs/use-toaster)_

## Installation

#### With yarn

```sh
yarn add react-hot-toast
```

#### With NPM

```sh
npm install react-hot-toast
```

## Getting Started

Add the Toaster to your app first. It will take care of rendering all notifications emitted. Now you can trigger `toast()` from anywhere!

```jsx
import toast, { Toaster } from 'react-hot-toast';

const notify = () => toast('Here is your toast.');

const App = () => {
  return (
    <div>
      <button onClick={notify}>Make me a toast</button>
      <Toaster />
    </div>
  );
};
```

## Documentation

Find the full API reference on [official documentation](https://react-hot-toast.com/docs).
npm package: @hyphen/hyphen-components
Description: A React component library to power all Hyphen UI.
Author: @hyphen
Latest version: 7.5.0

<p align="center">
  <a href="https://hyphen.ai" rel="noopener" target="_blank"><img width="150" src="public/images/logo.png" alt="Hyphen logo"></a></p>
</p>

<h1 align="center" style="border-bottom: none;">Hyphen Component Library</h1>
<h3 align="center">

  A [React](https://reactjs.org/) component library to power all Hyphen UI

</h3>

## Quick Start

### 1. Install

`npm install @hyphen/hyphen-components`

### 2. Import Global CSS

```jsx
import '@hyphen/hyphen-components/dist/css/utilities.css'; // Utility classes -- REQUIRED
import '@hyphen/hyphen-components/dist/css/variables.css'; // CSS Variables -- REQUIRED
import '@hyphen/hyphen-components/dist/css/index.css'; // Component CSS -- REQUIRED
import '@hyphen/hyphen-components/dist/css/fonts.css'; // Included Font files -- OPTIONAL BUT ENCOURAGED
```

We recommend importing our global reset in order to maintain a consistent
look of all components across applications.

```jsx
import '@hyphen/hyphen-components/dist/css/reset.css' // A Basic CSS Reset -- OPTIONAL BUT ENCOURAGED.
```

### 3. Usage

```jsx
import React from 'react';
import ReactDOM from 'react-dom';
import { Box } from '@hyphen/hyphen-components';

function App() {
  return <Box>Hello World</Box>;
}

ReactDOM.render(<App />, document.querySelector('#app'));
```

## Documentation

[SEE FULL DOCS HERE](https://ux.hyphen.ai)

## Contributing

Issues and PRs welcome! See [HERE](./CONTRIBUTING.md) for our Contribution Guide.

## Raising an Issue

When raising an issue:

* Make sure the issue hasn't been raised yet.
* Tag issue accordingly using your best judgement. Do NOT create new tags. If you feel a new one is needed, raise it in your issue.
* If your issue is a bug, include **screenshots** or animated GIFs in your issue whenever needed (if issue is visual in nature).
* If your issue is a bug, include steps to reproduce, or link to reproducible issue, e.g.: Code Sandbox or similar. Please also provide any additional details including device, OS, browser, browser version etc.

[Issues can be raised here](https://github.com/hyphen/hyphen-components/issues).

## License

This project is licensed under the terms of the
[MIT license](./LICENSE).
npm package: @hyphev/below
Description: The CSS design system of hyphev projects
Author: hyphev
Latest version: 1.1.0

<p align="center">
  <img width="300px" src="https://raw.githubusercontent.com/hyphev/below/master/site/static/assets/img/readme.svg?sanitize=true">
</p>
<h1 align="center">hyphev below CSS</h1>
<p align="center">The CSS design system of hyphev projects</p>
<p align="center">

  <a aria-label="Netlify Status" href="https://app.netlify.com/sites/below/deploys">
    <img alt="" src="https://api.netlify.com/api/v1/badges/764d5fef-7420-42d3-b990-21427089f991/deploy-status">
  </a>
  <a aria-label="npm package" href="https://www.npmjs.com/package/@hyphev/below">
    <img alt="" src="https://img.shields.io/npm/v/@hyphev/below.svg">
  </a>
  <a aria-label="contributors graph" href="https://github.com/hyphev/below/graphs/contributors">
    <img src="https://img.shields.io/github/contributors/hyphev/below.svg">
  </a>
  <a aria-label="last commit" href="https://github.com/hyphev/below/commits/master">
    <img alt="" src=
  "https://img.shields.io/github/last-commit/hyphev/below.svg">
  </a>

  <a aria-label="license" href="https://github.com/hyphev/below/blob/master/LICENSE">
    <img src="https://img.shields.io/github/license/hyphev/below.svg" alt="">
  </a>
</p>

## Documentation

Our documentation site lives at [below.hyphev.com](https://below.hyphev.com).

## Installation

Install `@hyphev/below` in your project with npm:

```sh
npm install @hyphev/below
```

## Usage
The included source files are written in [Sass] using SCSS syntax. After [installing](#install) with npm, you can add your project's `node_modules` directory to your Sass [include paths](https://github.com/sass/node-sass#includepaths) (AKA [load paths](http://technology.customink.com/blog/2014/10/09/understanding-and-using-sass-load-paths/) in Ruby), then import it like this:

```scss
@import "@hyphev/below/";
```

You can import individual ***below*** modules directly from the `@hyphev/below` package:

```scss
@import "@hyphev/below/globals/";
@import "@hyphev/below/foldings/";
@import "@hyphev/below/menus/";
```

## Local Development
To run `@hyphev/below` locally when adding or updating components:
1. Clone this repo: `git clone https://github.com/hyphev/below`
2. Install dependencies: `npm install`
3. Compile dist: `npm run dist`
4. Run the dev app: `npm start`
> [WIP] See [the contributing docs](contributing.md) for more info on code style, testing, and coverage.