iter: d09 新增滑块 slider 组件

apps/demo/main.ts

@@ -18,6 +18,7 @@ import {
   radioGroup,
   select,
   skeleton,
+  slider,
   spinner,
   switchButton,
   tabs,
@@ -96,6 +97,9 @@ const formResult = signal('');
 // —— 分页联动状态：dataTable 与独立 pagination 共用同一页码信号 ——
 const tablePage = signal(1);
 
+// —— 滑块：音量与禁用态演示 ——
+const volume = signal(40);
+
 // —— 表格加载态：切换后数据行变骨架行，筛选与翻页临时禁用 ——
 const tableLoading = signal(false);
 
@@ -155,6 +159,17 @@ const content = h(
       radioGroup({ options: [{ value: 'x', label: '静态禁用' }], value: size, disabled: true }),
     ),
   ),
+  section(
+    'sec-slider',
+    '滑块',
+    'slider：原生 range 承载交互（含键盘 ←→），value 信号双向绑定，右侧可显示当前值。',
+    h(
+      'div',
+      { class: 'row' },
+      slider({ value: volume, min: 0, max: 100, step: 5, onChange: (v) => toast.info(`音量 ${v}`) }),
+      slider({ value: volume, disabled: locked }),
+    ),
+  ),
   section(
     'sec-feedback',
     '反馈与提示',