open-index/open-npm huggingface dataset:
npm package: @grif/now-builder
Description: ### Make a new directory with the following files: ```fs /now.json /grif.config.js /schema.graphql ```
Author: Ryan Lindskog
Latest version: 0.0.0

# Usage

### Make a new directory with the following files:
```fs
/now.json
/grif.config.js
/schema.graphql
```


### `now.json`
```json
{
  "name": "my-project",
  "builds": [
    { "src": "grif.config.js", "use": "grif" }
  ],
  "routes": [
    { "src": "/api", "dest": "grif.config.js" }
  ]
}
```

### `grif.config.js`
```javascript
// example config
module.exports = { target: 'serverless', context: ({ req }) => ({ req }) }
```

### `schema.graphql`
```graphql
type User {
  id: ID
  username: String
  posts: [Post]
}

type Post {
  id: ID
  title: String
  text: String
  author: User
}

type Query {
  getUserById(id: ID!): User
  getAllUsers(): [User]
  getAllPosts(): [Post]
}

type Mutation {
  signUp(username: String!, password: String!): User
  createPost(title: String, text: String): Post
}
```

### Result
This schema would expect the following directory structure (which would also be the API structure, minus the extension "ext")

***Each file*** exports a ***serverless function*** that would resolve the above schema definition.

