弹出框是在按钮旁打开的小面板,用于放置可交互的内容:筛选条件、简短的表单、颜色选择器。它是原生的 popover="auto",因此浏览器会在按 Esc 键或点击外部时关闭它、归还焦点,并在 Tab 键顺序中把它放在触发器之后。
悬停卡片是一种内容丰富的工具提示。短暂悬停后打开,通过键盘获得焦点时则立即打开,用来描述它的触发器。指针移到卡片上时它会保持打开,因此其中的文字可以阅读和选中。
两者在空间不足时都会翻转到另一侧,始终保持在屏幕内,并在页面滚动时跟随触发器。
筛选
内含表单的弹出框。arrow 让它指向触发器,hide() 可在代码中关闭它。
Showing open, in review issues.
悬停卡片
将鼠标悬停在某个名字上,或用 Tab 键移到它。卡片用来描述该链接,因此屏幕阅读器会在名字之后读出它。
方位与入场动画
side 和 align 决定它在哪里打开;start 和 end 跟随书写方向。enter 和 motion 决定它如何入场。
rise · bouncy
swing · jelly
drop · snappy
unfold · mechanical