feat(design+desktop): Select 真相源组件 + 设置窗口无边框(12A 实测反馈)
Select 组件(用户拍板:下拉框全端共用一个真相源): - design/components/forms/Select.jsx:自绘下拉——触发器同 Input (control-sm/radius-sm/border-1 + chevronDown),弹层同菜单 (radius-md/shadow-menu、选中项前置对勾、hover surface-2), 外点/Esc 收起;登记簿加卡;icons.js 新增 chevronDown 并登记 icon-map - 原型 SettingsTray 与桌面 SettingsApp 同步换用(替换原生 select—— 其系统弹层样式/位置不可控,即 12A 截图问题) 原型组件运行时可再生(修复单源缺口): - design-pipeline/bundle-components.mjs:用 desktop 现成 esbuild 重建 _ds_bundle.js(此前为 Claude 导出产物、仓库内无法再生,组件一改即 过期);import 'react' 经全局 shim,命名空间不变;已实测原型页正常 - _ds_bundle.js 重建(15 个组件,含 Select/Icon) 设置窗口无边框: - tauri.conf settings 窗口 titleBarStyle=Overlay + hiddenTitle, 系统红绿灯悬浮左上;SettingsApp 自绘顶条(surface-2 + 下边框 + data-tauri-drag-region 可拖拽),对齐原型 MacWindow 规格 合并 feat/design-truth-source(真相源与闸体系)进本分支 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
@@ -6,6 +6,7 @@ import { HotkeyCombo } from '@dudu/design/components/core/Kbd';
|
||||
import { ProgressBar } from '@dudu/design/components/core/ProgressBar';
|
||||
import { Switch } from '@dudu/design/components/forms/Switch';
|
||||
import { SettingRow } from '@dudu/design/components/forms/SettingRow';
|
||||
import { Select } from '@dudu/design/components/forms/Select';
|
||||
import { invoke } from '../shared/tauri';
|
||||
import { setThemePref } from '../shared/theme';
|
||||
|
||||
@@ -61,6 +62,19 @@ export function SettingsApp() {
|
||||
|
||||
return (
|
||||
<div style={{ fontFamily: 'var(--font-sans)', background: 'var(--bg-app)', minHeight: '100vh' }}>
|
||||
{/* 无边框窗口自绘顶条(titleBarStyle Overlay:系统红绿灯悬浮于左上,留 76px);
|
||||
样式对齐原型 MacWindow:surface-2 + 下边框,整条可拖拽 */}
|
||||
<div
|
||||
data-tauri-drag-region
|
||||
style={{
|
||||
height: 36, display: 'flex', alignItems: 'center', padding: '0 14px 0 76px',
|
||||
background: 'var(--surface-2)', borderBottom: '1px solid var(--border-1)',
|
||||
fontSize: 'var(--text-sm)', fontWeight: 'var(--weight-semibold)', color: 'var(--text-1)',
|
||||
userSelect: 'none', WebkitUserSelect: 'none', cursor: 'default',
|
||||
}}
|
||||
>
|
||||
dudu 设置
|
||||
</div>
|
||||
<Section title="输入">
|
||||
<SettingRow label="说话快捷键" description="按住说话,松开上屏">
|
||||
<span style={{ display: 'inline-flex', alignItems: 'center', gap: 10 }}>
|
||||
@@ -69,17 +83,11 @@ export function SettingsApp() {
|
||||
</span>
|
||||
</SettingRow>
|
||||
<SettingRow label="麦克风">
|
||||
<select
|
||||
<Select
|
||||
value={settings.mic}
|
||||
onChange={(e) => update({ mic: e.target.value })}
|
||||
style={{
|
||||
height: 'var(--control-sm)', padding: '0 10px', borderRadius: 'var(--radius-sm)',
|
||||
border: '1px solid var(--border-1)', background: 'var(--surface-card)',
|
||||
color: 'var(--text-1)', fontSize: 'var(--text-sm)', fontFamily: 'var(--font-sans)',
|
||||
}}>
|
||||
<option value="">系统默认</option>
|
||||
{mics.map((m) => <option key={m} value={m}>{m}</option>)}
|
||||
</select>
|
||||
onChange={(mic) => update({ mic })}
|
||||
options={[{ value: '', label: '系统默认' }, ...mics.map((m) => ({ value: m, label: m }))]}
|
||||
/>
|
||||
</SettingRow>
|
||||
<SettingRow label="提示音" description="开始 / 完成时播放轻提示音">
|
||||
<Switch checked={settings.sound} onChange={(v) => update({ sound: v })} />
|
||||
|
||||
Reference in New Issue
Block a user