Popover

	// API-DEMO page/component/popover.json
	{  
	  "defaultTitle": "Popover",
	  "usingComponents": {
	    "popover": "mini-antui/es/popover/index",
	    "popover-item": "mini-antui/es/popover/popover-item/index"
	  }
	}

	<!-- API-DEMO page/component/popover/.axml-->
	<view class="demo-popover">
	  <popover
	    position="{{position}}"
	    show="{{show}}"
	    showMask="{{showMask}}"
	    onMaskClick="onMaskClick"
	  >
	    <view class="demo-popover-btn" onTap="onShowPopoverTap">Click {{show ? 'hide' : 'show'}}</view>
	    <view slot="items">
	      <popover-item onItemClick="itemTap1">
	        <text>{{position}}</text>
	      </popover-item>
	      <popover-item onItemClick="itemTap2">
	        <text>line2</text>
	      </popover-item>
	    </view>
	  </popover>
	</view>
	<view class="demo-popover-test-btns">
	  <button class="demo-popover-test-btn" onTap="onNextPositionTap">Next position</button>
	  <button class="demo-popover-test-btn" onTap="onMaskChangeTap">Mask{{showMask ? 'hide' : 'show'}}</button>
	</view>

	// API-DEMO page/component/popover.js
	const position = ['top', 'topRight', 'rightTop', 'right', 'rightBottom', 'bottomRight', 'bottom', 'bottomLeft', 'leftBottom', 'left', 'leftTop', 'topLeft'];
	Page({
	  data: {
	    position: position[0],
	    show: false,
	    showMask: true,
	  },
	  onShowPopoverTap() {
	    this.setData({
	      show: !this.data.show,
	    });
	  },
	  onNextPositionTap() {
	    let index = position.indexOf(this.data.position);
	    index = index >= position.length - 1 ? 0 : index + 1;
	    this.setData({
	      show: true,
	      position: position[index],
	    });
	  },
	  onMaskChangeTap() {
	    this.setData({
	      showMask: !this.data.showMask,
	    });
	  },
	  onMaskClick() {
	    this.setData({
	      show: false,
	    });
	  },
	  itemTap1() {
	    my.alert({
	      content: 'Click1',
	    });
	  },
	  itemTap2() {
	    my.alert({
	      content: 'Click2',
	    });
	  },
	});

	/* API-DEMO page/component/popover.css */
	.demo-popover {
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  width: 100%;
	  height: 400px;
	}
	.demo-popover-btn {
	  width: 100px;
	  height: 100px;
	  line-height: 100px;
	  text-align: center;
	  background-color: #fff;
	  border: 1px solid #dddddd;
	  border-radius: 2px;
	}
	.demo-popover-test-btns {
	  display: flex;
	  justify-content: space-around;
	}
	.demo-popover-test-btn {
	  width: 45%;
	}