feat(ios): comprehensive iPhone+iPad UX polish — refined-native design system
Freeze a shared design system (DesignSystem/{Tokens,Typography,StatusStyle,
Primitives}.swift): indigo #7C8CFF accent (root .tint), semantic status colors,
2-4-8-12-16-20-24 spacing + sm8/md12/lg16 radii scale, SF Mono tabular numbers,
reduce-motion-gated animations, haptics, reusable StatusBadge/TelemetryChip/Card/
SectionHeader/DSButtonStyle/ContinueLastBanner. Every changed view consumes tokens
— no hardcoded colors/spacing.
Applied across all surfaces (visual only — zero behavior/logic change, all suites
green): session list rows + status system (shape+color, not color-alone) +
telemetry chips + thumbnail placeholders; terminal gate card (≥44pt approve/reject)
+ keybar + reconnect + quick-reply + digest + SwiftTerm accent theme; pairing hero
+ warning tiers + Projects cards + Timeline/Diff; nav chrome + iPad split placeholder
+ privacy shade + motion. Chinese gate copy. UX finding fixed: timeline class colors
now via DS.Palette (+timelineTool/timelineUser tokens).
Design review 8.5/10. Verified: iPhone 16 290 + iPad Pro 11 290 tests green;
packages + integration green; consistency audit ~clean; zero changes under
ios/Packages, src/, public/.
This commit is contained in:
@@ -10,12 +10,17 @@ import SwiftUI
|
||||
/// split detail 无关,只换外层容器、内容零改(PLAN_IOS_IPAD §1)。
|
||||
/// - **选中态经 `AppCoordinator` 单一真值**:sidebar 触发面全部走
|
||||
/// `selectSidebarItem` / `open`(同 stack 的既有路由),不新开会话生命周期。
|
||||
/// `coordinator.sidebarSelection` 提供二向绑定;行 highlight 需 sidebar List
|
||||
/// 采纳 `selection:`(`SessionListScreen` 的 List,属列表组 Owns),见文末注。
|
||||
/// - **detail 终端仍带 `.id(controller.id)`**:换会话时新 controller → 新
|
||||
/// SwiftTerm 视图(回放 ring buffer),identity 稳定复用 T-iOS-29 语义。
|
||||
/// - **隐私遮罩不在这里**:它在 `AdaptiveRootView` 的 ZStack 顶层,两分支共享,
|
||||
/// 故 detail 终端字节同样在 `scenePhase != .active` 时被遮(安全不变式)。
|
||||
/// - **视觉层**:横幅/占位/工具栏全部走冻结 `DS.*` token 与共享 Primitive,
|
||||
/// 与 stack 分支像素级一致(继续横幅、项目入口都是同一组件)。
|
||||
struct SplitRootView: View {
|
||||
@Bindable var coordinator: AppCoordinator
|
||||
@Environment(\.accessibilityReduceMotion) private var reduceMotion
|
||||
|
||||
var body: some View {
|
||||
NavigationSplitView {
|
||||
@@ -37,23 +42,19 @@ struct SplitRootView: View {
|
||||
onAddHost: { coordinator.presentAddHost() }
|
||||
)
|
||||
.safeAreaInset(edge: .bottom) { continueLastBanner }
|
||||
.toolbar { projectsToolbarItem }
|
||||
.animation(
|
||||
DS.Motion.gated(DS.Motion.base, reduceMotion: reduceMotion),
|
||||
value: coordinator.continueLastSessionId
|
||||
)
|
||||
.toolbar { ProjectsToolbarItem(coordinator: coordinator) }
|
||||
}
|
||||
|
||||
/// 与 `StackRootView.continueLastBanner` 同款「继续上次会话」(冷启动第 5 步)
|
||||
/// —— 分栏 sidebar 也提供,iPad 用户不丢该入口(T-iPad-5 finding)。
|
||||
/// 与 stack 底栏同款「继续上次会话」(冷启动第 5 步)—— 复用共享
|
||||
/// `ContinueLastBanner`,iPad 用户不丢该入口(T-iPad-5 finding)。
|
||||
@ViewBuilder private var continueLastBanner: some View {
|
||||
if coordinator.continueLastSessionId != nil {
|
||||
Button {
|
||||
coordinator.openContinueLast()
|
||||
} label: {
|
||||
Label(RootCopy.continueLast, systemImage: "arrow.uturn.forward.circle.fill")
|
||||
.frame(maxWidth: .infinity)
|
||||
}
|
||||
.buttonStyle(.borderedProminent)
|
||||
.padding(.horizontal, RootMetrics.bannerHorizontalPadding)
|
||||
.padding(.vertical, RootMetrics.bannerVerticalPadding)
|
||||
.background(.thinMaterial)
|
||||
ContinueLastBanner { coordinator.openContinueLast() }
|
||||
.transition(.move(edge: .bottom).combined(with: .opacity))
|
||||
}
|
||||
}
|
||||
|
||||
@@ -62,21 +63,6 @@ struct SplitRootView: View {
|
||||
request.sessionId.map(SidebarItem.session) ?? .newSession
|
||||
}
|
||||
|
||||
/// 与 `StackRootView.projectsToolbarItem` 同款(leading 位、同 disabled 条件、
|
||||
/// 复用 `presentProjects`)—— iPad 上 Projects 本期仍走既有 sheet(大屏化留
|
||||
/// 给 T-iPad-4)。
|
||||
@ToolbarContentBuilder private var projectsToolbarItem: some ToolbarContent {
|
||||
ToolbarItem(placement: .topBarLeading) {
|
||||
Button {
|
||||
coordinator.presentProjects()
|
||||
} label: {
|
||||
Label(RootCopy.projects, systemImage: "folder")
|
||||
}
|
||||
.disabled(coordinator.sessionList.activeHost == nil)
|
||||
.accessibilityIdentifier("sessions.projectsButton")
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - Detail(终端或占位)
|
||||
|
||||
@ViewBuilder private var detail: some View {
|
||||
@@ -91,19 +77,27 @@ struct SplitRootView: View {
|
||||
}
|
||||
} else {
|
||||
placeholder
|
||||
.transition(.opacity)
|
||||
}
|
||||
}
|
||||
|
||||
/// 空 detail 占位 —— accent 图标 + 邀约式文案(DS 方向:ContentUnavailableView
|
||||
/// + 好符号 + 友好中文)。图标着 accent 靛紫,与全 App 强调色呼应。
|
||||
private var placeholder: some View {
|
||||
ContentUnavailableView {
|
||||
Label(SplitCopy.placeholderTitle, systemImage: "sidebar.left")
|
||||
Label {
|
||||
Text(SplitCopy.placeholderTitle)
|
||||
} icon: {
|
||||
Image(systemName: "terminal")
|
||||
.foregroundStyle(DS.Palette.accent)
|
||||
}
|
||||
} description: {
|
||||
Text(SplitCopy.placeholderHint)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// split 专属用户可见文案(「项目」标签复用 `RootCopy.projects`,DRY)。
|
||||
/// split 专属用户可见文案(「项目」/「继续」标签复用 `RootCopy`,DRY)。
|
||||
private enum SplitCopy {
|
||||
static let placeholderTitle = "选择或新建会话"
|
||||
static let placeholderHint = "从左侧选择一个运行中的会话,或新建一个开始工作。"
|
||||
|
||||
Reference in New Issue
Block a user