shawn
0de9b6e66e
- core/table-core: Headless 表格内核（排序/筛选/分页/选择插件 + 冒烟 9 项） - core/frame: signal/computed/effect + hyperscript 微框架（零依赖） - skin/ui: 16 个 DOM 组件（含自绘 select、滑动指示条 tabs、行选择 dataTable、form 表单校验） - design/tokens: --ua-* 设计令牌（light/dark） - tools/cli: ua 命令行（index/list/info/docs/style/mcp）+ MCP 注册表服务 - apps: demo 演示站（esbuild 单文件）+ docs 双轨文档（人类版 + llms-full.txt）
23 lines
969 B
TypeScript
23 lines
969 B
TypeScript
import { effect, h } from '@ui-arch/frame';
|
|
import type { ProgressProps } from './types.js';
|
|
|
|
/*** 进度条：轨道 + 渐变流动填充，value 信号驱动 0-100；满格切换 success 色并停止条纹 ***/
|
|
export function progress(props: ProgressProps): HTMLElement {
|
|
const fill = h('div', { class: 'ua-progress-fill' });
|
|
const track = h('div', { class: 'ua-progress-track' }, fill);
|
|
const text = h('span', { class: 'ua-progress-text' });
|
|
effect(() => {
|
|
const v = clamp(props.value()); // 依赖收集：信号变化自动写回
|
|
fill.style.width = `${v}%`;
|
|
fill.classList.toggle('ua-done', v >= 100); // 满格切语义色
|
|
text.textContent = `${Math.round(v)}%`;
|
|
});
|
|
return h('div', { class: 'ua-progress' }, track, props.showText === false ? null : text);
|
|
}
|
|
|
|
/*** 进度钳制到 0-100 ***/
|
|
function clamp(v: number): number {
|
|
if (Number.isNaN(v)) return 0; // 卫语句：非法值归零
|
|
return Math.min(100, Math.max(0, v));
|
|
}
|