@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>