SepProgress 进度条组件 v1.0.0
线形 / 环形进度条 · 预设色 / 渐变 / 纯色 / 动态阈值颜色 / 条纹流动 / 不确定加载 / 自定义线宽 / 百分比文字
1. 基础用法（percent 0-100）
HTML 声明式标签
JS API 初始化
2. 预设颜色（primary / success / warning / danger）
HTML 声明式标签
primary（CPU）
success（磁盘）
warning（内存）
danger（危险）
JS API 初始化
3. 自定义颜色（纯色 / 渐变字符串）
HTML 声明式标签
纯色 #8B5CF6
渐变 linear-gradient
JS API 初始化
4. 尺寸（small / default）与自定义线宽
HTML 声明式标签
size="small"（4px）
size="default"（8px）
stroke-width="16"
JS API 初始化
5. 百分比文字（showInfo + format）
HTML 声明式标签
JS API 初始化（自定义 format）
6. 动态更新（setPercent / setColor）
JS API 初始化
percent: 0, color: primary
7. 系统指标示例（CPU / 内存 / 磁盘）
JS API 初始化
8. 动态阈值颜色
两种方式：① colorStops 阈值配置（声明式友好，支持 striped/animated 特效 + onEnter/onLeave 回调）② color 函数（灵活）。每次 setPercent 自动切换颜色与特效，切换时通过 onColorStopChange(cur, prev, percent) 通知外部（异步执行，不阻塞渲染）。
方式一：colorStops 阈值配置（推荐）
percent: 0, color: success
方式二：color 函数
percent: 0, color: success
9. 条纹流动效果（striped + animated）
HTML 声明式标签
JS API 初始化
动态切换（JS API）
striped: false, animated: false
10. 不确定加载动画（indeterminate）
无法确定进度时使用，进度条显示一个不断滑动的加载指示块。
HTML 声明式标签
JS API 初始化
动态切换（JS API）
indeterminate: false
11. 环形进度条（type="circle"）
HTML 声明式标签
primary 默认
success
warning
danger
JS API 初始化
动态更新（JS API）
percent: 0
12. 仪表盘（type="gauge"）
半圆形仪表盘，带指针滑动动画和刻度，支持自定义起止角度。
HTML 声明式标签
primary 默认
success
warning
danger
JS API 初始化
动态更新（JS API）
percent: 0
13. 分段进度条（type="segment"）
多段进度条，每段独立颜色，自动按 value 比例分配宽度，支持 label 标签显示和悬停气泡。
JS API 初始化
资源使用率（4 段）
流量来源（5 段）
项目状态（3 段，16px 粗条）
动态更新（JS API）
segments: 资源默认分配
13a. 线形端点（strokeLinecap）
控制进度条两端形状：round（圆角）/
butt（平头）
HTML 声明式标签
round（圆角）→ 端点圆弧
butt （平头）→ 端点切平
13b. 文字内置（textInside）
百分比文字显示在进度条内部
HTML 声明式标签
JS API 初始化