open-index/open-npm huggingface dataset:
npm package: @santosl2/utils
Description: My utility library
Author: Santosl2
Latest version: 0.0.25

## My utils project

This project contains reusable functions that I frequently use in my daily development workflow. The goal is to streamline development by centralizing useful methods in one place.

### Publishing new version
To publish a new version of the package, follow these steps:
1. Make sure you have committed all your changes and are on the main branch.
2. Update the version number in `package.json` according to semantic versioning (major, minor, patch).
3. Run the following command to publish the package to npm:
   ```bash
   npm publish --access public
   ```
4. Verify that the package has been published successfully by checking the npm registry.

To publish in GitHub Packages, add the following to your `.npmrc` file:
```bash
@santosl2:registry=https://npm.pkg.github.com/
```

### Docs

[Publishing and installing a package with GitHub Actions
](https://docs.github.com/en/packages/managing-github-packages-using-github-actions-workflows/publishing-and-installing-a-package-with-github-actions)

[Automatic token authentication
](https://docs.github.com/en/actions/security-for-github-actions/security-guides/automatic-token-authentication#permissions-for-the-github_token)

[Workflow syntax for GitHub Actions - Permissions](https://docs.github.com/en/actions/writing-workflows/workflow-syntax-for-github-actions#permissions)
npm package: @santosmarco/use-socket-io
Description: A React hook for the Socket.IO's client-side library
Latest version: 1.0.0

# use-socket-io

Access the client-side `Socket` instance of your app with the ease of a single React hook.

---

## Installation

With `npm`:

```sh
npm i --save use-socket-io
```

With `yarn`:

```sh
yarn add use-socket-io
```

---

## Usage

```tsx
import SocketProvider, { useSocket } from "use-socket-io";

const App = () => {
  const socket = useSocket();

  return <div>App</div>;
};

render(
  <SocketProvider uri="http://localhost:8080" autoConnect>
    <App />
  </SocketProvider>,
  document.getElementById("root")
);
```

---

## API reference

### `SocketProvider`

The wrapper component for the `useSocket` hook.

**Props:**

- `uri` _string_ **[REQUIRED]** – Socket's URI.
- `autoConnect` _boolean_ – Whether the component should automatically connect to the Socket upon mounting. _Default:_ `false`
- `onConnect` _function_ – An optional callback function to run upon connection.
- `onDisconnect` _function_ – An optional callback function to run upon disconnection.

**Example:**

```tsx
<SocketProvider uri="http://localhost:8080" autoConnect>
  <App />
</SocketProvider>
```

### `useSocket`

A React hook to access the `Socket` instance anywhere throughout your app.

See _<https://socket.io/docs/v3/client-api/index.html#Socket>_ for a detailed description of the `Socket` instance.

_Must be called from a child of_ `<SocketProvider />`_._
npm package: @santospatrick/eslint-config-react
Description: :barber: Simple eslint config for React.js
Latest version: 1.0.6

# `@santospatrick/eslint-config-react`
:barber: Simple eslint config for React.js

## Usage

1. Install
```sh
yarn add eslint-config-prettier \
  eslint-plugin-prettier \
  @santospatrick/eslint-config-react \
  @santospatrick/prettier-config --dev
```

2. Create a file `.eslintrc` and add this:
```
{
    "extends": "@santospatrick/eslint-config-react"
}
```

3. Add this line at `package.json`
```diff
...
+ "prettier": "@santospatrick/prettier-config"
...
```

4. (Optional) Add script for linting
```json
"scripts": {
    "lint": "eslint --fix src --ext .js"
},
```


## Create React App
If you are using [create-react-app](https://create-react-app.dev/), remove the following lines at `package.json`:

```diff
...
- "eslintConfig": {
-   "extends": "react-app"
- },
...
```

## Development

```sh
yarn link
cd /path/to/project
yarn link @santospatrick/eslint-config-react

# Deploy
# This command will also publish do Yarn
npm publish --access public
```
npm package: @santospatrick/prettier-config
Description: :nail_care: Simple prettier config for React.js
Latest version: 1.0.1

# `@santospatrick/prettier-config`
:nail_care: Simple prettier config for React.js

## Usage

1. Install
```
yarn add @santospatrick/prettier-config --dev
```

2. Add this line at `package.json`
```diff
...
+ "prettier": "@santospatrick/prettier-config"
...
```
npm package: @santosvilanculos/bevor
Description: Inertia 3 devtools built on top of TanStack DevTools
Latest version: 0.1.0

# @santosvilanculos/bevor

[![npm version](https://img.shields.io/npm/v/@santosvilanculos/bevor.svg)](https://www.npmjs.com/package/@santosvilanculos/bevor)
[![npm license](https://img.shields.io/npm/l/@santosvilanculos/bevor.svg)](https://www.npmjs.com/package/@santosvilanculos/bevor)

Inertia 3 devtools built on top of TanStack DevTools. Uses TanStack DevTools as a harness to display Inertia-specific debugging information.

## Table of Contents

- [Installation](#installation)
- [Peer Dependencies](#peer-dependencies)
- [Quick Start](#quick-start)
- [Usage](#usage)
- [API](#api)

## Installation

```sh
pnpm add @santosvilanculos/bevor
```

## Peer Dependencies

This package requires the following peer dependencies:

- `@tanstack/react-devtools`
- `@inertiajs/core`
- `@inertiajs/react`
- `react`
- `react-dom`

## Quick Start

```tsx
import { TanStackDevtools } from '@tanstack/react-devtools';
import { inertiaDevtoolsPlugin } from '@santosvilanculos/bevor';

function App() {
  return (
    <TanStackDevtools
      plugins={[
        inertiaDevtoolsPlugin()
      ]}
    />
  );
}
```

## Usage

### Using the Plugin

The `inertiaDevtoolsPlugin` registers an Inertia panel within TanStack DevTools.

```tsx
import { TanStackDevtools } from '@tanstack/react-devtools';
import { inertiaDevtoolsPlugin } from '@santosvilanculos/bevor';

function App() {
  return (
    <TanStackDevtools
      plugins={[
        inertiaDevtoolsPlugin()
      ]}
    />
  );
}
```

### Using the Panel Directly

For custom configurations, you can import and render the `InertiaDevtoolsPanel` component directly.

```tsx
import { TanStackDevtools } from '@tanstack/react-devtools';
import { InertiaDevtoolsPanel } from '@santosvilanculos/bevor';

function App() {
  return (
    <TanStackDevtools
      plugins={[
        {
          name: 'Inertia',
          render: (_, { theme }) => <InertiaDevtoolsPanel theme={theme} />
        }
      ]}
    />
  );
}
```

## API

### `inertiaDevtoolsPlugin()`

Creates a plugin for TanStack DevTools that displays Inertia debugging information.

```tsx
import { inertiaDevtoolsPlugin } from '@santosvilanculos/bevor';

<TanStackDevtools plugins={[inertiaDevtoolsPlugin()]} />
```

### `InertiaDevtoolsPanel`

A React component that renders the Inertia devtools panel. Accepts a `theme` prop from TanStack DevTools.

```tsx
import { InertiaDevtoolsPanel } from '@santosvilanculos/bevor';

<InertiaDevtoolsPanel theme="light" />
```

### `InertiaDevtoolsPanelProps`

Type for the props accepted by `InertiaDevtoolsPanel`.

```tsx
import type { InertiaDevtoolsPanelProps } from '@santosvilanculos/bevor';
```