open-index/open-npm huggingface dataset:
npm package: @mattbastos/tailwind-bootstrap-grid
Description: Tailwind CSS plugin to generate Bootstrap flexbox grid system.
Author: Karolis Šarapnickis
Latest version: 5.1.9

# tailwind-bootstrap-grid

[![npm version][version-badge]][version]
![Build Status](https://github.com/karolis-sh/tailwind-bootstrap-grid/workflows/Node.js%20CI/badge.svg)
[![License: MIT][license-badge]][license]

Bootstrap **v5** flexbox grid system as a Tailwind CSS plugin.

Check the [demo](https://tailwind-bootstrap-grid.netlify.app/).

## Installation

```shell
npm i -D @mattbastos/tailwind-bootstrap-grid
```

In your css file:

```css
@import 'tailwindcss';
@plugin "tailwind-bootstrap-grid" {
  grid-columns: 12;
  grid-gutter-width: '1.5rem';
  grid-gutters-0: 0;
  grid-gutters-1: 0.25rem;
  grid-gutters-2: 0.5rem;
  grid-gutters-3: 1rem;
  grid-gutters-4: 1.5rem;
  grid-gutters-5: 3rem;
  generate-container: true;
  container-max-widths-sm: 540px;
  container-max-widths-md: 720px;
  container-max-widths-lg: 960px;
  container-max-widths-xl: 1140px;
  container-max-widths-xxl: 1320px;
  rtl: true;
  respect-important: true;
}
```

This will generate Bootstrap v5 flexbox grid.

\* **NOTE**: When using the `.container` class from this plugin you will need to
[disable](https://tailwindcss.com/docs/container#disabling-entirely) the core
[container plugin](https://tailwindcss.com/docs/container/) as both plugins
expose a `.container` class.

## Features & Tailwind CSS options support

- ✅ custom screens
- ✅ custom separator
- ✅ custom prefix
- ✅ important
- ✅ rtl support

## Options

- Original Bootstrap grid's options:

  - `gridColumns` (default - `12`) - grid size
  - `gridGutterWidth` (default - `"1.5rem"`) - container and rows gutter width
  - `gridGutters` (default - `{ 0: 0 }`) - gutter variable class steps
    (`--bs-gutter-x`, `--bs-gutter-y`)
  - `containerMaxWidths` (default - `{}`) - the `max-width` container value for
    each breakpoint

- Extra options:
  - `generateContainer` (default - `true`) - whether to generate `.container` and
    `.container-fluid` classes
  - `rtl` (default - `false`) - rtl support (`.offset-x` classes will start
    responding to `[dir=ltr]` / `[dir=rtl]`)
  - `respectImportant` (default - `true`) - whether it should respect the `important`
    root config option

## FAQ

1. _**Why my `.container` doesn't have padding?**_ This plugin will not work properly
   with [core container plugin](https://tailwindcss.com/docs/container/) as both
   plugins expose a `.container` class.
1. _**How to use rtl css?**_ Set the `ltr` or `rtl` [dir](https://www.w3schools.com/tags/att_global_dir.asp)
   attribute on your container (usually the root `html`).
1. _**Is there a Bootstrap v4 grid implementation?**_ Yes, use `tailwind-bootstrap-grid@3`.

## Related

[postcss-bootstrap-4-grid](https://github.com/johnwatkins0/postcss-bootstrap-4-grid)

[version-badge]: https://badge.fury.io/js/tailwind-bootstrap-grid.svg
[version]: https://www.npmjs.com/package/tailwind-bootstrap-grid
[license-badge]: https://img.shields.io/badge/License-MIT-yellow.svg
[license]: https://opensource.org/licenses/MIT
npm package: @mattbenton/dependency-graph
Description: A simple dependency graph with the following features:
Author: Matthew Bricker-Benton
Latest version: 0.1.0

# Dependency Graph

A simple dependency graph with the following features:

- **Node Management:**

  - Add nodes with unique string identifiers
  - Check if a node exists

- **Dependency Management:**

  - Add dependencies between nodes
  - Prevent circular dependencies automatically

- **Query Capabilities:**

  - Get direct dependencies of a node
  - Get all dependencies (direct and indirect)
  - Get all nodes that depend on a specific node
  - Generate a topological sort of the graph

- **Error Handling:**

  - Validation for node existence
  - Detection and prevention of circular dependencies

## Examples

### Basic usage

```ts
import { DependencyGraph } from '@mattbenton/dependency-graph';

const graph = new DependencyGraph();

// Add nodes
graph.addNode('A');
graph.addNode('B');
graph.addNode('C');
graph.addNode('D');

// Define dependencies between nodes
graph.addDependency('A', 'B'); // A depends on B
graph.addDependency('A', 'C'); // A depends on C
graph.addDependency('B', 'D'); // B depends on D

// Get all the nodes with the dependent ones sorted first
const result = graph.getTopologicalSort('dependents_first');
// => D, B, C, A
```

### With node data

You can associate structed data with nodes and query them back:

```ts
import { DependencyGraph } from '@mattbenton/dependency-graph';

const graph = new DependencyGraph<{ name: string }>();

// Add nodes
graph.addNode('A', { name: 'Apple' });
graph.addNode('B', { name: 'Banana' });
graph.addNode('C', { name: 'Carrot' });
graph.addNode('D', { name: 'Date' });

// Define dependencies between nodes
graph.addDependency('A', 'B'); // A depends on B
graph.addDependency('A', 'C'); // A depends on C
graph.addDependency('B', 'D'); // B depends on D

// Get all the nodes with the dependent ones sorted first
const result = graph.getTopologicalSortWithData('dependents_first');
/* =>
[
  { id: 'D', data: { name: 'Date' } },
  { id: 'B', data: { name: 'Banana' } },
  { id: 'C', data: { name: 'Carrot' } },
  { id: 'A', data: { name: 'Apple' } }
]
*/
```
npm package: @mattbrannon/convert
Description: A set of color conversion functions 
Author: Matt Brannon
Latest version: 2.2.0

# @mattbrannon/convert

This is a collection of functions for converting one thing to another. Currently those things are colors and angles.
Color formats currently include:

- rgb
- hsl
- hex
- hsv
- hwb
- cmyk
- lch

Angle formats currently include:

- degree
- radian
- gradian
- turn

## Installation

This package is available on Npm. You can install it using the package manager of your choice.

```bash
npm i --save @mattbrannon/convert
```

This package is compatible with both ESM (ES Modules) and CJS (Common JS).

## Usage

Color conversion functions can be called in one of two ways.

- Pass an array of values representing the individual color channels
- Pass each color channel individually as an argument.

The exception to the rule is for hexadecimal conversions which always require a string

```js
import { rgb, hex } from '@mattbrannon/convert';

// these are functionally equivalent to each other

rgb.lch([255, 0, 255]); // array of values
rgb.lch(255, 0, 255); // individual values

hex.hsl('#ff00ff');
```
npm package: @mattbrannon/file-loader
Description: Utility for loading modules in both ESM and CJS environments
Author: Matt Brannon
Latest version: 1.1.1

# file-loader

A utility module for loading modules in both ESM and CJS environments, with support for conditional caching and JSON imports.

## Installation

```bash
npm install file-loader
```

## Features

- Supports both CommonJS and ESM modules
- Conditional module caching
- Support for JSON imports
- Lightweight with no dependencies

## Usage

```javascript
const FileLoader = require("file-loader");

// Load a module with caching (default)
const module1 = await FileLoader.loadModule("./path/to/module");

// Load a module without caching
const module2 = await FileLoader.loadModule("./path/to/module", false);

// Load a JSON file
const jsonData = await FileLoader.loadModule("./path/to/file.json");
```

## API

### `loadModule(moduleName, useCache = true)`

- `moduleName`: Path to the module
- `useCache`: Boolean to control module caching
- Returns: Promise that resolves to the loaded module

### `resolveModule(moduleName)`

- `moduleName`: Path to the module
- Returns: Resolved absolute path to the module

### `isJson(moduleName)`

- `moduleName`: Path to the module
- Returns: Boolean indicating if the module is a JSON file

## License

MIT © Matt Brannon
npm package: @mattcampbell/semantic-release-config
Description: A config for [semantic-release](https://github.com/semantic-release/semantic-release).
Author: Matt Campbell
Latest version: 1.1.1

# Semantic release config

A config for [semantic-release](https://github.com/semantic-release/semantic-release).

- Adds a few extra commit types
- Creates changelog automatically
- Pushes changelog back into Git repo

## Installation

Install the config and it's peer dependencies.

```bash
pnpm i -D @nick-mazuk/semantic-release-config semantic-release @semantic-release/changelog @semantic-release/git
```

Create a `release.config.cjs` file in the root of your repo.

```js
module.exports = {
    extends: ['@nick-mazuk/semantic-release-config'],
}
```

## Usage with GitHub Actions

Create a `.github/workflows/release.yml` file.

```yml
name: Release

on:
  push:
    branches:
      - main

jobs:
  release:
    name: Release
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: actions/setup-node@v2.1.5
        with:
          node-version: 14
      - name: Install dependencies
        run: npx pnpm i --frozen-lockfile=false
      - name: Release
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
        run: npx semantic-release
```

Add your `NPM_TOKEN` token to your repository's secrets.

## Available commit types

- **build**: Changes that affect the build system (example scopes: gulp, broccoli, npm)
- **bump**: Dependency updates
- **ci**: Changes to our CI configuration files and scripts (example scopes: Circle, BrowserStack, SauceLabs)
- **docs**: Documentation only changes
- **feat**: A new feature
- **fix**: A bug fix
- **perf**: A code change that improves performance
- **refactor**: A code change that neither fixes a bug nor adds a feature
- **test**: Adding missing tests or correcting existing tests
- **style**: A change in CSS
- **BREAKING**: Any breaking change
npm package: @mattcbaker/blip
Description: Blip is making Node HTTP(S) transactions a little more pleasant.
Author: mattcbaker
Latest version: 1.0.6

<p align="center">
  <img src="https://i.imgur.com/RzBwAUm.png">
</p>

## Blip
[![Build Status](https://travis-ci.com/mattcbaker/blip.svg?token=YvkgqpiszGV5r7aytqLv&branch=master)](https://travis-ci.com/mattcbaker/blip)
[![npm version](https://badge.fury.io/js/%40mattcbaker%2Fblip.svg)](https://badge.fury.io/js/%40mattcbaker%2Fblip)

Blip is making Node HTTP(S) transactions a little more pleasant.

### Install
`npm i @mattcbaker/blip`

### Example
```js
const { request } = require('@mattcbaker/blip')

try {
  const result = await request({ url: 'https://httpbin.org/get' })

  console.log(result.body.toString())
} catch (error) {
  // be sure to handle your errors! :)
}

```

### API
**request**
```js
request({
 url: string,
 headers: {...},
 body: string,
 method: string
})
```
and the response
```js
{
 statusCode: int,
 headers: {...}
 body: <Buffer ...>
}
```



### Blip has a few opinions (don't we all?)
- The HTTP spec refers to message bodies as "body" and the Blip API reflects that.
- Blip will _not_ return an error based on _any_ status code. For example, Blip will not return an error when a server responds with a 5xx HTTP status code.

### Common questions
 - **Why doesn't the API have methods for each HTTP verb, e.g. GET, POST, PUT?**
   - No doubt these convenience methods are handy. But, they aren't without a cost -- increasing the API surface. Blip has chosen to have as small an API surface as possible, so we've decided to forego the verb convenience methods.
 - **Why return a `Buffer` for the body?**
   - This choice is rooted in the fact that Node is based on streams. Node serves HTTP response bodies in streams, Blip tries to make your life a little easier by loading that stream into a buffer. If you'd like the `utf8` encoding of the body, [buffer.toString()](https://nodejs.org/api/buffer.html#buffer_buf_tostring_encoding_start_end) is your friend.

### License
[MIT](LICENSE.md)
npm package: @mattclough/gatsby-source-shopify
Description: Gatsby source plugin for building websites using Shopfiy as a data source
Author: Angelo Ashmore
Latest version: 0.2.0

# gatsby-source-shopify

Source plugin for pulling product data into [Gatsby][gatsby] from a
[Shopify][shopify] store.

## Install

```sh
npm install --save gatsby-source-shopify
```

## How to use

Add the following plugin config to your `gatsby-config.js` file.

```js
// In your gatsby-config.js
plugins: [
  {
    resolve: `gatsby-source-shopify`,
    options: {
      name: `your_shop_name`,
      token: `your_access_token`,
    },
  },
]
```

## How to query

You can query nodes created from Shopify like the following:

```graphql
{
  allShopifyProductNode {
    edges {
      node {
        id
        title
      }
    }
  }
}
```

Utilize Gatsby's built-in [GraphiQL IDE][graphiql-intro] to explore the node schemas available.

By default, this is at `http://localhost:8000/___graphql`

## List of implemented nodes

| Name                 | Description                                                                                                           |
| -------------------- | --------------------------------------------------------------------------------------------------------------------- |
| `ArticleNode`        | A blog entry.                                                                                                         |
| `BlogNode`           | Collection of articles.                                                                                               |
| `CollectionNode`     | Represents a grouping of products that a shop owner can create to organize them or make their shops easier to browse. |
| `ProductNode`        | Represents an individual item for sale in a Shopify store.                                                            |
| `ProductOptionNode`  | Custom product property names.                                                                                        |
| `ProductVariantNode` | Represents a different version of a product, such as differing sizes or differing colors.                             |
| `ShopPolicyNode`     | Policy that a merchant has configured for their store, such as their refund or privacy policy.                        |

## A note on customer information

Not all Shopify nodes have been implemented as they are not necessary for the
static portion of a Gatsby-generated website. This includes any node that
contains sensitive customer-specific information, such as `Order` and
`Payment`.

If you are in need of this data (e.g. building a private, internal website),
please open an issue. Until then, the nodes will not be implemented to lessen
the chances of someone accidentally making private information publicly
available.

[gatsby]: https://gatsby.org
[shopify]: https://shopify.com
[graphiql-intro]: https://medium.com/the-graphqlhub/graphiql-graphql-s-killer-app-9896242b2125
npm package: @mattcotton/js-streamer
Description: A Node JS implementation of a webrtc streamer for testing.
Author: Epic Games
Latest version: 0.0.1

# JavaScript Streamer

The JavaScript Streamer is a functional drop-in for an instance of a Unreal Engine Pixel Streaming application
except it can run in the browser, requires no GPU, and has zero dependencies on Unreal Engine.

Its purpose is as follows:
- A mock of Unreal Engine Pixel Streaming for testing the various Pixel Streaming Infrastructure components in CI without requiring UE.
- A reference to demonstrate how to implement your own Pixel Streaming source (yes, you _could_ stream from things other than UE).

## Running
- `npm install`
- `npm run build`
- `npm run develop`
- Visit http://localhost:4000 in your browser