# @beisen-phoenix/unmodeled-layer

> 使用 rc-trigger 来实现弹框可见性的控制, 包括动画，定位等信息， 封装 rc-trigger，实现自适应位置

Latest version **3.3.55** (published 2019-11-25) · ISC license · 0 weekly downloads

## Install

```sh
npm install @beisen-phoenix/unmodeled-layer
pnpm add @beisen-phoenix/unmodeled-layer
yarn add @beisen-phoenix/unmodeled-layer
bun add @beisen-phoenix/unmodeled-layer
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 3.3.55 |
| Published | 2019-11-25 |
| First published | 2019-02-21 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 5 |
| Unpacked size | 68.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | beisencorp |

## Links

- npm: https://www.npmjs.com/package/@beisen-phoenix/unmodeled-layer
- Repository: git@gitlab.beisencorp.com:ux-phoenix/unmodeled-layer
- npm.io page: https://npm.io/package/@beisen-phoenix/unmodeled-layer

## Dependencies (5)

- [rc-trigger](https://npm.io/package/rc-trigger.md) 2.6.2
- [@beisen/common-func](https://npm.io/package/@beisen/common-func.md) 0.0.20
- [@beisen-phoenix/button](https://npm.io/package/@beisen-phoenix/button.md) ^3.3.55
- [@beisen-phoenix/tooltip](https://npm.io/package/@beisen-phoenix/tooltip.md) ^3.3.55
- [@beisen-phoenix/style-token](https://npm.io/package/@beisen-phoenix/style-token.md) ^3.3.55

## Recent versions

- 3.3.55 (latest) — 2019-11-25
- 3.2.44-rc.1 (rc) — 2019-10-24
- 3.3.54 — 2019-11-25
- 3.3.53 — 2019-11-25
- 3.3.52 — 2019-11-24
- 3.3.51 — 2019-11-23
- 3.3.50 — 2019-11-22
- 3.3.48 — 2019-11-22
- 3.3.47 — 2019-11-22
- 3.3.46 — 2019-11-22
- 3.3.45 — 2019-11-21
- 3.3.43 — 2019-11-21
- 3.3.42 — 2019-11-21
- 3.3.41-beta.1 — 2019-11-21
- 3.3.41 — 2019-11-21
- … 425 more at https://npm.io/package/@beisen-phoenix/unmodeled-layer/versions

## README

### @beisen-phoenix/unmodeled-layer

使用 rc-trigger 来实现弹框可见性的控制, 包括动画，定位等信息， 封装 rc-trigger，实现自适应位置

#### API 属性如下:

| 成员               |                                说明                                |                          类型                           | 默认值     |
| ------------------ | :----------------------------------------------------------------: | :-----------------------------------------------------: | ---------- |
| visible            |                              是否显示                              |                         boolean                         | -          |
| size               |       尺寸大小: small(170px) large(340px) auto(与父级自适应)       |                         string                          | -          |
| width              |                    自定义大小，优先级低于 size                     |                         number                          | -          |
| autoSize           |                       是否监听弹层的大小变化                       |                         Boolean                         | true       |
| childMargin        |                           子组件的外边距                           |                         string                          | 0px        |
| trigger            |                    触发展示的行为: hover click                     |                 Array<'hover' 'click'>                  | [ 'hover'] |
| footer             |                             自定义按钮                             |                         object                          | -          |
| autoAdjust         |                         是否自适应调整位置                         |                         Boolean                         | true       |
| content            |                              弹窗内容                              |                        ReactNode                        | -          |
| stretch            |                              弹层拉伸                              | string（'width'、 'minWidth'、 'height'、 'minHeight'） | -          |
| onVisibleChange    |               弹层显示状态改变时调用, 参数为 visible               |                    Function(visible)                    | -          |
| onOk               |                       默认确定按钮的回调函数                       |                        Function                         | -          |
| extraCls           |                            自定义 class                            |                         string                          | ""         |
| blockContainer     | 外层容器的显示类型（true 是 block 类型，false 则是 inline-block）  |                         Boolean                         | false      |
| placement          | 弹层的显示位置(可选值：topLeft, topRight, bottomRight, bottomLeft) |                         string                          | bottomLeft |
| builtinPlacements  |             弹层的可定义偏移位置(具体可参考 dom-align)             |                         object                          | --         |
| getPopupContainer  |                           弹层挂载的容器                           |                        Function                         | -          |
| destroyPopupOnHide |                       隐藏的时候是否销毁节点                       |                         boolean                         | false      |

#### builtinPlacements 取值举例

```
{
  topLeft: {
    points: ['bl', 'tl'],
  },
  topRight: {
    points: ['br', 'tr'],
  },
  bottomRight: {
    points: ['tr', 'br'],
  },
  bottomLeft: {
    points: ['tl', 'bl'],
    offset: [-11, -15]
  },
}
```

#### 代码示例

```
let footer = [{
  text: '按钮1',
  onClick: ()=> console.log("按钮1")
}, {
  text: '按钮2',
  onClick: ()=> console.log("按钮2")
}]
<UnmodeledLayer
  visible={visible}
  size = 'small'
  footer={footer}
  trigger={['hover', 'click']}
  content={content}
  onOk={this.handleOk}
  onVisibleChange={this.onVisibleChange}
  >
  <Button>打开</Button>
</UnmodeledLayer>
```

---
_Source: https://npm.io/package/@beisen-phoenix/unmodeled-layer · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._