## 通用型右键菜单组件

#### 配置参数

| 新增配置参数 |     参数     |             参数说明             | 默认值 |
| :----------: | :----------: | :------------------------------: | :----: |
|    zIndex    |     数值     |         设置菜单显示层级         |  1000  |
|   minWidth   |     数值     |         设置菜单最小宽度         |  230   |
| subOpenType  | hover、click | hover: 悬浮展开、click: 点击展开 | hover  |

#### 注册组件

```typescript
import { applyPolyfills, defineCustomElements } from '@ibiz/context-menu/dist/loader';

applyPolyfills().then(() => defineCustomElements(window));
```

#### 基本用法

```typescript
// 全局提供 contextMenu 控制器：
import { contextMenu } from '@ibiz/context-menu';

// 示例菜单
const menus: ContextMenuItem[] = [
  {
    text: '返回(B)',
    textRight: 'CTRL + B',
  },
  {
    text: '前进(F)',
    disable: true,
  },
  {
    text: '重新加载(R)',
  },
  {
    type: 'separator',
  },
  {
    text: '另存为(A)',
  },
  {
    text: '打印(P)',
  },
  {
    text: '投射(C)',
  },
  {
    type: 'separator',
  },
  {
    text: '使用网页翻译(T)',
    children: [
      {
        text: '中文',
      },
      {
        text: '英文',
      },
    ],
  },
  {
    type: 'separator',
  },
  {
    text: '关闭',
  },
];

// 右击事件触发
function contextMenu(e: MouseEvent): void {
  contextMenu
    // 打开右键菜单
    .open(e, this.menus)
    // 点击菜单项后回调
    .click((item: ContextMenuItem) => {
      console.log(item);
    });
}
```