open-index/open-npm huggingface dataset:
npm package: @juxi/app-network
Description: 桔夕app 网络通用配置
Author: cycweeds
Latest version: 1.0.2

# **App 网络通用配置**

基于 App采用 React Native 和 小程序采用Taro技术栈进行开发。两者的技术栈都是基于React。
所以抽离部分网络api到公共组件中。实现两端业务同步。


## **项目文件介绍**

* http-config： 项目配置
* http-encoding： 编码方式（URLEncoding, JSONEncoding）  
* http-method： 常用的方法，采用全大写  
* http-header： 常用的便捷header  
* request文件： 存放各个业务场景的请求参数，根据业务不断添加


## **设计思路**
header、method、config 封装常用的方法、常量。


#### http-encoding
主要针对 params。
* URLEncoding： 把 params 转成 xx=xx&xx=xx的形式拼接在url的query部分（方便的可以直接在url后面自己拼接，不通过params的方式）
* JSONEncoding： 把 params 转成data 放在 body 部分

#### request文件
单个request文件存放某类业务相似的请求。最好和后端文档同步。用户类请求相关的api放到同个文件下， 命名为  ```http-request-xxx.js```。
不同业务的api，单独新开一个文件。



举个🌰
```，

export const HTTPRequestGoods = {
    // 对应单个api
    get: (keyword) => {
        return {
            url: HTTPBaseURL + '?seach=' + keyword,
            params: null,
            method: HTTPMethod.GET,
            encoding: HTTPEncoding.JSONEncoding,
            header: null
        }
    },
    add: (name) => {
        url: HTTPBaseURL + '/add'
    }
    .
    .
    .
    .

}
```
按照以下格式去实现
```
{
    url: 必要
    params: 可选
    method: 可选
    encoding: 可选
    header: 可选
}
```


命名关键字：
get、update、delete、add



## **具体使用**
以 **App端** 为例，首先需要对网络api进行进一步封装  

RN 项目封装(仅供参考)：
```
// HTTP.js 文件
export function request(config, success, failure, completion) {
    let url = config.url
    let encoding = config.encoding || HTTPEncoding.URLEncoding
    let method = config.HTTPMethod || HTTPMethod.GET
    let header = config.header || DefaultHeader
    return axios.request({
        url: config.url,
        method: method,
        params: props.params,
        header: header
    })
}

```
上传调用
```
// 使用的时候
let config = HTTPRequestUser.login(phone, password)
HTTP.request(config, (response) => {

},(error) => {

  })



```
npm package: @juxi/picker
Description: test
Author: cycweeds
Latest version: 0.1.10

# @juxi/picker
mutiple columns picker
## Installation

```sh
npm install @juxi/picker
```

## Usage

```js
import { PickerView } from "@juxi/picker";

// ...

<PickerView color="tomato" />
```

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---

Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)
npm package: @juxio/cli
Description: Jux CLI to generate design tokens and components
Author: jux
Latest version: 0.8.20

<p align="center">
  <a href="https://www.jux.io" target="_blank">
    <img alt="Jux" src="https://cdn.jux.io/brand/JuxButtonWhite.png" width="350">
  </a>
</p>

<p align="center">
A utility first, zero runtime CSS-in-JS framework with full design tokens and themes support.
</p>

## Features

- Write CSS in JS, with **zero** runtime - all styles are extracted and calculated at build time
- Full support for design tokens and themes, powered by [@juxio/design-tokens](https://www.npmjs.com/package/@juxio/design-tokens)
- Utility first - write utilities (custom css properties) which can then be used to style your components
- CLI for easy management of your design tokens, themes, utilities and styles
- Type-safe - autocompletion for your design tokens, breakpoints, and utilities
- Full interpolation support when generating styles
- Pull components and design tokens from [Jux design tool](https://www.jux.io)

## Documentation

For documentation, visit [docs.jux.io](https://docs.jux.io).

## Quickstart

Jux is a PostCSS plugin, so you can use it with any build tool that supports PostCSS.

Install Jux CLI:

```
npm install -D @juxio/cli postcss
```

Initialize a new project. This will install the necessary dependencies, and create `jux.config.ts` and `postcss.config.js` files in your project root.

```
npx jux init --postcss
```

Configure your include files:

```typescript
export default {
  preflight: true,
  include: ['./src/**/*.{js,jsx,ts,tsx}', './pages/**/*.{ts,tsx}'],
  exclude: [],

  /* The core tokens of your design system */
  core_tokens: {},

  /* The themes for your design system */
  themes: {},
};
```

Add Jux’s `@layer` directive to your main CSS file:

```css
@layer juxbase, juxtokens, juxutilities;
```

Start your build process and generate your CSS:

```
npx jux generate css -o styles.css
```

Include the generated CSS in your project:

```tsx
import './styles.css';

import { css } from '@juxio/css';

export default function Home() {
  return (
    <div
      className={css({
        color: 'violet',
        '&:hover': {
          color: 'darkviolet',
        },
      })}
    >
      Hello from Jux 🤖
    </div>
  );
}
```

## Community

Love the project? ♥️ Need help or have a question? Join our [Discord](https://discord.gg/BSXsahmyVQ) community or email us at [squad@jux.io](mailto:squad@jux.io) and say hi!