iter(g286): 新增 noticeBar 单行通知条组件

packages/skin/ui/src/index.ts

@@ -86,3 +86,4 @@ export { relativeTime } from './relativeTime.js';
 export { sparkline } from './sparkline.js';
 export { heatmap } from './heatmap.js';
 export { progressRing } from './progressRing.js';
+export { noticeBar } from './noticeBar.js';

packages/skin/ui/src/noticeBar.ts

@@ -0,0 +1,37 @@
+import { h, signal } from '@ui-arch/frame';
+import type { NoticeBarProps } from './types.js';
+
+// 语义色配符号：只靠颜色区分在灰度/色弱下会失效，符号是第二条线索
+const ICONS: Record<string, string> = { info: 'ℹ', success: '✓', warning: '!', danger: '×' };
+
+/*** 通知条：单行横条，语义色 + 可选跑马灯与关闭；关闭即整条隐藏并回调 ***/
+export function noticeBar(props: NoticeBarProps): HTMLElement {
+  const variant = props.variant ?? 'info';
+  const open = signal(true); // 关闭状态：隐藏而非摘节点，调用方仍可拿到元素句柄
+  return h(
+    'div',
+    {
+      class: `ua-notice ua-notice-${variant}${props.scroll ? ' is-roll' : ''}`,
+      role: 'status',
+      title: props.text, // 滚动/裁切时仍能悬停读到完整原文
+      hidden: () => !open(),
+    },
+    h('span', { class: 'ua-notice-icon', 'aria-hidden': 'true' }, props.icon ?? ICONS[variant]),
+    h('div', { class: 'ua-notice-body' }, h('span', { class: 'ua-notice-text' }, props.text)),
+    props.closable === false
+      ? null
+      : h(
+          'button',
+          {
+            type: 'button',
+            class: 'ua-notice-close',
+            'aria-label': '关闭通知',
+            onClick: () => {
+              open(false);
+              props.onClose?.();
+            },
+          },
+          '×',
+        ),
+  );
+}

packages/skin/ui/src/types.ts

@@ -1111,11 +1111,20 @@ export interface HeatmapProps {
   formatValue?: (count: number, date: string) => string; // 悬停提示文案；缺省「日期 · 数量」
 }
 
-/*** 环形进度入参 ***/
-export interface ProgressRingProps {
+/*** 环形进度入参 ***/export interface ProgressRingProps {
   value: number | Signal<number>; // 当前进度 0-100；超出范围自动夹取，信号变化时自动重绘
   size?: number;                  // 外径（px）；缺省 96
   thickness?: number;             // 环宽（px）；缺省 8
   showText?: boolean;             // 是否显示中心文字；缺省 true（关掉时请自行保证 aria 可读）
   label?: string;                 // 中心文字；缺省「N%」
 }
+
+/*** 通知条入参 ***/
+export interface NoticeBarProps {
+  text: string;                   // 通知正文；单行不换行，超宽需配合 scroll
+  variant?: 'info' | 'success' | 'warning' | 'danger'; // 语义色；缺省 info
+  icon?: string;                  // 左侧符号；缺省按 variant 取（ℹ / ✓ / ! / ×）
+  scroll?: boolean;               // 正文超宽时跑马灯滚动；缺省 false（静态，超出裁切）
+  closable?: boolean;             // 是否显示关闭按钮；缺省 true
+  onClose?: () => void;           // 关闭回调
+}