open-index/open-npm huggingface dataset:
npm package: @frugally3683/agent-loop-plugin
Description: Minimal Task Continuation Plugin - Automatically continues sessions when incomplete tasks remain
Author: OpenCode Community
Latest version: 6.0.0

# Task Continuation Plugin

Minimal task continuation plugin for OpenCode - automatically continues sessions when incomplete tasks remain.

## Overview

This plugin provides task continuation functionality:

1. **Task Continuation**: Automatically continues sessions when incomplete todos remain

**Perfect for:**

- Multi-step task execution with automatic continuation
- Long-running agent workflows
- Preventing premature session termination
- Ensuring all tasks in a todo list are completed

## Installation

```bash
npm install @frugally3683/agent-loop-plugin
```

## Usage

```typescript
import agentLoopPlugin from "@frugally3683/agent-loop-plugin"

export default agentLoopPlugin
```

## Configuration

The plugin can be configured with the following options:

```typescript
{
  countdownSeconds: 2,        // Seconds to wait before auto-continuation
  errorCooldownMs: 3000,      // Cooldown period after errors
  toastDurationMs: 900,       // Toast notification duration
  agent: "custom-agent",      // Agent name for continuation prompts
  model: "custom-model",      // Model name for continuation prompts
  logFilePath: "path/to/log", // Path to log file for debugging
}
```

## Features

- **Automatic Continuation**: Sessions automatically continue when incomplete tasks remain
- **User Message Handling**: Cancels pending continuations when users send new messages
- **Error Handling**: Graceful handling of session errors with cooldown periods
- **Recovery Support**: Sessions can be marked as recovering to pause auto-continuation

## API

### Plugin Export

```typescript
import { agentLoopPlugin, createTaskContinuation } from "@frugally3683/agent-loop-plugin"
```

### Task Continuation API

```typescript
const continuation = createTaskContinuation(input, options)

continuation.handler({ event }) // Handle session events
continuation.cleanup() // Cleanup resources
continuation.scheduleContinuation(sessionID) // Manually schedule continuation
continuation.markRecovering(sessionID) // Mark session as recovering
continuation.markRecoveryComplete(sessionID) // Mark recovery as complete
continuation.cancel(sessionID) // Cancel pending continuation
```

## License

MIT
npm package: @frugalwizard/abi2ts
Description: This is a code generator that takes the JSON produced by the solidity compiler and creates typescript code for interacting with the corresponding smart contracts
Author: Frugal-Wizard
Latest version: 0.9.1

# README

## What is this?

This is a code generator that takes the JSON produced by the solidity compiler and creates typescript code for interacting with the corresponding smart contracts.

