open-index/open-npm huggingface dataset:
npm package: @productiongrid/mcp-client
Description: MCP client for connecting ProductionGrid to Claude Desktop
Author: ProductionGrid
Latest version: 1.0.12

# @productiongrid/mcp-client

MCP (Model Context Protocol) client for connecting ProductionGrid to Claude Desktop.

## Installation

You don't need to install this package directly. Use `npx` to always run the latest version:

```bash
npx @productiongrid/mcp-client
```

## Quick Setup

### 1. Get Your Token

Visit https://evanmcgillivray.github.io/production-grid/ and sign in with Google to get your authentication token.

### 2. Configure Claude Desktop

Add the following to your Claude Desktop configuration:

**Mac:** `~/Library/Application Support/Claude/claude_desktop_config.json`  
**Windows:** `%APPDATA%\Claude\claude_desktop_config.json`

```json
{
  "mcpServers": {
    "productionGrid": {
      "command": "npx",
      "args": ["-y", "@productiongrid/mcp-client"],
      "env": {
        "PRODUCTIONGRID_AUTH_TOKEN": "YOUR_TOKEN_HERE"
      }
    }
  }
}
```

### 3. Restart Claude Desktop

Quit and restart Claude Desktop to load the new configuration.

## Environment Variables

- `PRODUCTIONGRID_AUTH_TOKEN` - OAuth token from the authentication page
- `PRODUCTIONGRID_API_KEY` - Alternative: API key from your ProductionGrid account
- `PRODUCTIONGRID_API_URL` - Optional: Custom API endpoint (defaults to production)
- `DEBUG` - Set to `true` to enable debug logging

## Features

Once connected, Claude can:
- Get your ProductionGrid profile
- Update profile information
- Create API keys for programmatic access
- Access production data (coming soon)

## Troubleshooting

### View Debug Logs
```bash
DEBUG=true npx @productiongrid/mcp-client
# Logs will be written to /tmp/productiongrid-mcp-debug.log
```

### Test Connection
```bash
echo '{"jsonrpc":"2.0","id":1,"method":"tools/list","params":{}}' | \
  PRODUCTIONGRID_AUTH_TOKEN="YOUR_TOKEN" npx @productiongrid/mcp-client
```

## Updates

This package is automatically updated when you run it with `npx`. No manual updates needed!

## Support

- Documentation: https://github.com/evanmcgillivray/production-grid/blob/main/MCP_QUICK_SETUP.md
- Issues: https://github.com/evanmcgillivray/production-grid/issues

## License

MIT
npm package: @productive-codebases/react-toolbox
Description: A set of React components and helpers for productive codebases.
Author: Productive Codebases
Latest version: 0.3.0

# React Toolbox

A set of React components and helpers for productive codebases.

## Installation

```
npm i @productive-codebases/react-toolbox --save
```

## Summary

React Toolbox is a compact library offering shared components and tools for React. It's customizable and extensible, enabling uniform setups across your projects.

## Getting started

### Create a new configuration

A configuration is an object that extends the [`IConfiguration`](https://github.com/productive-codebases/react-toolbox/blob/main/src/types/index.ts#L19-L29) interface.

Example:

```ts
import { createConfiguration } from '@productive-codebases/react-toolbox'

const appConfiguration = createConfiguration({
  loggerMapping: {
    AppSample: {
      components: 'components',
      stores: 'stores',
    }
  },
  theme: {
    color: {
      primary: 'blue',
      secondary: 'silver'
    },
    sizes: {
      small: '5px',
      default: '10px',
      large: '15px'
    }
  },
  roles: {
    'container/portal': 'container/portal',
    'container/modal': 'container/modal'
  },
  portalNames: {
    leftNavigation: 'leftNavigation',
    rightSideBar: 'rightSideBar'
  }
})
```

Create the toolbox:

```ts
export const toolbox = createToolbox('app', appConfiguration)
```

That's it! You have now your toolbox exposing various components, hooks and functions bounded to the configuration parameters.

Usage example:

![Autocomplete](./documentation/static/example_autocomplete1.png)

### Destructure for easier imports

To enhance import clarity, you can destructure the toolbox into named exports.

```ts
// myapp/libs/reactToolbox.ts

export const {
  components: {
    ProviderNamedContext: ProviderApp,
    ContainerFlex,
    Portal,
    PortalPlaceHolder
  },
  hooks: {
    useNamedContext: useAppContext,
    useLogger: useAppLogger,
    useTheme: useAppTheme
  },
  helpers: {
    getDataTestAttributeProp: getAppDataTestAttributeProp,
    getDataTestAttributeValue: getAppDataTestAttributeValue
  }
} = createToolbox('app', appConfiguration)
```

And just import as it:

```ts
import { useAppTheme } from '@/myapp/libs/reactToolbox'
```

Usage example:

![Autocomplete](./documentation/static/example_autocomplete2.png)

## Toolbox exports

### Components

#### ProviderNameContext

WIP

#### ContainerFlex

WIP

#### PortalPlaceHolder

WIP

#### Portal

WIP

### Hooks

#### useNamedContext

WIP

#### useLogger

WIP

#### useTheme

WIP

### Helpers

#### getDataTestAttributeValue

WIP

#### getDataTestAttributeProp

WIP