open-index/open-npm huggingface dataset:
npm package: @jige-ui/unocss
Description: UnoCSS preset for jige-ui design system
Latest version: 0.4.0

# @jige-ui/unocss-preset

A comprehensive UnoCSS preset designed specifically for the jige-ui component library. This preset provides utility classes, component shortcuts, and design tokens that align with jige-ui's design system.

## Installation

```bash
npm install @jige-ui/unocss-preset
# or
pnpm add @jige-ui/unocss-preset
# or
yarn add @jige-ui/unocss-preset
```

## Usage

Add the preset to your UnoCSS configuration:

```typescript
// uno.config.ts
import { defineConfig } from "unocss";
import { presetJigeUI } from "@jige-ui/unocss-preset";

export default defineConfig({
  presets: [
    presetJigeUI({
      // Configuration options
    }),
  ],
});
```
npm package: @jiggag/react-native-highlight-updates
Description: react native highlight updates
Author: jiggag
Latest version: 0.0.1

## 목적
- 리렌더 되는 컴포넌트 강조
- 관련 테스트

## 시작
- `yarn add @jiggag/react-native-highlight-updates`

## 설명
| 이름       | 타입            | 설명               |
|----------|---------------|------------------|
| color    | string?       | 리렌더 상태 구분 테두리 색상 |
| children | ReactElement? | 테스트 대상           |


```tsx
import {WithHighlight} from '@jiggag/react-native-highlight-updates';

...

<WithHighlight>
  <TestComponent1 />
</WithHighlight>
<WithHighlight color="blue">
  <TestComponent2 />
</WithHighlight>
```
npm package: @jiggag/react-native-kakao-maps
Description: react native kakao map
Author: jiggag
Latest version: 0.0.12

## @jiggag/react-native-kakao-maps
<img src="example.png" width="420" />

```tsx
import { KakakoMapView } from '@jiggag/react-native-kakao-maps';

return (
  <KakaoMapView
    markerImageName="customImageName" // 옵션1
    markerImageUrl="https://github.com/jiggag/react-native-kakao-maps/blob/develop/example/custom_image.png?raw=true" // 옵션2
    markerList={[
        {
          lat: 37.59523,
          lng: 127.08600,
          markerName: 'marker'
        },
        {
          lat: 37.59523,
          lng: 127.08705,
          markerName: 'marker2'
        },
    ]}
    width={300}
    height={500}
    centerPoint={{
        lat: 37.59523,
        lng: 127.08600,
    }}
    onChange={(event) => {
      // event.nativeEvent
    }}
  />
);
```

## 시작하기
### 설치
`yarn add @jiggag/react-native-kakao-maps`

### 카카오 앱 키 설정
#### 안드로이드
- `./android/app/src/main/res/values/strings.xml`
- 
  ```sh
  <resources>
      ...
      <string name="kakao_app_key">KAKAO_APP_KEY</string>
  </resources>
  ```
#### iOS
- `./Info.plist`
- 
  ```xml
  <key>KAKAO_APP_KEY</key>
  <string>KAKAO_APP_KEY</string>
  ```

### 커스텀 마커 이미지 등록
1. 마커 이미지 URL `markerImageUrl` 옵션으로 설정하여 사용
2. 마커 이미지 등록 후 `markerImageName` 옵션으로 `{이미지}` 호출하여 사용
    ```
    - 안드로이드: ./android/app/src/main/res/drawable/{이미지}.png
    - iOS: xcode 프로젝트 폴더에 {이미지}.png 추가 + Copy items if needed
    ```

## [갑자기 문제가 생겼습니다](./TROUBLESHOOTING.md)
npm package: @jigglyjams/juice-sdk-v3
Description: 🧃 A JavaScript SDK for the [Juicebox V2 protocol](https://github.com/jbx-protocol/juice-contracts-v2).
Latest version: 3.2.2-alpha

# juice-sdk

🧃 A JavaScript SDK for the
[Juicebox V2 protocol](https://github.com/jbx-protocol/juice-contracts-v2).

> ⚠️ This library is experimental and we provide no guarantees. Use at your own
> risk.

## Overview

`juice-sdk` helps you interact with the Juicebox V2 contracts using JavaScript.

Supports your favorite dev environment:

- ✅ Node.js
- ✅ Typescript
- ✅ Webpack (supports tree-shaking)
- ✅ Rollup (supports tree-shaking)
- ✅ Vite (supports tree-shaking)

Check out the [examples](#examples) to get started 🚀.

## Installation

```bash
npm install juice-sdk
```

## Usage

1. Import the factory function for a Juicebox contract.

   ```js
   import { getJBDirectory } from 'juice-sdk';
   ```

1. Create a JsonRpcProvider. The example below uses the
   [ethers](https://docs.ethers.io/v5/) library.

   ```js
   import { JsonRpcProvider } from '@ethersproject/providers';
   // ...);
   const provider = new JsonRpcProvider(YOUR_GATEWAY_HOST_URL);
   ```

1. Call the factory function to get an instance of the ethers.js `Contract`.

   ```js
   const JBDirectory = getJBDirectory(provider);
   ```

1. Start interacting with the contract.

   ```js
   const const terminals = await JBDirectory.terminalsOf(projectId);
   ```

### Usage on Rinkeby

Juicebox is deployed on Ethererum mainnet and the Rinkeby testnet. To use the
Rinkeby contract addresses, set the `network` argument to `rinkeby` when loading
the given contract:

```js
const JBDirectory = getJBDirectory(provider, { network: 'rinkeby' });
```

### Examples

Inspect the `examples/` directory to learn how to use `juice-sdk` for your
project.

| Environment                    | Example                                                                                                          |
| ------------------------------ | ---------------------------------------------------------------------------------------------------------------- |
| node.js                        | [./examples/node](./examples/node)                                                                               |
| node.js with Typescript        | [./examples/typescript-node](./examples/typescript-node)                                                         |
| create-react-app (webpack)     | [./examples/create-react-app](./examples/create-react-app)                                                       |
| Vue                            | [./examples/vue](./examples/vue)                                                                                 |
| Svelte                         | [./examples/svelte](./examples/svelte)                                                                           |
| Vanilla JavaScript (with Vite) | [juice-tools/embed/project/balance](https://github.com/jbx-protocol/juice-tools/tree/main/embed/project/balance) |

## Development

- [Build process](./doc/build-process.md)