open-index/open-npm huggingface dataset:
npm package: @radiomemory/ngx-lazy-el
Description: Angular 17+ compatible lazy loading library for custom elements
Author: Radio Memory
Latest version: 2.0.1

# ngx-lazy-el

[![npm version](https://badge.fury.io/js/%40juristr%2Fngx-lazy-el.svg)](https://badge.fury.io/js/%40juristr%2Fngx-lazy-el)

Easy lazy loading components 💪 by Angular Elements.

## How to use it


### Install Angular Elements on your project

This library depends on Angular Elements. You can install that via

```
$ ng add @angular/elements
```

### Install ngx-lazy-el

Install the library from npm.

```
$ npm install @radiomemory/ngx-lazy-el
```

or

```
$ yarn add @radiomemory/ngx-lazy-el
```

### Lazy load a component

#### 1) Configure the Module containing the lazy loaded component

First of all, expose the Angular Component that should be loaded via a `customElementComponent` property.

```
...
@NgModule({
  declarations: [HelloWorldComponent],
  ...
  exports: [HelloWorldComponent]
})
export class HelloWorldModule {
  customElementComponent: Type<any> = HelloWorldComponent;
}
```

#### 2) Define the lazy component map in your AppModule

Just like with the Angular Router, define the map of component selector and lazy module.

```
// app.module.ts
...
const lazyConfig = [
  {
    selector: 'app-hello-world',
    loadChildren: () =>
      import('./hello-world/hello-world.module').then(m => m.HelloWorldModule)
  }
];

@NgModule({
  ...
  imports: [
    ...
    NgxLazyElModule.forRoot(lazyConfig),
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}
```

#### 3) Use the lazy loaded Component

To use the lazy loaded component in another module, first of all register the `CUSTOM_ELEMENT_SCHEMA`.

```
import { ..., CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';

@NgModule({
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
  imports: [NgxLazyElModule]
  ...
})
export class SomeModule {}
```

That is needed because otherwise Angular won't recognize the tag as it is no more an Angular Component, but Custom Element. Also note that I import the `NgxLazyElModule` if you haven't already. Otherwise the `*ngxLazyEl` directive won't work.

Now you can just use the Custom Element by applying the `*ngxLazyEl` directive.

```
<app-hello-world *ngxLazyEl [person]="person"></app-hello-world>
```

If it is behind a `*ngIf` or other non-visible component, the `app-hello-world` will be lazy loaded on the fly.
npm package: @radioshack-libs/sdk
Description: 🛠 An SDK for building applications on top of RadioShack Swap.
Latest version: 0.1.6

# RadioShack SDK

Forked from the [Pancake SDK](https://github.com/pancakeswap/pancake-swap-sdk.git).

## Running tests

To run the tests, follow these steps. You must have at least node v10 and [yarn](https://yarnpkg.com/) installed.

First clone the repository:

```sh
git clone https://github.com/genesisincubator/radioshackdefi-alpaca-sdk.git
```

Install dependencies

```sh
yarn install
```
npm package: @radioshack-libs/uikit
Description: Set of UI components for radioshack projects
Latest version: 0.2.9

# Radioshack UIkit

[![Version](https://img.shields.io/npm/v/@radioshack-libs/uikit)](https://www.npmjs.com/package/@radioshack-libs/uikit) [![Size](https://img.shields.io/bundlephobia/min/@radioshack-libs/uikit)](https://www.npmjs.com/package/@radioshack-libs/uikit)

RadioShack UIkit is a set of React components and hooks used to build pages on RadioShack's apps. It also contains a theme file for dark and light mode.

## Install

`yarn add @radioshack-libs/uikit`

## Setup

### Theme

Before using RadioShack UIkit, you need to provide the theme file to styled-component.

```
import { ThemeProvider } from 'styled-components'
import { light, dark } from '@radioshack-libs/uikit'
...
<ThemeProvider theme={isDark}>...</ThemeProvider>
```

### Reset

A reset CSS is available as a global styled component.

```
import { ResetCSS } from '@radioshack-libs/uikit'
...
<ResetCSS />
```

### Types

This project is built with Typescript and export all the relevant types.
npm package: @radioshack/core
Description: Core contracts for the Radioshack protocol
Latest version: 1.0.1

# Radioshack

https://radioshack.com/

## Deployed Contracts

https://github.com/genesisincubator/switch-alpaca-core/contracts

## Docs

[Development](docs/DEVELOPMENT.md)

[Deployment](docs/DEPLOYMENT.md)

[History](docs/HISTORY.md)

## Security

[Security Policy](SECURITY.md)

## License

[MIT](LICENSE.txt)
npm package: @radioshack/sdk
Description: 🛠 An SDK for building applications on top of Radioshack.
Latest version: 1.0.0

# Radioshack SDK

In-depth documentation on this SDK is available at [uniswap.org](https://uniswap.org/docs/v2/SDK/getting-started/).

This modifies uniswap-sdk's UniswapV2Factory address. The new address for radioshack is  `0xC0AEe478e3658e2610c5F7A4A2E1777cE9e4f2Ac`.

## Running tests

To run the tests, follow these steps. You must have at least node v10 and [yarn](https://yarnpkg.com/) installed.

First clone the repository:

```sh
git clone https://github.com/genesisincubator/switch-alpaca-periphery.git
```

Move into the radioshack-sdk working directory

```sh
cd radioshack-sdk/
```

Install dependencies

```sh
yarn install
```

Run tests

```sh
yarn test
```

You should see output like the following:

```sh
yarn run v1.22.4
$ tsdx test
 PASS  test/constants.test.ts
 PASS  test/pair.test.ts
 PASS  test/fraction.test.ts
 PASS  test/miscellaneous.test.ts
 PASS  test/entities.test.ts
 PASS  test/trade.test.ts

Test Suites: 1 skipped, 6 passed, 6 of 7 total
Tests:       3 skipped, 82 passed, 85 total
Snapshots:   0 total
Time:        5.091s
Ran all test suites.
✨  Done in 6.61s.
```
npm package: @radioshackswap/sdk2
Description: 🛠 An SDK for building applications on top of RadioShack.
Latest version: 2.1.0

# RadioShack SDK
This repo contains tools for developing with [RadioShack](radioshack.org).

## Running
This project uses standard npm and yarn workflows.

Install dependencies

```sh
yarn
```

Compile
```sh
yarn build
```

Yarn is available to install [here](https://classic.yarnpkg.com/en/docs/install/#debian-stable) if you need it.

## Installation
This project is available as an npm package. Add to your project with `npm install @radioshackswap/sdk2`

# development flow

1. do `npm i` in sdk
2. do `npm run dev` which will watch for any files changes and recompiles files
3. do `yalc link "@radioshackswap/sdk2"` in the project where you want to use components

## Attribution
This code was adapted from this Uniswap repo: [uniswap-sdk](https://github.com/Uniswap/sdk).
npm package: @radisa/ethereum-multicall
Description: Multicall allows multiple smart contract constant function calls to be grouped into a single call and the results aggregated into a single result
Author: tu@orai.io
Latest version: 1.0.5

# ethereum-multicall

## Supports

The below networks are supported by default, and custom networks can be supported by providing your own instance of a deployed Multicall contract.

| Chain                 | Chain ID   |
| --------------------- | ---------- |
| Mainnet               | 1          |
| Ropsten               | 3          |
| Rinkeby               | 4          |
| Görli                 | 5          |
| Optimism              | 10         |
| Kovan                 | 42         |
| Matic                 | 137        |
| KovanOptimism         | 69         |
| xDai                  | 100        |
| xDaiTestnet           | 10200      |
| GoerliOptimism        | 420        |
| Arbitrum              | 42161      |
| RinkebyArbitrum       | 421611     |
| GoerliArbitrum        | 421613     |
| Mumbai                | 80001      |
| Sepolia               | 11155111   |
| AvalancheMainnet      | 43114      |
| AvalancheFuji         | 43113      |
| FantomTestnet         | 4002       |
| Fantom                | 250        |
| BSC                   | 56         |
| BSC_Testnet           | 97         |
| Moonbeam              | 1284       |
| Moonriver             | 1285       |
| MoonbaseAlphaTestnet  | 1287       |
| Harmony               | 1666600000 |
| Cronos                | 25         |
| Fuse                  | 122        |
| SongbirdCanaryNetwork | 19         |
| CostonTestnet         | 16         |
| Boba                  | 288        |
| Aurora                | 1313161554 |
| Astar                 | 592        |
| OKC                   | 66         |
| Heco                  | 128        |
| Metis                 | 1088       |
| RSK                   | 30         |
| RSKTestnet            | 31         |
| Evmos                 | 9001       |
| EvmosTestnet          | 9000       |
| Thundercore           | 108        |
| ThundercoreTestnet    | 18         |
| Oasis                 | 26863      |
| Celo                  | 42220      |
| Godwoken              | 71402      |
| GodwokenTestnet       | 71401      |
| Klatyn                | 8217       |
| Milkomeda             | 2001       |
| KCC                   | 321        |
| Etherlite             | 111        |
| Linea Testnet         | 59140      |
| Linea                 | 59144      |
| Scroll Alpha          | 534352     |
| zkSync Era            | 324        |
| zkSync Era Testnet    | 280        |
| Shibarium             | 109        |
| Mantle                | 5000       |
| Mantle Testnet        | 5001       |
| Base                  | 8453       |
| Base Testnet          | 84531      |
| PolygonZkEvm          | 1101       |
| PolygonZkEvmTestnet   | 1442       |
| Zora                  | 7777777    |
| Zora Testnet          | 999        |
| Kawaiiverse Mainnet   | 6886       |
| Tron Mainnet          | 728126428  |
npm package: @radish-la/fresco
Description: A React component libray for Ethereum
Author: Radish
Latest version: 0.0.0-alpha.3

<a href="https://gofres.co">
  <img alt="https://gofres.co" src="https://raw.githubusercontent.com/rabani-to/fresco/master/packages/fresco/banner.png" />
</a>

## What is Fresco?

Fresco is a [React](https://reactjs.org/) component libray for Ethereum.

- 🔥 Atomic web3 components for the web
- ✅ Easily customizable
- 🦄 Built on top of [wagmi](https://wagmi.sh)

> FunFact: The name comes from `fresh radish` or `rabanito fresco`. Just as the power Fresco brings to your UIs 🙌

## Quick start

Simply plug-in fresco to your existent [wagmi](https://wagmi.sh) project. It's as easy as:

```bash
npm i @radish-la/fresco
# or
pnpm i @radish-la/fresco
# or
yarn add @radish-la/fresco
```

## Documentation

For full documentation, visit [gofres.co](https://gofres.co).

## Try it out

You can see live components from our Storybook [fresco-storybook.vercel.app](https://fresco-storybook.vercel.app).

**NOTE:** Storybook is used for development. You can playground for ongoing releases. Stay in the loop! [Follow us on Twitter](https://twitter.com/radish_la) for updates and upcoming feataures.
npm package: @radish-la/world-auth
Description: Extending World Auth SDK for React
Author: Denny Portillo
Latest version: 0.0.1-alpha.19

# @radish-la/world-auth

The react library for Worldchain.

## Getting started

```sh
npm i @radish-la/world-auth jotai @worldcoin/minikit-js
```

## Setting up validator

When using world we need to check if the current session is valid.
Under the hood we use `verifySiweMessage` to verify if our stored session payload is a valid signed SIWE message.

We've added a small utility function to fasten this. Follow this steps:

1. Create a file at root level (along with layout.tsx) with the following:

```tsx
// session.tsx

"use server"

import { validateSession } from "@radish-la/world-auth/server"
export const validator = validateSession
```

2. Define the World Auth Provider

```tsx
// layout.tsx

import type { PropsWithChildren } from "react"
import { WorldAppProvider } from "@radish-la/world-auth"

import { validator } from "./session"

export default function RootLayout({ children }: PropsWithChildren) {
  return (
    <WorldAppProvider appName="YOUR_APP_NAME" withValidator={validator}>
      {children}
    </WorldAppProvider>
  )
}
```

**Done 🥳**. You're now ready to interact with the connected user and `signin/signout` the user too.

---

## Usage

```ts
import { useWorldAuth } from "@radish-la/world-auth"

const { user, isConnected, isMiniApp, isConnecting, signIn, signOut } =
  useWorldAuth()

// isConnected: `true` when user and session is injected to MiniKit
// isConnecting: `true` if login modal is open
// signIn: request access to user information for mini app
// signOut: clean up the connected session
// isMiniApp: `true` when MiniKit is available in the browser

// To consume the connected user info you can pick values from:
// user.walletAddress // User's worldchain address
// user.username // Worldchain username
// user.profilePictureUrl // Custom profile picture `undefined` by default
```

[🔍 See example next14 repo](https://github.com/rabani-to/world/blob/master/packages/template-next-14/app/layout.tsx#L55)
npm package: @radish-ui/core
Description: Headless react-admin wrappers and Tailwind utilities for radish-ui
Latest version: 0.1.0

# @radish-ui/core

[![npm](https://img.shields.io/npm/v/%40radish-ui%2Fcore?label=%40radish-ui%2Fcore)](https://www.npmjs.com/package/@radish-ui/core)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://github.com/saebyn/radish-ui/blob/main/LICENSE)

Headless [react-admin](https://marmelab.com/react-admin/) wrappers and Tailwind CSS utilities for [radish-ui](https://github.com/saebyn/radish-ui).

> [!WARNING]
> **Early development — not production-ready.**
> The API may change rapidly without notice and is not yet stable.

## Installation

```bash
pnpm add @radish-ui/core ra-core react react-dom tailwindcss
# or
npm install @radish-ui/core ra-core react react-dom tailwindcss
```

## What's included

### `cn()` utility

A `clsx` + `tailwind-merge` helper for conditionally joining Tailwind class names without conflicts:

```ts
import { cn } from "@radish-ui/core";

<div className={cn("px-4 py-2", isActive && "bg-primary-500", className)} />
```

### Admin, ListBase, and ra-core wrappers

Thin wrappers around `ra-core` primitives so you can import everything from one package:

```ts
import { Admin, ListBase, EditBase, CreateBase, ShowBase } from "@radish-ui/core";
import { useFieldValue } from "@radish-ui/core";
```

### Tailwind CSS preset (`@radish-ui/core/preset`)

A Tailwind preset that registers semantic color tokens. Registry components use these tokens so you can retheme everything by overriding one value in your config.

| Token     | Default palette | Purpose                                 |
| --------- | --------------- | --------------------------------------- |
| `primary` | indigo          | Brand / interactive color               |
| `neutral` | gray            | Borders, dividers, muted text           |
| `danger`  | red             | Destructive actions and error states    |
| `success` | green           | Positive states and confirmations       |
| `info`    | blue            | Informational states                    |
| `warning` | yellow          | Warning states                          |
| `canvas`  | gray + white    | Surface backgrounds (page, card, input) |

```ts
// tailwind.config.ts
import radishPreset from "@radish-ui/core/preset";
import colors from "tailwindcss/colors";

export default {
  presets: [radishPreset],
  content: ["./index.html", "./src/**/*.{ts,tsx}"],
  // Override the primary brand color for your project:
  theme: { extend: { colors: { primary: colors.violet } } },
};
```

## Learn more

- [radish-ui on GitHub](https://github.com/saebyn/radish-ui)
- [Documentation](https://saebyn.github.io/radish-ui/)
- [react-admin / ra-core](https://marmelab.com/react-admin/)
npm package: @radishio/tailwindcss-marker
Description: Tailwind CSS plugin to style list markers
Author: RadishIO
Latest version: 1.0.3

# tailwindcss-marker
Tailwind CSS plugin to style list and summary markers - [Download Link](https://www.npmjs.com/package/@radishio/tailwindcss-marker)

## Install
```sh
npm install @radishio/tailwindcss-marker
```

## Generated Classes
This plugin generates the following classes, for styling listitem `<li>` markers, as well as `<summary>` markers.

Based on the following configuration, the following classes are created.

```js
// tailwind.config.js
const colors = require('tailwindcss/colors')

module.exports = {
  theme: {
    colors: {
      brand: '#ed1c16' // Coca-Cola Brand
      ...
    }
  }
}
```

### List Markers

For uniform styling of all list items, `.list-marker-<colorname>` is used on a `<ul>` or `<ol>`.

```css
-- Example Brand
.list-marker-brand > ::marker {
    color: #ed1c16
}
```

```html
<!-- All markers are in the color as defined in the CSS. -->
<ul class="m-10 p-2 bg-gray-300 list-inside list-disc list-marker-brand">
  <li>This is a simple list example </li>
  <li>Yay!</li>
</ul>
```

### List Item Markers / Summary Markers

For styling individual `<li>` elements or `<summary>` elements, the use of the `.marker-<colorname>` class is provided.

```css
.marker-brand::-webkit-details-marker, .marker-brand::marker {
    color: #ed1c16
}
```

```html
<ul class="m-10 p-2 bg-gray-300 list-inside list-disc">
  <!-- Marker Color as defined in CSS -->
  <li class="marker-brand">This is a simple list example </li>
  <!-- Default Color -->
  <li>Yay!</li>
</ul>
```

```html
<details class="m-10">
  <summary class="marker-brand">How can i change the marker color?</summary>

  Add `.marker-brand` to the `<summary>`-element.
</details>
```
npm package: @radist2s/json2x
Description: Use your JSON data to generate models for various things
Author: David Konsumer
Latest version: 1.1.5

# json2x

[![Build Status](https://travis-ci.org/konsumer/json2x.svg?branch=master)](https://travis-ci.org/konsumer/json2x) [![Greenkeeper badge](https://badges.greenkeeper.io/konsumer/json2x.svg)](https://greenkeeper.io/)

Use your JSON data to generate models for various things.

I often have a bunch of JSON mock that I need to get models for some other system from. This is a framework to generate all of the following:

* GraphQL types
* protobuf messages
* JSONSchema

If you don't want the actual model of the children, based on your data, you can use other things like [graphql-type-json](https://github.com/taion/graphql-type-json) or whatever. The idea is here is that you actually want to define the model of your data, and it's reasonably structured.

It looks at as many examples as you give it and learns from multiple records, so if you have lots of mock, use it.

## installation

If you want to actually install it use this:

```
npm i -g json2x
```

You can also just do this, to run it without installing it globally:

```
npx json2x
```

## usage

```
json2x <command>

Commands:
  json2x graphql <MODEL> <FILES...>     Generate GraphQL types from your data
  json2x jsonschema <MODEL> <FILES...>  Generate JSONSchema from your data
  json2x proto <MODEL> <FILES...>       Generate protobuf message-definitions from your data

Options:
  -h, --help     Show help                                             [boolean]
  -v, --version  Show version number                                   [boolean]

Examples:
  json2x graphql -h     Get some help with the graphql command
  json2x jsonschema -h  Get some help with the jsonschema command
  json2x proto -h       Get some help with the proto command
```
npm package: @radiumfi-libs/uikit
Description: Set of UI components for pancake projects
Latest version: 0.10.10

# 🥞 Pancake UIkit

[![Version](https://img.shields.io/npm/v/@pancakeswap-libs/uikit)](https://www.npmjs.com/package/@pancakeswap-libs/uikit) [![Size](https://img.shields.io/bundlephobia/min/@pancakeswap-libs/uikit)](https://www.npmjs.com/package/@pancakeswap-libs/uikit)

Pancake UIkit is a set of React components and hooks used to build pages on Pancake's apps. It also contains a theme file for dark and light mode.

## Install

`yarn add @pancakeswap-libs/uikit`

## Setup

### Theme

Before using Pancake UIkit, you need to provide the theme file to styled-component.

```
import { ThemeProvider } from 'styled-components'
import { light, dark } from '@pancakeswap-libs/uikit'
...
<ThemeProvider theme={isDark}>...</ThemeProvider>
```

### Reset

A reset CSS is available as a global styled component.

```
import { ResetCSS } from '@pancakeswap-libs/uikit'
...
<ResetCSS />
```

### Types

This project is built with Typescript and export all the relevant types.

## How to use the UIkit

If you want to use components from the UIkit, check the [Storybook documentation](https://pancakeswap.github.io/pancake-uikit/)
npm package: @radix-ng/primitives
Description: > Radix-NG is an unofficial Angular port of [Radix UI](https://www.radix-ui.com/), > thus we share the same principal and vision when building primitives.
Latest version: 0.50.0

# Primitives

> Radix-NG is an unofficial Angular port of [Radix UI](https://www.radix-ui.com/),
> thus we share the same principal and vision when building primitives.

Radix Primitives is a low-level UI component library with a focus on accessibility,
customization and developer experience.

You can use these components either as the base layer of your design system, or adopt them incrementally.
npm package: @radix-ui/colors
Description: [![Radix Colors Logo](colors.png)](https://radix-ui.com/colors)
Latest version: 3.0.0

[![Radix Colors Logo](colors.png)](https://radix-ui.com/colors)

# Radix Colors

**A gorgeous, accessible color system.**

---

## Documentation

For full documentation, visit [radix-ui.com/colors/docs](https://radix-ui.com/colors/docs).

## Installation

`yarn add @radix-ui/colors`

## Authors

- Colm Tuite ([@colmtuite](https://twitter.com/colmtuite))
- Vlad Moroz ([@vladyslavmoroz](https://twitter.com/vladyslavmoroz))
npm package: @radix-ui/themes
Description: [![Radix Themes Logo](https://radix-ui.com/social/themes.png)](https://radix-ui.com/themes)
Latest version: 3.3.0

[![Radix Themes Logo](https://radix-ui.com/social/themes.png)](https://radix-ui.com/themes)

# Radix Themes

**An open-source component library optimized for fast development, easy maintenance, and accessibility.**

---

## Documentation

For full documentation, visit [radix-ui.com/themes/docs](https://radix-ui.com/themes/docs).

## Releases

For changelog, visit [radix-ui.com/themes/docs/overview/releases](https://radix-ui.com/themes/docs/overview/releases).

## Authors

- Benoît Grélard ([@benoitgrelard](https://twitter.com/benoitgrelard))
- Vlad Moroz ([@vladyslavmoroz](https://twitter.com/vladyslavmoroz))
- Andy Hook ([@Andy_Hook](https://twitter.com/Andy_Hook))
- Lucas Motta ([@elmotta](https://twitter.com/elmotta))

---

## Community

See our [contribution guidelines](../../.github/CONTRIBUTING.md) for information on local development and creating a pull request.

- [Github Discussions](https://github.com/radix-ui/themes/discussions) - Ask questions and get answers from other community members.
- [Discord](https://discord.com/invite/7Xb99uG) - To get involved with the Radix community, ask questions and share tips.
- [Twitter](https://twitter.com/radix_ui) - To receive updates, announcements, blog posts, and general Radix tips.

## License

Licensed under the MIT License, Copyright © 2023-present [WorkOS](https://workos.com).

See [LICENSE](./LICENSE) for more information.