open-index/open-npm huggingface dataset:
npm package: @pinax/graph-networks-registry
Description: TypeScript types and helpers for The Graph Networks Registry
Author: Yaro Shkvorets
Latest version: 0.7.1

# The Graph Networks Registry Typescript Library

[![npm version](https://badge.fury.io/js/%40pinax%2Fgraph-networks-registry.svg)](https://www.npmjs.com/package/@pinax/graph-networks-registry) [![Documentation](https://img.shields.io/badge/docs-TypeDoc-blue)](https://pinax-network.github.io/graph-networks-libs/) [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)

TypeScript types and helpers for [The Graph Networks Registry](https://github.com/graphprotocol/networks-registry).

Documentation available [here](https://pinax-network.github.io/graph-networks-libs/).

## Installation

```bash
npm install @pinax/graph-networks-registry
```

## Usage

### Loading the Registry

```typescript
import { NetworksRegistry } from '@pinax/graph-networks-registry';

// Load from the latest compatible registry JSON at networks-registry.thegraph.com
const registry = await NetworksRegistry.fromLatestVersion();

// Load from specific version tag at networks-registry.thegraph.com
const registry = await NetworksRegistry.fromExactVersion('0.7.0');
const registry = await NetworksRegistry.fromExactVersion('0.7.x');

// Load from URL
const registry = await NetworksRegistry.fromUrl('https://networks-registry.thegraph.com/TheGraphNetworksRegistry.json');

// Load from local file
const registry = NetworksRegistry.fromFile('./TheGraphNetworksRegistry.json');

// Load from JSON string
const registry = NetworksRegistry.fromJson(jsonString);
```

### Working with Networks

```typescript
// Find network by graph ID (works with both network ID and alias)
const mainnet = registry.getNetworkByGraphId('mainnet');
if (mainnet) {
    console.log(mainnet.fullName); // "Ethereum Mainnet"
    console.log(mainnet.caip2Id); // "eip155:1"
}

// You can also use an alias with getNetworkByGraphId
const ethereum = registry.getNetworkByGraphId('eth');
if (ethereum) {
    console.log(ethereum.fullName); // "Ethereum Mainnet"
}

// Find network by CAIP-2 chain ID
const ethereumByChainId = registry.getNetworkByCaip2Id('eip155:1');
if (ethereumByChainId) {
    console.log(ethereumByChainId.fullName); // "Ethereum Mainnet"
    console.log(ethereumByChainId.id); // "mainnet"
}

// Invalid format will produce a warning and return undefined
const invalidNetwork = registry.getNetworkByCaip2Id('invalid-format');
// Warning: CAIP-2 Chain ID should be in the format '[namespace]:[reference]', e.g., 'eip155:1'

// Deprecated methods (will be removed in future versions)
// Find network by ID
// @deprecated Use getNetworkByGraphId instead
const mainnetById = registry.getNetworkById('mainnet');

// Find network by alias
// @deprecated Use getNetworkByGraphId instead
const mainnetByAlias = registry.getNetworkByAlias('eth');
```
npm package: @pinax/ui
Description: Pinax UI Library
Author: Dominic Fournier
Latest version: 1.2.0

# Pinax UI Library

<img src="./banner.png">

This is a library of React components that are used in the PINAX ecosystem. It's built on top of multiple frameworks & tools.

The goal of the library is to be strict in its design and implementation, while also being flexible enough to be used in a variety of projects. It leverages conventions from major UI libraries such as [MUI](https://mui.com/), while removing a lot of boilerplate and complexity. **Effectively trading off some flexibility for simplicity, while remaining familiar.**

## Quickstart

```bash
$ npm install @pinax/ui
```

```jsx
import React from "react";
import { Button } from "@pinax/ui";
import { BlogIcon } from "@pinax/ui/icons";

function handleClick() {
  console.log("Clicked!");
}

export default () => (
  <Button onClick={handleClick} startIcon={<BlogIcon />}>
    Click Me
  </Button>
);
```

## Components

- [x] `Accordion`
- [x] `Avatar`
- [x] `Backdrop`
- [x] `Badge`
- [x] `Button`
- [x] `Card`
- [x] `Checkbox`
- [x] `Chip`
- [x] `Code`
- [x] `CodeSnippet`
- [x] `Confetti`
- [x] `Container`
- [x] `Copyright`
- [x] `Divider`
- [x] `Dropdown`
- [ ] `Grid`
- [x] `Icon`
- [x] `Input`
- [x] `Link`
- [x] `Loading`
- [x] `Modal`
- [ ] `Pagination`
- [x] `Progress`
- [ ] `RadioGroup`
- [x] `Slider`
- [ ] `Snackbar`
- [x] `Switch`
- [x] `Table`
- [ ] `Tabs`
- [ ] `Tooltip`
- [ ] `User`

## Icons

- [x] `AnalyticsIcon`
- [x] `BillingIcon`
- [x] `BlogIcon`
- [x] `CaretDownIcon`
- [x] `CaretLeftIcon`
- [x] `CaretRightIcon`
- [x] `CaretUpIcon`
- [x] `CopyIcon`
- [x] `CoreIcon`
- [x] `DeleteIcon`
- [x] `DiscordIcon`
- [x] `DocsIcon`
- [x] `ExternalLinkIcon`
- [ ] `FirehoseIcon`
- [x] `FirstPageIcon`
- [x] `GatewayIcon`
- [x] `GithubIcon`
- [x] `GraphIcon`
- [x] `HamburgerIcon`
- [x] `HiddenIcon`
- [x] `InternalLinkIcon`
- [x] `LastPageIcon`
- [x] `LinkIcon`
- [x] `LinkedinIcon`
- [x] `MailIcon`
- [x] `NewIcon`
- [x] `NftIcon`
- [x] `PinaxIcon`
- [x] `RecentIcon`
- [ ] `SearchIcon`
- [x] `SortAscendingIcon`
- [x] `SortDescendingIcon`
- [x] `SortIcon`
- [x] `SubstreamsIcon`
- [x] `TimeseriesIcon`
- [x] `TokenIcon`
- [x] `TwitterIcon`
- [x] `UploadIcon`
- [x] `UserIcon`
- [x] `VideoIcon`
- [ ] `VisibleIcon`
- [x] `WebhookIcon`
- [x] `YoutubeIcon`

## Build

```bash
$ npm run build
```

## Storybook

```bash
$ storybook build
$ storybook dev -p 6006
```

## Testing

```bash
$ bun test
```