Modal 对话框
模态对话框，用于需要用户确认或输入的中断场景。
基础用法
基础用法
这是一个基础对话框示例。
受控显示
visible 为受控属性：由宿主（按钮 / JS）设置或移除，组件不会自动恢复；关闭后可监听 oas-ok / oas-cancel 后移除 visible。
受控显示（visible）
外部按钮直接设置 / 移除 visible 控制显隐，无需依赖底部按钮。
无底部按钮
无底部按钮
隐藏底部操作区，仅通过 ✕ / Esc / 遮罩关闭。
禁止遮罩关闭
禁止遮罩关闭
点击遮罩不会关闭，需通过按钮或 Esc 关闭。
自定义宽度
自定义宽度
通过 width 指定对话框宽度，支持像素或百分比（如 50%），未设置时默认 520px。
垂直居中
垂直居中
默认对话框靠上偏移（顶部 100px），添加 centered 后垂直居中显示。
可拖拽
可拖拽
按住标题栏可拖动对话框；Esc、遮罩关闭与焦点行为保持不变。
全屏对话框
fullscreen 让对话框铺满视口（无圆角、无外边距）。优先级定义：fullscreen 胜于 width / centered / draggable——width 被忽略、centered 无布局差异、拖拽被禁用；Esc / 遮罩关闭与焦点陷阱、ARIA 行为照常。
全屏对话框
全屏对话框铺满视口、无圆角与边距。width / centered 被忽略、拖拽被禁用，Esc / 遮罩关闭照常。
命令式确认
confirm() 命令式 API 基于 Promise，底层复用 oas-modal（返回 Promise<void>，确定 resolve、取消 reject）。传 onOk 异步回调可实现 loading 态确认：点击确定后 OK 按钮进入 loading（转圈、禁止重复触发），onOk resolve 后自动关闭并 resolve 外层 Promise；reject 则清除 loading、对话框保持打开可重试或取消。
命令式确认
事件反馈
事件反馈
点击「确定」或「取消」，观察右上角消息提示。
API
属性
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
centered | 对话框垂直居中显示 | boolean | — |
draggable | 可通过标题栏拖动对话框 | boolean | — |
fullscreen | 全屏显示：对话框铺满视口、无圆角与边距（优先级高于 width / centered / draggable） | boolean | — |
loading | 确定按钮进入 loading 态（禁用 + 转圈），禁止重复触发确定 | boolean | — |
no-footer | 隐藏底部操作按钮 | boolean | — |
no-mask-close | 禁用点击遮罩关闭 | boolean | — |
title | 标题文案 | string | — |
visible | 是否显示 | boolean | — |
width | 对话框宽度（px 或百分比） | — | — |
事件
| 事件 | 说明 |
|---|---|
oas-cancel | 取消：取消按钮 / ✕ / 遮罩点击 / Esc |
oas-ok | 点击「确定」 |
插槽
| 名称 | 说明 |
|---|---|
| 默认 | — |
role="dialog" + aria-modal="true"，打开时焦点移入「取消」按钮，关闭后还原。