*This file/api structure is supposed to mimic [the resolver map](https://www.apollographql.com/docs/apollo-server/essentials/data/#resolver-map)

*ext could be  js|ts|rs|py|go

*λ represents a separate serverless function

```fs
λ /Query/getUserById.ext
λ /Query/getAllUsers.ext
λ /Query/getAllPosts.ext

λ /Mutation/signUp.ext
λ /Mutation/createPost.ext

λ /User/username.ext
λ /User/posts.ext
λ /User/index.ext // this would handle the rest of the unspecified fields on type User
or
λ /User.ext // if you want everything handled all in one serverless function

λ /Post/author.ext
λ /Post/index.ext
or
λ /Post.ext
```

### development
`now dev`

the graphql endpoint (gateway): `http://localhost:3000/api`

the graphiql ui: `http://localhost:3000/api/graphiql`

FAQ:
`grif` is named after "Young Griff" from the books. It also almost sounds like graphql. ¯\\_(ツ)_/¯
npm package: @griffel/eslint-plugin
Description: ESLint plugin with lint rules for Griffel
Latest version: 2.0.2

# ESLint plugin for Griffel

ESLint plugin to follow best practices and anticipate common mistakes when writing styles with Griffel

## Install

```bash
yarn add --dev @griffel/eslint-plugin
# or
npm install --save-dev @griffel/eslint-plugin
```

## Usage

Add `@griffel` to the plugins section and `plugin:@griffel/recommended` to the extends section of your `.eslintrc` configuration file:

```json
{
  "plugins": ["@griffel"],
  "extends": ["plugin:@griffel/recommended"]
}
```

## Shareable configurations

This plugin exports recommended configuration that enforce good practices, but you can choose to use only the ones that are necessary for your use case:

```json
{
  "plugins": ["@griffel"],
  "rules": {
    "@griffel/hook-naming": "error",
    "@griffel/no-shorthands": "error",
    "@griffel/pseudo-element-naming": "error"
  }
}
```

You can find more info about enabled rules in the [Supported Rules section](#supported-rules) below.

## Supported Rules

**Key**: 🔧 = fixable

| Name                                                                                       | Description                                                                                                     | 🔧  |
| ------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------- | --- |
| [`@griffel/hook-naming`](./src/rules/hook-naming.md)                                       | Ensure that hooks returned by the `makeStyles()` function start with "use"                                      | ❌  |
| [`@griffel/no-invalid-shorthand-arguments`](./src/rules/no-invalid-shorthand-arguments.md) | All shorthands must not use space separators, and instead pass in multiple arguments                            | ✅  |
| [`@griffel/no-shorthands`](./src/rules/no-shorthands.md)                                   | Enforce usage of CSS longhands                                                                                  | ✅  |
| [`@griffel/styles-file`](./src/rules/styles-file.md)                                       | Ensures that all `makeStyles()` and `makeResetStyles()` calls are placed in a `.styles.js` or `.styles.ts` file | ❌  | limitations) | ❌ |
| [`@griffel/pseudo-element-naming`](./src/rules/pseudo-element-naming.md)                   | Ensures that all Pseudo Elements start with two colons                                                          | ✅  |
| [`@griffel/top-level-styles`](./src/rules/top-level-styles.md)                    | Ensures that all `makeStyles()`, `makeResetStyles()` and `makeStaticStyles()` calls are written in the top level of a file to discourage developer misuse.  | ❌  |
| [`@griffel/no-deprecated-shorthands`](./src/rules/no-deprecated-shorthands.md)                                       | Ensure that deprecated shorthand functions are not used                                      | ❌
npm package: @griffel/jest-serializer
Description: Jest serializer for Griffel
Latest version: 1.1.36

# Jest serializer for Griffel

Provides a Jest serializer for `@griffel/react` that strips out class names generated by Griffel from the output.

## Install

Add it as a dependency:

```bash
yarn add --dev @griffel/jest-serializer
# or
npm install --save-dev @griffel/jest-serializer
```

Update your `jest.config.js` (or appropriate config location) to include a `snapshotSerializers` array that references this package:

```js
module.exports = {
  snapshotSerializers: ['@griffel/jest-serializer'],
};
```

## Overview

When using Jest snapshot testing with components that utilize `@griffel/react`, class names will be rendered as follows:

```html
<div class="static-class __1qdh4ig f16th3vw frdkuqy0 fat0sn40 fjseox00">Hello world</div>
```

With this serializer, the generated class names will be removed:

```html
<div class="static-class">Hello world</div>
```

This ensures that your tests can pass reliably without any generated class names.
npm package: @griffel/next-extraction-plugin
Description: NextJS plugin that add Griffel's CSS extraction to webpack loaders pipeline
Latest version: 0.1.15

# Next plugin to perform CSS extraction in Griffel

A plugin for NextJS 12.0.5 and newer that adds [`@griffel/webpack-extraction-plugin`](../webpack-extraction-plugin) to webpack loaders pipeline.

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

- [Install](#install)
- [Usage](#usage)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## Install

```bash
yarn add --dev @griffel/next-extraction-plugin
# or
npm install --save-dev @griffel/next-extraction-plugin
```

Please install `@griffel/webpack-loader` if you haven't done so already:

```bash
yarn add --dev @griffel/webpack-loader
# or
npm install --save-dev @griffel/webpack-loader
```

For more details please check [README of `@griffel/webpack-loader`](../webpack-loader/README.md).

## Usage

In `next.config.js` file you'll need to add the next-plugin from `@griffel/webpack-extraction-plugin` like so:

```js
// next.config.js
const { withGriffelCSSExtraction } = require('@griffel/next-extraction-plugin');

module.exports = withGriffelCSSExtraction()({
  webpack(config) {
    config.module.rules.unshift({
      test: /\.(js|jsx)$/,
      exclude: /node_modules/,
      use: [
        {
          loader: '@griffel/webpack-loader',
        },
      ],
    });

    // If your project uses TypeScript
    config.module.rules.unshift({
      test: /\.(ts|tsx)$/,
      exclude: /node_modules/,
      use: [
        {
          loader: '@griffel/webpack-loader',
          options: {
            babelOptions: {
              presets: ['next/babel'],
            },
          },
        },
      ],
    });

    return config;
  },
});
```
npm package: @griffel/postcss-syntax
Description: postcss syntax for Griffel
Latest version: 1.3.6

# Postcss syntax for Griffel

A postcss [custom syntax](https://postcss.org/docs/how-to-write-custom-syntax) for Javascript files that contain
Griffel CSS in JS code.

## Parser

The parser will parse a Javascript file and return the CSS output of any Griffel `makeStyle` or `makeResetStyle`
calls. The parsed postcss AST will include source locations back to the original Javascript code.

## Stringifier

The stringifier only works on a postcss AST that was parsed by this custom syntax since Griffel ahead of time
compilation lacks the capability to map generated CSS back to the original javascript properties very accurately.

## Configuring @griffel/babel-preset

The preprocessor uses transforms in the `@griffel/babel-preset` package. In order to configure the babel transform
that is used internally, we've created the a factory to return the custom syntax that uses the desired configuration.

```ts
import { createSyntax } from '@griffel/postcss-syntax';
const syntax = createSyntax({
  modules: [
    { moduleSource: '@myScope/griffel', importName: 'createStyles' },
  ]
})
```

For more information about how to configure the babel Griffel preset 
[you can check out the docs](https://github.com/microsoft/griffel/blob/main/packages/babel-preset/README.md#usage)
npm package: @griffel/shadow-dom
Description: Shadow DOM implementation of Griffel Atomic CSS-in-JS
Latest version: 0.2.12

# Griffel for Shadow DOM

A package with wrappers and APIs to be used with Shadow DOM.

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

- [Install](#install)
- [`createShadowDOMRenderer()`](#createshadowdomrenderer)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## Install

```bash
npm install @griffel/shadow-dom
# or
yarn add @griffel/shadow-dom
```

## `createShadowDOMRenderer()`

```ts
import { createShadowDOMRenderer } from '@griffel/shadow-dom';

const render = createShadowDOMRenderer(element.shadowRoot);
```
npm package: @griffel/tag-processor
Description: wyw-in-js processor for Griffel
Latest version: 1.0.16

# Griffel processor for wyw-in-js

A processor for [wyw-in-js](https://github.com/Anber/wyw-in-js) for that performs build time transforms for `makeStyles` & `makeResetStyles` [`@griffel/react`](../react).

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

- [Install](#install)
- [How to use it?](#how-to-use-it)
  - [Handling Griffel re-exports](#handling-griffel-re-exports)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## Install

```bash
yarn add --dev @griffel/tag-processor
# or
npm install --save-dev @griffel/tag-processor
```

## How to use it?

This package cannot be used solely, it should be paired with `@griffel/vite-plugin` or other tools that support WyW-in-js.

### Handling Griffel re-exports

```js
import { makeStyles, makeResetStyles } from 'custom-package';
```

By default, the processor handles imports from `@griffel/react` & `@fluentui/react-components`, to handle imports from custom packages settings you need to include meta information to a matching `package.json`:

```json
{
  "name": "custom-package",
  "version": "1.0.0",
  "wyw-in-js": {
    "tags": {
      "makeStyles": "@griffel/tag-processor/make-styles",
      "makeResetStyles": "@griffel/tag-processor/make-reset-styles"
    }
  }
}
```

> **Note**: "custom-package" should re-export following functions from `@griffel/react`:
>
> - `__styles`
> - `__css`
> - `__resetStyles`
> - `__resetCSS`
npm package: @griffel/vite-plugin
Description: Vite plugin for Griffel
Latest version: 0.1.16

# @griffel/vite-plugin

The package contains a plugin for [Vite](https://vitejs.dev/).

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

- [Installation](#installation)
- [Usage](#usage)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## Installation

```shell
# npm
npm i -D @griffel/tag-processor @griffel/vite-plugin
# yarn
yarn add --dev @griffel/tag-processor @griffel/vite-plugin
```

## Usage

After installation, add the plugin to your `vite.config.js`:

```js
import { defineConfig } from 'vite';
import griffel from '@griffel/vite-plugin';

export default defineConfig(({ command }) => ({
  // ...
  plugins: [
    // We recommend using the plugin only in production builds to get optimized output
    command === 'build' && griffel(),
  ],
}));
```
npm package: @griffel/webpack-plugin
Description: Webpack plugin that performs CSS extraction for Griffel
Latest version: 4.0.1

# Webpack plugin to perform CSS extraction in Griffel

A plugin for Webpack 5 that performs CSS extraction for [`@griffel/react`](../react).

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

- [Install](#install)
- [When to use it?](#when-to-use-it)
- [Usage](#usage)
- [Options](#options)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## Install

```bash
yarn add --dev @griffel/webpack-plugin
# or
npm install --save-dev @griffel/webpack-plugin
```

## When to use it?

This is a replacement for `@griffel/webpack-loader` + `@griffel/webpack-extraction-plugin`. It combines both into a single plugin that handles CSS extraction without needing a separate loader setup.

## Usage

Webpack documentation:

- [Plugins](https://webpack.js.org/concepts/plugins/)
- [Loaders](https://webpack.js.org/loaders/)

Within your Webpack configuration, add the plugin along with `mini-css-extract-plugin`:

```js
import { GriffelPlugin } from '@griffel/webpack-plugin';
import MiniCssExtractPlugin from 'mini-css-extract-plugin';

export default {
  module: {
    rules: [
      {
        test: /\.(js|ts|tsx)$/,
        // Apply "exclude" only if your dependencies **do not use** Griffel
        // exclude: /node_modules/,
        use: {
          loader: '@griffel/webpack-plugin/loader',
        },
      },
      // "css-loader" and "mini-css-extract-plugin" are required to handle CSS assets produced by Griffel
      {
        test: /\.css$/,
        use: [MiniCssExtractPlugin.loader, 'css-loader'],
      },
    ],
  },
  plugins: [new MiniCssExtractPlugin(), new GriffelPlugin()],
};
```

The plugin automatically:

- Transforms `makeStyles()`, `makeResetStyles()`, and `makeStaticStyles()` calls at build time
- Extracts CSS into a dedicated chunk (named `griffel`) via `mini-css-extract-plugin`
- Sorts CSS rules by specificity buckets and media queries

## Options

```js
new GriffelPlugin({
  // Compare function for sorting media queries (default: @griffel/core's defaultCompareMediaQueries)
  compareMediaQueries: myCompareFunction,

  // Override the resolver used to resolve imports inside evaluated modules
  resolverFactory: myResolverFactory,

  // Attach extracted CSS to a specific entry point chunk
  unstable_attachToEntryPoint: 'main',

  // Collect and log timing stats
  collectStats: false,
});
```
npm package: @griffinbank/mcp-server
Description: Griffin API MCP Server - Model Context Protocol server for Griffin API
Author: Griffin Bank
Latest version: 0.1.3

## Griffin MCP server (beta)
This is our beta model context protocol (MCP) server. It gives your AI agents an easy way to interact with the [Griffin API](https://docs.griffin.com). Use the server via any MCP client, including Claude Desktop and code editors like Cursor.

## Prerequisites

- a Griffin API Key. Get one here at [app.griffin.com/register](https://app.griffin.com/register)
- Node.js (v16 or later)
- npm (v7 or later)

## How to use Griffin's MCP server with Claude Desktop

To use this MCP server with Claude for Desktop:

1. Edit your Claude for Desktop configuration file at:
   - macOS: `~/Library/Application Support/Claude/claude_desktop_config.json`
   - Windows: `%APPDATA%\Claude\claude_desktop_config.json`

2. Add the following to the `mcpServers` section:

```json
{
    "mcpServers": {
      "griffin": {
        "command": "npx",
        "args": ["-y" "@griffinbank/mcp-server"],
        "env": {
          "GRIFFIN_API_KEY": "your-griffin-api-key"
        }
      }
    }
  }

```

3. Restart Claude for Desktop

## Safety
Do not attempt to use this MCP server with your live organisation API key. We have put safeguards in place to stop live API keys working, but nevertheless please avoid exposing your keys unnecessarily.

## Features

- Open operational accounts
- Create and submit payments
- List resources, e.g. payments, bank accounts, legal persons
- Fetch information about specific resources

## Tools Provided

- `create-and-submit-payment` - Creates and submits a payment
- `open-operational-account` - Opens a new operational account
- `list-bank-accounts` - Lists all bank accounts
- `list-legal-persons` - Lists all legal persons
- `list-payments` - Lists all payments
- `list-payees` - Lists payees for a given legal person
- `get-bank-account` - Gets details for a specific bank account
- `get-legal-person` - Gets details for a specific legal person
- `get-payment` - Gets details for a specific payment
- `get-payee` - Gets details for a specific payee
- `list-transactions` - Lists the latest transactions for a bank account

## Give us feedback
Reach out to us at product@griffin.com or join our [Slack community](https://join.slack.com/t/griffin-community/shared_invite/zt-1do6oaad0-HB54Hv9KEfYOLQoUlZ_77A)
npm package: @griffins/small-swagger-codegen
Description: A small version of swagger-codegen. Does fewer things with less code.
Author: GasBuddy
Latest version: 2.0.0

# small-swagger-codegen

[![wercker status](https://app.wercker.com/status/3da8a3d8992ce63c2db82c29f02a584b/s/master "wercker status")](https://app.wercker.com/project/byKey/3da8a3d8992ce63c2db82c29f02a584b)

A small version of swagger-codegen. Does fewer things with less code. Supports Swift, Kotlin, and Javascript (using fetch/EventSource).

Usage
=====
You can either pass parameters on the command line or a configuration file.

Command line example:
This will build a Javascript module named my-spec-js-client with a default export of MyApi using snake casing (as opposed to the default camel casing) for methods and parameters, and output to the default directory - `client` (which can be overridden with `--output=someotherdir`)
```
npx small-swagger-codegen --language=js --spec=./my-spec.json --name=MyApi --packageName=my-spec-js-client --snake
```

Configuration files can be useful when you want to generate a number of clients at the same time, such as in a native app.

```
{
  "language": "swift",
  "output": "./DevelopmentPods/Generated/",
  "specs": {
    "ApiOne": {
      "spec": "./node_modules/api-one-spec/api-one-spec.json",
      "className": "ApiOneAPI",
      "basePath": "api1"
    },
    "OtherApi": {
      "spec": "./node_modules/other-api-spec/other-api-spec.json",
      "className": "OtherAPI",
      "basePath": "other"
    }
  }
}
```

Which, if saved in a file called `config.json` is run with
```
npx small-swagger-codegen ./config.json
```