open-index/open-npm huggingface dataset:
npm package: @minax/react-hot-toast
Description: Smoking hot React Notifications. Lightweight, customizable and beautiful by default.
Author: Timo Lins
Latest version: 2.5.1

<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: @minbong/stroke-svg-text
Description: SVG-based outlined text component for React Native
Latest version: 0.1.1

# @minbong/stroke-svg-text

SVG-based outlined text component for React Native.

This component renders text with a stroke using SVG, providing consistent results across iOS and Android.

---

## Features

- SVG-based text stroke rendering
- Consistent appearance across platforms (iOS & Android)
- Written in TypeScript
- Lightweight and easy to integrate
- Suitable for decorative or animation-heavy UI

---

## Installation

```bash
npm install @minbong/stroke-svg-text
```

---

## Peer Dependency

This package relies on `react-native-svg`.  
Make sure it is installed in your project:

```bash
npm install react-native-svg
```

---

## Usage

```tsx
import { StrokeSvgText } from '@minbong/stroke-svg-text';

<StrokeSvgText
  text="Hello World"
  fontSize={32}
  fill="#FFFFFF"
  stroke="#000000"
  strokeWidth={2}
/>
```

---

## Props

| Name        | Type   | Default | Description     |
|-------------|--------|---------|-----------------|
| text        | string | —       | Text content    |
| fontSize    | number | 32      | Font size       |
| fill        | string | #FFFFFF | Text fill color |
| stroke      | string | #000000 | Stroke color    |
| strokeWidth | number | 2       | Stroke width    |
| fontFamily  | string | —       | Custom font     |

---

## Notes

- SVG rendering avoids platform-specific text stroke issues
- Requires `react-native-svg`
- Designed as a small utility, not a full UI framework

---

## License

MIT
npm package: @minch/nuxt-basis
Description: A Base Layer for Nuxt Projects.
Author: Dawit
Latest version: 0.12.17

# Docs for Nuxt Basis

@minch/nuxt-basis is a base layer for Nuxt Projects that provides a pre-configured setup with Nuxt 4, Tailwind CSS 4, and additional modules.

## Features

- Pre-configured modules:
  - [@nuxt/eslint](https://github.com/nuxt/eslint) - ESLint integration
  - [@nuxt/content](https://content.nuxt.com/) - Content management
  - [@nuxt/image](https://image.nuxt.com/) - Image optimization
  - [@nuxt/test-utils](https://nuxt.com/docs/getting-started/testing) - Testing utilities
  - [@nuxt/ui](https://ui.nuxt.com/) - UI components
- Built-in TailwindCSS 4 configuration
- TypeScript support
- DevTools enabled by default

## Installation

To create a new Nuxt project based on this layer:

```bash
pnpm create nuxt --template gh:oneminch/nuxt-basis/.starter
```

To add to an existing Nuxt project:

```bash
pnpm add -D @minch/nuxt-basis
```

## Usage

1. Add the layer to your `nuxt.config.ts`:

```ts
export default defineNuxtConfig({
  extends: ["@minch/nuxt-basis"],
});
```

2. (Optional) Configure modules in `nuxt.config.ts`:

```ts
export default defineNuxtConfig({
  extends: ["@minch/nuxt-basis"],
  baseModules: {
    eslint: true, // Enable/disable ESLint module
    content: true, // Enable/disable Content module
    image: true, // Enable/disable Image module
    testUtils: true, // Enable/disable Test Utils module
    ui: true, // Enable/disable UI module
  },
});
```

All modules are enabled by default. Set any option to `false` to disable that module.

## TailwindCSS Integration

This layer includes TailwindCSS by default. You can import the base styles in your project:

```ts
// In your CSS file
@import '@minch/nuxt-basis/tailwind';
```

## Development

The `.playground` directory contains an example implementation of this layer.

```bash
# Install dependencies
pnpm install

# Develop with the playground
pnpm dev

# Build the playground
pnpm build

# Generate static playground
pnpm generate

# Preview the build
pnpm preview
```
npm package: @minch/use-event-source
Description: A Vue composable for simplifying Server-Sent Events.
Author: Dawit
Latest version: 1.3.15

# useEventSource

`useEventSource` is a Vue composable for simplifying Server-Sent Events (SSE).

It is based on the standard `EventSource` interface, and makes working with SSEs simpler in Vue & Nuxt applications.

## Installation

```
npm install @minch/use-event-source
```

## Usage

An example directory structure of a simple Nuxt 3 app:

```
sse-app/
├── server/
│   ├── api/
│   │   └── counter.ts
└── app.vue
├── nuxt.config.ts
├── package.json
└── tsconfig.json
```

Create a server API for sending your events:

```ts
// ~/server/api/counter.ts
export default defineEventHandler(async (event) => {
	setHeader(event, "Content-Type", "text/event-stream");
	setHeader(event, "Cache-Control", "no-cache");
	setHeader(event, "Connection", "keep-alive");
	event.node.res.flushHeaders();

	// Increment count every second and send it as data
	let count = 0;
	const intervalId = setInterval(() => {
		let eventString = `event: message\n`;
		const timestamp = new Date().toISOString();
		eventString += `id: ${timestamp}\n`;
		eventString += `data: ${JSON.stringify(++count)}\n\n`;
		event.node.res.write(eventString);
	}, 1000);

	// Clean up on client disconnect
	event.node.req.on("close", () => {
		clearInterval(intervalId);
		event.node.res.end();
	});
});
```

Consume events from any page:

```vue
// ~/app.vue (or any page / component)
<script setup lang="ts">
import { useEventSource } from "@minch/use-event-source";

const { eventData, restartConnection, closeConnection, isStopped } =
	useEventSource("/api/counter", 0);
</script>

<template>
	<div>
		<h1>{{ eventData }}</h1>

		<p>The number is being sent from the server in real-time.</p>

		<button @click="restartConnection" :disabled="isStopped">Restart</button>

		<button @click="closeConnection" :disabled="!isStopped">Stop</button>
	</div>
</template>
```