open-index/open-npm huggingface dataset:
npm package: @info.nl/delegate
Description: Encapsulation module for @info.nl/delegator.
Author: Info.nl
Latest version: 0.1.0

# @info.nl/delegate [![npm version][npm-image]][npm-url]

> Encapsulation module for @info.nl/delegator.

## Installation

    npm i @info.nl/delegate

## License

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/delegate.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/delegate
npm package: @info.nl/delegator
Description: Generic delegator for user interaction events.
Author: Info.nl
Latest version: 0.0.1

# @info.nl/delegator [![npm version][npm-image]][npm-url]

> Generic delegator for user interaction events.

## Installation

    npm i @info.nl/delegator

## License

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/delegator.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/delegator
npm package: @info.nl/eslint-config
Description: Info.nl ESLint default configuration.
Author: Info.nl
Latest version: 0.3.0

# Info.nl ESLint default configuration [![npm version][npm-image]][npm-url]

> Info.nl ESLint default configuration

## Install

    $ npm i @info.nl/eslint-config

## Roadmap

This is a fairly opiniated starting point. 
Create issues and pull requests boldly, and with good arguments.

## License

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/eslint-config.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/eslint-config
npm package: @info.nl/eslint-config-berlin
Description: Info.nl#teamberlin ESLint default configuration
Author: Info.nl
Latest version: 0.2.1

# Info.nl#teamberlin ESLint default configuration [![npm version][npm-image]][npm-url]

> ESLint default configuration for Team Berlin @ info.nl.

## Install

    $ npm i @info.nl/eslint-config-berlin

## Roadmap

This is a fairly opiniated starting point. 
Create issues and pull requests boldly, and with good arguments.

## License

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/eslint-config-berlin.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/eslint-config-berlin
npm package: @info.nl/generator-fluxible
Description: Info.nl#teamberlin Fluxible app generator
Author: Info.nl
Latest version: 0.1.0

# @info.nl/generator-fluxible [![npm version][npm-image]][npm-url] [![build status][travis-image]][travis-url]

> Info.nl#teamberlin Fluxible app generator.

## Status

You're Feeling Lucky

## Installation

    npm i -g @info.nl/generator-fluxible

If you haven't done so yet, 
install the Yeoman CLI globally:

    npm i -g yo

NB: you don't need bower, gulp or grunt-cli for this generator.

## Usage

    mkdir fubar
    cd fubar
    yo @info.nl/fluxible

NB: with scoped packages you still omit the `generator-` 
prefix as you'd do with any other old generator.

## Environment variables

If the following environment variables are set, 
they are used as defaults:

    export INFONL_FULLNAME="Fred Fubar"
    export INFONL_EMAIL="fred@info.nl"

### But I'm not an Info.nl employee at all! How do I change those environment variable names?

