open-index/open-npm huggingface dataset:
npm package: @rog0x/mcp-network-tools
Description: Network diagnostics tools for AI agents via MCP
Latest version: 1.0.2

# mcp-network-tools

Network diagnostics tools for AI agents, exposed via the [Model Context Protocol (MCP)](https://modelcontextprotocol.io).

## Tools

| Tool | Description |
|------|-------------|
| `dns_lookup` | Resolve domains to DNS records (A, AAAA, MX, TXT, NS, CNAME, SOA). Reverse DNS. Propagation check across public DNS servers. |
| `ip_info` | Geolocation and network info for an IP address — country, city, ISP, ASN, coordinates. IPv4 and IPv6. |
| `ssl_check` | Inspect SSL/TLS certificates — validity, issuer, expiry, SANs, certificate chain, cipher, protocol. |
| `whois_lookup` | WHOIS data for a domain — registrar, creation/expiry dates, nameservers, status. |
| `http_ping` | Measure HTTP response time over N requests. Returns avg, min, max, p95 latency and success rate. |

## Setup

```bash
npm install
npm run build
```

## Usage with Claude Desktop

Add to your `claude_desktop_config.json`:

```json
{
  "mcpServers": {
    "network-tools": {
      "command": "node",
      "args": ["D:/products/mcp-servers/mcp-network-tools/dist/index.js"]
    }
  }
}
```

## Dependencies

- **@modelcontextprotocol/sdk** — MCP server framework
- **Node.js built-in modules** — `dns`, `tls`, `net`, `https`, `http` (no external runtime dependencies beyond MCP SDK)
- **ip-api.com** — free geolocation API (no API key required)

## Examples

### DNS Lookup
```
dns_lookup({ domain: "example.com", record_types: ["A", "MX"] })
```

### Reverse DNS
```
dns_lookup({ domain: "8.8.8.8", mode: "reverse" })
```

### DNS Propagation Check
```
dns_lookup({ domain: "example.com", mode: "propagation" })
```

### IP Info
```
ip_info({ ip: "1.1.1.1" })
```

### SSL Check
```
ssl_check({ host: "example.com" })
```

### WHOIS Lookup
```
whois_lookup({ domain: "example.com" })
```

### HTTP Ping
```
http_ping({ url: "https://example.com", count: 10 })
```

## License

MIT
npm package: @rog0x/mcp-npm-tools
Description: MCP server providing npm/Node.js package management tools for AI agents
Author: rog0x
Latest version: 1.0.1

# mcp-npm-tools

MCP server providing npm and Node.js package management tools for AI agents.

## Tools

### npm_search
Search the npm registry for packages by keyword. Returns name, description, version, weekly downloads, and last publish date.

### npm_package_info
Get detailed information about a specific npm package: all published versions, dependencies, maintainers, repository URL, license, unpacked size, npm quality/popularity/maintenance scores, and weekly download count.

### npm_dependency_audit
Analyze a `package.json` file to find outdated dependencies (compares pinned/range version against latest), deprecated packages, and known security vulnerabilities via the npm bulk advisory API.

### npm_bundle_size
Estimate the bundle size of an npm package using the Bundlephobia API. Returns minified size, gzipped size, dependency count, and tree-shaking support indicators.

### npm_compare_packages
Compare two or more packages side by side across multiple dimensions: weekly downloads, bundle size, number of runtime dependencies, last publish date, GitHub stars, and license.

## Setup

```bash
npm install
npm run build
```

## Usage with Claude Desktop

Add to your `claude_desktop_config.json`:

```json
{
  "mcpServers": {
    "npm-tools": {
      "command": "node",
      "args": ["D:/products/mcp-servers/mcp-npm-tools/dist/index.js"]
    }
  }
}
```

## Development

```bash
npm run build   # compile TypeScript
npm start       # run the server
```

## License

MIT
npm package: @rog0x/mcp-perf-tools
Description: Performance analysis tools for AI agents via MCP
Latest version: 1.0.2

# mcp-perf-tools

Performance analysis tools for AI agents, exposed via the [Model Context Protocol (MCP)](https://modelcontextprotocol.io/).

## Tools

### benchmark

Benchmark JavaScript code execution. Run a snippet N times and measure min/max/avg/median/p95/p99 latency and operations per second. Optionally compare two implementations side by side.

**Parameters:**
- `code` (string) — JavaScript code to benchmark
- `iterations` (number, default 1000) — Number of iterations
- `compareCode` (string, optional) — Second implementation to compare
- `labelA` / `labelB` (string) — Labels for comparison output

### memory_analyze

Analyze Node.js memory usage: heap used/total, RSS, external memory, and array buffers. Takes snapshots over time and uses linear regression to detect trends and potential memory leaks.

**Parameters:**
- `action` — `"snapshot"` | `"analyze"` | `"clear"`

### big_o_estimate

Estimate Big O complexity from empirical timing data. Fits measurements against O(1), O(log n), O(n), O(n log n), O(n^2), O(n^3), and O(2^n) using R-squared scoring. Includes an ASCII growth curve visualization.

**Parameters:**
- `inputSizes` (number[]) — Array of input sizes
- `executionTimesMs` (number[]) — Corresponding execution times in ms

### bundle_analyze

Analyze a JavaScript bundle file: raw size, gzip compressed estimate, detected module count, largest modules, and tree-shaking opportunities (side effects, duplicates).

**Parameters:**
- `filePath` (string) — Absolute path to the bundle file

### load_test

Simple HTTP load tester. Sends N requests at a given concurrency level and reports response time percentiles, error rate, throughput (req/sec), and status code distribution.

**Parameters:**
- `url` (string) — Target URL
- `totalRequests` (number, default 100) — Total requests to send
- `concurrency` (number, default 10) — Concurrent request count
- `method` (string, default "GET") — HTTP method
- `headers` (object, optional) — HTTP headers
- `body` (string, optional) — Request body
- `timeoutMs` (number, default 30000) — Request timeout

## Setup

```bash
npm install
npm run build
```

## Usage with Claude Desktop

Add to your `claude_desktop_config.json`:

```json
{
  "mcpServers": {
    "perf-tools": {
      "command": "node",
      "args": ["D:/products/mcp-servers/mcp-perf-tools/dist/index.js"]
    }
  }
}
```

## License

MIT
npm package: @rog0x/mcp-regex-tools
Description: Regex and text processing tools for AI agents via MCP
Author: rog0x
Latest version: 1.0.1

# mcp-regex-tools

Regex and text processing tools for AI agents via the Model Context Protocol (MCP).

## Tools

| Tool | Description |
|------|-------------|
| `regex_test` | Test a regex pattern against text. Returns all matches with indices, captured groups, and named groups. |
| `regex_replace` | Find and replace using regex with support for capture group references (`$1`, `$2`, `$&`, `$<name>`). |
| `regex_extract` | Extract all matches of a pattern from text as a structured array. Optionally return only a specific capture group. |
| `regex_explain` | Parse a regex pattern and return a human-readable explanation of each component and flag. |
| `text_transform` | Apply common text transformations: camelCase, snake_case, kebab-case, PascalCase, UPPER, lower, title case, reverse, trim, deduplicate lines, sort lines, remove blank lines, count words/chars/lines. Chain multiple transforms in one call. |

## Setup

```bash
npm install
npm run build
```

## Usage with Claude Desktop

Add this to your Claude Desktop config file:

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

```json
{
  "mcpServers": {
    "regex-tools": {
      "command": "node",
      "args": ["D:/products/mcp-servers/mcp-regex-tools/dist/index.js"]
    }
  }
}
```

## Usage with Claude Code

```bash
claude mcp add regex-tools node D:/products/mcp-servers/mcp-regex-tools/dist/index.js
```

Or add to your `.mcp.json`:

```json
{
  "mcpServers": {
    "regex-tools": {
      "command": "node",
      "args": ["D:/products/mcp-servers/mcp-regex-tools/dist/index.js"]
    }
  }
}
```

## Examples

### Test a regex

```
regex_test({ pattern: "(\\d{4})-(\\d{2})-(\\d{2})", text: "Today is 2026-03-19 and tomorrow is 2026-03-20" })
```

### Replace with capture groups

```
regex_replace({ pattern: "(\\w+)\\s(\\w+)", replacement: "$2 $1", text: "hello world" })
```

### Extract matches

```
regex_extract({ pattern: "[\\w.]+@[\\w.]+", text: "Contact us at info@example.com or support@example.com" })
```

### Explain a regex

```
regex_explain({ pattern: "^(?:https?://)?(?:www\\.)?([\\w-]+)\\.\\w{2,}$", flags: "i" })
```

### Transform text

```
text_transform({ text: "hello world example", transforms: ["PascalCase"] })
text_transform({ text: "some text\nwith\nlines\nwith\nduplicates\nlines", transforms: ["deduplicate_lines", "sort_lines"] })
```

## License

MIT
npm package: @rog0x/mcp-schema-tools
Description: MCP server providing schema validation and generation tools for AI agents
Author: rog0x
Latest version: 1.0.1

# mcp-schema-tools

MCP server providing schema validation and generation tools for AI agents.

## Tools

### generate_json_schema
Generate a JSON Schema from sample JSON data. Infers types, required fields, formats (email, date, URI, UUID), and detects enum patterns from multiple examples.

### generate_typescript
Generate TypeScript interfaces and types from JSON data or a JSON Schema. Handles nested objects, arrays, optional fields, enums, and union types.

### validate_schema
Validate data against a JSON Schema with detailed error messages including JSON path, expected type, actual value, and the violated constraint keyword.

### mock_from_schema
Generate realistic mock data from a JSON Schema. Smart field-name detection produces contextual values: email fields get valid emails, name fields get realistic names, phone fields get formatted numbers, etc.

### diff_schemas
Compare two JSON Schemas to find added, removed, and changed fields. Identifies type changes, constraint changes, and classifies each difference as breaking or non-breaking for backwards compatibility analysis.

## Setup

```bash
npm install
npm run build
```

## Usage with Claude Desktop

Add to your `claude_desktop_config.json`:

```json
{
  "mcpServers": {
    "schema-tools": {
      "command": "node",
      "args": ["path/to/mcp-schema-tools/dist/index.js"]
    }
  }
}
```

## License

MIT
npm package: @rog0x/mcp-string-tools
Description: Advanced string manipulation tools for AI agents via MCP
Latest version: 1.0.2

# @rog0x/mcp-string-tools

Advanced string manipulation tools for AI agents, served over the Model Context Protocol (MCP).

## Tools

### analyze_string
Analyze text to get detailed metrics:
- Character count (with and without spaces)
- Word, sentence, and paragraph counts
- Estimated reading time
- Flesch-Kincaid reading level score and grade
- Unique word count and most common words
- Longest word

### transform_string
Transform text with various operations:
- **remove_duplicate_lines** - Remove duplicate lines from text
- **remove_extra_whitespace** - Collapse extra whitespace and blank lines
- **extract_emails** - Extract all email addresses from text
- **extract_urls** - Extract all URLs from text
- **extract_phone_numbers** - Extract phone numbers from text
- **mask_sensitive_data** - Mask emails, phone numbers, and credit card numbers
- **truncate** - Truncate text with ellipsis at word boundaries
- **wrap_text** - Wrap text at a specified column width

### diff_strings
Compare two strings and see the differences:
- **character** mode - Character-by-character diff
- **word** mode - Word-by-word diff (default)
- **line** mode - Line-by-line diff
- Shows additions, deletions, and unchanged segments with positions

### render_template
Simple template engine:
- Replace `{{variables}}` with values from a JSON data object
- Conditionals: `{{#if var}}...{{#else}}...{{/if}}`
- Loops: `{{#each arr}}...{{this}}...{{@index}}...{{/each}}`
- Nested property access: `{{user.name}}`

### generate_slug
Generate URL-friendly slugs:
- Transliterates accented characters (e.g., `cafe` from `cafe`)
- Removes special characters
- Configurable separator (default: `-`)
- Optional max length with clean truncation
- Optional lowercase toggle

## Setup

```bash
npm install
npm run build
```

## Usage with Claude Desktop

Add to your `claude_desktop_config.json`:

```json
{
  "mcpServers": {
    "string-tools": {
      "command": "node",
      "args": ["D:/products/mcp-servers/mcp-string-tools/dist/index.js"]
    }
  }
}
```

## License

MIT
npm package: @rog0x/mcp-task-tools
Description: MCP server providing task and project management tools for AI agents
Author: rog0x
Latest version: 1.0.1

# mcp-task-tools

MCP server providing task and project management tools for AI agents.

## Tools

### todo_manager
In-memory task list management. Add, complete, update status, delete, and list tasks with filtering by status, priority, and tags. Data persists within the session.

### priority_sorter
Sort tasks using established prioritization frameworks:
- **Eisenhower Matrix** — categorize by urgent/important into four quadrants (Do First, Schedule, Delegate, Eliminate)
- **RICE Scoring** — rank by Reach, Impact, Confidence, and Effort
- **MoSCoW Method** — classify as Must Have, Should Have, Could Have, or Won't Have

### time_estimator
Estimate task duration using PERT methodology. Break work into subtasks, provide optimistic/realistic/pessimistic estimates, and get weighted expected time with configurable buffer.

### standup_generator
Generate daily standup updates from the current task list. Outputs yesterday (completed), today (in progress), and blockers with summary statistics.

### burndown_calculator
Calculate sprint burndown data. Given tasks with story points and sprint duration, computes ideal vs actual burndown, velocity metrics, and completion forecast.

## Setup

```bash
npm install
npm run build
```

## Usage with Claude Desktop

Add to your Claude Desktop config:

```json
{
  "mcpServers": {
    "task-tools": {
      "command": "node",
      "args": ["path/to/mcp-task-tools/dist/index.js"]
    }
  }
}
```

## License

MIT
npm package: @rog0x/mcp-time-tools
Description: Date, time, and timezone tools for AI agents via MCP
Latest version: 1.0.2

# mcp-time-tools

Date, time, and timezone tools for AI agents via the Model Context Protocol (MCP).

Built entirely with native JavaScript `Date` and `Intl` APIs -- no external date libraries required.

## Tools

### Timezone Converter
- **convert_timezone** -- Convert a date/time from one timezone to another
- **list_timezones** -- List common timezones with current UTC offsets
- **current_time_multi** -- Show current time in multiple timezones at once
- **time_difference** -- Calculate the time difference between two timezones

### Date Calculator
- **date_add_subtract** -- Add or subtract days, weeks, months, or years from a date
- **date_difference** -- Calculate the difference between two dates in various units
- **business_days** -- Count business days between dates or add business days to a date

### Cron Parser
- **parse_cron** -- Parse a cron expression into a human-readable description
- **cron_next_runs** -- Calculate the next N execution times for a cron expression
- **validate_cron** -- Validate a cron expression and explain any errors
- **generate_cron** -- Generate a cron expression from a human-readable description

### Timestamp Converter
- **timestamp_to_date** -- Convert Unix timestamp (seconds or milliseconds) to readable formats
- **date_to_timestamp** -- Convert a date/time string to Unix timestamps
- **current_timestamp** -- Get the current Unix timestamp and formatted date/time

### Duration Formatter
- **format_duration** -- Convert seconds to human-readable duration (e.g. 2h 30m 15s)
- **parse_duration** -- Parse a human-readable duration string to seconds
- **time_ago** -- Calculate relative time description (e.g. "5 minutes ago")
- **countdown** -- Calculate time remaining until a target date/time

## Setup

```bash
npm install
npm run build
```

## Usage with Claude Desktop

Add to your Claude Desktop configuration:

```json
{
  "mcpServers": {
    "time-tools": {
      "command": "node",
      "args": ["D:/products/mcp-servers/mcp-time-tools/dist/index.js"]
    }
  }
}
```

## Development

```bash
npm install
npm run build
npm start
```
npm package: @rog0x/mcp-web-tools
Description: MCP server providing web utilities for AI agents - screenshots, extraction, monitoring, search
Author: rog0x
Latest version: 1.0.1

# MCP Web Tools

A powerful MCP (Model Context Protocol) server that gives AI agents web superpowers. Extract content, search the web, monitor sites, and convert HTML to markdown — all through a clean tool interface.

## Tools

| Tool | Description |
|------|-------------|
| `web_extract` | Extract structured content from any URL (title, headings, paragraphs, links, images, metadata) |
| `web_search` | Search the web via DuckDuckGo — no API key needed |
| `web_monitor` | Check if a site is up, measure response time, get HTTP headers |
| `html_to_markdown` | Convert any URL or HTML to clean markdown |
| `web_multi_extract` | Extract content from multiple URLs in parallel |

## Installation

### For Claude Code

Add to your Claude Code MCP settings (`~/.claude/settings.json`):

```json
{
  "mcpServers": {
    "web-tools": {
      "command": "npx",
      "args": ["@rog0x/mcp-web-tools"]
    }
  }
}
```

### For Claude Desktop

Add to `claude_desktop_config.json`:

```json
{
  "mcpServers": {
    "web-tools": {
      "command": "npx",
      "args": ["@rog0x/mcp-web-tools"]
    }
  }
}
```

### Manual Installation

```bash
npm install -g @rog0x/mcp-web-tools
mcp-web-tools
```

## Usage Examples

### Extract content from a webpage
```
Use web_extract to get the main content from https://example.com
```

### Search the web
```
Use web_search to find "best TypeScript frameworks 2026"
```

### Monitor a website
```
Use web_monitor to check if https://api.example.com is responding
```

### Convert page to markdown
```
Use html_to_markdown to convert https://docs.example.com/guide to readable markdown
```

### Batch extraction
```
Use web_multi_extract to get content from these URLs: [url1, url2, url3]
```

## Features

- **No API keys required** — uses DuckDuckGo for search, direct HTTP for everything else
- **Fast** — parallel extraction, 15s timeout per request
- **Clean output** — strips scripts, styles, ads; extracts meaningful content
- **Lightweight** — minimal dependencies, no headless browser needed
- **Production-ready** — proper error handling, timeouts, input validation

## Requirements

- Node.js 18+

## License

MIT — rog0x
npm package: @rog0x/mcp-webhook-tools
Description: Webhook management and testing tools for AI agents via MCP
Latest version: 1.0.2

# mcp-webhook-tools

Webhook management and testing tools for AI agents, built on the [Model Context Protocol](https://modelcontextprotocol.io/).

## Tools

### webhook_send

Send a webhook payload to any URL with custom headers, body, and content-type. Supports automatic retry with exponential backoff and jitter. Returns detailed attempt records including status codes, timing, and errors.

### webhook_validate

Validate webhook signatures using HMAC-SHA256 or HMAC-SHA1. Includes built-in patterns for:

- **Stripe** — `t=TIMESTAMP,v1=SIGNATURE` format with timestamp tolerance
- **GitHub** — `sha256=SIGNATURE` or `sha1=SIGNATURE` format
- **Slack** — `v0=SIGNATURE` with `v0:timestamp:body` signing scheme

Uses timing-safe comparison to prevent timing attacks.

### webhook_generate_payload

Generate realistic webhook payloads for testing. Supported events:

| Service | Events                              |
| ------- | ----------------------------------- |
| Stripe  | `payment_intent.succeeded`          |
| GitHub  | `push`, `pull_request`              |
| Slack   | `message`                           |

Each payload includes randomized IDs, current timestamps, and suggested headers. Use the `overrides` parameter to customize specific fields.

### webhook_debug

Analyze a webhook request end-to-end:

- Parse and categorize headers (content-type, signature, timestamp, delivery ID, custom)
- Validate the request body (size, JSON validity, encoding)
- Auto-detect the provider (Stripe, GitHub, Slack)
- Verify the signature if a secret is provided
- Check timestamp freshness (default 300s threshold)
- Report all issues found

### webhook_retry_schedule

Calculate a retry schedule with exponential backoff. Shows each attempt's delay, cumulative elapsed time, and scheduled ISO timestamp. Configurable base delay, max delay cap, multiplier, and jitter.

## Setup

```bash
npm install
npm run build
```

## MCP Configuration

Add to your MCP client config:

```json
{
  "mcpServers": {
    "webhook-tools": {
      "command": "node",
      "args": ["path/to/mcp-webhook-tools/dist/index.js"]
    }
  }
}
```

## License

MIT
npm package: @rogal/addon-react-translate
Description: > An addon for storybook to change language in your stories along with react-translate with ease
Author: Gabriel García Seco
Latest version: 1.0.1

# Addon React-Translate [![NPM Version](https://img.shields.io/npm/v/@rogal/addon-react-translate.svg)](https://www.npmjs.com/package/@rogal/addon-react-translate) [![NPM Downloads](https://img.shields.io/npm/dm/@rogal/addon-react-translate.svg)](https://www.npmjs.com/package/addon-react-translate) [![Actions Status](https://github.com/gabrielseco/react-translate/workflows/build/badge.svg)](https://github.com/gabrielseco/addon-react-translate/actions) [![Actions Status](https://github.com/gabrielseco/addon-react-translate/workflows/ci/badge.svg)](https://github.com/gabrielseco/addon-react-translate/actions)

> An addon for storybook to change language in your stories along with react-translate with ease

## Install

```sh
npm install @rogal/addon-react-translate --save-dev
```

### Getting Started

In your **main.js**, in the **addons** array add

```js
{
  addons: [
    // other addons...

    "@rogal/addon-react-translate"
  ]
}

```

And then in your **preview.js**

```js
import { withReactTranslate } from '@rogal/addon-react-translate';

addDecorator(
  withReactTranslate({
    languages: ['en', 'es'],
    language: 'en',
    fallbackLng: 'en',
    translations: {
      en: {
        collection: collectionEN,
      },
      es: {
        collection: collectionES,
      }
    }
  })
);
```

And then you are good to go

## Features

- Change the language of your stories with a selectbox



## License

MIT
npm package: @rogal/async-render
Description: **async-render** gives you a component to show spinners after a timeout until suspense is ready
Author: Gabriel García Seco
Latest version: 1.0.0-beta.3

# async-render [![NPM Version](https://img.shields.io/npm/v/@rogal/async-render.svg)](https://www.npmjs.com/package/@rogal/async-render) [![NPM Downloads](https://img.shields.io/npm/dm/@rogal/async-render.svg)](https://www.npmjs.com/package/async-render)  [![Actions Status](https://github.com/gabrielseco/async-render/workflows/build/badge.svg)](https://github.com/gabrielseco/async-render/actions) [![Actions Status](https://github.com/gabrielseco/async-render/workflows/ci/badge.svg)](https://github.com/gabrielseco/async-render/actions) [![Coverage Status](https://coveralls.io/repos/github/gabrielseco/async-render/badge.svg?branch=master)](https://coveralls.io/github/gabrielseco/async-render?branch=master)

**async-render** gives you a component to show spinners after a timeout until suspense is ready

## Install

```sh
npm install @rogal/async-render --save
```

### Getting Started

In this example the h1 element will be shown after 2s

```js
import React from 'react'
import {
  AsyncRender
} from '@rogal/async-render';

const App = () => {
  return (
    <AsyncRender loading>
      <h1>hello</h1>
    </TranslateProvider>
  )
}

```

### How to increase the timeout

The timeout by default is 2000, so you can increase giving the prop timeout

```js
import React from 'react'
import {
  AsyncRender
} from '@rogal/async-render';

const App = () => {
  return (
    <AsyncRender loading timeout={4000}>
      <h1>hello</h1>
    </TranslateProvider>
  )
}
```

## Props

|            Name           |       Type        |      Default       |                                                          
| :-----------------------: | :---------------: | :----------------: | 
|       **`loading`**       |   `Boolean`       |   `none`    |
|       **`children`**      |   `React.Node`    |   `none`    |
|       **`timeout`**       |   `number`      |   `2000`    |







## How to contribute

You can install and have an enviroment ready for use with Storybook

```sh
  npm i
  npm start
```

## License

MIT
npm package: @rogal/classnames
Description: Apply classes conditionally and parse classes from css modules
Author: gabriel
Latest version: 1.0.3

# ClassNames [![NPM Version](https://img.shields.io/npm/v/@rogal/classnames.svg)](https://www.npmjs.com/package/@rogal/classnames) [![NPM Downloads](https://img.shields.io/npm/dm/@rogal/classnames.svg)](https://www.npmjs.com/package/classnames) [![Actions Status](https://github.com/gabrielseco/classnames/workflows/build/badge.svg)](https://github.com/gabrielseco/classnames/actions) [![Coverage Status](https://coveralls.io/repos/github/gabrielseco/classnames/badge.svg?branch=master)](https://coveralls.io/github/gabrielseco/classnames?branch=master)

> A small utility to get classnames for css-modules and apply classes conditionally in react

## Install

```sh
  npm i --save @rogal/classnames
```

### Implementation

When you import ClassNames you have to initialize them with the styles coming from CSS Modules.

Then you have a function with accepts a string or an object with keys and booleans

If you pass a string the function is going to search in the styles if the class exists

If you pass an object the function is going to search first if it exists in the styles, if not it understands that they are global classes and apply only the truthy values

## Usage

```js
import ClassNames from '@rogal/classnames'
```

```jsx
import ClassNames from '@rogal/classnames'
import styles from './styles'

const classNames = ClassNames(styles)

const Example = () => (
  <div
    className={classNames({
      example: true,
      hidden: false
    })}
  >
    <h1 className={classNames('example__title')}>hello world</h1>
    <h1 className={classNames('not_found_class_in_styles')}>not found class</h1>
  </div>
)
```

```html
<div class="example">
  <h1 class="example__title">hello world</h1>
  <h1 class>not found class</h1>
</div>
```
npm package: @rogal/custom-properties-to-json
Description: [![NPM Version](https://img.shields.io/npm/v/@rogal/custom-properties-to-json.svg)](https://www.npmjs.com/package/@rogal/custom-properties-to-json) [![NPM Downloads](https://img.shields.io/npm/dm/@rogal/custom-properties-to-json.svg)](https://www.npmjs.co
Latest version: 1.0.0-beta.1

# custom-properties-to-json

[![NPM Version](https://img.shields.io/npm/v/@rogal/custom-properties-to-json.svg)](https://www.npmjs.com/package/@rogal/custom-properties-to-json) [![NPM Downloads](https://img.shields.io/npm/dm/@rogal/custom-properties-to-json.svg)](https://www.npmjs.com/package/@rogal/custom-properties-to-json)[![Travis](https://travis-ci.org/gabrielseco/custom-properties-to-json.svg?branch=master)](https://travis-ci.org/gabrielseco/custom-properties-to-json) [![Coverage Status](https://coveralls.io/repos/github/gabrielseco/custom-properties-to-json/badge.svg?branch=master)](https://coveralls.io/github/gabrielseco/custom-properties-to-json?branch=master)

> Package that parses a css file with a :root pseudoselector with custom properties to a json object

## Use Cases

- Theme modes so you can change your themes based in custom properties in the fly

## Installation

```sh
$ npm install @rogal/custom-properties-to-json --save-dev
```

## Use

You'll need to create a css file with a :root pseudoselector

```css
:root {
  --primary-bg-color: blue;
  --color: #ffffff;
}
```

After creating the file create a task or execute the command

```sh
custom-properties-to-json input=src/styles/base-theme.css output=src/styles/variables/base-theme.json
```

This will create a json with the next structure

```json
[
  {
    "property": "--primary-bg-color",
    "value": "blue"
  },
  {
    "property": "--color",
    "value": "#ffffff"
  }
]
```
npm package: @rogal/http-client
Description: > An adapter to make http requests and abstract from fetching packages
Author: Gabriel García Seco
Latest version: 1.0.0

# Http Client [![NPM Version](https://img.shields.io/npm/v/@rogal/http-client.svg)](https://www.npmjs.com/package/@rogal/http-client) [![NPM Downloads](https://img.shields.io/npm/dm/@rogal/http-client.svg)](https://www.npmjs.com/package/http-client) [![Actions Status](https://github.com/gabrielseco/http-client/workflows/ci/badge.svg)](https://github.com/gabrielseco/http-client/actions) [![Actions Status](https://github.com/gabrielseco/http-client/workflows/build/badge.svg)](https://github.com/gabrielseco/http-client/actions) [![Coverage Status](https://coveralls.io/repos/github/gabrielseco/http-client/badge.svg?branch=master)](https://coveralls.io/github/gabrielseco/http-client?branch=master)

> An adapter to make http requests and abstract from fetching packages

## Install

```sh
npm install @rogal/http-client --save
```

### Getting Started

```js
  const httpClient = new HttpClient({
    baseUrl: 'http://localhost:3001',
  });

  httpClient.get('/todos').then(response => {
    console.log('response', response);
  }).catch(err => {
    console.log('err doing response')
  })

```

### Methods 

* httpClient.get
* httpClient.post
* httpClient.put
* httpClient.delete


### Interceptor

We offer you an interceptor so you can observe calls.

```js
HttpClientInterceptor().then(response => {
  // do something with the response
}).catch(err => {
  // do something with the error
}) ;
```


### How to contribute

You can install and have an enviroment ready for use with Storybook

```sh
  npm i
  npm start
```

## License

MIT
npm package: @rogal/react-translate
Description: > Easier i18n to be happier
Author: Gabriel García Seco
Latest version: 1.0.2

# React-Translate [![NPM Version](https://img.shields.io/npm/v/@rogal/react-translate.svg)](https://www.npmjs.com/package/@rogal/react-translate) [![NPM Downloads](https://img.shields.io/npm/dm/@rogal/react-translate.svg)](https://www.npmjs.com/package/react-translate) [![Actions Status](https://github.com/gabrielseco/react-translate/workflows/build/badge.svg)](https://github.com/gabrielseco/react-translate/actions) [![Coverage Status](https://coveralls.io/repos/github/gabrielseco/react-translate/badge.svg?branch=master)](https://coveralls.io/github/gabrielseco/react-translate?branch=master)

> Easier i18n to be happier

react-translate can prevent you going crazy about react interpolation

## Install

```sh
npm install @rogal/react-translate --save
```

### Getting Started

```js
import React from 'react'
import {
  TranslateProvider,
  useTranslate,
} from '@rogal/react-translate';

const Childen = () => {
  const {t} = useTranslate();
  return <p>{t('common:helloWorld')}</p>
}
const App = () => {
  const providerValue = {
    fallbackLng: 'en',
    languages: ['en', 'es'],
    translations: {
      en: {
        common: {
          helloWorld: 'Hello world'
        },
      },
      es: {
        common: {
          helloWorld: 'Hola Mundo'
        },
      }
    }
  };
  return (
    <TranslateProvider value={providerValue}>
      <Children />
    </TranslateProvider>
  )
}

```

### How to instance a i18nConfiguration so you can use it outside of react

You only need to import the i18nConfiguration and passed the next config

```js
import {i18nConfiguration} from '@rogal/react-translate';
import commonES from 'locales/es/common';
import commonEN from 'locales/en/common';

const i18next = i18nConfiguration({
  languages: ['es', 'en'],
    translations: {
      es: {
        common: commonES
      },
      en: {
        common: commonEN
      }
    },
    fallbackLng: 'en',
    language: 'en'
});

const translation = i18next.t('helloWorld');

```


### More examples

You can check the demo folder or run the storybook so you can see advanced used cases

### Components

- A TranslateProvider to pass configuration data to the context.
- useTranslate hook to use the t function in your code and translate jsonKeys to strings
- withTranslate HOC to support class components
- A Trans component to have a fallback when translating


### Features

- i18n languages supported such as English or Spanish.
- Easy to use for dev experience
- Works with SSR


### How to contribute

You can install and have an enviroment ready for use with Storybook

```sh
  npm i
  npm start
```

## License

MIT
npm package: @rogalski/state-manager
Description: This module allows distributed state management including before and after state change actions.
Author: Marcin Rogalski
Latest version: 1.0.0

# State Manager

This module allows distributed state management including before and after state change actions.

## Instalation

```typescript
npm i @rogalski/state-manager
```

## Usage

```typescript
import createStateManager from "@rogalski/state-manager"

/** first create state manager by adding multiple states */
const stateManager = createStateManager({
	stateA: {
		a: "a",
		b: "b",
		c: {
			d: 1,
			e: true
		}
	},
	stateB: {
		//...
	}
	//...
})

/** then get state controller */
const controllerA = stateManager.getController("stateA")


/** get state, set state, add actions before and after state change */
// returns copy of stateA
controllerA.getState()

// sets value of param a of stateA to 'c'
controllerA.setState({ a: "c" })

 // logs a message allways before stateA will be updated
controllerA.willUpdateState((newState, oldState) => { console.log("Updating stateA"})

 // logs a message allways after updating stateA
controllerA.didUpdateState((newState, oldState) => { console.log("stateA succesfully updated"})

/** delete controller and all its actions */
// this will destroy controller - actions defined by controller.willUpdateState() and controller.didUpdateState() will be removed from the registry. This is usefull f.e. when working with React - this function shold be called when a component that uses controller gets unmounted.
controllerA.destroy()
```