# @hbtv/style-input

> 适用于 ant-design 4.x Form 的 样式编辑器

Latest version **1.0.11** (published 2021-01-13) · MIT license · 0 weekly downloads

## Install

```sh
npm install @hbtv/style-input
pnpm add @hbtv/style-input
yarn add @hbtv/style-input
bun add @hbtv/style-input
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.11 |
| Published | 2021-01-13 |
| First published | 2020-11-19 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 5 |
| Unpacked size | 65.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | zix2002, yugong, dokey, gogoing, xuezhidp, aa719032411 |

## Links

- npm: https://www.npmjs.com/package/@hbtv/style-input
- Repository: /nebula-library
- npm.io page: https://npm.io/package/@hbtv/style-input

## Dependencies (5)

- [antd](https://npm.io/package/antd.md) ^4.x
- [@ant-design/icons](https://npm.io/package/@ant-design/icons.md) ^4.3.0
- [@hbtv/color-picker](https://npm.io/package/@hbtv/color-picker.md) ^1.0.5
- [@hbtv/media-upload](https://npm.io/package/@hbtv/media-upload.md) ^2.1.3
- [@hbtv/slider-input](https://npm.io/package/@hbtv/slider-input.md) ^1.0.1

## Recent versions

- 1.0.11 (latest) — 2021-01-13
- 1.0.4-beta (beta) — 2020-11-20
- 1.0.10 — 2021-01-13
- 1.0.9 — 2020-11-26
- 1.0.8 — 2020-11-23
- 1.0.7 — 2020-11-23
- 1.0.6 — 2020-11-23
- 1.0.5 — 2020-11-23
- 1.0.4 — 2020-11-20
- 1.0.3 — 2020-11-20
- 1.0.2 — 2020-11-20
- 1.0.1 — 2020-11-20
- 1.0.0 — 2020-11-19

## README

# @hbtv/style-editor

## 安装方法

`yarn add @hbtv/style-editor@latest`

## 使用方法

```tsx
import { Form, Card } from 'antd';
import StyleInput, { StyleEditor } from './index';

const UsageInput = () => {
  const [form] = Form.useForm();
  // 可以使用form 各种方法
  return (
    <Form form={form}>
      <Form.Item name="style" label="样式">
        <StyleInput />
      </Form.Item>
    </Form>
  );
}


```

## API

```ts
// 适用于 FormItem 的 StyleInput
export interface StyleInputProps {
  allowStyle?: string[]; // 允许的样式 background | flex | font | border | sizePosition
  style?: CSSProperties; // 额外样式
  uploadServices?: ServicesType; // 上传服务
  value?: CSSProperties; // 值
  onChange?: (newValue: any) => void; // onChange时间
}

```

---
_Source: https://npm.io/package/@hbtv/style-input · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._