You are probably trying to [fix the wrong problem](https://www.info.nl/en/working-at-info-nl/). :-)

## Help

- [generator reference](http://yeoman.io/authoring/index.html)
- the Yeoman `fs.copyTpl` method uses [EJS](http://ejs.co/)

## License

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/generator-fluxible.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/generator-fluxible
[travis-image]: https://img.shields.io/travis/teamberlin/generator-fluxible.svg?style=flat-square
[travis-url]: https://travis-ci.org/teamberlin/generator-fluxible
npm package: @info.nl/generator-npm
Description: Info.nl npm generator
Author: Info.nl
Latest version: 0.1.0

# @info.nl/generator-npm [![npm version][npm-image]][npm-url] [![build status][travis-image]][travis-url]

> Info.nl npm package generator.

## Status

You're Feeling Lucky

## Installation

    npm i -g @info.nl/generator-npm

If you haven't done so yet, 
install the Yeoman CLI globally:

    npm i -g yo

NB: you don't need bower, gulp or grunt-cli for this generator.

## Usage

    mkdir fubar
    cd fubar
    yo @info.nl/npm

NB: with scoped packages you still omit the `generator-` 
prefix as you'd do with any other old generator.

# Help

- [generator reference](http://yeoman.io/authoring/index.html)
- the Yeoman `fs.copyTpl` method uses [EJS](http://ejs.co/)

## License

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/generator-npm.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/generator-npm
[travis-image]: https://img.shields.io/travis/infonl/generator-npm.svg?style=flat-square
[travis-url]: https://travis-ci.org/infonl/generator-npm
npm package: @info.nl/node-app-distribute
Description: Info.nl#teamberlin distribution package for Node.js projects.
Author: Info.nl
Latest version: 0.0.2

# @info.nl/node-app-distribute [![npm version][npm-image]][npm-url]

> Info.nl#teamberlin distribution package for Node.js projects.

## Installation

    npm i @info.nl/node-distribute

## License

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/node-app-distribute.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/node-app-distribute
npm package: @info.nl/pattern-portfolio
Description: Info.nl front-end Pattern Portfolio generator.
Author: Info.nl
Latest version: 0.0.4

# @info.nl/pattern-portfolio [![npm version][npm-image]][npm-url]

> Info.nl front-end Pattern Portfolio generator.

## Status

[Cruft together](http://www.catb.org/jargon/html/C/cruft-together.html)

## Installation

    npm i @info.nl/pattern-portfolio

## License

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/pattern-portfolio.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/pattern-portfolio
npm package: @info.nl/react-google-tagmanager
Description: Google Tag Manager code strings for React server page templates.
Author: Info.nl
Latest version: 0.0.1

# react-google-tagmanager [![npm version][npm-image]][npm-url]

> Google Tag Manager code strings for React server page templates.

## Installation

    $ npm i @info.nl/react-google-tagmanager -S

## Usage

    import reactGoogleTagmanager from "react-google-tagmanager";

    class Html extends Component {
      render() {
        const tagmanager = reactGoogleTagmanager(
          process.env.GOOGLE_TAGMANAGER_ID, 
          'myLayer'
        );

        return (
          <html>
            ...
            <body>
              <noscript
                dangerouslySetInnerHTML={{__html: tagmanager.noscript}}
                ></noscript>
              <script
                dangerouslySetInnerHTML={{__html: tagmanager.script}}
                ></script>
              ...
            </body>
          </html>
        )
      }
    }

## License 

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/react-google-tagmanager.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/react-google-tagmanager
npm package: @info.nl/react-page
Description: Page component for React.
Author: Info.nl
Latest version: 0.0.6

# @info.nl/react-page [![npm version][npm-image]][npm-url]

> Page component for React.

## Installation

    npm i @info.nl/react-page

## License

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/react-page.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/react-page
npm package: @info.nl/react-progressive
Description: Progressive enhancement component for isomorphic React usage.
Author: Info.nl
Latest version: 0.0.1

# @info.nl/react-progressive [![npm version][npm-image]][npm-url]

> Progressive enhancement component for isomorphic React usage.

## Installation

    npm i @info.nl/react-progressive

## License

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/react-progressive.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/react-progressive
npm package: @info.nl/style-essentials
Description: Installable Less imports for CSS snippets and patterns.
Author: Info.nl
Latest version: 0.0.2

# style-essentials [![npm version][npm-image]][npm-url]

> Installable Less imports for CSS snippets and patterns.

## Contents

- clearfix
- normalite
- visuallyhidden

## Installation

    $ npm i @info.nl/style-essentials -S

## Usage

    @import "/node_modules/@info.nl/style-essentials/normalite";

NB: starting the import path with a slash plays nice with the 
Less plugin for JetBrains IDEs. This assumes that `process.cwd()`
is added to the 
[Less include paths](http://lesscss.org/usage/#command-line-usage-include-paths).

## License 

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/style-essentials.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/style-essentials
npm package: @info.nl/svg-symbol
Description: File system based SVG symbol 'sprite' generator.
Author: Info.nl
Latest version: 0.1.0

# @info.nl/svg-symbol [![npm version][npm-image]][npm-url]

> File system based SVG symbol 'sprite' generator.

## Installation

    $ npm install @info.nl/svg-symbol

## Configuration

`package.json` config options (defaults):

    {
        "config": {
            "@info.nl/svg-symbol": {
                "source": "./source/vector/symbol",
                "target": {
                    "image": "./public/image",
                    "style": "./source/style/include/svg-symbol"
                }
            }
        }
    }

### Example

Given the above default configuration, the following folder structure

- ./source/vector/symbol/
    - ./chart/
        - bar.svg
        - pie.svg
    - ./icon/
        - home.svg    
        - search.svg    

generates the files

- ./public/
    - ./image/
        - **./chart.svg**
            - contains two symbols with the `id`s
                - `chart-bar`
                - `chart-pie`
        - **./icon.svg**
            - contains two symbols with the `id`s
                - `icon-home`
                - `icon-search`

- ./source/style/svg-sprite/
    - **./chart.css**
        - contains two rulesets with the selectors
            - `.svg-chart-bar`
            - `.svg-chart-bar`
    - **./icon.css**
        - contains two rulesets with the selectors
            - `.svg-icon-home`
            - `.svg-icon-search`

## License

MIT

[npm-image]: https://img.shields.io/npm/v/@info.nl/svg-symbol.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/@info.nl/svg-symbol
npm package: @infobae/infobae-components
Description: **Welcome to infobae-components!**
Author: infobae
Latest version: 0.0.65

# INFOBAE Components

**Welcome to infobae-components!**

This repository provides a collection of React UI components ready to use in your pnpm projects.

## **Getting Started**

**1. Installation:**

```bash
pnpm add infobae-components
```

This command will install the `infobae-components` package and all of its peer dependencies in your local project's `node_modules` folder.

**2. Build:**

If you need to modify the source code of the components, you can rebuild them using the following command:

```bash
pnpm run build
```

This will generate a new `dist` folder with the compiled components.

## **Linking with a Local Project (DEVELOPMENT)**

There are two ways to link infobae-components to a local project using pnpm:

- **1. Using pnpm workspaces:**

  This is the recommended approach for projects using pnpm workspaces. Add `infobae-components` as a dependency to your root `package.json` file:

  ```json
  {
    "dependencies": {
      "infobae-components": "path/to/infobae-components"
    }
  }
  ```

  Then, run the following command to link the dependency:

  ```bash
  pnpm workspace infobae-components link
  ```

- **2. (RECOMMENDED) Directly Linking**

  In this folder package run:

  **Bash**

  ```bash
  pnpm link
  ```

  Then on your `project` folder run the next script

  **Bash**

  ```bash
  pnpm link infobae-components
  ```

> [!WARNING]  
> 💡 **DON’T FORGET to unlink the packages in the reverse order that you linked them**. 

> [!CAUTION]  
> ⚠️⚠️⚠️ [Duplicate React](https://legacy.reactjs.org/warnings/invalid-hook-call-warning.html#duplicate-react)  
>This problem can also come up when you use npm link or an equivalent. In that case, your bundler might “see” two Reacts — one in application folder and one in your library folder. Assuming myapp and mylib are sibling folders, one possible fix is to run npm link ../myapp/node_modules/react from mylib. This should make the library use the application’s React copy.

## **Usage**

Once linked, you can import the components directly into your React files:

**JavaScript**

```jsx
import { MyComponent } from 'infobae-components';

function MyPage() {
  return (
    <MyComponent>
      {/* ... content ... */}
    </MyComponent>
  );
}
```

For detailed information about each component, please refer to the individual component files or consider adding a dedicated documentation website.

## **Contributing**

We welcome your contributions to infobae-components! Please see the CONTRIBUTING.md file for more information.

## **License**

This project is licensed under the MIT License. See the LICENSE file for details.

- Credits

    [@vladimirjv](https://github.com/vladimirjv)

    [@yohatuco](https://github.com/yohatu14)

    [@alexbari](https://github.com/AlexBari)
npm package: @infobiotech/js-logger
Description: An helper static class to handle logging on JavaScript projects such as Node.js, React and React Native.
Author: Alessandro Raffa
Latest version: 1.7.1

# @infobiotech/js-logger

An helper static class to handle logging on JavaScript projects such as Node.js, React and React Native.

## Installation

```bash
yarn add @infobiotech/js-logger
```

Or

```bash
npm install @infobiotech/js-logger
```

## Basic usage

```javascript
import logger from '@infobiotech/js-logger';

// other imports...

// Initialize the logger with application-wide log level
logger.init({
  logLevel: logger.INFO,
});

// for each container, set the name and the log level
const logContainerName = 'App';
logger.setLogLevel(log.INFO, logContainerName);

logger.info(logContainerName, 'methodName', 'message', {
  // data keys to be logged
});
```
npm package: @infobip/n8n-nodes-infobip-api
Description: n8n nodes for Infobip API integration - send SMS & view delivery reports.
Author: Armin Imsirevic
Latest version: 0.2.1

# n8n-nodes-infobip-api

**⚠️ Beta Version**: This node is currently in beta. Features and APIs may change.

This is an n8n community node. It lets you use Infobip SMS API in your n8n workflows.

Infobip is a global cloud communications platform that enables businesses to send SMS messages, make voice calls, and engage with customers through various messaging channels.

[n8n](https://n8n.io/) is a [fair-code licensed](https://docs.n8n.io/reference/license/) workflow automation platform.

[Installation](#installation)  
[Operations](#operations)  
[Credentials](#credentials)  
[Compatibility](#compatibility)  
[Resources](#resources)  

## Installation

Follow the [installation guide](https://docs.n8n.io/integrations/community-nodes/installation/) in the n8n community nodes documentation.

You can install this node using:

```bash
npm install @infobip/n8n-nodes-infobip-api
```

## Operations

* **Send SMS**: Send SMS messages to recipients via the Infobip SMS API
* **View SMS Delivery Report**: Retrieve delivery reports for previously sent SMS messages

## Credentials

To use this node, you need an Infobip account and API credentials:

1. Sign up for an [Infobip account](https://www.infobip.com/)
2. Obtain your API key from the Infobip Developer Hub
3. In n8n, create new Infobip API credentials with:
   - **API Key**: Your Infobip API key
   - **Domain**: Your Infobip API domain (defaults to `https://api.infobip.com/`)

## Compatibility

This node requires:
- n8n version 1.0 or later
- Node.js version 20 or higher

## Resources

* [n8n community nodes documentation](https://docs.n8n.io/integrations/#community-nodes)
* [Infobip SMS API documentation](https://www.infobip.com/docs/api/channels/sms)
* [Infobip API authentication](https://www.infobip.com/docs/api#authentication)
npm package: @infobits/intl
Description: Internationalization data for countries, languages, currencies, and continents
Author: Infobits
Latest version: 1.3.0

# @infobits/intl

Internationalisatiegegevens voor landen, talen, valuta's en continenten met vertalingen en SVG-vlaggen.

## Installatie

```bash
npm install @infobits/intl
```

## Gebruik

### Landen

```typescript
import { countries, getCountryByAlpha2Code } from '@infobits/intl';

// Een land ophalen op code
const usa = getCountryByAlpha2Code('US');
console.log(usa?.name); // United States
console.log(usa?.alpha3Code); // USA
console.log(usa?.capital); // Washington, D.C.
console.log(usa?.callingCode); // 1

// Alle landen ophalen
console.log(countries.length); // 248

// Landen filteren
const europeanCountries = countries.filter(c => c.continent === 'europe');
```

### Talen

```typescript
import { languages, getLanguageByCode } from '@infobits/intl';

// Een taal ophalen op code
const english = getLanguageByCode('en');
console.log(english?.name); // English
console.log(english?.nativeName); // English

// Alle talen ophalen
console.log(languages.length); // 185
```

### Valuta's

```typescript
import { currencies, getCurrencyByCode } from '@infobits/intl';

// Een valuta ophalen op code
const usd = getCurrencyByCode('USD');
console.log(usd?.name); // US Dollar
console.log(usd?.symbol); // $

// Alle valuta's ophalen
console.log(currencies.length); // 179
```

### Continenten

```typescript
import { continents } from '@infobits/intl';

// Alle continenten ophalen
continents.forEach(c => {
  console.log(c.name, c.code);
});
```

### Vlaggen

```typescript
import { flags } from '@infobits/intl';

// SVG-vlagreeks ophalen
const usaFlag = flags['US'];

// Gebruiken in HTML
document.getElementById('flag').innerHTML = usaFlag;

// Gebruiken in React
function Flag({ code }: { code: string }) {
  return <div dangerouslySetInnerHTML={{ __html: flags[code] }} />;
}
```

### Vertalingen

```typescript
import {
  getCountryTranslation,
  getLanguageTranslation,
  getCurrencyTranslation
} from '@infobits/intl';

// Vertaalde landnaam ophalen
const countryName = getCountryTranslation('US', 'de'); // Vereinigte Staaten

// Vertaalde taalnaam ophalen
const languageName = getLanguageTranslation('en', 'es'); // Inglés

// Vertaalde valutanaam ophalen
const currencyName = getCurrencyTranslation('USD', 'fr'); // Dollar américain
```

## Functies

- 248 landen met ISO 3166-1-codes
- 185 talen met ISO 639-1-codes
- 179 valuta's met ISO 4217-codes
- 7 continenten
- SVG-landvlaggen (inline ingebed)
- Meertalige vertalingen
- Volledige TypeScript-ondersteuning

## Licentie

MIT
npm package: @infocentric/hateoas-parser
Description: Javascript parser for HATEOAS rest APIs
Author: Joel Poulin
Latest version: 1.0.0

# hateoas-parser
Javascript HATEOAS parser

![](badges/badge-lines.svg "Yes, indeed !")
![](badges/badge-branches.svg "Yes, indeed !")
![](badges/badge-functions.svg "Yes, indeed !")
![](badges/badge-statements.svg "Yes, indeed !")

### API

This library exposes 4 methods.

`getEndpoint(index, rel, params, version)`

Pick the "rel" endpoint from the "index" dictionary and resolve it with the provided "params" and "version". 

`parseLinks(result)`

Simple function to convert a raw HATEOAS index result to a more usable key-value Hash

`parseUrl(url, params)`

Does the same as getEndpoint() but with a URL without solving the index-rel-version puzzle before. parseUrl() is internally called by getEndpoint().

`getCleanEndpoint(index, rel)`

Format an endpoint by simply removing all optional or required paramaters in the querystring
npm package: @infochamp/gitlab-mcp-server
Description: GitLab MCP Server (Node.js/TypeScript)
Latest version: 0.0.5

# GitLab MCP Server (Node.js)

A Model Context Protocol (MCP) server for GitLab issue management, built with Node.js, TypeScript, and Express.js.

## Features

| Tool | Description |
|------|-------------|
| `upload_file` | Upload image/file to GitLab, returns markdown link |
| `create_issue` | Create new issue (supports images in description) |
| `get_issue` | Get issue details by IID |
| `update_issue` | Update issue title, description, labels, state |
| `list_issues` | List issues with filters (state, labels, search) |
| `add_comment` | Add comment to issue (supports images) |
| `search_issues` | Search issues across all projects |
| `get_issue_comments` | Get all comments for an issue (with attachment download) |
| `read_file` | Read a text file from local filesystem (Node.js only) |
| `read_media` | Read a binary file as base64 from local filesystem (Node.js only) |

## Requirements

- Node.js 18+
- GitLab Personal Access Token with `api` scope

## Installation

```bash
npm install
```

## Build

```bash
npm run build
```

## Configuration

Set environment variables:

```bash
export GITLAB_URL=https://gitlab.com          # or your self-hosted GitLab URL
export GITLAB_TOKEN=your-personal-access-token
export GITLAB_DEFAULT_PROJECT_ID=mygroup/myproject  # optional
```

## Run as STDIO Server

```bash
npm run start
# or after build:
node dist/index.js
```

## Claude Desktop Configuration

Add to your Claude Desktop config (`~/.config/claude/claude_desktop_config.json` on Linux/Mac or `%APPDATA%\Claude\claude_desktop_config.json` on Windows):

```json
{
  "mcpServers": {
    "gitlab-nodejs": {
      "command": "node",
      "args": ["/path/to/dist/index.js"],
      "env": {
        "GITLAB_URL": "https://gitlab.com",
        "GITLAB_TOKEN": "your-token-here",
        "GITLAB_DEFAULT_PROJECT_ID": "mygroup/myproject"
      }
    }
  }
}
```

## Testing

```bash
./start.sh
```

This will use MCP Inspector to test all tools.

## Development

### Project Structure

```
src/
├── index.ts              # Main entry point
├── tools/
│   └── gitlab.ts         # GitLab API client and tool implementations
└── config/               # Configuration files (future)
```

### Adding New Tools

1. Add methods in `src/tools/gitlab.ts`
2. Register the tool in `src/index.ts` in the `ListToolsRequestSchema` handler
3. Add the tool call handling in the `CallToolRequestSchema` handler

## Scripts

- `npm run build` - Compile TypeScript
- `npm run start` - Run compiled JavaScript
- `npm run dev` - Run with ts-node (development)
- `npm run test` - Run the test script

## License

MIT
npm package: @infodb/create-myts
Description: Scaffolding tool for TypeScript projects
Author: tamuto
Latest version: 0.3.0

# create-myts

Scaffolding tool for TypeScript projects - quickly create new TypeScript projects with pre-configured templates.

## Usage

With npm:

```bash
npm create @infodb/myts
```

With npx:

```bash
npx @infodb/create-myts
```

Then follow the prompts:

1. Enter your project name
2. Select a template (basic, cli, server, or library)
3. Choose whether to automatically install dependencies

## Available Templates

### basic
Minimal TypeScript setup with tsc compiler.

**Use case:** Simple TypeScript projects, learning, quick prototypes

**Includes:**
- TypeScript configuration
- Basic build scripts
- tsx for development

### cli
CLI application template with bin configuration.

**Use case:** Command-line tools and utilities

**Includes:**
- Executable bin file
- CLI argument parsing example
- Ready to publish as npm package with CLI command

### server
HTTP server template using Node.js built-in http module.

**Use case:** Simple web servers, REST APIs, microservices

**Includes:**
- Basic HTTP server
- Example routes
- JSON response handling

### library
TypeScript library template optimized for publishing.

**Use case:** Reusable libraries, npm packages

**Includes:**
- Declaration file generation
- Source maps
- Proper module exports configuration

## Project Structure

After creating a project, you'll get:

```
my-project/
  ├── src/
  │   └── index.ts (or server.ts for server template)
  ├── package.json
  ├── tsconfig.json
  └── .gitignore
```

## Commands in Generated Projects

All templates include these scripts:

- `npm run dev` - Run TypeScript directly with tsx
- `npm run build` - Compile TypeScript to JavaScript
- `npm start` - Run compiled JavaScript

## Requirements

- Node.js 18.0.0 or higher
- npm 7.0.0 or higher

## Development

To work on this package:

```bash
# Clone the repository
git clone <repo-url>
cd create-myts

# Install dependencies
npm install

# Build the CLI
npm run build

# Test locally
node bin/cli.js
```

## License

MIT
npm package: @infodb/uilib
Description: UI Library
Author: tamuto
Latest version: 0.5.4

# UI Library

UIライブラリのプロジェクトです。
`infodb-cli`を利用している場合には、以下の方法でUIライブラリが用意しているコンポーネントを利用できます。

```
import DataTable from 'github://tamuto/uilib/components/datarow/DataTable.js'

const MyApp = () => <DataTable />
```

# コンポーネント一覧

| カテゴリ | コンポーネント名                         | 説明                           |
| -------- | ---------------------------------------- | ------------------------------ |
| backdrop | Spinner                                  |                                |
| datarow  | [DataTable](./docs/datarow/DataTable.md) |                                |
|          | DataHeader                               |                                |
|          | DataRow                                  |                                |
|          | DataCell                                 |                                |
| form     | FormBar                                  |                                |
|          | [FormField](./docs/form/FormField.md)    | 入力フィールド用コンポーネント |
|          | Spacer                                   |                                |
| heads    | RoundHead                                |                                |
|          | UBGradHead                               |                                |
| misc     | ScrollTop                                |                                |
| unsplash | Unsplash                                 |                                |

# 内部ルール

## コンポーネントクラス名

* 各コンポーネントのクラス名は、`In4`のプリフィックスを持つ。
  * `In4FormField`など。
* MaterialUIのThemeProviderを使ってテーマ設定をすることも可能。

## カスタマイズ

* レスポンシブ向けブレークポイントの設定

```javascript
components: {
    In4UILibs: {
        breakpoint: '@media screen and (max-width: 768px)'
    }
}
```