The generated code requires the library [abi2ts-lib](https://github.com/Frugal-Wizard/abi2ts-lib) as a dependency to work.

Currently it depends on [ethers](https://github.com/ethers-io/ethers.js/) but eventually this dependency will be dropped (or at least that is the intention).

## What functionality does it provide?

* A class for each smart contract.
* A class method for each smart contract function (overloading not yet supported).
* Method arguments are mapped to appropriate javascript types.
* Additional methods for calling contract functions statically.
* Additional methods for estimating gas of a contract function.
* Additional methods for encoding or creating the transaction for a contract function.
* An Error class for each smart contract defined error.
* Throws the appropriate error on a static call if the error type is known at runtime.
* A class for each smart contract defined event.
* Transaction events are provided in their respective class if the event type is known at runtime.

## Should I use this?

Currently it's not to be considered stable.

Use at your own discretion and don't rely on its interface staying backward compatible.

## How do I use this?

```typescript
// builing the code

import { abi2ts } from '@frugalwizard/abi2ts';
import { readFileSync, writeFileSync } from 'fs';

writeFileSync('Contract.ts', abi2ts(readFileSync('Contract.json')));

// using the code

import { Contract, CustomError, CustomEvent } from './Contract';

(async () => {
    const deployedContract = await Contract.deploy(...args);

    const contract = Contract.at(deployedContract.address);

    try {
        const returnValue = await contract.staticCall.writeMethod(...args);
    } catch (error) {
        if (error instanceof CustomError) {
            // handle error
        }
    }

    const { events } = await contract.writeMethod(...args);
    for (const event of events) {
        if (event instanceof CustomEvent) {
            // handle event
        }
    }

    const returnValue = await contract.readMethod(...args);
})();
```
npm package: @frugalwizard/abi2ts-lib
Description: This is a library used by code generated by abi2ts
Author: Frugal-Wizard
Latest version: 0.9.0

# README

## What is this?

This is a library used by code generated by [abi2ts](https://github.com/Frugal-Wizard/abi2ts).

Basically, you need [abi2ts](https://github.com/Frugal-Wizard/abi2ts) as a devDependency to build the code, and this library as a normal dependency for the code to work.

## Should I use this?

Currently it's not to be considered stable.

Use at your own discretion and don't rely on its interface staying backward compatible.
npm package: @frugalwizard/addressbook
Description: This is a Solidity smart contract created for the purpose of storing an address using 40 bits instead of the required 160 bits
Author: Frugal-Wizard
Latest version: 1.7.0

# README

## What is this?

This is a Solidity smart contract created for the purpose of storing an address using 40 bits instead of the required 160 bits.

Instead of storing the address, users register on the address book which assigns their address an id, which another smart contract can use instead of the address.

Using an address book also has the beneficial side-effect of helping prevent the use of addresses that might not be under someone's control, for example it could help prevent sending funds to a wrongly typed address.

## Should I use this?

The Solidity source code might be used as is and is not expected to change.

The package also distributes javascript code generated using [abi2ts](https://github.com/Frugal-Wizard/abi2ts), which is not currently stable, so don't rely on it.

## How do I use this?

```solidity
import { IAddressBook } from "@frugalwizard/addressbook/contracts/interfaces/IAddressBook.sol";
import { AddressBookUtil } from "@frugalwizard/addressbook/contracts/utils/AddressBookUtil.sol";

contract CrudeExample {
    using AddressBookUtil for IAddressBook;

    error Unathorized();

    IAddressBook private immutable _addressBook;

    uint40 private ownerId;

    constructor(IAddressBook addressBook_) {
        _addressBook = addressBook_;
        // safeId will fail if address is not registered
        ownerId = addressBook_.safeId(msg.sender);
    }

    function transferOwner(address addr) external {
        if (_addressBook.addr(ownerId) != msg.sender) {
            revert Unathorized();
        }
        ownerId = _addressBook.safeId(addr);
    }

    function owner() external view returns (address) {
        return _addressBook.addr(ownerId);
    }
}
```
npm package: @frugalwizard/contract-test-helper
Description: This is a collection of helper functions and classes to help test Solidity smart contracts using mocha
Author: Frugal-Wizard
Latest version: 0.6.0

# README

## What is this?

This is a collection of helper functions and classes to help test Solidity smart contracts using [mocha](https://github.com/mochajs/mocha).

## What functionality does it provide?

* An ethereum provider stored in memory implemented using [ganache](https://github.com/trufflesuite/ganache).
* A framework for building reusable test scenarios.
* A set of utilities to generate test scenarios.

## Should I use this?

Currently it's not to be considered stable.

Use at your own discretion and don't rely on its interface staying backward compatible.

## How do I use this?

```solidity
contract Adder {
    uint256 private _value;

    function add(uint256 value_) external {
        _value += value_;
    }

    function value() external view returns (uint256) {
        return _value;
    }
}
```

```typescript
import { Adder } from './Adder';
import { SetupAction, createEthereumScenario, describeSetupActions, executeSetupActions, generatorChain, range } from '@frugalwizard/contract-test-helper';
import { expect } from 'chai';

function createAddAction({ value }: { value: bigint }): SetupAction<{ contract: Adder }> {
    return {
        description: `add ${value}`,
        async execute(ctx) {
            await ctx.contract.add(value);
        },
    };
}

function createAddScenario({ value, only, setupActions = [] }: {
    only?: boolean;
    value: bigint;
    setupActions?: SetupAction<{ contract: Adder }>[],
}) {
    return {
        value,
        ...createEthereumScenario({
            only,
            description: `add ${value}${describeSetupActions(setupActions)}`,
            async setup(ctx) {
                ctx.addContext('value', value);
                const contract = await Adder.deploy();
                await executeSetupActions(setupActions, { ...ctx, contract });
                return {
                    ...ctx,
                    contract,
                    execute: () => contract.add(value),
                };
            },
        })
    };
}

const scenarios = generatorChain(function*() {
    for (const value of range(1n, 3n)) {
        yield { value };
    }
}).then(function*(properties) {
    for (const value of range(1n, 3n)) {
        yield {
            ...properties,
            setupActions: [ createAddAction({ value }) ],
        };
    }
}).then(function*(properties) {
    yield createAddScenario(properties);
});

describe('Adder', () => {
    for (const scenario of scenarios) {
        scenario.describe(({ it }) => {
            it('should add the provided value', async (test) => {
                const prev = await test.contract.value();
                await test.execute();
                expect(await test.contract.value())
                    .to.be.equal(prev + scenario.value);
            });
        });
    }
});
```
npm package: @frugalwizard/random-async-utils
Description: This is compilation of random utilities related to Promise and async functions in javascript/typescript
Author: Frugal-Wizard
Latest version: 0.1.0

# README

## What is this?

This is compilation of random utilities related to `Promise` and `async` functions in javascript/typescript.

## Should I use this?

Currently it's not to be considered stable.

Use at your own discretion and don't rely on anything staying backward compatible.

## What utilities are included here?

TODO
npm package: @frugalwizard/random-iterable-utils
Description: This is compilation of random utilities for working with iterables in javascript/typescript
Author: Frugal-Wizard
Latest version: 0.1.0

# README

## What is this?

This is compilation of random utilities for working with iterables in javascript/typescript.

## Should I use this?

Currently it's not to be considered stable.

Use at your own discretion and don't rely on anything staying backward compatible.

## What utilities are included here?

TODO
npm package: @frugalwizard/random-react-utils
Description: Random React Utils
Author: Frugal-Wizard
Latest version: 0.2.0

# README

## What is this?

This is compilation of random utilities for building React apps.

## Should I use this?

Currently it's not to be considered stable.

Use at your own discretion and don't rely on anything staying backward compatible.

## What utilities are included here?

* [`abortable`](docs/abortable.md)

  > A wrapper for effects that use an `AbortSignal`.

* [`asynced`](docs/asynced.md)

  > A wrapper for async effects.

* [`Nested`](docs/Nested.md)

  > A component that handles nesting multiple no args components.

* [`nonexistent`](docs/nonexistent.md)

  > A symbol/type to mark state as non-existent.

* `noop`

  > An empty function. Useful when such a function is required and it being a stable value is preferable.

* [`onClickOutside`](docs/onClickOutside.md)

  > A helper for setting up listener to clicks that happen outside an element.

* [`pending`](docs/pending.md)

  > A symbol/type to mark state as pending.

* [`preventDefault`](docs/preventDefault.md)

  > A function that calls `preventDefault` on its first argument. Useful for some use cases with event handlers.

* [`pushState`](docs/pushState.md)

  > A function to push an url/state into navigation history. Also triggers the corresponding `popstate` event.

* [`useBoolean`](docs/useBoolean.md)

  > An `useState` alternative for boolean flags.

* [`useBooleanToggle`](docs/useBooleanToggle.md)

  > Another `useState` alternative for boolean flags.

* [`useCursor`](docs/useCursor.md)

  > A `useState` alternative for handling cursors over numerically indexed lists (e.g. pagination).

* [`useFunctionRef`](docs/useFunctionRef.md)

  > A mutable function reference. Useful when you need to keep a callback for later without keeping it as part of the component state.

* [`useLoadingFlag`](docs/useLoadingFlag.md)

  > A hook for dynamically keeping track of one or more `Promises` and providing a flag that indicates whether there are pending `Promises` or not.

* [`useLocation`](docs/useLocation.md)

  > Returns the current URL and causes the component to rerender when it changes. Useful to handle URL routing yourself.

* [`useMediaQuery`](docs/useMediaQuery.md)

  > Indicates whether the current viewport matches a media query and causes a rerender if the condition changes.

* [`useMutable`](docs/useMutable.md)

  > A hook for handling a mutable value. Useful for keeping track of data during the component lifecycle that does not need to be part of the component state.

* [`useResizeDetect`](docs/useResizeDetect.md)

  > A flag which indicates when the viewport is view resized.

* [`useSharedState`](docs/useSharedState.md)

  > A way for components to share state and/or prevent unnecessary rerenders and coupling between parent and child components.

* [`useSingleton`](docs/useSingleton.md)

  > An alternative to React's `useContext`.

* [`useUnmountSignal`](docs/useUnmountSignal.md)

  > An `AbortSignal` that triggers when the component unmounts. Useful for async callbacks that need to be aborted when the component unmounts.
npm package: @frugalwizard/random-typescript-utils
Description: This is compilation of random utilities that only make sense in typescript projects
Author: Frugal-Wizard
Latest version: 0.1.0

# README

## What is this?

This is compilation of random utilities that only make sense in typescript projects.

## Should I use this?

Currently it's not to be considered stable.

Use at your own discretion and don't rely on anything staying backward compatible.

## What utilities are included here?

TODO
npm package: @frugalwizard/solidity-compiler-wrapper
Description: This is a just a wrapper for solc-js meant to simplify its use in build tasks and provide some functionality usually expected when handling Solidity projects
Author: Frugal-Wizard
Latest version: 1.3.0

# README

## What is this?

This is a just a wrapper for [solc-js](https://github.com/ethereum/solc-js) meant to simplify its use in build tasks and provide some functionality usually expected when handling Solidity projects.

## What extra functionality does it provide?

* Handles importing Solidity files from node_modules.
* Strongly typed compilation results.

## Should I use this?

Currently it's not to be considered stable and it's pretty much ad-hoc code extracted from reused code in the building process of several Solidity projects.

So, use at your own discretion and don't rely on its interface staying backward compatible.

## How do I use this?

```typescript
import compileSolidity from '@frugal-wizard/solidity-compiler-wrapper';

const compiled = compileSolidity('path/to/contracts', 'Contract.sol', { optimizer: { enabled: true } });

// ethers

const contract = new ethers.Contract(address, compiled['Contract'].abi, signerOrProvider);

const contractFactory = ethers.ContractFactory.fromSolidity(compiled['Contract'], signer);

// web3

const contract = new web3.eth.Contract(compiled['Contract'].abi);

contract.deploy(compiled['Contract'].evm.bytecode.object);
```

## How do I use the CLI command?

```
wsolc <contractsDir>

compile solitidy files

Positionals:
  contractsDir  Contracts folder

Options:
  --help           Show help                                           [boolean]
  --version        Show version number                                 [boolean]
  --outputDir      Output folder                       [default: <contractsDir>]
  --saveInputJson  Save input JSON                                     [boolean]
  --optimize       Enable optimizer                                    [boolean]
  --prettyJson     Output prettified JSON                              [boolean]
  --viaIR          Change compilation pipeline to go through the Yul
                   intermediate representation                         [boolean]
  --evmVersion     Version of the EVM to compile for
       [choices: "homestead", "tangerineWhistle", "spuriousDragon", "byzantium",
        "constantinople", "petersburg", "istanbul", "berlin", "london", "paris",
                                                                     "shanghai"]
```
npm package: @frui.ts/bootstrap
Description: Bootstrap controls ready for Frui.ts integration
Author: Augustin Šulc
Latest version: 0.17.5

# `bootstrap`

Bootstrap controls ready for Frui.ts integration. Mainly input controls wrapped in `BindingComponent`.

## Input

```
TODO
```

## Select

- `items` - list of available values.
- `keyProperty` - name of the property in `items` that contain item's key. Default is `"id"`.
- `textProperty` - name of the property in `items` that contain item's label displayed in the dropdown control. Default is `"label"`.
- `mode` - specify if only the key or the whole selected entity should be set to the bound property. Default is `"item"`.
- `allowEmpty` - displays an empty item with `undefined` value.
- `isNumeric` - when in the `key` mode, keys are by default `string`. If you want to use numbers only, you need to enable this prop.

```
TODO
```

## Check

You can use all props as in [React Boostrap Check](https://react-bootstrap.github.io/components/forms/#forms-form-check), especially:

- `type` - specify type of the control: `"check" | "radio" | "switch"`
- `id` - unique identifier used to bind label with the actual `<input>` control

Moreover, the are the follofing additional props:

- `threeState` - if set to `true`, the control displays `indeterminate` state if the bound value is `null`
- `value` - this value is set to the bound property when the check is selected. Default set to `true` so that checkboxes by default.

```
TODO
```
npm package: @frui.ts/cra-template
Description: Frui.ts template for Create React App.
Author: Augustin Šulc
Latest version: 0.17.5

# @frui.ts/cra-template

This is the Frui.ts template for [Create React App](https://github.com/facebook/create-react-app).

To use this template, add `--template @frui.ts` when creating a new app.

For example:

```sh
npx create-react-app my-app --template @frui.ts

# or

yarn create react-app my-app --template @frui.ts
```

For more information, please refer to:

- [Getting Started](https://create-react-app.dev/docs/getting-started) – How to create a new app.
- [User Guide](https://create-react-app.dev) – How to develop apps bootstrapped with Create React App.
npm package: @frui.ts/data
Description: Helpers and interfaces for handling paged and sorted data sets
Author: Augustin Šulc
Latest version: 1.0.0-rc.4

# `@frui.ts/data`

Helpers and interfaces for handling paged and sorted data sets.

- [pagerHelper](./src/pagerHelper.ts)
- [sortingHelper](./src/sortingHelper.ts)
npm package: @frui.ts/dataviews
Description: View components for data display
Author: Augustin Šulc
Latest version: 1.0.0-rc.4

# `@frui.ts/dataViews`

View components for data display

`DataRepeater` - generic structure for rendering data in a grid format. It supports sorting by column and custom value formatters as well.

`DataTable` - similar to DataRepeater, but renders ordinary html `<table>` by default.

## Example

```tsx
// in your View
import { ColumnDefinition, DataTable } from "@frui.ts/dataviews";

const tableColumns: ColumnDefinition<MyEntity, MyContext>[] = [
  {
    title: "id",
    property: "id",
    valueFormatter: x => `(${x.value})`
  },
  {
    titleFactory: (context) => {context.localize("name")},
    property: "name",
    sortable: true,
  }
];

...

<DataTable items={vm.items} itemKey="id" columns={tableColumns} context={vm} />

```

You can check [ColumnDefinition](./src/dataTypes.ts) for more details.

## Styles

You can also use default CSS styles for table column headers supporting sorting:

```tsx
import "@frui.ts/dataviews/styles/sorting-header.scss";
```
npm package: @frui.ts/helpers
Description: Frui.ts helper functions
Author: Augustin Šulc
Latest version: 1.0.0-rc.4

# `@frui.ts/helpers`

Helper functions for various use cases.

## `@bound`

A function decorator that binds context of the function to the parent class. This is useful for direct use of the function as event handler `<Xxx onClick={vm.decoratedFunction} />` so that new anonymous functions are not allocated for each render (compare to `<Xxx onClick={() => vm.decoratedFunction()} />`).

### Usage

```ts
// in view model
class MyViewModel {
  @bound someAction() {
    // you can safely use 'this' here
  }
}

// in view
<button onClick={vm.someAction} />
```

## `createMap`

Helper function for easily creating Maps.

### Usage

```ts
const items = [
  { id: 1, name: "One" },
  { id: 2, name: "Two" },
  { id: 3, name: "Three" },
];

// map of items by key
const itemsById = createMap(items, x => x.id); // Map<number, { id, name }>

// map of values by key
const namesById = createMap(items, x => x.id, x => x.name); // Map<number, string>
```

## `nameof`

Syntactic sugar for creating strings that are also a key of a type.

### Usage

```ts
this.pagingFilter.sortColumn = nameof<User>("login"); // the same as ="login", but checked on compile time that the class 'User' actually has a 'login' field
```


## `ManualPromise`

TODO
npm package: @fruitdexx/uikit
Description: Set of UI components for pancake projects
Author: fruit
Latest version: 0.15.2

# 🥞 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: @fruits-chain/antd5-lowcode
Description: @fruits-chain/antd5-lowcode
Author: fusion-team
Latest version: 0.1.1

# @fruits-chain/antd5-lowcode

一个面向 PC 的业务组件库，基于Antd 5.x版本

## 调试
启动调试

```
npm run lowcode:dev             # 打开开发环境，运行所有组件
```

构建

```
npm run lowcode:build
```
npm package: @fruits-chain/bailu-lowcode
Description: @fruits-chain/bailu-lowcode
Author: fusion-team
Latest version: 0.1.0

# @fruits-chain/bailu-lowcode

一个面向 PC 的业务组件库

## 调试
启动调试

```
npm run lowcode:dev             # 打开开发环境，运行所有组件
```

构建

```
npm run lowcode:build
```
npm package: @fruits-chain/chushu-native
Description: react-native埋点项目
Latest version: 1.1.2

## Chushu ReactNative APP 埋点脚本

1. 错误信息的收集和上报
2. 设备信息的收集和上报
3. 路由信息的收集和上报

### 初始化埋点

1、使用该脚本需要在根节点使用【initTracking】初始化脚本实例。

示例：

```jsx
import { initTracking } from '@fruits-chain/chushu-native'

const App: React.FC = () => {
  // accessKey可以通过在埋点平台创建应用后获取
  // uploadUrl为埋点数据上传地址
  // pv是否记录页面方位记录 默认false
  initTracking({
    accesskey: '$2b$10$YNQRLqrAQLoIvDSl2pXAQ.1A7sPQykoglzQDmk9goMrpgl7XjXOYi',
    uploadUrl: 'http://192.168.10.84:4000/upload',
    pv: true,
  })
  return <div>测试</div>
}
```

2、收集和上报需要用户 id 作为分析依据，需在外部调用【trackingInstance.setUserHash】，获取 userId

示例：

```typescript
import { initTracking } from '@fruits-chain/chushu-native'

getUserInfo: async () => {
  const trackingInstance = initTracking()
  try {
    const res: Result<Partial<IUserInfo>> = await getLoginUserInfo()
    const userInfo = res.data
    trackingInstance.setUserHash(`${userInfo?.userId}`)
    set({ userInfo })
  } catch (error) {}
},
```

### 错误信息

1、其他错误信息收集已在内部集成，接口报错需在外部调用【trackingLink】

示例：

```typescript
// graphql接口
import { ApolloClient, HttpLink, concat } from '@apollo/client'
import { trackingLink } from 'app-tracker@fruits-chain/chushu-native'

export function createClient(httpUri?: string) {
  const httpLink = new HttpLink({})
  return {
    client: new ApolloClient({
      link: concat(trackingLink, httpLink),
    }),
  }
}

// restful接口
import { trackingInterceptors } from '@fruits-chain/chushu-native'
/**
 * 响应拦截器
 */
axios.interceptors.response.use(
  (response: AxiosResponse<RestfulResult | RestfulUploadResult>) => {
    trackingInterceptors(response)
  },
  error => {},
)
```

### 路由信息

路由信息的收集需要在路由配置处调用【trackingInstance.setRouteInfo】

示例：

```jsx
import { initTracking } from 'app-tracker'
import type { NavigationContainerRef } from '@react-navigation/native'
const navigationRef = useRef<NavigationContainerRef<ReactNavigation.RootParamList>>()
const trackingInstance = initTracking()

<NavigationContainer
  ref={navigationRef}
  onReady={() => {
    const rootState = navigationRef.current?.getRootState?.()
    trackingInstance.setRouteInfo(rootState)
  }}
  onStateChange={state => {
    trackingInstance.setRouteInfo(state)
  }}>
  <Stack.Navigator>
    <Stack.Screen
      name={route.name}
      component={route.component}
      options={{ ...defaultStackRouteOptions, ...route.options }}
    />
  </Stack.Navigator>
</NavigationContainer>
```
npm package: @fruits-chain/dashu-sop
Description: A component for sop
Author: changhuali
Latest version: 1.1.8

# sop

> SOP 业务公共组件, 内部对 SOP 表单、预览进行了封装

## 使用

```sh
yarn add @fruits-chain/dashu-sop @fruits-chain/dashu-upload
```

_请确保项目安装了上述包中`peerDependencies`列出的所有三方包，并仔细检查版本。_

## API

### Form

> SOP 表单组件

**使用**

```tsx | pure
import React from "react"
import { SopForm, useSopForm } from "@fruits-chain/dashu-sop"

const Demo = () => {
  const form = useSopForm()
  return (
    <SopForm
      loading={false}
      uuid={"uuid"}
      form={form}
      data={[]}
      title={"title"}
    />
  )
}
```

### Preview

> SOP 预览组件

**使用**

```tsx | pure
import React from "react"
import { SopPreview } from "@fruits-chain/dashu-sop"

const Demo = () => {
  return <SopPreview loading={false} data={[]} title={"title"} />
}
```

### useSopForm

> 创建`SopForm`组件的`form`属性实例，相较`xiaoshu`的`form`, 其多了一个属
> 性`strictValidation`, 其值为`bool`类型, 用来控制表单是否需要严格校验, 在调
> 用`form.validateFields`方法时, 用户应该手动设置该属性的值
npm package: @fruits-chain/dashu-sop-pro
Description: A higher abstracted component for sop
Author: changhuali
Latest version: 1.2.9

# sop-pro

> SOP 业务公共组件, 相比`@fruits-chain/dashu-sop`组件, 内部对 SOP 模板、答案、暂
> 存、等功能进行了封装, 并内置了 loading、error 等状态下的 UI

## 使用

```sh
yarn add @fruits-chain/dashu-sop-pro @fruits-chain/dashu-sop @fruits-chain/dashu-upload
```

_请确保项目安装了上述包中`peerDependencies`列出的所有三方包，并仔细检查版本。_

## API

### Form

> SOP 表单组件

**使用**

```tsx | pure
import React from "react"
import { Form, useSopRef } from "@fruits-chain/dashu-sop-pro"

const Demo = () => {
  const sopFormRef = useSopRef()
  return (
    <Form
      ref={sopFormRef}
      title={"每个模板的title"} // 可以为render函数
      uuid={"全局唯一id"} // 推荐由路由+业务id+操作类型组成
      businessId={"业务id"}
      sopIds={"SOP ID组成的数组"}
    />
  )
}
```

### Preview

> SOP 预览组件

**使用**

```tsx | pure
import React from "react"
import { Preview } from "@fruits-chain/dashu-sop-pro"

const Demo = () => {
  return (
    <Preview
      title={"每个模板的title"}
      businessId={"业务id"}
      sopIds={"SOP ID组成的数组"}
    />
  )
}
```

### useSopRef

> 创建`Form`组件的`ref`, 组件内部通过`ref`向外暴露了部分`API`

**form**

> `SopForm`表单`form`属性实例

**requestTempSave**

> 请求暂存, 返回一个`Promise<bool>`对象, 成功结果为`true`, 失败结果为`false`

**requestSave**

> 请求保存修改后的数据, 返回一个`Promise<bool>`对象, 成功结果为`true`, 失败结果
> 为`false`

**clear**

> 清除当前表单内后台上传存储的本地资源，比如当用户已经将数据同步到后端后，应该手
> 动调用此方法

**refresh**

> 刷新 SOP 模板及答案的数据

### usePreviewRef

**refresh**

> 刷新 SOP 模板及答案的数据
npm package: @fruits-chain/dashu-upload
Description: A component for upload
Author: changhuali
Latest version: 1.0.3

# upload

> 后台上传公共组件, 相比`@fruits-chain/react-native-upload`组件, 内部增加了后台
> 上传功能, 用户在上传图片时, 不需要等待上传完成即可退出操作界面, 下次进入该页面
> 时, 本地数据(上传中和上传完成的图片)会自动同步到组件内部

## 使用

```sh
yarn add @fruits-chain/dashu-upload
```

```tsx | pure
import React, { useEffect } from "react"
import { useBackUploadManager, init } from "@fruits-chain/dashu-upload"

const App = () => {
  // 获取run方法
  const { run } = useBackUploadManager((state) => ({
    run: state.run,
  }))

  // 注意: 需要用户决定init和run方法的调用时机, 下面仅作为示例
  useEffect(() => {
    // 初始化上传API, useBackUploadManager内部会执行此回调函数上传文件
    init(async (file) => {
      return await yourUploadAPI(file)
    })
    // 继续执行未完成的任务
    run()
  }, [run])

  return <YourAppContent />
}
```

_请确保项目安装了上述包中`peerDependencies`列出的所有三方包，并仔细检查版本。_

## API

### Upload

> 上传组件, 支持`@fruits-chain/react-native-upload`上传组件的所有属性配置, 但是
> 目前仅支持作为`受控组件`使用

**使用**

```tsx | pure
import React from "react"
import Upload from "@fruits-chain/dashu-upload"

const Demo = () => {
  return <Upload groupUuid={"所属分组唯一id"} uuid={"当前上传组件的唯一id"} />
}
```

> 为什么会有`组`的概念, 主要是方便内部做资源管理, 比如按`组`清除缓存等

> uuid 的作用, 组件内部在同步缓存的数据到组件状态时, 需要通
> 过`groupUuid`和`uuid`对资源进行匹配

### init

> 初始化后台上传, 其参数为执行上传 API 的回调函数

使用

```tsx | pure
import { init } from "@fruits-chain/dashu-upload"

init(async (file) => {
  return await yourUploadAPI(file)
})
```

### useBackUploadManager

> 一个`zustand` store, 内部负责整个后台上传的调度, 也暴露了诸
> 如`run`、`setFinishedTask`、`clear`等方法供外部使用

_由于`useBackUploadManager`是一个`React hook`, 所以他只能在组件内部使用_

#### run

> 开始处理未完成的任务

使用

```tsx | pure
const { run } = useBackUploadManager((state) => ({
  run: state.run,
}))

run()
```

#### setFinishedTask

> 清理已完成的任务

使用

```tsx | pure
const { setFinishedTask } = useBackUploadManager((state) => ({
  setFinishedTask: state.setFinishedTask,
}))

// 清除某个组已完成的任务
setFinishedTask(groupUuid)
// 清除某个组下某个上传组件已完成的任务
setFinishedTask(groupUuid, uploadUuid)
```

#### clear

> 清理所有任务

使用

```tsx | pure
const { clear } = useBackUploadManager((state) => ({
  clear: state.clear,
}))

clear()
```
npm package: @fruits-chain/export-2json-asset-webpack-plugin
Description: A plugin to generate a json asset with your exported value
Author: changhuali
Latest version: 1.0.1

# @fruits-chain/export-2json-asset-webpack-plugin

A plugin to generate a json asset with your default exported value.

## Install

```shell
# NPM
npm install --save-dev @fruits-chain/export-2json-asset-webpack-plugin
# Yarn
yarn add -D @fruits-chain/export-2json-asset-webpack-plugin
```

## Examples

If you have the following file and webpack configuration

src/user.js

```js
const name = 'Bob'
const age = 21
export default {
  name,
  age,
}
```

webpack.config.js

```js
{
  plugins: [
    new Export2jsonAssetWebpackPlugin({
      entryPath: path.resolve(__dirname, 'src/user.js'),
      outputPath: 'user.json',
    }),
  ]
}
```

After the compilation, you'll get an asset named user.json, which contains the following contents

```json
{
  "name": "Bob",
  "age": 21
}
```

## Options

- `options.entryPath: string`

  An absolute path, the file in this path will be bundled and run in Node.js.

- `options.outputPath: string`

  A path relative to your webpack output dir, the file in this path will contain the value been exported by default in entry file.

## Notice

- Be sure that your code in `entryPath` is runnable in Node.js, if not, you'll get an error in compilation phase.
- Only the value exported by default will appear in the asset file.
npm package: @fruits-chain/graphql-usage-statistics-webpack-plugin
Description: A plugin to collect graphql api usage info by your route config
Author: changhuali
Latest version: 0.0.1

# @fruits-chain/graphql-usage-statistics-webpack-plugin

A plugin to collect graphql api usage info by your route config.

## Install

```shell
# NPM
npm install --save-dev @fruits-chain/graphql-usage-statistics-webpack-plugin
# Yarn
yarn add -D @fruits-chain/graphql-usage-statistics-webpack-plugin
```