Expand description
通用 UI 原子与全部 class 常量(卡片 / 按钮 / 徽章 / 分页 / spinner / checkbox)。 任何 inline Tailwind class 字符串上线前,先在此查是否已有常量。 通用 UI 原子组件与类名常量。
提供跨页面共享的样式常量(卡片、按钮、徽章外层等)与可复用组件 (分页导航、状态徽章、空状态)。样式常量用于消除散落在各页面的重复 Tailwind 类字符串;组件用于封装结构固定的 UI 单元。
与 forms.rs(表单控件)并列,本模块聚焦通用展示类原子。
Re-exports§
pub use Pagination_completions::Component::Pagination;pub use StatusBadge_completions::Component::StatusBadge;pub use UserAvatar_completions::Component::UserAvatar;pub use Tooltip_completions::Component::Tooltip;pub use CollapsibleSettingsCard_completions::Component::CollapsibleSettingsCard;pub use Popover_completions::Component::Popover;pub use FilterTabs_completions::Component::FilterTabs;pub use LoadingButton_completions::Component::LoadingButton;pub use TagChip_completions::Component::TagChip;pub use Checkbox_completions::Component::Checkbox;
Structs§
- Checkbox
Props - Properties for the
Checkboxcomponent. - Collapsible
Settings Card Props - Properties for the
CollapsibleSettingsCardcomponent. - Filter
Tabs Props - Properties for the
FilterTabscomponent. - Loading
Button Props - Properties for the
LoadingButtoncomponent. - Pagination
Props - Properties for the
Paginationcomponent. - Popover
Props - Properties for the
Popovercomponent. - Status
Badge Props - Properties for the
StatusBadgecomponent. - TagChip
Props - Properties for the
TagChipcomponent. - Tooltip
Props - Properties for the
Tooltipcomponent. - User
Avatar Props - Properties for the
UserAvatarcomponent.
Constants§
- ADMIN_
CARD_ CLASS - Admin 卡片容器:内容档圆角(16px),作为主面板内的内容卡片,与外壳 32px 形成层次。
- ADMIN_
ROW_ HOVER - ADMIN_
TABLE_ CLASS - Admin 表格容器:内容档圆角(16px),与卡片一致。
- BADGE_
BASE - BTN_
CLOSE_ ICON - 关闭图标按钮(× 关闭提示条)。
- BTN_
DANGER_ OUTLINE - 红色描边危险按钮(trash 清空回收站)。
- BTN_
GHOST - 弱化文字按钮(弹窗「取消」等次要取消操作):无描边、无填充,悬浮转主色。
- BTN_
ICON - 方形图标按钮(trash 步进 −/+)。
- BTN_
OUTLINE - 描边次要按钮(posts 重建、system 刷新列表):
relative以承载 spinner 叠加层。 - BTN_
PRIMARY - 主操作按钮:主题绿实心胶囊(用于
<Link>、无 loading 态的静态按钮)。 - BTN_
PRIMARY_ SM - 小号主操作按钮:工具栏场景(刷新 / 导出 / 创建备份)。
- BTN_
SECONDARY - 次要按钮:极简风次要操作。
- BTN_
SOLID_ AMBER - 琥珀色实心小按钮(批量标为垃圾)。
- BTN_
SOLID_ GREEN - 绿色实心小按钮(批量通过、批量恢复)。
- BTN_
SOLID_ RED - 红色实心小按钮(批量删除、批量彻底删除)。
- BTN_
TEXT_ ACCENT - 主题绿(鼠尾草)文字小按钮(行内恢复)。
- BTN_
TEXT_ AMBER - BTN_
TEXT_ GREEN - 绿色文字小按钮(行内通过)。
- BTN_
TEXT_ RED - MEDIA_
BADGE_ BASE - POPOVER_
OVERLAY_ 🔒CLASS - Popover 遮罩与面板的层级(z-40 遮罩 < z-50 面板),与 Tooltip/lightbox 同 z-50。
- POPOVER_
PANEL_ 🔒CLASS - Popover 面板:卡片化大圆角 + 阴影 + 淡入缩放动画。 居中变体:animate-popover-enter 的关键帧烘了 translateX(-50%),与居中的 静态 transform 一致;端点对齐(start/end)变体静态 transform 为空,必须换用 无位移的 animate-popover-enter-edge,否则 both fill 期面板水平错位半宽。
- POPOVER_
PANEL_ 🔒EDGE_ CLASS - SPINNER_
SVG - 行内加载 spinner:环形渐变 + 自旋动画,用 currentColor 继承文字色。
- TOOLTIP_
STYLE 🔒 - Tooltip 基础样式(胶囊:黑底白字,hover 显现)。水平定位由调用方经
align选择, 不在此处写死居中——触发器贴容器边缘时居中会让 tooltip 溢出被overflow-hidden裁掉。
Statics§
Functions§
- Checkbox
- 带勾画动画的复选框:对勾 SVG 用 stroke-dashoffset 描边绘制 + scale 弹入。
- Collapsible
Settings Card - 可折叠的后台设置卡片外壳。
- Filter
Tabs - 筛选选项卡组件。
- Loading
Button - 主操作按钮,内置 loading spinner 叠加(统一三态)。
- Pagination
- 分页导航组件。
- Popover
- 受控式通用 Popover(浮层)组件。
- Status
Badge - 状态徽章组件。
- TagChip
- 标签芯片组件:统一的标签可视化(标签云软底 / 卡片描边两种变体)。
- Tooltip
- Tooltip 包裹组件。
- User
Avatar - 用户头像:有图显示图,无图回退展示名首字符(accent 软底)。