open-index/open-npm huggingface dataset:
npm package: @halvaradop/ui-toggle
Description: A customizable Toggle component for @halvaradop/ui library with Tailwind CSS styling.
Author: Hernan Alvarado
Latest version: 1.0.0

# @halvaradop/ui-toggle

`@halvaradop/ui-toggle` is an accessible, reusable, and customizable `Toggle` component from the `@halvaradop/ui` React library. Built with React and styled using TailwindCSS v4, it provides pre-styled components to accelerate UI development.

## Installation

```bash
npm install @halvaradop/ui-toggle
yarn add @halvaradop/ui-toggle
pnpm add @halvaradop/ui-toggle
```

## Usage

The `Toggle` component offers three additional props for customization: `variant`, `size`, `checked` and `disabled`. Import the `Toggle` component as shown below:

```tsx
import { Toggle } from "@halvaradop/ui-toggle"

export default function App() {
  return <Toggle checked={false} />
}
```

### Prop Reference

| Prop     | Values                   | Default |
| -------- | ------------------------ | ------- |
| variant  | "base"                   | base    |
| size     | "sm", "base", "md", "lg" | "base"  |
| checked  | true, false              | false   |
| disabled | true, false              | false   |

## Styling

The component supports TailwindCSS v4. To customize colors, use the following CSS variables. For the full theme, see [the theme file](https://github.com/halvaradop/ui/blob/master/tailwind.css).

```css
@import "tailwindcss";

@theme {
  --color-border: oklch(70% 0.02 260);
  --color-surface: oklch(98% 0 0);
  --color-success: oklch(75% 0.18 140);
  --color-disabled: oklch(92% 0 0);
}
```

### Dark Theme Support

The library currently supports only a dark theme. To enable it, update the CSS variables as follows:

```css
:is(html, body).dark {
  --color-border: oklch(35% 0.01 260);
  --color-success: oklch(70% 0.19 150);
  --color-surface: oklch(15% 0.005 260);
  --color-disabled: oklch(30% 0 0);
}
```
npm package: @halvbra/babel-preset-react-app
Description: Babel preset used by Create React App
Latest version: 3.1.5

# babel-preset-react-app

This package includes the Babel preset used by [Create React App](https://github.com/facebook/create-react-app).<br>
Please refer to its documentation:

* [Getting Started](https://github.com/facebook/create-react-app/blob/master/README.md#getting-started) – How to create a new app.
* [User Guide](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md) – How to develop apps bootstrapped with Create React App.

## Usage in Create React App Projects

The easiest way to use this configuration is with [Create React App](https://github.com/facebook/create-react-app), which includes it by default. **You don’t need to install it separately in Create React App projects.**

## Usage Outside of Create React App

If you want to use this Babel preset in a project not built with Create React App, you can install it with following steps.

First, [install Babel](https://babeljs.io/docs/setup/).

Then install babel-preset-react-app.

```sh
npm install babel-preset-react-app --save-dev
```

Then create a file named `.babelrc` with following contents in the root folder of your project:

```js
{
  "presets": ["react-app"]
}
```

This preset uses the `useBuiltIns` option with [transform-object-rest-spread](http://babeljs.io/docs/plugins/transform-object-rest-spread/) and [transform-react-jsx](http://babeljs.io/docs/plugins/transform-react-jsx/), which assumes that `Object.assign` is available or polyfilled.

## Usage with TypeScript

To use this package with [`@babel/preset-typescript`](https://www.npmjs.com/package/@babel/preset-typescript), you need to disable `@babel/preset-flow` first.

You can achieve this by doing:

```
{
  "presets": [
    ["react-app", {
        "flow": false
    }],
    "@babel/typescript"
  ]
}
```
npm package: @halvbra/confusing-browser-globals
Description: A list of browser globals that are often used by mistake instead of local variables
Latest version: 1.0.2

# confusing-browser-globals

A curated list of browser globals that commonly cause confusion and are not recommended to use without an explicit `window.` qualifier.

## Motivation

Some global variables in browser are likely to be used by people without the intent of using them as globals, such as `status`, `name`, `event`, etc.

For example:

```js
handleClick() { // missing `event` argument
  this.setState({
  	text: event.target.value // uses the `event` global: oops!
  });
}
```

This package exports a list of globals that are often used by mistake. You can feed this list to a static analysis tool like ESLint to prevent their usage without an explicit `window.` qualifier.


## Installation

```
npm install --save confusing-browser-globals
```


## Usage

If you use Create React App, you don't need to configure anything, as this rule is already included in the default `eslint-config-react-app` preset.

If you maintain your own ESLint configuration, you can do this:

```js
var restrictedGlobals = require('confusing-browser-globals');

module.exports = {
  rules: {
    'no-restricted-globals': ['error'].concat(restrictedGlobals),
  }
};
```


## License

MIT
npm package: @halvbra/create-react-app
Description: Create React apps with no build configuration.
Latest version: 1.5.6

# create-react-app

This package includes the global command for [Create React App](https://github.com/facebook/create-react-app).<br>
Please refer to its documentation:

* [Getting Started](https://github.com/facebook/create-react-app/blob/master/README.md#getting-started) – How to create a new app.
* [User Guide](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md) – How to develop apps bootstrapped with Create React App.
npm package: @halvbra/react-scripts
Description: Configuration and scripts for Create React App.
Latest version: 1.3.9

# react-scripts

This package includes scripts and configuration used by [Create React App](https://github.com/facebook/create-react-app).<br>
Please refer to its documentation:

* [Getting Started](https://github.com/facebook/create-react-app/blob/master/README.md#getting-started) – How to create a new app.
* [User Guide](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md) – How to develop apps bootstrapped with Create React App.
npm package: @halysondev/woovi-nodejs-sdk
Description: Woovi NodeJS SDK
Latest version: 1.3.4

# Node SDK

The Node SDK is a toolkit created with the goal of easily integrating OpenPix services into your Node.js applications.

It allows you to create recurring subscriptions, charges, payment requests, webhooks, as well as manage other API data.

You can send custom requests using our client, which adds all necessary information, such as authentication details, and decodes responses in JSON format.

Using our integrated paginator, it's easy to create pagination for data listing. It's supported on all data listing endpoints.

The SDK is officially maintained by OpenPix and distributed via [Npm](https://www.npmjs.com/).

The code is hosted in a [GitHub repository](https://github.com/woovibr/woovi-nodejs-sdk).

Take a look at [how to use it](./docs/usage.md).
npm package: @ham-core/fast-dxcc
Description: Fast implementation for getting information about a callsign
Author: Jakob Kordež
Latest version: 2.36.0

# Fast DXCC

## Downloading the country database

Data about countries can be downloaded from either [Amateur Radio Country Files by AD1C](https://www.country-files.com/) or [Clublog](https://clublog.freshdesk.com/support/solutions/articles/54902-downloading-the-prefixes-and-exceptions-as-xml).

### Obtaining the AD1C country database

Download any `cty.dat` file from the [Country Files](https://www.country-files.com/) website. I recommend using the [Big CTY](https://www.country-files.com/big-cty/) file.
Instead of `cty.dat` you can also use the `cty.csv` file.

Parsing of `cty.dat` or `cty.csv` can be done with the script [`cty-parser.ts`](./scripts/cty-parser.ts).

`Note:` The `cty.dat` does not contain the `adif` DXCC number.

### Obtaining the Clublog prefix database `OBSOLETE`

Read how to obtain the Clublog prefix file [here](https://clublog.freshdesk.com/support/solutions/articles/54902-downloading-the-prefixes-and-exceptions-as-xml)

Parsing can be done with the script [`clublog-parser.ts`](./scripts/clublog-parser.ts).

## Updating the country database

1. Download the latest Big CTY (`cty.csv`) file from [Country Files](https://www.country-files.com/).
2. Run the script `cty-parser.ts` to parse the `cty.csv` file.
3. Run `npm version minor` to update the version number.
4. Run `pnpm build` to build the code.
5. Publish the new version to npm with `npm publish`.
npm package: @ham-js/cat
Description: Computer aided transceiver from JS, works in the browser and node.
Author: Phillip Kessels
Latest version: 0.0.1-beta3

<div align="center">
<a href="https://github.com/ham-js/cat">
<img src="https://raw.githubusercontent.com/ham-js/cat/main/docs/static/img/logo.png" alt="Logo" width="128" height="128" />
</a>

<h3 align="center">@ham-js/cat</h3>
<p align="center">
A JavaScript library for all things related to computer aided transceivers.

<a href="https://ham-js.github.io/cat/docs/getting-started"><strong>Explore the docs »</strong></a>
<br />
<a href="https://ham-js.github.io/cat/docs/playground">View Demo</a>
&middot;
<a href="https://github.com/ham-js/cat/issues/new?template=bug_report.md">Report Bug</a>
&middot;
<a href="https://github.com/ham-js/cat/issues/new?template=feature_request.md">Request Feature</a>
</p>
</div>

![NPM Version](https://img.shields.io/npm/v/@ham-js/cat)
[![check](https://github.com/ham-js/cat/actions/workflows/check.yml/badge.svg?branch=main)](https://github.com/ham-js/cat/actions/workflows/check.yml)
[![codecov](https://codecov.io/gh/ham-js/cat/graph/badge.svg?token=BE8UE67EF5)](https://codecov.io/gh/ham-js/cat)


# Getting Started

Check out the [docs](https://ham-js.github.io/cat/docs/getting-started)!

# Features

* *interface* transceivers, antennas and other devices (coming soon or roll your own!)
* send commands via *drivers* that you decide what they actually are (e.g. can be a COM port, a websocket for remote stations or something else)
* send commands via *webserial* (possibly a driver on the host necessary) or our *webusb drivers* (no driver on the host necessary)
* (mostly) *platform-agnostic* - use anywhere!

# Contributing

Please refer to [the contributing guide](https://ham-js.github.io/cat/docs/contributing) in order to understand how the library works.

# Contributors

<a href="https://github.com/ham-js/cat/graphs/contributors">
  <img src="https://contrib.rocks/image?repo=ham-js/cat" />
</a>

Made with [contrib.rocks](https://contrib.rocks).
npm package: @ham-zeal/react-zendesk
Description: A component enable Zendesk in your React application
Author: Shuying Lin
Latest version: 1.0.4

# @ham-zeal/react-zendesk

> A component simplifies Zendesk widget usage in your React application

## Introduction

This component applies to Zendesk Web Widget including contact form, live chat, talk, answer bot and help center. For more information on widget and API, please check [Zendesk official documentation](https://developer.zendesk.com/embeddables/docs/widget/introduction)

## Installation

```sh
yarn add @ham-zeal/react-zendesk
```

## Component Usage

```js
import React from "react";
import ReactDOM from "react-dom";
import { ZenDeskHandler, ZendeskAPI } from "@ham-zeal/react-zendesk";
const ZEN_DESK_KEY = "your zendesk embed key";

// Take the contact form as an example
// Let's customize our contact form appearance, launcher, and add pre-filled content
const settings = {
  color: {
    theme: "#000",
  },
  launcher: {
    chatLabel: {
      "en-US": "Need Help",
    },
  },
  contactForm: {
    fields: [
      { id: "description", prefill: { "*": "My pre-filled description" } },
    ],
  },
};

// Will render a german version of your widget
const App = () => {
  return (
    <ZenDeskHandler
      defer
      zen_desk_key={ZEN_DESK_KEY}
      zen_desk_settings={settings}
      onLoaded={() => ZendeskAPI("setLocale", "de")}
    />
  );
};

ReactDOM.render(<App />, document.getElementById("#app"));
```

## Zendesk API usage

```js
import { ZendeskAPI } from "@ham-zeal/react-zendesk";
...
// Set Zendesk widgets in German
ZendeskAPI("setLocale", "de");
...

```

## Resources

[Zendesk Widget Documentation](https://developer.zendesk.com/embeddables/docs/widget)

## License

MIT