open-index/open-npm huggingface dataset:
npm package: @interfector18/wrap-css-loader
Description: CSS Wrap loader for webpack to wrap css classes with a namespace 
Author: interfector18
Latest version: 1.1.1

# wrap-css-loader
[CSS Wrap](https://github.com/benignware/css-wrap) Loader for webpack.

Uses [loader-utils](https://github.com/webpack/loader-utils).getOptions() to get the options, hence avoids any depreciation warnings related to parseQuery().

## Install
npm install wrap-css-loader --save-dev

## Usage

##### Basic Usage
```javascript
module.exports = {
  /* webpack config */
  module: {
    loaders: [{
     test: /\.css$/,
      loader: "wrap-css-loader",
      options: {
        selector: "namespace"
      }
    },
    //other loaders
  ]},
}
```

#### Example with a typical webpack config using babel-loader, sass-loader and extract text plugin.

```javascript
module.exports = {
  /* Webpack config */
  module: {
    loaders: [{
      test: /\.js$/,
      exclude: /node_modules/,
      loader: 'babel-loader'
    },
    {
      test: /\.(sass|scss)$/,
      loader: ExtractTextPlugin.extract({
        use: [
          {
            loader: "css-loader",
            options: {
              sourceMap: true
            }
          },
          {
            loader: "wrap-css-loader",
            options: {
              selector: config.namespace
            }
          },          
          {
            loader: "sass-loader",
            options: {
              sourceMap: true
            }
          },
        ]
      })
    },
  ]},
  
plugins: [
    new ExtractTextPlugin('[name].css'),
  ],
}
```
npm package: @interfere/constants
Description: Build apps that never break.
Author: Interfere
Latest version: 8.1.0

<p align="center">
  <a href="https://interfere.com">
    <picture>
      <source media="(prefers-color-scheme: dark)" srcset="https://qyzkf4cgb8ydxtq1.public.blob.vercel-storage.com/v2/header/logo-dark.png">
      <img src="https://qyzkf4cgb8ydxtq1.public.blob.vercel-storage.com/v2/header/logo-light.png" height="64">
    </picture>
  </a>
  <h1 align="center">@interfere/constants</h1>
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@interfere/constants"><img src="https://img.shields.io/npm/v/@interfere/constants.svg" /></a>
  <a href="https://github.com/interfere-inc/interfere/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@interfere/constants.svg" /></a>
</p>

<p align="center">
  Shared constants for <a href="https://interfere.com">Interfere</a> SDKs — API URLs, paths, and HTTP utilities.
</p>

---

## Installation

```bash
npm install @interfere/constants
```

## License

MIT
npm package: @interfere/react
Description: Client-side React SDK for Interfere. Error tracking, session replay, and analytics.
Author: Interfere
Latest version: 8.1.1

<p align="center">
  <a href="https://interfere.com">
    <picture>
      <source media="(prefers-color-scheme: dark)" srcset="https://qyzkf4cgb8ydxtq1.public.blob.vercel-storage.com/v2/header/logo-dark.png">
      <img src="https://qyzkf4cgb8ydxtq1.public.blob.vercel-storage.com/v2/header/logo-light.png" height="64">
    </picture>
  </a>
  <h1 align="center">@interfere/react</h1>
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@interfere/react"><img src="https://img.shields.io/npm/v/@interfere/react.svg" /></a>
  <a href="https://github.com/interfere-inc/interfere/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@interfere/react.svg" /></a>
  <a href="https://www.npmjs.com/package/@interfere/react"><img src="https://img.shields.io/npm/dm/@interfere/react.svg" /></a>
</p>

<p align="center">
  Client-side React SDK for <a href="https://interfere.com">Interfere</a> — error tracking, session replay, and analytics.
</p>

<p align="center">
  <a href="https://support.interfere.com/docs">Documentation</a>
  ·
  <a href="https://support.interfere.com/roadmap">Feature Requests</a>
  ·
  <a href="https://support.interfere.com/requests">Report a Bug</a>
  ·
  <a href="mailto:support@interfere.com">Get Help</a>
</p>

---

## Framework Guides

| Framework | Package | Guide |
| --- | --- | --- |
| Next.js | [`@interfere/next`](https://www.npmjs.com/package/@interfere/next) | [docs/next.md](docs/next.md) |
| Vite | [`@interfere/vite`](https://www.npmjs.com/package/@interfere/vite) + `@interfere/react` | [docs/vite.md](docs/vite.md) |

## Installation

```bash
npm install @interfere/react
```

### Prerequisites

- React `>=19`

## Quick Start

```tsx
import { InterfereProvider } from "@interfere/react/provider";

function App() {
  return (
    <InterfereProvider>
      <YourApp />
    </InterfereProvider>
  );
}
```

## Features

- **Error tracking** — automatic capture of uncaught errors and unhandled rejections
- **Session replay** — full visual playback of user sessions
- **Page analytics** — SPA-aware pageviews and UI interaction events
- **Rage click detection** — surface frustrated user behavior
- **User identity** — attach user context to sessions
- **Offline resilient** — events are persisted and delivered in the background

## Hooks

```tsx
import { useInterfere } from "@interfere/react/provider";

function MyComponent() {
  const { identity, session } = useInterfere();

  identity.set({
    identifier: "usr_123",
    email: "jane@example.com",
    name: "Jane",
    source: { type: "clerk", name: "Clerk" },
  });

  const sessionId = session.getId();
}
```

## Documentation

Visit [interfere.com/docs](https://interfere.com/docs) for the full documentation.

## License

MIT
npm package: @interfere/types
Description: TypeScript & Zod types for Interfere
Author: Interfere
Latest version: 8.1.1

<p align="center">
  <a href="https://interfere.com">
    <picture>
      <source media="(prefers-color-scheme: dark)" srcset="https://qyzkf4cgb8ydxtq1.public.blob.vercel-storage.com/v2/header/logo-dark.png">
      <img src="https://qyzkf4cgb8ydxtq1.public.blob.vercel-storage.com/v2/header/logo-light.png" height="64">
    </picture>
  </a>
  <h1 align="center">@interfere/types</h1>
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@interfere/types"><img src="https://img.shields.io/npm/v/@interfere/types.svg" /></a>
  <a href="https://github.com/interfere-inc/interfere/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@interfere/types.svg" /></a>
</p>

<p align="center">
  Shared TypeScript types and Zod schemas for <a href="https://interfere.com">Interfere</a> SDKs.
</p>

---

## Installation

```bash
npm install @interfere/types
```

## License

MIT
npm package: @interfere/typescript-config
Description: <p align="center">   <a href="https://interfere.com">     <picture>       <source media="(prefers-color-scheme: dark)" srcset="https://qyzkf4cgb8ydxtq1.public.blob.vercel-storage.com/v2/header/logo-dark.png">       <img src="https://qyzkf4cgb8ydxtq1.publi
Latest version: 8.1.0

<p align="center">
  <a href="https://interfere.com">
    <picture>
      <source media="(prefers-color-scheme: dark)" srcset="https://qyzkf4cgb8ydxtq1.public.blob.vercel-storage.com/v2/header/logo-dark.png">
      <img src="https://qyzkf4cgb8ydxtq1.public.blob.vercel-storage.com/v2/header/logo-light.png" height="64">
    </picture>
  </a>
  <h1 align="center">@interfere/typescript-config</h1>
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@interfere/typescript-config"><img src="https://img.shields.io/npm/v/@interfere/typescript-config.svg" /></a>
  <a href="https://github.com/interfere-inc/interfere/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@interfere/typescript-config.svg" /></a>
</p>

<p align="center">
  Shared TypeScript configurations used across <a href="https://interfere.com">Interfere</a> packages.
</p>

---

## Installation

```bash
npm install @interfere/typescript-config
```

## Usage

Extend from a config in your `tsconfig.json`:

```json
{
  "extends": "@interfere/typescript-config/base.json"
}
```

## License

MIT
npm package: @interfiber/expressinit
Description: Generate a basic express app with sensible preinstalled packages
Author: Interfiber
Latest version: 1.0.2

# expressinit
Create a basic express app with ease


## Installation
You can install expressinit with the following command in your terminal(You need nodejs, and npm installed):
```
npm i -g @interfiber/expressinit
```
#### Note: this will only work on UNIX-like Operating systems(Like Arch, MacOS, FreeBSD)

## Usage
To create a express app create a directory for your project and cd into it.
Then in the folder you just created run ```expressinit``` and answer the questions
npm package: @interfirm/configs
Description: Manage common config files for interfirm projects
Latest version: 1.0.2

# INTERFIRM Configs

[![NPM version](https://img.shields.io/npm/v/@interfirm/configs.svg)](https://www.npmjs.com/package/@interfirm/configs)
[![CircleCI](https://circleci.com/gh/interfirm/configs.svg?style=svg)](https://circleci.com/gh/interfirm/configs)

This repository manages common config files for INTERFIRM projects.
All config files are in `/templates` directory.

## Usage

1. Edit `@interfirm/configs` entry in `package.json`.
1. Install via `npm` or `yarn`:

```sh
npm install --save-dev @interfirm/configs
```

```sh
yarn add --dev @interfirm/configs
```

This package automatically copies config files to the installed repository
when downloaded into your `node_modules`.

## Configuration

```
"key": boolean || [boolean, destinationPath]
```

Default configuration:

```json
{
  "@interfirm/configs": {
    "reek": true,
    "codeclimate": true,
    "rubocop": true,
    "editorconfig": true
  }
}
```

If you omit `destinationPath`, config files are copied to default path.

## Available config files

| service/tool | key | default path |
| --- | --- | --- |
| [Reek](https://github.com/troessner/reek) | reek | .reek.yml |
| [Code Climate](https://codeclimate.com/) | codeclimate | .codeclimate.yml |
| [RuboCop](https://github.com/bbatsov/rubocop) | rubocop | .rubocop.yml |
| [EditorConfig](http://editorconfig.org/) | editorconfig | .editorconfig |

## Release

1. Run [`yarn version`](https://yarnpkg.com/en/docs/cli/version) command.
1. Push new tag to remote repository.
1. New version will be published by Travis automatically.

Example:

```sh
git checkout master
git pull
yarn version
git push --follow-tags
```