From 108c8758b5d1370c06ce40be622162498eea70f4 Mon Sep 17 00:00:00 2001 From: GCWing Date: Sun, 27 Sep 2026 19:39:13 +0800 Subject: [PATCH 1/5] feat(ui): consolidate FlowChat presentation and design system --- OpenBitFun-Installer/package.json | 2 +- OpenBitFun-Installer/src/App.tsx | 4 +- .../src/components/BrandMark.tsx | 4 +- OpenBitFun-Installer/src/styles/global.css | 3 - THIRD_PARTY_NOTICES.md | 3 +- assets/brand/exports/openbitfun-mark.svg | 30 +- assets/brand/source/openbitfun-mark.svg | 30 +- design-system/apps/design-lab/package.json | 3 +- design-system/apps/design-lab/src/App.tsx | 714 ++---- .../design-lab/src/assets/subagentAvatars.ts | 5 + .../src/components/LabNavigation.tsx | 32 + .../src/components/VoiceCallPreview.tsx | 3 +- .../apps/design-lab/src/design-layout.css | 307 +++ .../apps/design-lab/src/i18n/brandMessages.ts | 62 + .../design-lab/src/i18n/componentMetadata.ts | 13 + .../apps/design-lab/src/i18n/core.d.mts | 1 + .../apps/design-lab/src/i18n/core.mjs | 4 + .../design-lab/src/i18n/designMessages.ts | 255 ++ .../design-lab/src/i18n/flowChatMessages.ts | 421 ++++ .../src/i18n/flowChatMockMessages.ts | 242 ++ .../src/i18n/foundationsMessages.ts | 152 ++ .../apps/design-lab/src/i18n/messages.ts | 167 +- .../design-lab/src/i18n/previewMessages.ts | 114 + .../src/i18n/semanticToolMessages.ts | 557 +++++ .../src/i18n/subagentMotionMessages.ts | 211 ++ design-system/apps/design-lab/src/main.tsx | 1 + .../apps/design-lab/src/pages/BrandPage.css | 395 ++++ .../apps/design-lab/src/pages/BrandPage.tsx | 238 ++ .../apps/design-lab/src/pages/ColorsPage.tsx | 162 +- .../src/pages/ComponentDetailPage.tsx | 887 +++---- .../design-lab/src/pages/ComponentsPage.tsx | 214 +- .../design-lab/src/pages/FlowChatMockPage.css | 381 +++ .../design-lab/src/pages/FlowChatMockPage.tsx | 51 + .../src/pages/FoundationSpecimens.css | 142 ++ .../src/pages/FoundationSpecimens.tsx | 228 ++ .../design-lab/src/pages/FoundationTokens.tsx | 76 + .../design-lab/src/pages/FoundationsPage.css | 168 ++ .../design-lab/src/pages/FoundationsPage.tsx | 279 +++ .../src/pages/GettingStartedPage.tsx | 92 +- .../design-lab/src/pages/OverviewPage.css | 199 ++ .../design-lab/src/pages/OverviewPage.tsx | 88 +- .../design-lab/src/pages/PatternsPage.tsx | 33 +- .../design-lab/src/pages/ResourcesPage.tsx | 19 +- .../design-lab/src/pages/SubagentIpPage.css | 156 ++ .../design-lab/src/pages/SubagentIpPage.tsx | 113 + .../design-lab/src/preview/BrandPreview.tsx | 45 + .../src/preview/ComponentOverview.tsx | 82 + .../src/preview/ComponentShowcase.css | 42 + .../src/preview/FlowChatMockConversation.tsx | 265 +++ .../src/preview/FlowChatMockTools.tsx | 62 + .../src/preview/FlowChatPreviewRegistry.tsx | 323 ++- .../src/preview/FlowChatScenarios.tsx | 177 ++ .../src/preview/FlowChatToolGallery.css | 49 +- .../src/preview/FlowChatToolGallery.tsx | 75 +- .../src/preview/LiveComponentExamples.tsx | 78 + .../src/preview/SemanticToolCardPreview.tsx | 103 + .../src/preview/SubagentMotionPreview.css | 338 +++ .../src/preview/SubagentMotionPreview.tsx | 384 +++ .../src/preview/componentPresentation.ts | 69 + .../src/preview/flowChatMockScenarios.ts | 44 + .../src/preview/flowChatTranslation.ts | 19 + .../design-lab/src/preview/subagentMotion.ts | 1 + .../src/preview/subagentMotionPlayer.ts | 1 + .../src/preview/useFlowChatFullscreen.ts | 71 + design-system/apps/design-lab/src/styles.css | 2081 +++-------------- .../src/token-editor/TokenEffectPreview.tsx | 9 +- .../src/token-editor/TokenWorkbench.tsx | 99 +- design-system/apps/design-lab/vite.config.ts | 15 +- .../apps/design-lab/vite/brand-page.test.mjs | 43 + .../vite/component-detail-contract.test.mjs | 219 +- .../vite/component-preview-render.test.mjs | 106 +- .../vite/flow-chat-mock-contract.test.mjs | 68 + .../design-lab/vite/icon-consumers.test.mjs | 28 +- .../vite/style-layer-contract.test.mjs | 32 +- design-system/package.json | 2 +- .../design-tokens/src/system.tokens.json | 50 +- .../design-tokens/src/typography-runtime.d.ts | 16 + .../design-tokens/src/typography-runtime.mjs | 49 + .../design-tokens/tests/contract.test.mjs | 27 +- .../theme-openbitfun/src/dark.tokens.json | 30 + .../theme-openbitfun/src/light.tokens.json | 30 + .../src/reference.tokens.json | 20 + .../tests/theme-contract.test.mjs | 21 + design-system/packages/ui/package.json | 6 +- design-system/packages/ui/src/brand.ts | 11 + .../ui/src/brand/OpenBitFunArtwork.tsx | 32 + .../ui/src/brand/OpenBitFunBrandMotion.tsx | 231 ++ .../packages/ui/src/brand/OpenBitFunMark.tsx | 29 + .../VoiceParticleLogo.meta.ts | 2 +- .../VoiceParticleLogo.module.css | 0 .../VoiceParticleLogo/VoiceParticleLogo.tsx | 0 .../VoiceParticleLogo/index.ts | 0 .../voiceParticleDynamics.ts | 0 .../voiceParticleFormation.ts | 0 .../voiceParticleRenderer.ts | 0 .../brand/assets/openbitfun-app-icon-128.png | Bin 0 -> 6717 bytes .../brand/assets/openbitfun-app-icon-16.png | Bin 0 -> 542 bytes .../brand/assets/openbitfun-app-icon-256.png | Bin 0 -> 15236 bytes .../brand/assets/openbitfun-app-icon-32.png | Bin 0 -> 1251 bytes .../brand/assets/openbitfun-app-icon-512.png | Bin 0 -> 30543 bytes .../src/brand/assets/openbitfun-app-mark.png | Bin 0 -> 27094 bytes .../ui/src/brand/assets/openbitfun-mark.svg | 17 + .../brand/assets/subagent-egg.palette.json | 16 + .../ui/src/brand/assets/subagent-egg.svg | 25 + .../packages/ui/src/brand/brand.meta.ts | 73 + .../packages/ui/src/brand/brand.module.css | 44 + .../packages/ui/src/brand/brandPlayback.ts | 36 + .../brand/subagent/SubagentHatch.module.css | 45 + .../ui/src/brand/subagent/SubagentHatch.tsx | 25 + .../src/brand/subagent/subagentHatchMotion.ts | 126 + .../ui/src/brand/subagent/subagentMotion.ts | 143 ++ .../brand/subagent/subagentMotionPlayer.ts | 106 + .../brand/subagent/useSubagentAvatarMotion.ts | 111 + .../src/components/Checkbox/Checkbox.meta.ts | 1 + .../components/Checkbox/Checkbox.module.css | 1 + .../ui/src/components/Checkbox/Checkbox.tsx | 6 +- .../packages/ui/src/components/Icon/Icon.tsx | 93 + .../packages/ui/src/components/Icon/index.ts | 1 + .../ui/src/components/Icon/layersPlus.ts | 27 + .../ui/src/components/Radio/Radio.meta.ts | 1 + .../ui/src/components/Radio/Radio.module.css | 1 + .../ui/src/components/Radio/Radio.tsx | 6 +- .../components/ScrollArea/ScrollArea.meta.ts | 10 +- .../ScrollArea/ScrollArea.module.css | 52 + .../src/components/ScrollArea/ScrollArea.tsx | 85 +- .../ui/src/components/ScrollArea/index.ts | 2 + .../components/StatusPill/StatusPill.meta.ts | 2 + .../StatusPill/StatusPill.module.css | 4 + .../src/components/StatusPill/StatusPill.tsx | 3 + .../ui/src/components/Tooltip/Tooltip.tsx | 15 +- .../VoiceCallPanel/VoiceCallIdentity.tsx | 2 +- .../VoiceCallPanel/VoiceCallPanel.tsx | 2 +- .../ui/src/flow-chat/ask-user/AskUser.meta.ts | 26 +- .../src/flow-chat/ask-user/AskUser.module.css | 451 ++-- .../ui/src/flow-chat/ask-user/AskUser.tsx | 386 ++- .../ui/src/flow-chat/ask-user/index.ts | 1 + .../conversation/ContextLoadGroup.tsx | 9 + .../conversation/ConversationBlocks.css | 764 ++++++ .../conversation/ConversationBlocks.meta.ts | 57 + .../flow-chat/conversation/ExploreGroup.tsx | 9 + .../conversation/FlowChatCollapse.tsx | 141 ++ .../conversation/FlowChatRuntimeStatus.tsx | 27 + .../src/flow-chat/conversation/FlowGroup.tsx | 221 ++ .../flow-chat/conversation/FlowItemRhythm.css | 92 + .../flow-chat/conversation/ThinkingBlock.tsx | 113 + .../flow-chat/conversation/ToolDuration.css | 83 + .../flow-chat/conversation/ToolDuration.tsx | 77 + .../src/flow-chat/conversation/ToolGroup.tsx | 28 + .../ui/src/flow-chat/conversation/index.ts | 7 + .../conversation/useThinkingAnnotation.ts | 267 +++ .../packages/ui/src/flow-chat/index.ts | 1 + .../flow-chat/motion/CapsuleMotion.module.css | 36 + .../ui/src/flow-chat/motion/capsuleMotion.ts | 190 ++ .../tool-cards/ActivityToolCards.module.css | 4 - .../tool-cards/ActivityToolCards.tsx | 57 +- .../AgentControlToolCard.module.css | 191 ++ .../tool-cards/AgentControlToolCard.tsx | 161 ++ .../tool-cards/AgentWaitTargetRail.module.css | 58 + .../tool-cards/AgentWaitTargetRail.tsx | 75 + .../tool-cards/AmbientToolCard.meta.ts | 10 +- .../tool-cards/CommandToolCard.meta.ts | 12 +- .../tool-cards/CommandToolCard.module.css | 214 +- .../flow-chat/tool-cards/CommandToolCard.tsx | 278 ++- .../tool-cards/ContextCompressionToolCard.tsx | 4 +- .../FileOperationToolCard.module.css | 5 +- .../tool-cards/FileOperationToolCard.tsx | 69 +- .../tool-cards/FlowChatToolCard.module.css | 472 +++- .../flow-chat/tool-cards/FlowChatToolCard.tsx | 395 +++- .../tool-cards/ProminentToolCard.meta.ts | 2 + .../tool-cards/ProminentToolCards.meta.ts | 15 +- .../tool-cards/ProminentToolCards.module.css | 119 +- .../tool-cards/ProminentToolCards.tsx | 216 +- .../flow-chat/tool-cards/ReadFileToolCard.tsx | 8 +- .../tool-cards/RuntimeToolCards.meta.ts | 30 + .../tool-cards/RuntimeToolCards.module.css | 29 + .../flow-chat/tool-cards/RuntimeToolCards.tsx | 157 ++ .../SearchResultsToolCards.module.css | 142 +- .../tool-cards/SearchResultsToolCards.tsx | 137 +- .../tool-cards/SemanticToolCards.meta.ts | 83 + .../tool-cards/SemanticToolCards.module.css | 29 + .../tool-cards/SemanticToolCards.tsx | 202 ++ .../tool-cards/SessionToolCards.module.css | 70 +- .../flow-chat/tool-cards/SessionToolCards.tsx | 106 +- .../StandardAmbientToolCards.module.css | 182 +- .../tool-cards/StandardAmbientToolCards.tsx | 246 +- .../tool-cards/StandardToolCards.meta.ts | 25 +- .../tool-cards/ToolCapsulePresentation.tsx | 43 + .../tool-cards/ToolCardCopyButton.tsx | 4 +- .../tool-cards/ToolCardDetails.module.css | 151 ++ .../flow-chat/tool-cards/ToolCardDetails.tsx | 105 + .../tool-cards/ToolCardInteraction.module.css | 30 + .../tool-cards/ToolCardInteraction.tsx | 70 + .../tool-cards/ToolCardStatusSlot.module.css | 4 +- .../tool-cards/ToolCardStatusSlot.tsx | 35 +- .../tool-cards/ToolProcessingDots.module.css | 57 +- .../tool-cards/ToolProcessingDots.tsx | 6 +- .../tool-cards/ToolRelationRow.meta.ts | 19 + .../tool-cards/ToolRelationRow.module.css | 68 + .../flow-chat/tool-cards/ToolRelationRow.tsx | 86 + .../ui/src/flow-chat/tool-cards/index.ts | 41 +- design-system/packages/ui/src/index.ts | 6 +- .../src/internal/applicationTitleTooltips.ts | 139 ++ .../ui/src/internal/tooltipTriggerContext.ts | 22 + .../primitives/OverflowText/OverflowText.tsx | 7 +- .../providers/ApplicationTitleTooltips.tsx | 25 + .../providers/DesignSystemProvider.context.ts | 6 + .../ui/src/providers/DesignSystemProvider.tsx | 18 +- design-system/packages/ui/src/registry.ts | 21 +- .../packages/ui/src/registry.types.ts | 2 +- .../packages/ui/src/styles/layers.css | 2 +- .../packages/ui/src/styles/scrollbars.css | 17 +- .../packages/ui/tests/ask-user.test.mjs | 73 +- .../packages/ui/tests/brand.test.mjs | 82 + .../ui/tests/context-load-group.test.mjs | 31 + .../ui/tests/flow-chat-tool-card.test.mjs | 508 +++- .../packages/ui/tests/icon-slots.test.mjs | 58 +- design-system/packages/ui/tests/icon.test.mjs | 22 +- .../packages/ui/tests/registry.test.mjs | 16 + .../ui/tests/runtime-tool-cards.test.mjs | 28 + .../packages/ui/tests/scroll-area.test.mjs | 7 +- .../ui/tests/semantic-tool-cards.test.mjs | 69 + .../packages/ui/tests/tooltip.test.mjs | 4 +- .../packages/ui/tests/voice-call.test.mjs | 4 +- design-system/packages/ui/vite.config.ts | 1 + packages/flow-chat-presentation/package.json | 45 + .../src/context-load.ts | 16 + .../src/deferredContent.tsx | 124 + .../src/exec/ExecProcessPresentation.tsx | 315 +++ .../src/exec/ExecRelationPresentation.tsx | 44 + .../src/exec/contracts.ts | 53 + .../flow-chat-presentation/src/exec/index.ts | 4 + .../flow-chat-presentation/src/exec/model.ts | 212 ++ .../flow-chat-presentation/src/explore.ts | 27 + .../flow-chat-presentation/src/registry.ts | 89 + .../flow-chat-presentation/src/scenarios.ts | 102 + packages/flow-chat-presentation/src/scroll.ts | 324 +++ packages/flow-chat-presentation/src/search.ts | 74 + .../src/sessionViewPreview.ts | 28 + .../flow-chat-presentation/src/tailEase.ts | 105 + .../terminal/LazyTerminalOutputRenderer.tsx | 71 + .../src/terminal/TerminalOutputRenderer.css | 55 + .../src/terminal/TerminalOutputRenderer.tsx | 329 +++ .../src/terminal/index.ts | 2 + .../terminal/terminalOutputPresentation.ts | 162 ++ .../flow-chat-presentation/src/thinking.ts | 35 + .../tests/catalog.test.tsx | 82 + .../tests/context-load.test.ts | 22 + .../tests/deferred-content.test.tsx | 135 ++ .../tests/explore.test.ts | 37 + .../tests/flow-group.test.tsx | 194 ++ .../tests/presentation.test.tsx | 304 +++ .../tests/relation-row.test.tsx | 88 + .../tests/scroll.test.tsx | 109 + .../tests/search.test.ts | 101 + .../tests/terminal-and-replay.test.tsx | 343 +++ packages/flow-chat-presentation/tsconfig.json | 19 + .../flow-chat-presentation/vitest.config.ts | 2 + pnpm-lock.yaml | 105 +- pnpm-workspace.yaml | 1 + scripts/appearance-dom-contracts.mjs | 83 + scripts/appearance-dom-contracts.test.mjs | 35 +- scripts/audit-appearance-contracts.mjs | 23 +- scripts/audit-typography-tokens.mjs | 2 + scripts/check-subagent-avatar-assets.mjs | 25 +- scripts/frontend-color-surface-registry.json | 22 +- scripts/generate-brand-assets.mjs | 17 +- scripts/generate-brand-assets.test.mjs | 11 + .../generate-startup-appearance-bootstrap.mjs | 17 +- ...rate-startup-appearance-bootstrap.test.mjs | 40 +- scripts/git-object-size-policy.json | 5 + scripts/i18n-dynamic-key-allowlist.json | 13 + scripts/startup-appearance-vite-config.mjs | 19 + scripts/web-font-profile.mjs | 47 +- scripts/web-font-profile.test.mjs | 107 +- src/apps/cli/src/dispatch/worker.rs | 3 + src/apps/cli/src/shared_runtime.rs | 3 + .../ui/generated/design-system.css | 80 +- .../desktop/src/generated/bootstrap_theme.css | 21 + .../src/agentic/coordination/coordinator.rs | 16 + .../coordination/host_message_queue.rs | 8 + .../coordination/host_message_queue_tests.rs | 91 + .../src/agentic/coordination/scheduler.rs | 15 +- .../contracts/config-contracts/src/types.rs | 25 +- src/crates/contracts/events/src/agentic.rs | 29 +- .../events/src/frontend_projection.rs | 4 + .../generated/default_appearance_style.html | 2 +- .../tests/remote_connect_contracts.rs | 1 + src/miniapp-market-web/package.json | 2 +- src/mobile-web/package.json | 2 +- src/skin-market-web/package.json | 2 +- src/web-ui/index.html | 85 +- src/web-ui/package.json | 3 +- src/web-ui/src/app/App.tsx | 6 +- .../components/AboutDialog/AboutBrandMark.tsx | 112 - .../components/AboutDialog/AboutDialog.scss | 5 +- .../components/AboutDialog/AboutDialog.tsx | 4 +- .../src/app/components/NavBar/NavBar.tsx | 13 +- .../src/app/components/NavPanel/MainNav.tsx | 2 +- .../src/app/components/NavPanel/NavPanel.scss | 44 +- .../components/PersistentFooterActions.tsx | 5 +- .../navigationIconIntegration.test.ts | 2 +- .../sections/sessions/SessionsSection.scss | 14 - .../sections/sessions/SessionsSection.tsx | 13 +- .../sessions/SessionsSectionLayout.test.ts | 7 +- .../sections/workspaces/WorkspaceItem.tsx | 13 +- .../SceneTopBar/SceneTopBar.test.tsx | 30 +- .../components/SplashScreen/SplashScreen.scss | 34 +- .../components/SplashScreen/SplashScreen.tsx | 3 +- .../components/panels/base/FlexiblePanel.tsx | 59 +- .../src/app/components/panels/base/utils.ts | 8 + .../app/global-search/GlobalSearchRoot.tsx | 2 +- .../app/global-search/productActionCatalog.ts | 4 +- src/web-ui/src/app/layout/AppLayout.tsx | 13 +- src/web-ui/src/app/scenes/SceneViewport.tsx | 28 +- .../app/scenes/agents/AgentsScene.test.tsx | 2 +- .../src/app/scenes/agents/AgentsScene.tsx | 2 +- .../components/AgentHarnessOverview.tsx | 2 +- .../app/scenes/assistant/AssistantScene.tsx | 5 +- .../EcosystemBatchLayout.tsx | 18 +- .../EcosystemCompatibilityScene.tsx | 5 +- .../ExternalAgentContent.tsx | 4 +- .../scenes/miniapps/MiniAppGalleryScene.tsx | 7 +- .../customization/MiniAppCustomizePanel.tsx | 3 +- .../miniapps/views/MiniAppGalleryView.tsx | 2 +- .../miniapps/views/MiniAppLibraryView.tsx | 2 +- .../miniapps/views/MiniAppMarketView.tsx | 2 +- .../miniapps/views/MiniAppSubmissionsView.tsx | 2 +- src/web-ui/src/app/scenes/nav-registry.ts | 14 +- .../src/app/scenes/pages/PagesScene.test.tsx | 2 +- .../src/app/scenes/pages/PagesScene.tsx | 7 +- .../profile/views/AssistantConfigPage.tsx | 4 +- .../profile/views/AssistantDefaultsPage.tsx | 2 +- .../scenes/profile/views/NurseryGallery.tsx | 4 +- .../src/app/scenes/session/ChatPane.tsx | 69 +- .../settings/pages/AutomationSettingsPage.tsx | 7 +- .../app/scenes/settings/settingsRegistry.ts | 9 +- .../src/app/scenes/shell/ShellScene.tsx | 5 +- .../src/app/scenes/skills/SkillsScene.tsx | 18 +- .../skills/components/SkillCard.test.tsx | 1 + .../scenes/skills/components/SkillCard.tsx | 7 +- .../src/app/scenes/welcome/WelcomeScene.scss | 4 +- .../src/app/scenes/welcome/WelcomeScene.tsx | 5 +- .../src/app/startup/startupModuleRecovery.ts | 10 +- .../startupPerformanceContract.test.ts | 30 +- .../src/app/startup/startupPreload.test.ts | 68 + src/web-ui/src/app/styles/scrollbar.test.ts | 14 +- .../src/app/styles/textClipping.test.ts | 2 +- .../app/workbench/workbenchContent.test.ts | 25 + .../assets/fonts/harmonyos-sans/LICENSE.txt | Bin 32768 -> 32766 bytes .../assets/fonts/harmonyos-sans/NOTICE.txt | 14 +- .../harmonyos-sans/base/HarmonyOS_Sans.ttf | Bin 0 -> 342076 bytes .../base/HarmonyOS_Sans_Bold.ttf | Bin 145860 -> 0 bytes .../base/HarmonyOS_Sans_Medium.ttf | Bin 146164 -> 0 bytes .../base/HarmonyOS_Sans_Regular.ttf | Bin 146616 -> 0 bytes .../harmonyos-sans/sc/HarmonyOS_Sans_SC.ttf | Bin 0 -> 20617156 bytes .../sc/HarmonyOS_Sans_SC_Bold.ttf | Bin 8158996 -> 0 bytes .../sc/HarmonyOS_Sans_SC_Medium.ttf | Bin 8227312 -> 0 bytes .../sc/HarmonyOS_Sans_SC_Regular.ttf | Bin 8261128 -> 0 bytes .../dispatch/DispatchTargetPicker.tsx | 4 +- src/web-ui/src/flow_chat/_item-rhythm.scss | 49 +- .../src/flow_chat/_markdown-typography.scss | 21 - .../src/flow_chat/_transcript-layout.scss | 25 +- .../assets/subagent-avatars/robot-01.svg | 1 - .../assets/subagent-avatars/robot-04.svg | 1 - .../assets/subagent-avatars/robot-05.svg | 1 - .../assets/subagent-avatars/robot-07.svg | 1 - .../assets/subagent-avatars/robot-10.svg | 1 - .../assets/subagent-avatars/robot-11.svg | 1 - .../assets/subagent-avatars/robot-13.svg | 1 - .../assets/subagent-avatars/robot-15.svg | 1 - .../assets/subagent-avatars/robot-18.svg | 1 - .../assets/subagent-avatars/robot-20.svg | 1 - .../flow_chat/components/AcpModeSelector.tsx | 2 +- .../src/flow_chat/components/AcpPlanPanel.tsx | 11 +- .../components/ChatContextPicker.tsx | 10 +- .../src/flow_chat/components/ChatInput.scss | 4 +- .../src/flow_chat/components/ChatInput.tsx | 151 +- .../components/ChatInputAttachments.test.tsx | 11 +- .../components/ChatInputWorkspaceStrip.scss | 6 +- .../components/ChatInputWorkspaceStrip.tsx | 23 +- .../src/flow_chat/components/CodePreview.scss | 47 +- .../src/flow_chat/components/CodePreview.tsx | 30 +- .../components/CoworkExampleCards.tsx | 24 +- .../components/DeepReviewConsentDialog.tsx | 6 +- .../FlowChatSurfaceElevation.test.ts | 2 +- .../FlowChatTypographyRoles.test.ts | 71 +- .../flow_chat/components/FlowTextBlock.scss | 187 +- .../components/FlowTextBlock.test.tsx | 26 + .../flow_chat/components/FlowTextBlock.tsx | 7 + .../components/FlowToolCard.appearance.ts | 2 +- .../flow_chat/components/FlowToolCard.scss | 33 +- .../components/FlowToolCard.test.tsx | 95 +- .../src/flow_chat/components/FlowToolCard.tsx | 98 +- .../components/FlowToolCardErrorBoundary.tsx | 2 +- .../components/HarnessProfileSelector.tsx | 4 +- .../components/ImageAnalysisCard.tsx | 6 +- .../components/InlineDiffPreview.scss | 352 ++- .../components/InlineDiffPreview.tsx | 255 +- .../flow_chat/components/ModelSelector.scss | 12 +- .../flow_chat/components/ModelSelector.tsx | 6 +- .../components/PendingQueuePanel.test.tsx | 4 +- .../components/PendingQueuePanel.tsx | 31 +- .../components/RichTextInput.test.tsx | 4 +- .../flow_chat/components/RichTextInput.tsx | 4 + .../components/ScrollToBottomButton.tsx | 4 +- .../TaskDetailPanel/TaskDetailPanel.scss | 171 +- .../TaskDetailPanel/TaskDetailPanel.tsx | 135 +- .../components/ThinkingDetailPanel.test.tsx | 188 ++ .../components/ThinkingDetailPanel.tsx | 92 + .../components/ToolStatusIndicator.tsx | 2 +- .../src/flow_chat/components/WelcomePanel.tsx | 7 +- .../BackgroundCommandOutputPanel.scss | 4 +- .../BackgroundCommandOutputPanel.tsx | 9 +- .../BackgroundTerminalProjection.tsx | 16 +- .../btw/BtwSessionPanel.appearance.ts | 1 - .../BtwSessionPanel.review-action.test.tsx | 92 +- .../components/btw/BtwSessionPanel.scss | 107 +- .../components/btw/BtwSessionPanel.tsx | 156 +- .../btw/BtwSessionPanelLayout.test.ts | 9 - .../components/btw/btwPanelViewState.ts | 1 + .../btw/useBtwPanelViewport.test.tsx | 7 +- .../components/inlineDiffModel.test.ts | 63 + .../flow_chat/components/inlineDiffModel.ts | 36 + .../components/inlineDiffPrismTheme.test.ts | 41 + .../components/inlineDiffPrismTheme.ts | 57 + .../components/inlineDiffTokens.test.ts | 59 + .../flow_chat/components/inlineDiffTokens.ts | 31 + .../modern/ExploreGroupRenderer.appearance.ts | 28 +- .../modern/ExploreGroupRenderer.tsx | 363 +-- .../components/modern/ExploreRegion.scss | 187 -- .../modern/FlowChatCollapseAlignment.test.ts | 41 +- .../components/modern/FlowChatContext.tsx | 11 +- .../components/modern/FlowChatHeader.tsx | 6 +- .../components/modern/FlowChatRhythm.test.ts | 133 +- .../modern/FlowGroupLifecycle.test.tsx | 256 ++ .../components/modern/FlowGroupRenderer.tsx | 311 +++ .../modern/FlowItemVisibility.test.tsx | 305 +++ .../modern/HistorySessionPlaceholder.tsx | 4 +- .../modern/MessageExportControls.test.tsx | 19 +- .../modern/ModelRoundItem.appearance.ts | 1 - .../components/modern/ModelRoundItem.scss | 177 +- .../components/modern/ModelRoundItem.tsx | 608 +++-- .../modern/ModernFlowChatContainer.tsx | 19 +- .../components/modern/RuntimeStatusSlot.scss | 54 +- .../modern/RuntimeStatusSlot.test.tsx | 7 +- .../components/modern/RuntimeStatusSlot.tsx | 36 +- .../modern/SessionFileModificationsBar.scss | 1 - .../modern/SessionFileModificationsBar.tsx | 2 +- .../components/modern/SessionFilesBadge.tsx | 2 +- .../components/modern/SessionTreePopover.tsx | 8 +- .../modern/SmoothHeightCollapse.scss | 51 +- .../modern/SmoothHeightCollapse.tsx | 140 +- .../components/modern/SubagentItems.scss | 94 - .../modern/TurnCompletionNoticeItem.tsx | 4 +- .../modern/TurnFailureNoticeItem.tsx | 4 +- .../UserMessageEditComposer.appearance.ts | 2 +- .../modern/UserMessageEditComposer.tsx | 147 +- .../components/modern/UserMessageItem.scss | 36 +- .../components/modern/UserMessageItem.tsx | 2 +- .../modern/UserMessageItemActions.test.ts | 7 +- .../modern/UserMessagePresentationContent.tsx | 5 +- .../modern/VirtualItemRenderer.scss | 27 +- .../components/modern/VirtualItemRenderer.tsx | 13 +- .../modern/VirtualMessageList.layout.test.ts | 49 +- .../components/modern/VirtualMessageList.scss | 1 - ...rtualMessageList.session-boundary.test.tsx | 93 +- .../components/modern/VirtualMessageList.tsx | 85 +- .../modern/contextLoadGrouping.test.ts | 151 ++ .../modern/exploreGroupProjection.test.ts | 143 ++ .../modern/exploreGroupProjection.ts | 2 + .../modern/flowChatCollapseMotion.ts | 10 +- .../components/modern/flowChatFocusTarget.ts | 33 +- .../components/modern/flowChatRhythm.ts | 60 +- .../modern/flowChatSearchDom.test.ts | 9 + .../components/modern/flowChatSearchDom.ts | 12 + .../modern/flowGroupRenderSegments.test.ts | 31 + .../modern/flowGroupRenderSegments.ts | 47 + .../modern/messageReferenceIcons.tsx | 22 +- .../modern/modelRoundItemGrouping.test.ts | 106 +- .../modern/modelRoundItemGrouping.ts | 121 +- .../modern/modelRoundItemMemo.test.ts | 14 + .../components/modern/modelRoundItemMemo.ts | 20 + .../modern/useExploreGroupState.test.tsx | 105 + .../components/modern/useExploreGroupState.ts | 82 +- .../useFlowChatNavigation.focus.test.tsx | 35 +- .../modern/useFlowChatNavigation.ts | 18 +- .../modern/useFlowChatSearch.test.ts | 17 + .../components/modern/useFlowChatSearch.ts | 5 +- .../useFlowChatSearchPresentation.test.tsx | 67 + .../modern/useFlowChatSearchPresentation.ts | 47 +- ...seFlowChatVirtualizer.measurement.test.tsx | 32 +- .../modern/useFlowChatVirtualizer.ts | 34 +- .../components/modern/useFlowGroupState.ts | 85 + .../modern/virtualItemHeightEstimators.ts | 62 +- .../modern/virtualMessageListLayout.ts | 3 +- .../components/session-menu/SessionMenu.tsx | 2 +- .../SubagentProjectionView.appearance.ts | 3 +- .../subagent/SubagentProjectionView.scss | 11 +- .../subagent/SubagentProjectionView.test.tsx | 22 +- .../subagent/SubagentProjectionView.tsx | 86 +- .../thread-goal/ThreadGoalDialogs.scss | 4 +- .../thread-goal/ThreadGoalDialogs.tsx | 4 +- .../usage/SessionRuntimeStatusEntry.tsx | 4 +- .../components/usage/SessionUsagePanel.scss | 9 +- .../components/usage/SessionUsagePanel.tsx | 32 +- .../usage/SessionUsageReportCard.scss | 5 +- .../usage/SessionUsageReportCard.tsx | 26 +- .../voice/ComposerVoiceInputButton.tsx | 11 +- .../voice/ConversationModeSurface.scss | 8 - .../voice/ConversationModeSurface.tsx | 7 +- .../DeepResearchProtocolGroup.tsx | 33 +- .../action-bar/DecisionExecutionGate.tsx | 4 +- .../action-bar/DeepReviewActionBar.tsx | 65 +- .../action-bar/RecoveryPlanPreview.tsx | 4 +- .../action-bar/RemediationSelectionPanel.tsx | 2 +- .../action-bar/ReviewActionControls.tsx | 2 +- .../action-bar/ReviewActionHeader.test.tsx | 8 +- .../action-bar/ReviewActionHeader.tsx | 15 +- .../grouping/activityClassification.ts | 94 + .../grouping/activityGrouping.test.ts | 187 ++ .../src/flow_chat/grouping/browse.test.ts | 90 + src/web-ui/src/flow_chat/grouping/browse.ts | 89 + .../src/flow_chat/grouping/companions.test.ts | 130 + .../src/flow_chat/grouping/groupProjection.ts | 171 ++ .../src/flow_chat/grouping/lifecycle.test.ts | 128 + .../src/flow_chat/grouping/lifecycle.ts | 23 + src/web-ui/src/flow_chat/grouping/policies.ts | 141 ++ .../grouping/receiveFeedback.test.ts | 70 + .../src/flow_chat/grouping/receiveFeedback.ts | 53 + .../src/flow_chat/grouping/roundGroups.ts | 155 ++ .../src/flow_chat/grouping/selectors.ts | 34 + src/web-ui/src/flow_chat/grouping/types.ts | 76 + .../hooks/useChatInputTargets.test.tsx | 107 + .../flow_chat/hooks/useChatInputTargets.ts | 109 + .../selection/ConversationExcerpt.scss | 32 +- .../selection/ConversationExcerptDialog.tsx | 33 +- .../selection/ConversationExcerptEditor.tsx | 25 +- .../selection/FlowChatSelectionBar.test.tsx | 2 +- .../selection/FlowChatSelectionBar.tsx | 4 +- .../useExcerptComposerActions.test.tsx | 7 +- .../selection/useExcerptComposerActions.ts | 11 +- .../services/BtwThreadService.test.ts | 10 + .../flow_chat/services/BtwThreadService.ts | 4 + .../src/flow_chat/services/FlowChatManager.ts | 1 + .../btwSessionPane.navigation.test.ts | 119 + .../src/flow_chat/services/btwSessionPane.ts | 123 +- .../EventHandlerModule.test.ts | 2 + .../flow-chat-manager/EventHandlerModule.ts | 7 + .../flow-chat-manager/MessageModule.test.ts | 147 +- .../flow-chat-manager/MessageModule.ts | 52 +- .../flow_chat/services/hostQueueSubmission.ts | 22 + .../flow_chat/services/openBtwSession.test.ts | 43 +- .../flow_chat/services/openThinkingPanel.ts | 31 + .../flow_chat/services/steeringSubmission.ts | 35 + .../conversationCapability.test.ts | 36 + .../session-drivers/conversationCapability.ts | 78 + .../local/LocalSessionDriver.ts | 8 +- .../src/flow_chat/session-drivers/types.ts | 2 + .../useComposerCapabilities.ts | 3 + .../src/flow_chat/store/FlowChatStore.test.ts | 21 + .../src/flow_chat/store/FlowChatStore.ts | 24 +- .../store/TaskCollapseStateManager.ts | 62 - .../store/askUserQuestionDraftStore.test.ts | 19 + .../store/askUserQuestionDraftStore.ts | 16 +- .../store/modernFlowChatStore.test.ts | 745 ++---- .../flow_chat/store/modernFlowChatStore.ts | 361 +-- .../subagent-identity/SubagentAvatar.scss | 24 +- .../subagent-identity/SubagentAvatar.test.tsx | 49 +- .../subagent-identity/SubagentAvatar.tsx | 28 +- .../SubagentDelegationAvatar.test.tsx | 154 ++ .../SubagentDelegationAvatar.tsx | 13 + .../subagent-identity/avatarResolver.ts | 17 +- .../subagent-identity/identityHash.ts | 9 + .../src/flow_chat/subagent-identity/index.ts | 3 + .../subagent-identity/nameResolver.test.ts | 28 + .../subagent-identity/nameResolver.ts | 42 + .../tool-cards/AcpPermissionActions.tsx | 4 +- .../tool-cards/AgentControlToolCard.test.tsx | 317 ++- .../tool-cards/AgentControlToolCard.tsx | 113 +- .../tool-cards/AgentDeleteToolCard.tsx | 42 + .../tool-cards/AgentInteractionToolCard.tsx | 46 + .../tool-cards/AgentWaitToolCard.scss | 100 + .../tool-cards/AgentWaitToolCard.test.tsx | 302 ++- .../tool-cards/AgentWaitToolCard.tsx | 163 +- .../tool-cards/AskUserQuestionCard.test.tsx | 233 +- .../tool-cards/AskUserQuestionCard.tsx | 194 +- .../tool-cards/BuiltinImagePreview.tsx | 40 + .../tool-cards/BuiltinMarketDialog.tsx | 31 + .../flow_chat/tool-cards/BuiltinToolCard.tsx | 172 ++ .../flow_chat/tool-cards/CanvasToolCard.scss | 6 +- .../tool-cards/CanvasToolCard.test.tsx | 34 +- .../flow_chat/tool-cards/CanvasToolCard.tsx | 51 +- .../CodeReviewReportExportActions.test.tsx | 7 +- .../CodeReviewReportExportActions.tsx | 13 +- .../tool-cards/CodeReviewToolCard.scss | 646 +---- .../tool-cards/CodeReviewToolCard.test.tsx | 5 +- .../tool-cards/CodeReviewToolCard.tsx | 63 +- .../ComputerUseToolCard.appearance.ts | 2 +- .../tool-cards/ComputerUseToolCard.scss | 48 +- .../tool-cards/ComputerUseToolCard.tsx | 99 +- .../ContextCompressionDisplay.test.tsx | 8 +- .../tool-cards/ContextCompressionDisplay.tsx | 27 +- .../tool-cards/ControlHubToolCard.tsx | 110 + .../tool-cards/CreatePlanDisplay.scss | 75 +- .../tool-cards/CreatePlanDisplay.tsx | 65 +- .../src/flow_chat/tool-cards/CronToolCard.tsx | 98 +- .../tool-cards/DefaultToolCard.test.tsx | 13 +- .../flow_chat/tool-cards/DefaultToolCard.tsx | 138 +- .../tool-cards/ExecControlToolCard.tsx | 10 +- .../ExecProcessToolCardView.test.tsx | 69 +- .../tool-cards/ExecProcessToolCardView.tsx | 370 +-- .../tool-cards/FileOperationToolCard.test.tsx | 31 +- .../tool-cards/FileOperationToolCard.tsx | 39 +- .../tool-cards/GenerativeWidgetToolCard.scss | 38 +- .../tool-cards/GenerativeWidgetToolCard.tsx | 77 +- .../tool-cards/GetFileDiffDisplay.tsx | 4 +- .../tool-cards/GetToolSpecCard.test.tsx | 7 +- .../flow_chat/tool-cards/GetToolSpecCard.tsx | 32 +- .../tool-cards/GlobSearchDisplay.tsx | 49 +- .../tool-cards/GrepSearchDisplay.tsx | 61 +- .../src/flow_chat/tool-cards/LSDisplay.tsx | 44 +- .../tool-cards/ListModelsToolCard.tsx | 31 + .../flow_chat/tool-cards/MCPToolDisplay.scss | 92 +- .../tool-cards/MCPToolDisplay.test.tsx | 2 +- .../flow_chat/tool-cards/MCPToolDisplay.tsx | 77 +- .../MiniAppToolDisplay.appearance.ts | 2 +- .../tool-cards/MiniAppToolDisplay.scss | 47 +- .../tool-cards/MiniAppToolDisplay.test.tsx | 68 + .../tool-cards/MiniAppToolDisplay.tsx | 59 +- .../ModelThinkingDisplay.appearance.ts | 1 + .../tool-cards/ModelThinkingDisplay.scss | 376 +-- .../tool-cards/ModelThinkingDisplay.test.tsx | 467 +++- .../tool-cards/ModelThinkingDisplay.tsx | 444 +--- .../ModelThinkingDisplay.typewriter.test.tsx | 79 +- .../tool-cards/OpenBitFunControlToolCard.scss | 24 +- .../OpenBitFunControlToolCard.test.tsx | 16 +- .../tool-cards/OpenBitFunControlToolCard.tsx | 30 +- .../tool-cards/PageDeployToolDisplay.tsx | 22 +- .../tool-cards/PagePublishToolDisplay.tsx | 40 +- .../flow_chat/tool-cards/ReadFileDisplay.tsx | 97 +- .../tool-cards/RelationshipToolCards.test.tsx | 104 + .../tool-cards/ReviewSessionSummaryCard.tsx | 27 +- .../flow_chat/tool-cards/RunCodeToolCard.tsx | 23 +- .../SessionControlToolCard.test.tsx | 37 +- .../tool-cards/SessionControlToolCard.tsx | 158 +- .../tool-cards/SessionMessageToolCard.tsx | 91 +- .../tool-cards/SkillDisplay.test.tsx | 45 +- .../src/flow_chat/tool-cards/SkillDisplay.tsx | 51 +- .../SnapshotFullscreenDiffViewer.css | 1 - .../SnapshotFullscreenDiffViewer.tsx | 10 +- .../tool-cards/TaskToolDisplay.appearance.ts | 5 +- .../flow_chat/tool-cards/TaskToolDisplay.scss | 149 -- .../tool-cards/TaskToolDisplay.test.tsx | 564 ++--- .../flow_chat/tool-cards/TaskToolDisplay.tsx | 481 +--- .../tool-cards/TodoWriteDisplay.test.tsx | 31 +- .../flow_chat/tool-cards/TodoWriteDisplay.tsx | 75 +- .../ToolCapsuleInteraction.test.tsx | 66 + .../tool-cards/ToolCapsuleMotion.test.tsx | 162 ++ .../tool-cards/ToolCapsuleRecord.tsx | 17 + .../tool-cards/ToolCardInformation.test.tsx | 126 + .../tool-cards/ToolTimeoutIndicator.scss | 84 - .../tool-cards/ToolTimeoutIndicator.test.tsx | 2 +- .../tool-cards/ToolTimeoutIndicator.tsx | 78 +- .../tool-cards/ViewImageToolCard.test.tsx | 2 +- .../tool-cards/ViewImageToolCard.tsx | 24 +- .../tool-cards/WebFetchCard.test.tsx | 7 +- .../src/flow_chat/tool-cards/WebFetchCard.tsx | 37 +- .../flow_chat/tool-cards/WebSearchCard.tsx | 37 +- .../tool-cards/WriteStdinToolCard.tsx | 10 +- .../tool-cards/agentWaitAvatarTargets.test.ts | 105 + .../tool-cards/agentWaitAvatarTargets.ts | 76 + .../tool-cards/builtinAgentSessions.ts | 28 + .../tool-cards/builtinContextCardModel.ts | 163 ++ .../tool-cards/builtinToolCardModel.test.ts | 156 ++ .../tool-cards/builtinToolCardModel.ts | 225 ++ .../tool-cards/builtinToolCardPolicy.ts | 39 + .../tool-cards/builtinWorkflowCardModel.ts | 214 ++ .../tool-cards/contextLoadClassification.ts | 29 + .../execProcessToolCardModel.test.ts | 8 + .../tool-cards/execProcessToolCardModel.ts | 198 +- .../src/flow_chat/tool-cards/index.test.ts | 33 +- src/web-ui/src/flow_chat/tool-cards/index.ts | 35 +- .../tool-cards/runtimeToolCardModel.test.ts | 123 + .../tool-cards/runtimeToolCardModel.ts | 167 ++ .../tool-cards/toolCapsuleLayout.test.ts | 94 + .../flow_chat/tool-cards/toolCapsuleLayout.ts | 52 + .../tool-cards/toolCapsuleModel.test.ts | 70 + .../flow_chat/tool-cards/toolCapsuleModel.ts | 113 + .../flow_chat/tool-cards/toolCardMetadata.ts | 175 +- .../flow_chat/tool-cards/toolCardStatus.ts | 29 + .../tool-cards/toolInteractionModel.test.ts | 56 + .../tool-cards/toolInteractionModel.ts | 87 + .../tool-cards/useToolSessionParticipant.ts | 79 + .../flow_chat/types/flow-chat-projection.ts | 48 + src/web-ui/src/flow_chat/types/flow-chat.ts | 6 +- .../chatInputSessionSubscription.test.ts | 8 + .../utils/chatInputSessionSubscription.ts | 7 + .../flow_chat/utils/chatInputTarget.test.ts | 64 +- .../src/flow_chat/utils/chatInputTarget.ts | 47 +- .../src/flow_chat/utils/flowChatTailEase.ts | 106 +- .../src/flow_chat/utils/flowItemVisibility.ts | 22 + .../flow_chat/utils/sessionMetadata.test.ts | 16 + .../src/flow_chat/utils/sessionMetadata.ts | 29 +- .../src/flow_chat/utils/sessionViewPreview.ts | 29 +- .../src/flow_chat/utils/subagentProjection.ts | 4 +- .../src/flow_chat/utils/toolInterruption.ts | 3 +- src/web-ui/src/font-profiles/apple-system.css | 2 +- .../src/font-profiles/harmony-bundled.css | 47 +- .../api/service-api/AgentAPI.ts | 1 + .../appearance/appearanceDomainTokens.ts | 1 + .../appearance/appearanceTokenContract.ts | 1 + .../builtins/appearancePresetOutput.test.ts | 20 + .../builtins/buildBuiltinAppearance.ts | 2 + .../builtins/composeAppearancePackage.test.ts | 23 +- .../builtins/subagentAvatarTokens.ts | 45 + .../compiler/AppearanceCompiler.test.ts | 17 + .../registry/defaultAppearanceRegistry.ts | 5 +- .../config/components/EditorConfig.tsx | 11 +- .../infrastructure/config/schemas/editor.json | 7 +- .../OpenBitFunDesignSystemProvider.tsx | 4 + .../design-system/typographyRuntime.test.ts | 33 + .../design-system/typographyRuntime.ts | 87 +- .../infrastructure/i18n/core/I18nService.ts | 7 +- .../src/infrastructure/markdown/Markdown.scss | 544 ++--- .../markdown/MarkdownCodeBody.tsx | 87 + .../markdown/MarkdownRenderer.test.tsx | 33 +- .../markdown/MarkdownRenderer.tsx | 140 +- .../infrastructure/markdown/MermaidBlock.scss | 4 +- .../markdown/markdownPrismTheme.ts | 22 +- .../src/infrastructure/runtime/window.ts | 10 +- .../infrastructure/update/AppUpdatePanel.scss | 2 +- .../infrastructure/update/AppUpdatePanel.tsx | 3 +- .../update/DailyAppUpdateGate.tsx | 5 +- .../update/UpdateNotificationCard.scss | 1 - .../update/UpdateNotificationCard.tsx | 3 +- src/web-ui/src/locales/en-US/components.json | 1 + src/web-ui/src/locales/en-US/errors.json | 5 + src/web-ui/src/locales/en-US/flow-chat.json | 698 +++++- .../src/locales/en-US/settings/editor.json | 1 + src/web-ui/src/locales/zh-CN/components.json | 1 + src/web-ui/src/locales/zh-CN/errors.json | 5 + src/web-ui/src/locales/zh-CN/flow-chat.json | 702 +++++- .../src/locales/zh-CN/settings/editor.json | 1 + src/web-ui/src/locales/zh-TW/components.json | 1 + src/web-ui/src/locales/zh-TW/errors.json | 5 + src/web-ui/src/locales/zh-TW/flow-chat.json | 702 +++++- .../src/locales/zh-TW/settings/editor.json | 1 + src/web-ui/src/shared/types/panelContent.ts | 1 + .../src/shared/types/session-history.ts | 3 + .../ui/ApplicationTitleTooltips.test.tsx | 226 ++ src/web-ui/src/shared/ui/ScrollArea.test.tsx | 119 + .../src/shared/ui/ThinkingAnnotation.test.tsx | 278 +++ .../shared/utils/lazyWithRecovery.test.tsx | 135 ++ .../src/shared/utils/lazyWithRecovery.tsx | 133 ++ .../src/shared/utils/moduleLoader.test.ts | 62 + src/web-ui/src/shared/utils/moduleLoader.ts | 55 + .../shared/utils/syntaxHighlighterLoader.ts | 12 +- .../tools/editor/components/CodeEditor.tsx | 13 +- .../tools/editor/components/DiffEditor.tsx | 3 +- .../src/tools/editor/config/defaults.ts | 8 +- .../editor/services/EditorOptionsBuilder.ts | 8 +- .../components/GitGraphView/GitGraphView.tsx | 9 +- .../mermaid-editor/services/MermaidService.ts | 8 +- .../OpenBitFunCanvasPanel.tsx | 3 +- .../components/LazyTerminalOutputRenderer.tsx | 81 +- .../tools/terminal/components/Terminal.tsx | 2 +- .../components/TerminalOutputRenderer.scss | 44 +- .../components/TerminalOutputRenderer.tsx | 320 +-- .../terminal/components/terminalOutputHost.ts | 17 + .../components/terminalOutputPresentation.ts | 158 +- src/web-ui/vite.config.ts | 9 +- 771 files changed, 39760 insertions(+), 16581 deletions(-) create mode 100644 design-system/apps/design-lab/src/assets/subagentAvatars.ts create mode 100644 design-system/apps/design-lab/src/components/LabNavigation.tsx create mode 100644 design-system/apps/design-lab/src/design-layout.css create mode 100644 design-system/apps/design-lab/src/i18n/brandMessages.ts create mode 100644 design-system/apps/design-lab/src/i18n/designMessages.ts create mode 100644 design-system/apps/design-lab/src/i18n/flowChatMessages.ts create mode 100644 design-system/apps/design-lab/src/i18n/flowChatMockMessages.ts create mode 100644 design-system/apps/design-lab/src/i18n/foundationsMessages.ts create mode 100644 design-system/apps/design-lab/src/i18n/previewMessages.ts create mode 100644 design-system/apps/design-lab/src/i18n/semanticToolMessages.ts create mode 100644 design-system/apps/design-lab/src/i18n/subagentMotionMessages.ts create mode 100644 design-system/apps/design-lab/src/pages/BrandPage.css create mode 100644 design-system/apps/design-lab/src/pages/BrandPage.tsx create mode 100644 design-system/apps/design-lab/src/pages/FlowChatMockPage.css create mode 100644 design-system/apps/design-lab/src/pages/FlowChatMockPage.tsx create mode 100644 design-system/apps/design-lab/src/pages/FoundationSpecimens.css create mode 100644 design-system/apps/design-lab/src/pages/FoundationSpecimens.tsx create mode 100644 design-system/apps/design-lab/src/pages/FoundationTokens.tsx create mode 100644 design-system/apps/design-lab/src/pages/FoundationsPage.css create mode 100644 design-system/apps/design-lab/src/pages/FoundationsPage.tsx create mode 100644 design-system/apps/design-lab/src/pages/OverviewPage.css create mode 100644 design-system/apps/design-lab/src/pages/SubagentIpPage.css create mode 100644 design-system/apps/design-lab/src/pages/SubagentIpPage.tsx create mode 100644 design-system/apps/design-lab/src/preview/BrandPreview.tsx create mode 100644 design-system/apps/design-lab/src/preview/ComponentOverview.tsx create mode 100644 design-system/apps/design-lab/src/preview/ComponentShowcase.css create mode 100644 design-system/apps/design-lab/src/preview/FlowChatMockConversation.tsx create mode 100644 design-system/apps/design-lab/src/preview/FlowChatMockTools.tsx create mode 100644 design-system/apps/design-lab/src/preview/FlowChatScenarios.tsx create mode 100644 design-system/apps/design-lab/src/preview/LiveComponentExamples.tsx create mode 100644 design-system/apps/design-lab/src/preview/SemanticToolCardPreview.tsx create mode 100644 design-system/apps/design-lab/src/preview/SubagentMotionPreview.css create mode 100644 design-system/apps/design-lab/src/preview/SubagentMotionPreview.tsx create mode 100644 design-system/apps/design-lab/src/preview/componentPresentation.ts create mode 100644 design-system/apps/design-lab/src/preview/flowChatMockScenarios.ts create mode 100644 design-system/apps/design-lab/src/preview/flowChatTranslation.ts create mode 100644 design-system/apps/design-lab/src/preview/subagentMotion.ts create mode 100644 design-system/apps/design-lab/src/preview/subagentMotionPlayer.ts create mode 100644 design-system/apps/design-lab/src/preview/useFlowChatFullscreen.ts create mode 100644 design-system/apps/design-lab/vite/brand-page.test.mjs create mode 100644 design-system/apps/design-lab/vite/flow-chat-mock-contract.test.mjs create mode 100644 design-system/packages/ui/src/brand.ts create mode 100644 design-system/packages/ui/src/brand/OpenBitFunArtwork.tsx create mode 100644 design-system/packages/ui/src/brand/OpenBitFunBrandMotion.tsx create mode 100644 design-system/packages/ui/src/brand/OpenBitFunMark.tsx rename design-system/packages/ui/src/{components => brand}/VoiceParticleLogo/VoiceParticleLogo.meta.ts (96%) rename design-system/packages/ui/src/{components => brand}/VoiceParticleLogo/VoiceParticleLogo.module.css (100%) rename design-system/packages/ui/src/{components => brand}/VoiceParticleLogo/VoiceParticleLogo.tsx (100%) rename design-system/packages/ui/src/{components => brand}/VoiceParticleLogo/index.ts (100%) rename design-system/packages/ui/src/{components => brand}/VoiceParticleLogo/voiceParticleDynamics.ts (100%) rename design-system/packages/ui/src/{components => brand}/VoiceParticleLogo/voiceParticleFormation.ts (100%) rename design-system/packages/ui/src/{components => brand}/VoiceParticleLogo/voiceParticleRenderer.ts (100%) create mode 100644 design-system/packages/ui/src/brand/assets/openbitfun-app-icon-128.png create mode 100644 design-system/packages/ui/src/brand/assets/openbitfun-app-icon-16.png create mode 100644 design-system/packages/ui/src/brand/assets/openbitfun-app-icon-256.png create mode 100644 design-system/packages/ui/src/brand/assets/openbitfun-app-icon-32.png create mode 100644 design-system/packages/ui/src/brand/assets/openbitfun-app-icon-512.png create mode 100644 design-system/packages/ui/src/brand/assets/openbitfun-app-mark.png create mode 100644 design-system/packages/ui/src/brand/assets/openbitfun-mark.svg create mode 100644 design-system/packages/ui/src/brand/assets/subagent-egg.palette.json create mode 100644 design-system/packages/ui/src/brand/assets/subagent-egg.svg create mode 100644 design-system/packages/ui/src/brand/brand.meta.ts create mode 100644 design-system/packages/ui/src/brand/brand.module.css create mode 100644 design-system/packages/ui/src/brand/brandPlayback.ts create mode 100644 design-system/packages/ui/src/brand/subagent/SubagentHatch.module.css create mode 100644 design-system/packages/ui/src/brand/subagent/SubagentHatch.tsx create mode 100644 design-system/packages/ui/src/brand/subagent/subagentHatchMotion.ts create mode 100644 design-system/packages/ui/src/brand/subagent/subagentMotion.ts create mode 100644 design-system/packages/ui/src/brand/subagent/subagentMotionPlayer.ts create mode 100644 design-system/packages/ui/src/brand/subagent/useSubagentAvatarMotion.ts create mode 100644 design-system/packages/ui/src/components/Icon/layersPlus.ts create mode 100644 design-system/packages/ui/src/flow-chat/conversation/ContextLoadGroup.tsx create mode 100644 design-system/packages/ui/src/flow-chat/conversation/ConversationBlocks.css create mode 100644 design-system/packages/ui/src/flow-chat/conversation/ConversationBlocks.meta.ts create mode 100644 design-system/packages/ui/src/flow-chat/conversation/ExploreGroup.tsx create mode 100644 design-system/packages/ui/src/flow-chat/conversation/FlowChatCollapse.tsx create mode 100644 design-system/packages/ui/src/flow-chat/conversation/FlowChatRuntimeStatus.tsx create mode 100644 design-system/packages/ui/src/flow-chat/conversation/FlowGroup.tsx create mode 100644 design-system/packages/ui/src/flow-chat/conversation/FlowItemRhythm.css create mode 100644 design-system/packages/ui/src/flow-chat/conversation/ThinkingBlock.tsx create mode 100644 design-system/packages/ui/src/flow-chat/conversation/ToolDuration.css create mode 100644 design-system/packages/ui/src/flow-chat/conversation/ToolDuration.tsx create mode 100644 design-system/packages/ui/src/flow-chat/conversation/ToolGroup.tsx create mode 100644 design-system/packages/ui/src/flow-chat/conversation/index.ts create mode 100644 design-system/packages/ui/src/flow-chat/conversation/useThinkingAnnotation.ts create mode 100644 design-system/packages/ui/src/flow-chat/motion/CapsuleMotion.module.css create mode 100644 design-system/packages/ui/src/flow-chat/motion/capsuleMotion.ts create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/AgentControlToolCard.module.css create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/AgentControlToolCard.tsx create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/AgentWaitTargetRail.module.css create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/AgentWaitTargetRail.tsx create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/RuntimeToolCards.meta.ts create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/RuntimeToolCards.module.css create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/RuntimeToolCards.tsx create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/SemanticToolCards.meta.ts create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/SemanticToolCards.module.css create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/SemanticToolCards.tsx create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/ToolCapsulePresentation.tsx create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/ToolCardDetails.module.css create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/ToolCardDetails.tsx create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/ToolCardInteraction.module.css create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/ToolCardInteraction.tsx create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/ToolRelationRow.meta.ts create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/ToolRelationRow.module.css create mode 100644 design-system/packages/ui/src/flow-chat/tool-cards/ToolRelationRow.tsx create mode 100644 design-system/packages/ui/src/internal/applicationTitleTooltips.ts create mode 100644 design-system/packages/ui/src/providers/ApplicationTitleTooltips.tsx create mode 100644 design-system/packages/ui/tests/brand.test.mjs create mode 100644 design-system/packages/ui/tests/context-load-group.test.mjs create mode 100644 design-system/packages/ui/tests/runtime-tool-cards.test.mjs create mode 100644 design-system/packages/ui/tests/semantic-tool-cards.test.mjs create mode 100644 packages/flow-chat-presentation/package.json create mode 100644 packages/flow-chat-presentation/src/context-load.ts create mode 100644 packages/flow-chat-presentation/src/deferredContent.tsx create mode 100644 packages/flow-chat-presentation/src/exec/ExecProcessPresentation.tsx create mode 100644 packages/flow-chat-presentation/src/exec/ExecRelationPresentation.tsx create mode 100644 packages/flow-chat-presentation/src/exec/contracts.ts create mode 100644 packages/flow-chat-presentation/src/exec/index.ts create mode 100644 packages/flow-chat-presentation/src/exec/model.ts create mode 100644 packages/flow-chat-presentation/src/explore.ts create mode 100644 packages/flow-chat-presentation/src/registry.ts create mode 100644 packages/flow-chat-presentation/src/scenarios.ts create mode 100644 packages/flow-chat-presentation/src/scroll.ts create mode 100644 packages/flow-chat-presentation/src/search.ts create mode 100644 packages/flow-chat-presentation/src/sessionViewPreview.ts create mode 100644 packages/flow-chat-presentation/src/tailEase.ts create mode 100644 packages/flow-chat-presentation/src/terminal/LazyTerminalOutputRenderer.tsx create mode 100644 packages/flow-chat-presentation/src/terminal/TerminalOutputRenderer.css create mode 100644 packages/flow-chat-presentation/src/terminal/TerminalOutputRenderer.tsx create mode 100644 packages/flow-chat-presentation/src/terminal/index.ts create mode 100644 packages/flow-chat-presentation/src/terminal/terminalOutputPresentation.ts create mode 100644 packages/flow-chat-presentation/src/thinking.ts create mode 100644 packages/flow-chat-presentation/tests/catalog.test.tsx create mode 100644 packages/flow-chat-presentation/tests/context-load.test.ts create mode 100644 packages/flow-chat-presentation/tests/deferred-content.test.tsx create mode 100644 packages/flow-chat-presentation/tests/explore.test.ts create mode 100644 packages/flow-chat-presentation/tests/flow-group.test.tsx create mode 100644 packages/flow-chat-presentation/tests/presentation.test.tsx create mode 100644 packages/flow-chat-presentation/tests/relation-row.test.tsx create mode 100644 packages/flow-chat-presentation/tests/scroll.test.tsx create mode 100644 packages/flow-chat-presentation/tests/search.test.ts create mode 100644 packages/flow-chat-presentation/tests/terminal-and-replay.test.tsx create mode 100644 packages/flow-chat-presentation/tsconfig.json create mode 100644 packages/flow-chat-presentation/vitest.config.ts create mode 100644 scripts/startup-appearance-vite-config.mjs delete mode 100644 src/web-ui/src/app/components/AboutDialog/AboutBrandMark.tsx create mode 100644 src/web-ui/src/assets/fonts/harmonyos-sans/base/HarmonyOS_Sans.ttf delete mode 100644 src/web-ui/src/assets/fonts/harmonyos-sans/base/HarmonyOS_Sans_Bold.ttf delete mode 100644 src/web-ui/src/assets/fonts/harmonyos-sans/base/HarmonyOS_Sans_Medium.ttf delete mode 100644 src/web-ui/src/assets/fonts/harmonyos-sans/base/HarmonyOS_Sans_Regular.ttf create mode 100644 src/web-ui/src/assets/fonts/harmonyos-sans/sc/HarmonyOS_Sans_SC.ttf delete mode 100644 src/web-ui/src/assets/fonts/harmonyos-sans/sc/HarmonyOS_Sans_SC_Bold.ttf delete mode 100644 src/web-ui/src/assets/fonts/harmonyos-sans/sc/HarmonyOS_Sans_SC_Medium.ttf delete mode 100644 src/web-ui/src/assets/fonts/harmonyos-sans/sc/HarmonyOS_Sans_SC_Regular.ttf delete mode 100644 src/web-ui/src/flow_chat/_markdown-typography.scss create mode 100644 src/web-ui/src/flow_chat/components/ThinkingDetailPanel.test.tsx create mode 100644 src/web-ui/src/flow_chat/components/ThinkingDetailPanel.tsx create mode 100644 src/web-ui/src/flow_chat/components/inlineDiffModel.test.ts create mode 100644 src/web-ui/src/flow_chat/components/inlineDiffModel.ts create mode 100644 src/web-ui/src/flow_chat/components/inlineDiffPrismTheme.test.ts create mode 100644 src/web-ui/src/flow_chat/components/inlineDiffPrismTheme.ts create mode 100644 src/web-ui/src/flow_chat/components/inlineDiffTokens.test.ts create mode 100644 src/web-ui/src/flow_chat/components/inlineDiffTokens.ts create mode 100644 src/web-ui/src/flow_chat/components/modern/FlowGroupLifecycle.test.tsx create mode 100644 src/web-ui/src/flow_chat/components/modern/FlowGroupRenderer.tsx create mode 100644 src/web-ui/src/flow_chat/components/modern/FlowItemVisibility.test.tsx delete mode 100644 src/web-ui/src/flow_chat/components/modern/SubagentItems.scss create mode 100644 src/web-ui/src/flow_chat/components/modern/contextLoadGrouping.test.ts create mode 100644 src/web-ui/src/flow_chat/components/modern/exploreGroupProjection.test.ts create mode 100644 src/web-ui/src/flow_chat/components/modern/exploreGroupProjection.ts create mode 100644 src/web-ui/src/flow_chat/components/modern/flowGroupRenderSegments.test.ts create mode 100644 src/web-ui/src/flow_chat/components/modern/flowGroupRenderSegments.ts create mode 100644 src/web-ui/src/flow_chat/components/modern/useExploreGroupState.test.tsx create mode 100644 src/web-ui/src/flow_chat/components/modern/useFlowChatSearchPresentation.test.tsx create mode 100644 src/web-ui/src/flow_chat/components/modern/useFlowGroupState.ts create mode 100644 src/web-ui/src/flow_chat/grouping/activityClassification.ts create mode 100644 src/web-ui/src/flow_chat/grouping/activityGrouping.test.ts create mode 100644 src/web-ui/src/flow_chat/grouping/browse.test.ts create mode 100644 src/web-ui/src/flow_chat/grouping/browse.ts create mode 100644 src/web-ui/src/flow_chat/grouping/companions.test.ts create mode 100644 src/web-ui/src/flow_chat/grouping/groupProjection.ts create mode 100644 src/web-ui/src/flow_chat/grouping/lifecycle.test.ts create mode 100644 src/web-ui/src/flow_chat/grouping/lifecycle.ts create mode 100644 src/web-ui/src/flow_chat/grouping/policies.ts create mode 100644 src/web-ui/src/flow_chat/grouping/receiveFeedback.test.ts create mode 100644 src/web-ui/src/flow_chat/grouping/receiveFeedback.ts create mode 100644 src/web-ui/src/flow_chat/grouping/roundGroups.ts create mode 100644 src/web-ui/src/flow_chat/grouping/selectors.ts create mode 100644 src/web-ui/src/flow_chat/grouping/types.ts create mode 100644 src/web-ui/src/flow_chat/hooks/useChatInputTargets.test.tsx create mode 100644 src/web-ui/src/flow_chat/hooks/useChatInputTargets.ts create mode 100644 src/web-ui/src/flow_chat/services/btwSessionPane.navigation.test.ts create mode 100644 src/web-ui/src/flow_chat/services/hostQueueSubmission.ts create mode 100644 src/web-ui/src/flow_chat/services/openThinkingPanel.ts create mode 100644 src/web-ui/src/flow_chat/services/steeringSubmission.ts create mode 100644 src/web-ui/src/flow_chat/session-drivers/conversationCapability.test.ts create mode 100644 src/web-ui/src/flow_chat/session-drivers/conversationCapability.ts delete mode 100644 src/web-ui/src/flow_chat/store/TaskCollapseStateManager.ts create mode 100644 src/web-ui/src/flow_chat/subagent-identity/SubagentDelegationAvatar.test.tsx create mode 100644 src/web-ui/src/flow_chat/subagent-identity/SubagentDelegationAvatar.tsx create mode 100644 src/web-ui/src/flow_chat/subagent-identity/identityHash.ts create mode 100644 src/web-ui/src/flow_chat/subagent-identity/nameResolver.test.ts create mode 100644 src/web-ui/src/flow_chat/subagent-identity/nameResolver.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/AgentDeleteToolCard.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/AgentInteractionToolCard.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/AgentWaitToolCard.scss create mode 100644 src/web-ui/src/flow_chat/tool-cards/BuiltinImagePreview.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/BuiltinMarketDialog.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/BuiltinToolCard.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/ControlHubToolCard.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/ListModelsToolCard.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/MiniAppToolDisplay.test.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/RelationshipToolCards.test.tsx delete mode 100644 src/web-ui/src/flow_chat/tool-cards/TaskToolDisplay.scss create mode 100644 src/web-ui/src/flow_chat/tool-cards/ToolCapsuleInteraction.test.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/ToolCapsuleMotion.test.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/ToolCapsuleRecord.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/ToolCardInformation.test.tsx create mode 100644 src/web-ui/src/flow_chat/tool-cards/agentWaitAvatarTargets.test.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/agentWaitAvatarTargets.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/builtinAgentSessions.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/builtinContextCardModel.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/builtinToolCardModel.test.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/builtinToolCardModel.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/builtinToolCardPolicy.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/builtinWorkflowCardModel.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/contextLoadClassification.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/runtimeToolCardModel.test.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/runtimeToolCardModel.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/toolCapsuleLayout.test.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/toolCapsuleLayout.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/toolCapsuleModel.test.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/toolCapsuleModel.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/toolCardStatus.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/toolInteractionModel.test.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/toolInteractionModel.ts create mode 100644 src/web-ui/src/flow_chat/tool-cards/useToolSessionParticipant.ts create mode 100644 src/web-ui/src/flow_chat/types/flow-chat-projection.ts create mode 100644 src/web-ui/src/flow_chat/utils/flowItemVisibility.ts create mode 100644 src/web-ui/src/infrastructure/appearance/builtins/subagentAvatarTokens.ts create mode 100644 src/web-ui/src/infrastructure/markdown/MarkdownCodeBody.tsx create mode 100644 src/web-ui/src/shared/ui/ApplicationTitleTooltips.test.tsx create mode 100644 src/web-ui/src/shared/ui/ScrollArea.test.tsx create mode 100644 src/web-ui/src/shared/ui/ThinkingAnnotation.test.tsx create mode 100644 src/web-ui/src/shared/utils/lazyWithRecovery.test.tsx create mode 100644 src/web-ui/src/shared/utils/lazyWithRecovery.tsx create mode 100644 src/web-ui/src/shared/utils/moduleLoader.test.ts create mode 100644 src/web-ui/src/shared/utils/moduleLoader.ts create mode 100644 src/web-ui/src/tools/terminal/components/terminalOutputHost.ts diff --git a/OpenBitFun-Installer/package.json b/OpenBitFun-Installer/package.json index e5ebfd1547..0f49121031 100644 --- a/OpenBitFun-Installer/package.json +++ b/OpenBitFun-Installer/package.json @@ -38,7 +38,7 @@ "react": "^18.3.1", "react-dom": "^18.3.1", "react-i18next": "^16.5.3", - "lucide-react": "^0.541.0" + "lucide-react": "^0.560.0" }, "devDependencies": { "@tauri-apps/cli": "2.11.4", diff --git a/OpenBitFun-Installer/src/App.tsx b/OpenBitFun-Installer/src/App.tsx index 0323cc6c72..77560281f3 100644 --- a/OpenBitFun-Installer/src/App.tsx +++ b/OpenBitFun-Installer/src/App.tsx @@ -3,7 +3,7 @@ import { DesignSystemProvider, Select } from '@openbitfun/ui'; import { useTranslation } from 'react-i18next'; import { WindowControls } from './components/WindowControls'; import { StepIndicator } from './components/StepIndicator'; -import appIcon from './assets/openbitfun-app-icon-16.png'; +import { OpenBitFunAppIcon } from '@openbitfun/ui/brand'; import { LanguageSelect } from './pages/LanguageSelect'; import { Options } from './pages/Options'; import { ModelSetup } from './pages/ModelSetup'; @@ -128,7 +128,7 @@ function App() {
- + {t('shared.product.name')}
{installer.previewOnly && ( diff --git a/OpenBitFun-Installer/src/components/BrandMark.tsx b/OpenBitFun-Installer/src/components/BrandMark.tsx index b3b0cb0428..08a2e26862 100644 --- a/OpenBitFun-Installer/src/components/BrandMark.tsx +++ b/OpenBitFun-Installer/src/components/BrandMark.tsx @@ -1,3 +1,5 @@ +import { OpenBitFunMark } from '@openbitfun/ui/brand'; + interface BrandMarkProps { size?: 'medium' | 'hero'; working?: boolean; @@ -5,5 +7,5 @@ interface BrandMarkProps { /** The canonical fine-line vector is painted with the active surface's text color. */ export function BrandMark({ size = 'medium', working = false }: BrandMarkProps) { - return
- - - -
- v0.1.0 - -
- -
- - -
-
+ + + {t("search.label")} + + + + setSearchQuery(event.target.value)} + leadingIcon={} clearLabel={t("design.clear")} onClear={() => setSearchQuery("")} + onKeyDown={event => { + if (event.nativeEvent.isComposing) return; + if (event.key === "ArrowDown") { + event.preventDefault(); + searchResultsRef.current?.querySelector('[role="option"]')?.focus(); + } else if (event.key === "Enter" && visibleSearchDestinations[0]) { + event.preventDefault(); + navigate(visibleSearchDestinations[0].route); + } + }} /> + + {visibleSearchDestinations.map(destination => ( + : } + onClick={() => navigate(destination.route)}> + {destination.label} + + ))} + {visibleSearchDestinations.length === 0 && {t("search.noResults", { query: searchQuery })}} + + + + + + + + {t("settings.title")} + {t("settings.subtitle")} + + + + + + + + + + + + + OpenBitFun Design + + + + page === "tokens" ? openTokenPage() : navigate({ page })} /> + page === "tokens" ? openTokenPage() : navigate({ page })} /> + + + + page === "tokens" ? openTokenPage() : navigate({ page })} />
{route.page === "overview" && ( navigate({ page: target })} /> )} + {route.page === "foundations" && page === "tokens" ? openTokenPage() : navigate({ page })} + />} + {route.page === "getting-started" && ( navigate({ page: target })} /> )} - {route.page === "components" && ( + {(["components", "component", "mobile", "flow-chat"].includes(route.page)) && ( openTokenPage()} + onInspectTokens={openTokenPage} onOpenComponent={(name) => navigate({ componentName: name, page: "component" })} tokenOverrides={tokenOverrides} /> )} - {route.page === "mobile" && ( - openTokenPage()} - onOpenComponent={(name) => navigate({ componentName: name, page: "component" })} - tokenOverrides={tokenOverrides} - /> - )} + {route.page === "brand" && navigate({ componentName: name, page: "component" })} />} {route.page === "patterns" && ( )} - {route.page === "flow-chat" && ( - openTokenPage()} - onOpenComponent={(name) => navigate({ componentName: name, page: "component" })} - tokenOverrides={tokenOverrides} - /> - )} - - {route.page === "component" && activeComponent && ( - navigate({ - page: activeComponent.category === "flow-chat" - ? "flow-chat" - : activeComponent.category === "mobile" - ? "mobile" - : "components", - })} - onInspectTokens={openTokenPage} - tokenOverrides={tokenOverrides} - /> - )} + {route.page === "flow-chat-mock" && } {route.page === "tokens" && ( - + )} /> @@ -925,9 +624,12 @@ export function App() { /> )} + {route.page === "subagent-ip" && } + {route.page === "resources" && }
+ ); } diff --git a/design-system/apps/design-lab/src/assets/subagentAvatars.ts b/design-system/apps/design-lab/src/assets/subagentAvatars.ts new file mode 100644 index 0000000000..3feaf43aa0 --- /dev/null +++ b/design-system/apps/design-lab/src/assets/subagentAvatars.ts @@ -0,0 +1,5 @@ +// Design Lab previews the product's authored catalog without loading its runtime. +export { + SUBAGENT_AVATAR_CATALOG, + type SubagentAvatarId, +} from "../../../../../src/web-ui/src/flow_chat/subagent-identity/catalog"; diff --git a/design-system/apps/design-lab/src/components/LabNavigation.tsx b/design-system/apps/design-lab/src/components/LabNavigation.tsx new file mode 100644 index 0000000000..1bb81891dc --- /dev/null +++ b/design-system/apps/design-lab/src/components/LabNavigation.tsx @@ -0,0 +1,32 @@ +import { useI18n, type MessageKey } from "../i18n"; + +type Page = "components" | "foundations" | "brand" | "colors" | "tokens" | "getting-started" | "resources" | "patterns" | "flow-chat" | "flow-chat-mock" | "mobile" | "subagent-ip"; +type NavigationProps = { page: string; componentName?: string; onNavigate: (page: Page) => void }; +function sectionFor(page: string) { + return ["brand", "subagent-ip"].includes(page) ? "brand" + : ["foundations", "colors", "tokens", "getting-started", "resources"].includes(page) ? "foundations" + : page === "overview" ? undefined : "components"; +} +export function LabNavigation({ page, onNavigate }: NavigationProps) { + const { t } = useI18n(); + return ; +} +export function LabSectionNavigation({ page, onNavigate }: NavigationProps) { + const { t } = useI18n(); + const section = sectionFor(page); + const links: readonly [Page, MessageKey][] = section === "brand" + ? [["brand", "design.identity"], ["subagent-ip", "design.characters"]] + : section === "foundations" + ? [["foundations", "design.foundations"], ["colors", "nav.colors"], ["tokens", "design.tokens"], ["getting-started", "nav.gettingStarted"], ["resources", "nav.resources"]] + : section === "components" + ? [["components", "design.all"], ["patterns", "design.contexts"], ["flow-chat-mock", "design.conversation"]] + : []; + if (!links.length) return null; + return ; +} diff --git a/design-system/apps/design-lab/src/components/VoiceCallPreview.tsx b/design-system/apps/design-lab/src/components/VoiceCallPreview.tsx index 9d42f002e2..d44614cad0 100644 --- a/design-system/apps/design-lab/src/components/VoiceCallPreview.tsx +++ b/design-system/apps/design-lab/src/components/VoiceCallPreview.tsx @@ -1,5 +1,6 @@ import { useState } from "react"; -import { Button, VoiceCallPanel, VoiceParticleLogo, type VoiceCallPhase } from "@openbitfun/ui"; +import { Button, VoiceCallPanel, type VoiceCallPhase } from "@openbitfun/ui"; +import { VoiceParticleLogo } from "@openbitfun/ui/brand"; import { useI18n } from "../i18n"; import "./VoiceCallPreview.css"; diff --git a/design-system/apps/design-lab/src/design-layout.css b/design-system/apps/design-lab/src/design-layout.css new file mode 100644 index 0000000000..36875207d5 --- /dev/null +++ b/design-system/apps/design-lab/src/design-layout.css @@ -0,0 +1,307 @@ +/* The site shell uses the same theme, density and control contracts as its specimens. */ +:root[data-openbitfun-design-system-root] { + color-scheme: light; + color: var(--openbitfun-color-content-primary); + background: var(--openbitfun-color-surface-canvas); + font-family: var(--openbitfun-type-body-md-font-family); + font-size: var(--openbitfun-type-body-md-font-size); + font-weight: var(--openbitfun-type-body-md-font-weight); + line-height: var(--openbitfun-type-body-md-line-height); +} +:root[data-openbitfun-design-system-root][data-color-scheme="dark"] { color-scheme: dark; } + +.lab-shell { + --_lab-topbar-height: var(--openbitfun-space-16); + --_lab-section-height: calc(var(--openbitfun-control-tab-group-item-height) + var(--openbitfun-space-4)); + --_lab-content-width: 1360px; + display: block; + min-height: 100dvh; + color: var(--openbitfun-color-content-primary); + background: var(--openbitfun-color-surface-canvas); + font-family: var(--openbitfun-type-body-md-font-family); + font-size: var(--openbitfun-type-body-md-font-size); + font-weight: var(--openbitfun-type-body-md-font-weight); + line-height: var(--openbitfun-type-body-md-line-height); +} +.lab-shell [hidden] { display: none !important; } +.lab-workspace, .lab-content { min-width: 0; } +.lab-topbar { + position: sticky; + top: 0; + z-index: var(--openbitfun-layer-sticky); + display: flex; + align-items: center; + gap: var(--openbitfun-space-6); + min-height: var(--_lab-topbar-height); + padding: var(--openbitfun-space-2) max(var(--openbitfun-space-6), calc((100% - var(--_lab-content-width)) / 2 + var(--openbitfun-space-6))); + background: var(--openbitfun-color-surface-canvas); +} +.design-wordmark-link { + display: inline-flex; + flex: none; + align-items: center; + gap: var(--openbitfun-space-2); + color: var(--openbitfun-color-content-primary); + text-decoration: none; + white-space: nowrap; + font-family: var(--openbitfun-type-label-lg-font-family); + font-size: var(--openbitfun-type-label-lg-font-size); + font-weight: var(--openbitfun-type-label-selected-font-weight); +} +.design-wordmark-suffix { color: var(--openbitfun-color-content-secondary); font-weight: var(--openbitfun-type-body-md-font-weight); } +.design-primary-navigation, .design-secondary-navigation { display: flex; align-items: center; gap: var(--openbitfun-control-tab-group-gap); } +.design-primary-navigation { flex: 1; } +.design-secondary-navigation { + max-width: var(--_lab-content-width); + min-height: var(--_lab-section-height); + margin-inline: auto; + padding: var(--openbitfun-space-2) var(--openbitfun-space-6); + overflow-x: auto; +} +/* Routes remain real links; their geometry and states follow TabGroup. */ +.design-primary-navigation a, .design-secondary-navigation a { + display: inline-flex; + flex: none; + align-items: center; + min-height: var(--openbitfun-control-tab-group-item-height); + padding: var(--openbitfun-space-component-block) var(--openbitfun-control-tab-group-item-padding-inline); + border: var(--openbitfun-border-width-default) solid transparent; + border-radius: var(--openbitfun-control-tab-group-item-radius); + color: var(--openbitfun-color-content-secondary); + background: transparent; + font-family: var(--openbitfun-type-label-md-font-family); + font-size: var(--openbitfun-type-label-md-font-size); + font-weight: var(--openbitfun-type-label-md-font-weight); + line-height: var(--openbitfun-type-label-md-line-height); + text-decoration: none; + white-space: nowrap; + transition: background-color var(--openbitfun-motion-duration-fast) var(--openbitfun-motion-easing-standard), color var(--openbitfun-motion-duration-fast) var(--openbitfun-motion-easing-standard); +} +.design-primary-navigation a[aria-current], .design-secondary-navigation a[aria-current] { + color: var(--openbitfun-color-content-primary); + background: var(--openbitfun-color-selection-surface); + font-weight: var(--openbitfun-type-label-selected-font-weight); +} +.design-primary-navigation a:hover, .design-secondary-navigation a:hover { color: var(--openbitfun-color-content-primary); background: var(--openbitfun-color-action-neutral-surface-hover); } +.lab-topbar-actions { display: flex; align-items: center; gap: var(--openbitfun-space-2); margin-inline-start: auto; } +.lab-navigation-trigger { display: none; } +.lab-search-trigger { flex: none; } +.lab-search-shortcut { margin-inline-start: var(--openbitfun-space-4); } +.lab-search-dialog, .lab-settings-form { display: flex; flex-direction: column; gap: var(--openbitfun-space-4); } +.lab-search-options { max-height: min(55dvh, 32rem); } +.lab-settings-field { display: grid; gap: var(--openbitfun-space-2); } +.lab-settings-field > span:first-child { color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-label-md-font-size); } +.lab-mobile-navigation { display: flex; flex-direction: column; gap: var(--openbitfun-space-6); } +.lab-mobile-navigation :is(.design-primary-navigation, .design-secondary-navigation) { display: flex; flex-direction: column; align-items: stretch; margin: 0; padding: 0; } +.lab-page { width: 100%; max-width: var(--_lab-content-width); padding: var(--openbitfun-space-8) var(--openbitfun-space-6) var(--openbitfun-space-12); margin-inline: auto; } +.page-heading { display: grid; gap: var(--openbitfun-space-3); max-width: 52rem; margin-bottom: var(--openbitfun-space-6); } +.page-heading--split > div:first-child { display: grid; min-width: 0; gap: var(--openbitfun-space-3); } +.lab-shell :is(.page-heading, .component-detail-heading, .colors-heading-copy, .guide-hero, .brand-gallery-heading) h1 { + margin: 0; + font-family: var(--openbitfun-type-heading-page-font-family); + font-size: var(--openbitfun-type-heading-page-font-size); + font-weight: var(--openbitfun-type-heading-page-font-weight); + line-height: var(--openbitfun-type-heading-page-line-height); + letter-spacing: var(--openbitfun-type-heading-page-letter-spacing); + overflow-wrap: anywhere; +} +.page-kicker { + color: var(--openbitfun-color-content-muted); + font-family: var(--openbitfun-type-label-sm-font-family); + font-size: var(--openbitfun-type-label-sm-font-size); + font-weight: var(--openbitfun-type-label-sm-font-weight); + line-height: var(--openbitfun-type-label-sm-line-height); + letter-spacing: var(--openbitfun-type-label-sm-letter-spacing); + text-transform: none; +} +.lab-shell :is(.page-heading, .component-detail-heading, .colors-heading-copy, .guide-hero) p { margin: 0; max-width: 46rem; color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-body-md-font-size); line-height: var(--openbitfun-type-body-md-line-height); } +.design-brand-page p, .design-foundation-section p, .design-component-usage p, .design-component-tokens p { color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-body-md-font-size); line-height: var(--openbitfun-type-body-md-line-height); } +.design-component-card h2 a { display: flex; gap: var(--openbitfun-space-3); align-items: center; justify-content: space-between; color: inherit; text-decoration: none; } +.design-component-card h2 a::after { content: ""; position: absolute; inset: 0; border-radius: var(--openbitfun-radius-lg); } +.design-catalog-search { display: flex; gap: var(--openbitfun-space-5); align-items: center; margin-bottom: var(--openbitfun-space-4); } +.design-catalog-search > :first-child { flex: 1; max-width: 34rem; } +.design-catalog-search > span:last-child { color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-body-sm-font-size); white-space: nowrap; } +.design-catalog-filters { display: flex; gap: var(--openbitfun-space-5); flex-wrap: wrap; padding-block: var(--openbitfun-space-3); margin-bottom: var(--openbitfun-space-8); border-bottom: var(--openbitfun-border-width-default) solid var(--openbitfun-color-border-subtle); } +.design-catalog-filter { position: relative; padding: var(--openbitfun-space-2) 0 var(--openbitfun-space-3); border: 0; background: transparent; color: var(--openbitfun-color-content-muted); font: inherit; font-size: var(--openbitfun-type-body-sm-font-size); cursor: pointer; } +.design-catalog-filter[aria-pressed="true"] { color: var(--openbitfun-color-content-primary); } +.design-catalog-filter[aria-pressed="true"]::after { content: ""; position: absolute; bottom: calc(-1 * var(--openbitfun-space-3)); inset-inline: 0; height: var(--openbitfun-border-width-strong); background: currentColor; } +.lab-shell[data-component-library] .design-secondary-navigation { position: sticky; top: var(--_lab-topbar-height); z-index: calc(var(--openbitfun-layer-sticky) - 1); height: var(--_lab-section-height); background: var(--openbitfun-color-surface-canvas); } +.lab-page.design-component-library { display: grid; grid-template-columns: 256px minmax(0, 1fr); align-items: start; column-gap: var(--openbitfun-space-10); padding-block: 0; min-height: calc(100dvh - var(--_lab-topbar-height) - var(--_lab-section-height)); } +.design-library-sidebar { position: sticky; top: calc(var(--_lab-topbar-height) + var(--_lab-section-height)); height: calc(100dvh - var(--_lab-topbar-height) - var(--_lab-section-height)); min-height: 0; min-width: 0; display: flex; flex-direction: column; gap: var(--openbitfun-space-4); padding-block: var(--openbitfun-space-6); padding-inline-end: var(--openbitfun-space-5); } +.design-library-heading { display: flex; align-items: center; gap: var(--openbitfun-space-2); flex: none; } +.design-library-heading h2 { margin: 0; font-size: var(--openbitfun-type-heading-card-font-size); font-weight: var(--openbitfun-type-heading-card-font-weight); } +.design-library-count { margin-inline-start: auto; color: var(--openbitfun-color-content-muted); font-size: var(--openbitfun-type-body-xs-font-size); white-space: nowrap; } +.design-library-toggle { + display: none; } +.design-library-index { display: flex; flex-direction: column; gap: var(--openbitfun-space-4); min-height: 0; flex: 1; } +.design-library-index > :first-child { flex-shrink: 0; } +.design-library-list { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: var(--openbitfun-space-1); margin-inline: calc(-1 * var(--openbitfun-space-1)); } +.design-library-group + .design-library-group { margin-top: var(--openbitfun-space-5); } +.design-library-group h3 { margin: 0; padding: var(--openbitfun-space-2) var(--openbitfun-space-3); color: var(--openbitfun-color-content-muted); font-size: var(--openbitfun-type-label-sm-font-size); font-weight: var(--openbitfun-type-label-sm-font-weight); } +.design-library-group ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--openbitfun-space-1); } +.design-library-link { position: relative; display: flex; align-items: center; min-height: var(--openbitfun-control-height-md); padding: var(--openbitfun-space-2) var(--openbitfun-space-3); border-radius: var(--openbitfun-radius-md); color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-label-md-font-size); line-height: var(--openbitfun-type-label-md-line-height); text-decoration: none; } +.design-library-link:hover { color: var(--openbitfun-color-content-primary); background: var(--openbitfun-color-action-neutral-surface-hover); } +.design-library-link[aria-current="page"] { color: var(--openbitfun-color-content-primary); background: var(--openbitfun-color-action-neutral-surface); font-weight: var(--openbitfun-type-label-selected-font-weight); } +.design-library-sidebar :is(a, button):focus-visible { outline: var(--openbitfun-focus-width) solid var(--openbitfun-color-focus-ring); outline-offset: var(--openbitfun-focus-offset); } +.design-library-empty { padding: var(--openbitfun-space-3); color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-body-sm-font-size); } +.design-library-footer { flex: none; display: grid; gap: var(--openbitfun-space-3); padding: var(--openbitfun-space-4) var(--openbitfun-space-3) 0; } +.design-library-footer a { display: flex; align-items: center; justify-content: space-between; gap: var(--openbitfun-space-2); color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-body-sm-font-size); text-decoration: none; } +.design-library-footer a:hover { color: var(--openbitfun-color-content-primary); } +.design-library-content { min-width: 0; padding-block: var(--openbitfun-space-6) var(--openbitfun-space-12); } +.design-library-detail { min-width: 0; } +.design-library-detail .component-detail-heading { min-height: 0; padding: 0; } +.design-library-detail .component-detail-heading > div { min-width: 0; gap: var(--openbitfun-space-3); } +.design-library-detail .component-detail-heading h1 { margin: 0; overflow-wrap: anywhere; } +.design-library-detail .component-preview-main { gap: var(--openbitfun-space-6); } +.design-library-detail .design-state-comparison { margin-block: 0; } +.design-library-detail .component-inspector { top: calc(var(--_lab-topbar-height) + var(--_lab-section-height) + var(--openbitfun-space-6)); max-height: calc(100dvh - var(--_lab-topbar-height) - var(--_lab-section-height) - var(--openbitfun-space-12)); } +.design-catalog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); gap: var(--openbitfun-space-8) var(--openbitfun-space-5); } +.design-component-card { position: relative; min-width: 0; border-radius: var(--openbitfun-radius-lg); } +.design-component-card-preview { height: 240px; overflow: hidden; display: flex; align-items: center; justify-content: center; gap: var(--openbitfun-space-3); padding: var(--openbitfun-space-6); border: 0; border-radius: var(--openbitfun-radius-lg); background: var(--openbitfun-color-surface-subtle); pointer-events: none; } +.design-component-card-preview > * { max-width: 100%; } +.design-component-card-preview .flow-chat-preview-frame { min-width: 0; width: 100%; } +.design-component-card-preview .lab-brand-solid-stage { display: contents; } +.design-component-card-copy { padding: var(--openbitfun-space-4) var(--openbitfun-space-1) 0; } +.design-component-card h2 { margin: var(--openbitfun-space-2) 0 var(--openbitfun-space-2); font-size: var(--openbitfun-type-heading-panel-font-size); overflow-wrap: anywhere; } +.design-component-card p { color: var(--openbitfun-color-content-secondary); margin: 0; font-size: var(--openbitfun-type-body-sm-font-size); line-height: var(--openbitfun-type-body-sm-line-height); } +.design-component-card:hover .design-component-card-preview { border-color: var(--openbitfun-color-border-strong); } +.design-component-card:focus-within { outline: var(--openbitfun-focus-width) solid var(--openbitfun-color-focus-ring); outline-offset: var(--openbitfun-focus-offset); } +.design-context-link { display: flex; align-items: center; justify-content: space-between; gap: var(--openbitfun-space-5); padding: var(--openbitfun-space-5); margin-bottom: var(--openbitfun-space-8); background: var(--openbitfun-color-surface-subtle); border-radius: var(--openbitfun-radius-lg); } +.design-context-link h2 { margin: 0 0 var(--openbitfun-space-2); font-size: var(--openbitfun-type-heading-card-font-size); } +.design-context-link p { margin: 0; color: var(--openbitfun-color-content-secondary); } +.design-directory-footer, .design-preview-caption { display: flex; align-items: center; justify-content: space-between; gap: var(--openbitfun-space-4); padding-top: var(--openbitfun-space-6); } +.design-directory-footer a, .design-preview-caption a { display: inline-flex; align-items: center; gap: var(--openbitfun-space-2); color: var(--openbitfun-color-content-primary); } +.design-state-comparison, .design-tool-reference { margin-block: var(--openbitfun-space-6); } +.design-state-comparison > summary, .design-tool-reference > summary { padding: var(--openbitfun-space-4) 0; cursor: pointer; font-size: var(--openbitfun-type-label-lg-font-size); } +.design-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: var(--openbitfun-space-6); } +.design-detail-layout[data-inspector-open] { grid-template-columns: minmax(0, 1fr) 280px; } +.design-detail-layout .component-inspector { position: sticky; top: calc(var(--_lab-topbar-height) + var(--_lab-section-height) + var(--openbitfun-space-4)); max-height: calc(100dvh - var(--_lab-topbar-height) - var(--_lab-section-height) - var(--openbitfun-space-8)); overflow-y: auto; } +.design-detail-layout .component-inspector-content { display: block; } +.design-detail-layout .component-preview-panel { border: 0; border-radius: var(--openbitfun-radius-lg); overflow: visible; } +.design-preview-toolbar { flex-wrap: wrap; gap: var(--openbitfun-space-3); padding: var(--openbitfun-space-4); border-bottom: 0; } +.design-preview-options { display: flex; align-items: center; flex-wrap: wrap; gap: var(--openbitfun-space-3); padding: 0 var(--openbitfun-space-4) var(--openbitfun-space-3); } +.design-preview-options .component-inspector-select { display: flex; align-items: center; gap: var(--openbitfun-space-2); } +.design-preview-options select { width: auto; max-width: 15rem; } +.design-selected-stage { display: flex; flex-direction: column; justify-content: center; min-height: 300px; min-width: 0; padding: var(--openbitfun-space-10); background: var(--openbitfun-color-surface-panel); border-radius: 0 0 var(--openbitfun-radius-lg) var(--openbitfun-radius-lg); } +.design-selected-component { min-width: 0; display: flex; align-items: center; justify-content: center; gap: var(--openbitfun-space-4); width: 100%; margin-inline: auto; } +.design-selected-component > * { max-width: 100%; } +.design-selected-component > label { display: flex; gap: var(--openbitfun-space-2); align-items: center; } +.design-selected-stage[data-narrow] > * { width: 100%; max-width: 360px; margin-inline: auto; } +.design-selected-stage[data-chat] { background: var(--openbitfun-color-surface-canvas); } +.design-selected-stage[data-chat] > * { width: 100%; max-width: var(--openbitfun-control-flow-chat-transcript-max-width); margin-inline: auto; } +.design-selected-stage[data-chat][data-narrow] > * { max-width: 360px; } +.design-selected-stage[data-mode="conversation"] { gap: var(--openbitfun-control-flow-chat-flow-item-gap); } +.design-selected-stage[data-chat] .design-selected-component { display: block; } +.design-selected-stage[data-guides] .design-selected-component { outline: var(--openbitfun-border-width-default) dashed var(--openbitfun-color-border-strong); outline-offset: var(--openbitfun-space-2); } +.design-preview-context-before, .design-preview-context-after { color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-flow-body-font-size); line-height: var(--openbitfun-type-flow-body-line-height); } +.design-context-user { width: fit-content; max-width: var(--openbitfun-control-flow-chat-user-message-max-width); margin-inline-start: auto; margin-bottom: var(--openbitfun-control-flow-chat-turn-gap); border-radius: var(--openbitfun-control-flow-chat-user-message-radius); background: var(--openbitfun-color-surface-subtle); padding: var(--openbitfun-control-flow-chat-user-message-padding-block) var(--openbitfun-control-flow-chat-content-padding-inline); } +.design-preview-caption { padding: var(--openbitfun-space-3) var(--openbitfun-space-4); font-size: var(--openbitfun-type-body-xs-font-size); color: var(--openbitfun-color-content-secondary); } +.design-preview-caption p { margin: 0; flex: 1; } +.design-preview-caption a { white-space: nowrap; } +.design-component-usage, .design-component-api, .design-component-tokens { padding-block: var(--openbitfun-space-3); } +.design-component-api .component-inspector-props > div { grid-template-columns: minmax(6rem, .6fr) minmax(0, 2fr) minmax(3rem, .6fr); padding: var(--openbitfun-space-3) 0; } +.design-component-api .component-inspector-props span { overflow-wrap: anywhere; } +.design-component-tokens .component-inspector-token-list { flex-direction: row; flex-wrap: wrap; } +.design-state-comparison .component-preview-canvas { max-height: 75vh; overflow: auto; padding: var(--openbitfun-space-5); } +.design-state-comparison .component-preview-matrix { width: max-content; min-width: 100%; } +.design-button-overview { display: grid; min-width: 0; gap: var(--openbitfun-space-6); padding: var(--openbitfun-space-5); overflow-x: auto; border-radius: 0 0 var(--openbitfun-radius-lg) var(--openbitfun-radius-lg); } +.design-button-overview .button-state-surface { min-width: 640px; border-radius: var(--openbitfun-radius-md); padding-bottom: var(--openbitfun-space-4); } +.design-button-overview .component-preview-matrix { width: 100%; min-width: 640px; grid-template-columns: 96px repeat(var(--_preview-state-count), minmax(100px, 1fr)); grid-template-rows: var(--openbitfun-space-10); grid-auto-rows: minmax(var(--openbitfun-space-16), auto); } +.design-section-index { display: flex; gap: var(--openbitfun-space-5); flex-wrap: wrap; padding-bottom: var(--openbitfun-space-6); } +.design-section-index a { color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-body-sm-font-size); } +.pattern-section { grid-template-columns: minmax(0, 1fr); gap: var(--openbitfun-space-5); } +.pattern-section__heading { max-width: 48rem; } +.design-token-owner-preview { display: grid; gap: var(--openbitfun-space-4); padding: var(--openbitfun-space-6); } +.design-token-owner-preview > div { display: grid; align-items: center; justify-items: center; min-height: 240px; padding: var(--openbitfun-space-5); background: var(--openbitfun-color-surface-subtle); border-radius: var(--openbitfun-radius-lg); } +.design-token-owner-preview > div > * { max-width: 100%; } +@media (max-width: 1100px) { + .lab-page.design-component-library { grid-template-columns: 224px minmax(0, 1fr); column-gap: var(--openbitfun-space-6); } + .design-library-detail .component-inspector { position: static; max-height: none; } + .design-detail-layout[data-inspector-open] { grid-template-columns: minmax(0, 1fr); } + .design-detail-layout .component-inspector { grid-row: 1; position: static; max-height: calc(100dvh - var(--_lab-topbar-height) - var(--_lab-section-height) - var(--openbitfun-space-8)); top: calc(var(--_lab-topbar-height) + var(--_lab-section-height) + var(--openbitfun-space-4)); } +} +@media (max-width: 860px) { + .lab-page.design-component-library { grid-template-columns: minmax(0, 1fr); } + .design-library-sidebar { position: static; height: auto; padding-inline-end: 0; padding-block: var(--openbitfun-space-3); gap: 0; } + .design-library-toggle { + display: inline-flex; } + .design-library-sidebar:not([data-open]) .design-library-index { display: none; } + .design-library-index { padding-block-start: var(--openbitfun-space-4); } + .design-library-list { flex: none; max-height: 40dvh; } + .design-library-footer { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-block-end: var(--openbitfun-space-2); } + .design-library-content { padding-block-start: var(--openbitfun-space-6); padding-block: var(--openbitfun-space-6) var(--openbitfun-space-12); } + .design-preview-caption, .design-context-link { align-items: flex-start; flex-direction: column; } + .design-selected-stage { padding: var(--openbitfun-space-5); background: var(--openbitfun-color-surface-panel); } +} +@media (max-width: 600px) { + .lab-page { padding: var(--openbitfun-space-8) var(--openbitfun-space-4) var(--openbitfun-space-12); } + .design-secondary-navigation { padding-inline: var(--openbitfun-space-4); } + .design-catalog-search { align-items: stretch; flex-direction: column; } +} +/* Shared document layout; controls retain their public component styles. */ +.lab-shell :is(a, summary, [role="tabpanel"]):focus-visible { outline: var(--openbitfun-focus-width) solid var(--openbitfun-color-focus-ring); outline-offset: var(--openbitfun-focus-offset); } +.design-secondary-navigation { position: sticky; top: var(--_lab-topbar-height); z-index: calc(var(--openbitfun-layer-sticky) - 1); background: var(--openbitfun-color-surface-canvas); } +.lab-mobile-navigation .design-secondary-navigation { position: static; } +.lab-text-link { display: inline-flex; align-items: center; gap: var(--openbitfun-space-2); min-height: var(--openbitfun-control-height-sm); color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-label-md-font-size); text-decoration: none; } +.lab-text-link:hover { color: var(--openbitfun-color-content-primary); text-decoration: underline; } +.design-reference-disclosure { padding-block: var(--openbitfun-space-2); } +.design-reference-note { margin: 0; color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-body-sm-font-size); line-height: var(--openbitfun-type-body-sm-line-height); padding-block: var(--openbitfun-space-2); } +.design-reference-disclosure .component-code-panel { border: 0; background: var(--openbitfun-color-surface-subtle); } +.design-reference-disclosure .component-code-heading { justify-content: flex-end; border-bottom: 0; } +.design-component-tokens { display: grid; gap: var(--openbitfun-space-4); justify-items: start; } +.colors-section-navigation, .token-category-navigation, .pattern-navigation { display: flex; max-width: 100%; overflow-x: auto; padding-block: var(--openbitfun-space-1); margin-bottom: var(--openbitfun-space-5); } +.colors-theme-value { display: flex; align-items: center; min-height: var(--openbitfun-control-height-md); color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-body-sm-font-size); } +.colors-semantic-tools > [data-openbitfun-component="search-field"] { flex: 1; min-width: 12rem; } +.colors-semantic-tools > [data-openbitfun-component="select"] { min-width: 10rem; } +.colors-expand-action { display: flex; justify-content: center; padding: var(--openbitfun-space-2); border-top: var(--openbitfun-border-width-default) solid var(--openbitfun-color-border-subtle); } +.token-tools > * { min-width: 0; } +.token-action-row { flex-wrap: wrap; } +.token-value-control > [data-openbitfun-component="input"] { flex: 1; min-width: 0; } +.guide-setup-layout { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: start; gap: var(--openbitfun-space-8); } +.guide-step-list { display: grid; gap: var(--openbitfun-space-6); list-style: none; padding: 0; margin: 0; } +.guide-step-list li { display: flex; align-items: flex-start; gap: var(--openbitfun-space-3); } +.guide-step-list h2 { margin: 0 0 var(--openbitfun-space-2); font-family: var(--openbitfun-type-heading-section-font-family); font-size: var(--openbitfun-type-heading-section-font-size); font-weight: var(--openbitfun-type-heading-section-font-weight); line-height: var(--openbitfun-type-heading-section-line-height); } +.guide-step-list p { margin: 0; color: var(--openbitfun-color-content-secondary); font-size: var(--openbitfun-type-body-sm-font-size); line-height: var(--openbitfun-type-body-sm-line-height); } +.guide-step-icon { flex: none; } +.guide-next-action { margin-top: var(--openbitfun-space-6); display: flex; flex-wrap: wrap; gap: var(--openbitfun-space-3); } +@media (max-width: 1100px) { + .lab-topbar { gap: var(--openbitfun-space-3); } + .design-wordmark-suffix, .lab-search-shortcut { display: none; } + .colors-page-heading { grid-template-columns: minmax(0, 1fr); } +} +@media (max-width: 860px) { + .lab-topbar { padding-inline: var(--openbitfun-space-4); gap: var(--openbitfun-space-2); } + .lab-topbar > .design-primary-navigation { display: none; } + .lab-navigation-trigger { display: inline-flex; flex: none; } + .guide-setup-layout { grid-template-columns: minmax(0, 1fr); } +} +@media (max-width: 600px) { + .lab-search-trigger-label { display: none; } + .lab-topbar-actions { gap: var(--openbitfun-space-1); } + .lab-page { padding-block: var(--openbitfun-space-6) var(--openbitfun-space-8); } + .colors-context-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; } + .colors-context-controls > :first-child { grid-column: 1 / -1; } + .colors-context-control { min-width: 0; grid-template-columns: minmax(0, 1fr); } + .colors-semantic-tools { flex-wrap: wrap; width: 100%; } + .colors-semantic-tools > * { flex: 1 1 100%; } + .token-tools { grid-template-columns: minmax(0, 1fr); } + .token-table__header, .token-table__row { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); } + .token-table__header > :last-child, .token-table__row > :last-child { display: none; } + .resource-grid { grid-template-columns: minmax(0, 1fr); } +} +@media (prefers-reduced-motion: reduce) { + html { scroll-behavior: auto; } + .design-primary-navigation a, .design-secondary-navigation a { transition: none; } +} +/* Keep document offsets beside the shell that owns their geometry. */ +.lab-page.design-foundations { --_foundation-sticky-top: calc(var(--_lab-topbar-height) + var(--_lab-section-height) + var(--openbitfun-space-4)); } +.foundation-sidebar { top: var(--_foundation-sticky-top); max-height: calc(100dvh - var(--_foundation-sticky-top)); } +.foundation-chapter { scroll-margin-top: var(--_foundation-sticky-top); } +.subagent-ip-detail { top: calc(var(--_lab-topbar-height) + var(--_lab-section-height) + var(--openbitfun-space-4)); scroll-margin-top: calc(var(--_lab-topbar-height) + var(--_lab-section-height) + var(--openbitfun-space-4)); } +.brand-gallery :is(section, details) { scroll-margin-top: calc(var(--_lab-topbar-height) + var(--_lab-section-height) + var(--openbitfun-space-4)); } +@media (max-width: 860px) { + .lab-page.design-foundations { --_foundation-sticky-top: calc(var(--_lab-topbar-height) + var(--_lab-section-height) + var(--openbitfun-control-height-lg) + var(--openbitfun-space-6)); } + .foundation-sidebar { top: calc(var(--_lab-topbar-height) + var(--_lab-section-height)); max-height: none; } +} + +.page-heading--split { max-width: none; } diff --git a/design-system/apps/design-lab/src/i18n/brandMessages.ts b/design-system/apps/design-lab/src/i18n/brandMessages.ts new file mode 100644 index 0000000000..aadba3e7e3 --- /dev/null +++ b/design-system/apps/design-lab/src/i18n/brandMessages.ts @@ -0,0 +1,62 @@ +export const brandAssetsEn = { + "brandAssets.identityTitle": "Identity", + "brandAssets.motionTitle": "Motion", + "brandAssets.charactersTitle": "Characters", + "brandAssets.usageTitle": "Usage notes", + "brandAssets.silverDescription": "Transparent artwork. Preserve the silver material and original proportions.", + "brandAssets.appDescription": "PNG for general use, ICO for Windows, ICNS for macOS. Keep the black tile.", + "brandAssets.outlineDescription": "Monochrome vector. The component inherits the surrounding text color.", + "brandAssets.wordmarkDescription": "Use on light surfaces and keep the horizontal composition intact.", + "brandAssets.aboutDescription": "For brand introductions. This motion does not indicate progress.", + "brandAssets.voiceDescription": "This preview is idle. Audio feedback comes from a real voice conversation.", + "brandAssets.backgroundFor": "{asset} preview background", + "brandAssets.downloadLabel": "Download {asset} ({format})", + "brandAssets.chooseMotion": "Motion style", + "brandAssets.breathe": "Breathe", + "brandAssets.flow": "Flow", + "brandAssets.particles": "Particles", + "brandAssets.voiceIdle": "Idle", + "brandAssets.motionPreference": "Motion respects system preferences and pauses when out of view." +} as const; + +export const brandAssetsZhCN = { + "brandAssets.identityTitle": "标识", + "brandAssets.motionTitle": "动效", + "brandAssets.charactersTitle": "角色", + "brandAssets.usageTitle": "使用说明", + "brandAssets.silverDescription": "透明底。保留银色材质与原始比例。", + "brandAssets.appDescription": "PNG 通用,ICO 用于 Windows,ICNS 用于 macOS。保留黑色底板。", + "brandAssets.outlineDescription": "单色矢量,组件颜色随界面文字变化。", + "brandAssets.wordmarkDescription": "使用浅色背景,保留完整横向组合。", + "brandAssets.aboutDescription": "用于品牌介绍,不表示工作进度。", + "brandAssets.voiceDescription": "此处为待机效果,音频反馈来自真实通话。", + "brandAssets.backgroundFor": "{asset}预览背景", + "brandAssets.downloadLabel": "下载{asset}({format})", + "brandAssets.chooseMotion": "动效样式", + "brandAssets.breathe": "呼吸", + "brandAssets.flow": "流光", + "brandAssets.particles": "粒子", + "brandAssets.voiceIdle": "待机", + "brandAssets.motionPreference": "动效遵循系统偏好,并在不可见时暂停。" +} satisfies Record; + +export const brandAssetsZhTW = { + "brandAssets.identityTitle": "標誌", + "brandAssets.motionTitle": "動效", + "brandAssets.charactersTitle": "角色", + "brandAssets.usageTitle": "使用說明", + "brandAssets.silverDescription": "透明背景。保留銀色材質與原始比例。", + "brandAssets.appDescription": "PNG 通用,ICO 用於 Windows,ICNS 用於 macOS。保留黑色底板。", + "brandAssets.outlineDescription": "單色向量,元件色彩隨介面文字變化。", + "brandAssets.wordmarkDescription": "使用淺色背景,保留完整橫向組合。", + "brandAssets.aboutDescription": "用於品牌介紹,不表示工作進度。", + "brandAssets.voiceDescription": "此處為待機效果,音訊回應來自真實通話。", + "brandAssets.backgroundFor": "{asset}預覽背景", + "brandAssets.downloadLabel": "下載{asset}({format})", + "brandAssets.chooseMotion": "動效樣式", + "brandAssets.breathe": "呼吸", + "brandAssets.flow": "流光", + "brandAssets.particles": "粒子", + "brandAssets.voiceIdle": "待機", + "brandAssets.motionPreference": "動效遵循系統偏好,並在不可見時暫停。" +} satisfies Record; diff --git a/design-system/apps/design-lab/src/i18n/componentMetadata.ts b/design-system/apps/design-lab/src/i18n/componentMetadata.ts index dddf2e51e4..bad37dd9f3 100644 --- a/design-system/apps/design-lab/src/i18n/componentMetadata.ts +++ b/design-system/apps/design-lab/src/i18n/componentMetadata.ts @@ -4,6 +4,7 @@ import type { TranslateParams } from "./core.mjs"; type Translate = (key: MessageKey, params?: TranslateParams) => string; const categoryKeys: Readonly> = { + brand: "nav.brand", action: "meta.category.action", feedback: "meta.category.feedback", "flow-chat": "meta.category.flowChat", @@ -14,6 +15,18 @@ const categoryKeys: Readonly> = { }; const descriptionKeys: Readonly> = { + ListModelsToolCard: "component.ListModelsToolCard.description", + ControlHubToolCard: "component.ControlHubToolCard.description", + ThinkingBlock: "component.ThinkingBlock.description", + FlowGroup: "component.FlowGroup.description", + ExploreGroup: "component.ExploreGroup.description", + ContextLoadGroup: "component.ContextLoadGroup.description", + FlowChatRuntimeStatus: "component.FlowChatRuntimeStatus.description", + OpenBitFunSolidMark: "component.OpenBitFunSolidMark.description", + OpenBitFunAppIcon: "component.OpenBitFunAppIcon.description", + OpenBitFunMark: "component.OpenBitFunMark.description", + OpenBitFunBrandMotion: "component.OpenBitFunBrandMotion.description", + SubagentHatch: "component.SubagentHatch.description", ActionCard: "component.ActionCard.description", ActionItem: "component.ActionItem.description", ActivityItem: "component.ActivityItem.description", diff --git a/design-system/apps/design-lab/src/i18n/core.d.mts b/design-system/apps/design-lab/src/i18n/core.d.mts index 2da81b3ae7..d606d765c4 100644 --- a/design-system/apps/design-lab/src/i18n/core.d.mts +++ b/design-system/apps/design-lab/src/i18n/core.d.mts @@ -9,6 +9,7 @@ export function resolveFirstDesignLabLocale( fallback?: DesignLabLocale, ): DesignLabLocale; export function interpolateMessage(template: string, params?: TranslateParams): string; +export function formatDesignLabNumber(value: number, locale: unknown): string; export function translateFromCatalog( catalog: Readonly>>>, locale: unknown, diff --git a/design-system/apps/design-lab/src/i18n/core.mjs b/design-system/apps/design-lab/src/i18n/core.mjs index c062d8960b..516cfdc6e4 100644 --- a/design-system/apps/design-lab/src/i18n/core.mjs +++ b/design-system/apps/design-lab/src/i18n/core.mjs @@ -66,6 +66,10 @@ export function interpolateMessage(template, params) { }); } +export function formatDesignLabNumber(value, locale) { + return new Intl.NumberFormat(resolveDesignLabLocale(locale) ?? 'en-US').format(value); +} + export function translateFromCatalog(catalog, locale, key, params) { const resolvedLocale = resolveDesignLabLocale(locale) ?? "en-US"; const template = catalog[resolvedLocale]?.[key] ?? catalog["en-US"]?.[key] ?? key; diff --git a/design-system/apps/design-lab/src/i18n/designMessages.ts b/design-system/apps/design-lab/src/i18n/designMessages.ts new file mode 100644 index 0000000000..f3fb446b8c --- /dev/null +++ b/design-system/apps/design-lab/src/i18n/designMessages.ts @@ -0,0 +1,255 @@ +import { foundationsEn, foundationsZhCN, foundationsZhTW } from "./foundationsMessages"; + +export const designEn = { + ...foundationsEn, + "design.character.robot-01": "Cream", + "design.character.robot-02": "Lake Blue", + "design.character.robot-03": "Lilac", + "design.character.robot-04": "Ink Mint", + "design.character.robot-05": "Peach", + "design.character.robot-06": "Pea", + "design.character.robot-07": "Tangerine", + "design.character.robot-08": "Berry", + "design.character.robot-09": "Sea Salt", + "design.character.robot-10": "Matcha", + "design.character.robot-11": "Lemon", + "design.character.robot-12": "Grape", + "design.character.robot-13": "Coral", + "design.character.robot-14": "Glacier", + "design.character.robot-15": "Cocoa", + "design.character.robot-16": "Cloud", + "design.character.robot-17": "Pistachio", + "design.character.robot-18": "Sakura", + "design.character.robot-19": "Indigo", + "design.character.robot-20": "Oat", + + "design.components": "Components", + "design.foundations": "Foundations", + "design.brand": "Brand resources", + "design.intro": "Components, foundations, and brand assets for OpenBitFun.", + "design.componentsIntro": "Browse components and try their states and interactions.", + "design.foundationsIntro": "Color, typography, spacing, shape, and motion.", + "design.brandIntro": "Original artwork, characters, and brand motion.", + "design.all": "All components", + "design.search": "Search by name or purpose", + "design.browseComponents": "Browse components", + "design.results": "{count} components", + "design.noResults": "No matching components. Try another name or clear the filters.", + "design.clear": "Clear filters", + "design.contexts": "Examples in context", + "design.conversation": "Conversation preview", + "design.conversationIntro": "Follow a complete conversation to examine rhythm, grouping, state changes, and user input.", + "design.standalone": "Single component", + "design.inConversation": "In conversation", + "design.compare": "Compare states and variants", + "design.allVariants": "All styles and states", + "design.configure": "Configure preview", + "design.closeConfigure": "Close configuration", + "design.usage": "Usage and behavior", + "design.usageIntro": "Select a variant and state; theme and density follow the surrounding ThemeRoot.", + "design.chatUsage": "Compare the component on its own or within a conversation. Preview controls preserve its state.", + "design.chatContext": "Layout context", + "design.chatContextNote": "This composition demonstrates presentation. Streaming, grouping, and scroll policy belong to the product.", + "design.contextUser": "Help me review the current changes.", + "design.contextAssistant": "I’ll inspect the relevant information and keep the results together.", + "design.contextAfter": "The next response continues here, keeping the conversation easy to follow.", + "design.inspectLayout": "Show layout guides", + "design.previewWidth": "Preview width", + "design.fullWidth": "Available width", + "design.narrowWidth": "Narrow", + "design.type": "Typography", + "design.space": "Spacing", + "design.shape": "Shape and layers", + "design.motion": "Motion", + "design.accessibility": "Accessibility", + "design.tokens": "Token workbench", + "design.colorNote": "Choose colors by purpose. Inspect the same semantic roles in light, dark, and high-contrast themes.", + "design.typeNote": "Use semantic type roles for headings, body, labels, and code. Scale and leading come from the same token system.", + "design.spaceNote": "Use the shared spacing scale to express relationships. Closely related content sits closer together.", + "design.shapeNote": "Corners describe the surface; borders and shadows clarify its relationship to the content below.", + "design.motionNote": "Motion explains a state change. Keep it purposeful, interruptible, and respectful of reduced-motion preferences.", + "design.accessibilityNote": "Keep keyboard focus visible, give controls accessible names, and communicate status with text as well as color. Verify narrow layouts, touch targets, and high contrast.", + "design.tokenNote": "Components consume semantic and system tokens. Edit a draft and inspect the affected component in its own preview.", + "design.identity": "Logo and identity", + "design.characters": "Characters and IP", + "design.identityNote": "One identity across application icons, transparent artwork, wordmark, and motion.", + "design.charactersNote": "Meet the full character family, inspect real avatar sizes, and explore the available animation.", + "design.silverMark": "Silver mark", + "design.lineMark": "Outline mark", + "design.appIcon": "Application icon", + "design.wordmark": "Wordmark", + "design.aboutMotion": "Brand introduction", + "design.voiceMotion": "Voice particles", + "design.assetBackground": "Preview background", + "design.actualSize": "At actual size", + "design.downloads": "Download assets", + "design.downloadNote": "Downloads use the existing source artwork and generated platform assets.", + "design.brandUsage": "Preserve proportions and clear space. Keep the silver material and authored character colors intact. Use the app icon on its original black tile; use the transparent mark on other surfaces.", + "design.assetUsage": "Use the original artwork at its intended size. Keep a clear area around it and provide a text label when the identity is otherwise unclear.", + "design.characterUsage": "Character artwork identifies the agent. Put status indicators in the surrounding avatar component so the identity stays consistent.", + "design.viewCharacters": "Explore characters", + "design.viewIdentity": "Explore identity", + "design.characterName": "Character {number}", + "design.relatedComponent": "Open component documentation", + "design.selectedComponent": "Affected component", +} as const; + +export const designZhCN = { + ...foundationsZhCN, + "design.character.robot-01": "奶油", + "design.character.robot-02": "湖蓝", + "design.character.robot-03": "丁香", + "design.character.robot-04": "墨薄荷", + "design.character.robot-05": "蜜桃", + "design.character.robot-06": "豌豆", + "design.character.robot-07": "柑橘", + "design.character.robot-08": "莓果", + "design.character.robot-09": "海盐", + "design.character.robot-10": "抹茶", + "design.character.robot-11": "柠檬", + "design.character.robot-12": "葡萄", + "design.character.robot-13": "珊瑚", + "design.character.robot-14": "冰川", + "design.character.robot-15": "可可", + "design.character.robot-16": "云朵", + "design.character.robot-17": "开心果", + "design.character.robot-18": "樱花", + "design.character.robot-19": "靛蓝", + "design.character.robot-20": "燕麦", + + "design.components": "组件库", + "design.foundations": "设计规范", + "design.brand": "品牌资源", + "design.intro": "OpenBitFun 的组件、设计规范与品牌资源。", + "design.componentsIntro": "查看组件,体验状态与交互。", + "design.foundationsIntro": "颜色、排版、间距、形态与动效。", + "design.brandIntro": "原始标识、角色形象与品牌动效。", + "design.all": "全部组件", + "design.search": "按名称或用途搜索组件", + "design.browseComponents": "展开或收起组件目录", + "design.results": "{count} 个组件", + "design.noResults": "没有找到匹配的组件,请换个关键词或清除筛选。", + "design.clear": "清除筛选", + "design.contexts": "组合示例", + "design.conversation": "对话预览", + "design.conversationIntro": "在完整对话中观察阅读节奏、内容分组、状态变化与用户输入。", + "design.standalone": "单独预览", + "design.inConversation": "对话中预览", + "design.compare": "对比状态与变体", + "design.allVariants": "全部样式与状态", + "design.configure": "调整预览参数", + "design.closeConfigure": "收起参数", + "design.usage": "使用与行为", + "design.usageIntro": "选择变体与状态,主题和密度跟随所在的 ThemeRoot。", + "design.chatUsage": "对照组件的独立表现与对话布局,切换视图时保留状态。", + "design.chatContext": "布局上下文", + "design.chatContextNote": "此处展示组件的组合表现;流式输出、内容分组与滚动策略由产品负责。", + "design.contextUser": "帮我检查一下当前的修改。", + "design.contextAssistant": "我会查看相关信息,并把检查结果整理在一起。", + "design.contextAfter": "后续回复从这里继续,保持对话的阅读连续性。", + "design.inspectLayout": "显示布局辅助线", + "design.previewWidth": "预览宽度", + "design.fullWidth": "适应可用宽度", + "design.narrowWidth": "窄屏", + "design.type": "字体排版", + "design.space": "间距", + "design.shape": "形态与层级", + "design.motion": "动效", + "design.accessibility": "可访问性", + "design.tokens": "令牌工作台", + "design.colorNote": "按用途选择颜色,在浅色、深色与高对比主题中查看同一套语义角色。", + "design.typeNote": "标题、正文、标签与代码使用对应的语义排版角色,字号与行高来自同一套令牌。", + "design.spaceNote": "用共享间距表达内容关系。关系越紧密,距离越近。", + "design.shapeNote": "圆角表达表面形态,边框与阴影说明表面之间的层级关系。", + "design.motionNote": "用动效解释状态变化。动效应有明确目的、可以中断,并尊重减少动态效果的偏好。", + "design.accessibilityNote": "保留清晰的键盘焦点,为控件提供可访问名称,同时用文字和颜色传达状态。检查窄屏布局、触控目标与高对比模式。", + "design.tokenNote": "组件直接消费语义令牌与系统令牌。编辑草稿时,可在对应组件中查看影响。", + "design.identity": "Logo 与品牌标识", + "design.characters": "角色与 IP", + "design.identityNote": "从应用图标、透明标识、字标到动态表达,保持同一个 OpenBitFun。", + "design.charactersNote": "浏览完整角色家族,检查真实头像尺寸,探索已有的角色动作。", + "design.silverMark": "银色标识", + "design.lineMark": "轮廓标识", + "design.appIcon": "应用图标", + "design.wordmark": "品牌字标", + "design.aboutMotion": "品牌介绍动效", + "design.voiceMotion": "语音粒子动效", + "design.assetBackground": "预览背景", + "design.actualSize": "实际尺寸", + "design.downloads": "下载资源", + "design.downloadNote": "下载文件来自已有的原始图稿与生成的各平台资源。", + "design.brandUsage": "保持原始比例与留白,保留银色材质和角色原始配色。应用图标使用原始黑色底板;其他背景使用透明标识。", + "design.assetUsage": "使用原始图稿并按目标尺寸检查效果。四周保留清晰留白;身份不明确时配合文字名称。", + "design.characterUsage": "角色图稿负责表达身份,状态标记由外层头像组件承载,保持角色本身的一致性。", + "design.viewCharacters": "浏览角色家族", + "design.viewIdentity": "浏览品牌标识", + "design.characterName": "角色 {number}", + "design.relatedComponent": "查看组件文档", + "design.selectedComponent": "受影响的组件", +} satisfies Record; + +export const designZhTW = { + ...designZhCN, + ...foundationsZhTW, + "design.character.robot-01": "奶油", + "design.character.robot-02": "湖藍", + "design.character.robot-03": "丁香", + "design.character.robot-04": "墨薄荷", + "design.character.robot-05": "蜜桃", + "design.character.robot-06": "豌豆", + "design.character.robot-07": "柑橘", + "design.character.robot-08": "莓果", + "design.character.robot-09": "海鹽", + "design.character.robot-10": "抹茶", + "design.character.robot-11": "檸檬", + "design.character.robot-12": "葡萄", + "design.character.robot-13": "珊瑚", + "design.character.robot-14": "冰川", + "design.character.robot-15": "可可", + "design.character.robot-16": "雲朵", + "design.character.robot-17": "開心果", + "design.character.robot-18": "櫻花", + "design.character.robot-19": "靛藍", + "design.character.robot-20": "燕麥", + + "design.components": "元件庫", + "design.foundations": "設計規範", + "design.brand": "品牌資源", + "design.intro": "OpenBitFun 的元件、設計規範與品牌資源。", + "design.componentsIntro": "查看元件,體驗狀態與互動。", + "design.foundationsIntro": "色彩、排版、間距、形態與動效。", + "design.brandIntro": "原始標誌、角色形象與品牌動效。", + "design.all": "全部元件", "design.search": "依名稱或用途搜尋元件", "design.results": "{count} 個元件", + "design.browseComponents": "展開或收起元件目錄", + "design.noResults": "找不到符合的元件,請換個關鍵字或清除篩選。", "design.clear": "清除篩選", + "design.contexts": "組合範例", "design.conversation": "對話預覽", + "design.conversationIntro": "在完整對話中觀察閱讀節奏、內容分組、狀態變化與使用者輸入。", + "design.standalone": "單獨預覽", "design.inConversation": "對話中預覽", "design.compare": "比較狀態與變體", + "design.allVariants": "全部樣式與狀態", + "design.configure": "調整預覽參數", "design.closeConfigure": "收起參數", "design.usage": "使用與行為", + "design.usageIntro": "選擇變體與狀態,主題和密度跟隨所在的 ThemeRoot。", + "design.chatUsage": "對照元件的獨立表現與對話版面,切換視圖時保留狀態。", + "design.chatContext": "版面配置情境", "design.chatContextNote": "此處展示元件的組合表現;串流輸出、內容分組與捲動策略由產品負責。", + "design.contextUser": "幫我檢查一下目前的修改。", "design.contextAssistant": "我會查看相關資訊,並把檢查結果整理在一起。", + "design.contextAfter": "後續回覆從這裡繼續,保持對話的閱讀連續性。", + "design.inspectLayout": "顯示版面輔助線", "design.previewWidth": "預覽寬度", "design.fullWidth": "適應可用寬度", "design.narrowWidth": "窄螢幕", + "design.type": "字體排版", "design.space": "間距", "design.shape": "形態與層級", "design.motion": "動效", "design.accessibility": "無障礙設計", "design.tokens": "權杖工作台", + "design.colorNote": "依用途選擇色彩,在淺色、深色與高對比主題中查看同一套語意角色。", + "design.typeNote": "標題、內文、標籤與程式碼使用對應的語意排版角色,字級與行高來自同一套權杖。", + "design.spaceNote": "用共享間距表達內容關係。關係越緊密,距離越近。", + "design.shapeNote": "圓角表達表面形態,邊框與陰影說明表面之間的層級關係。", + "design.motionNote": "用動效解釋狀態變化。動效應有明確目的、可以中斷,並尊重減少動態效果的偏好。", + "design.accessibilityNote": "保留清晰的鍵盤焦點,為控制項提供無障礙名稱,同時用文字和色彩傳達狀態。檢查窄螢幕版面、觸控目標與高對比模式。", + "design.tokenNote": "元件直接使用語意權杖與系統權杖。編輯草稿時,可在對應元件中查看影響。", + "design.identity": "Logo 與品牌標誌", "design.characters": "角色與 IP", + "design.identityNote": "從應用程式圖示、透明標誌、字標到動態表達,保持同一個 OpenBitFun。", + "design.charactersNote": "瀏覽完整角色家族,檢查實際頭像尺寸,探索已有的角色動作。", + "design.silverMark": "銀色標誌", "design.lineMark": "輪廓標誌", "design.appIcon": "應用程式圖示", "design.wordmark": "品牌字標", + "design.aboutMotion": "品牌介紹動效", "design.voiceMotion": "語音粒子動效", "design.assetBackground": "預覽背景", "design.actualSize": "實際尺寸", + "design.downloads": "下載資源", "design.downloadNote": "下載檔案來自已有的原始圖稿與產生的各平台資源。", + "design.brandUsage": "保持原始比例與留白,保留銀色材質和角色原始配色。應用程式圖示使用原始黑色底板;其他背景使用透明標誌。", + "design.assetUsage": "使用原始圖稿並依目標尺寸檢查效果。四周保留清晰留白;身分不明確時配合文字名稱。", + "design.characterUsage": "角色圖稿負責表達身分,狀態標記由外層頭像元件承載,保持角色本身的一致性。", + "design.viewCharacters": "瀏覽角色家族", "design.viewIdentity": "瀏覽品牌標誌", "design.characterName": "角色 {number}", + "design.relatedComponent": "查看元件文件", "design.selectedComponent": "受影響的元件", +} satisfies Record; diff --git a/design-system/apps/design-lab/src/i18n/flowChatMessages.ts b/design-system/apps/design-lab/src/i18n/flowChatMessages.ts new file mode 100644 index 0000000000..858caa32b8 --- /dev/null +++ b/design-system/apps/design-lab/src/i18n/flowChatMessages.ts @@ -0,0 +1,421 @@ +import { flowChatMockEn, flowChatMockZhCN, flowChatMockZhTW } from './flowChatMockMessages'; + +export const flowChatEn = { + "component.ToolRelationRow.description": "Actor-to-target relationships with clickable identities and operation results.", + "flowChat.toolCards.interaction.currentSession": "Current session", + "flowChat.toolCards.interaction.unknownAgent": "Subagent", + "flowChat.toolCards.interaction.process": "Process #{id}", + "flowChat.toolCards.interaction.unknownProcess": "Process", + "flowChat.toolCards.interaction.send": "Send", + "flowChat.toolCards.interaction.receive": "Receive", + "flowChat.toolCards.interaction.create": "Create", + "flowChat.toolCards.interaction.interrupt": "Stop", + "flowChat.toolCards.interaction.delete": "Delete", + "flowChat.toolCards.interaction.rename": "Rename", + "flowChat.toolCards.interaction.list": "Sessions", + "flowChat.toolCards.interaction.agentId": "Agent ID", + "flowChat.toolCards.interaction.messageAccepted": "Instruction accepted", + "flowChat.toolCards.interaction.interruptedRuns": "Interrupted {count} background runs", + "flowChat.toolCards.interaction.noActiveRuns": "No active work", + "flowChat.toolCards.interaction.messageSent": "Sent 1 message", + "flowChat.toolCards.interaction.sendingMessage": "Sending a message…", + "flowChat.toolCards.interaction.waitingResults": "Waiting for results…", + "flowChat.toolCards.interaction.receivedResults": "Results received: {value}", + "flowChat.toolCards.interaction.noResults": "No new results", + "flowChat.toolCards.interaction.resultsReceived": "Received results", + "flowChat.toolCards.interaction.inputSent": "Wrote input", + "flowChat.toolCards.interaction.sendingInput": "Writing input…", + "flowChat.toolCards.interaction.outputRead": "Read output", + "flowChat.toolCards.interaction.readingOutput": "Reading output…", + "flowChat.toolCards.interaction.noOutput": "No new output", + "flowChat.toolCards.interaction.creatingSession": "Creating a session…", + "flowChat.toolCards.interaction.sessionCreated": "Created a session", + "flowChat.toolCards.interaction.stopping": "Requesting interruption…", + "flowChat.toolCards.interaction.stopRequested": "Requested interruption", + "flowChat.toolCards.interaction.terminating": "Terminating the process…", + "flowChat.toolCards.interaction.terminated": "Terminated the process", + "flowChat.toolCards.interaction.deleting": "Deleting…", + "flowChat.toolCards.interaction.sessionDeleted": "Deleted the session", + "flowChat.toolCards.interaction.agentsDeleted": "Agents deleted: {value}", + "flowChat.toolCards.interaction.deleted": "Deleted", + "flowChat.toolCards.interaction.renaming": "Updating the name…", + "flowChat.toolCards.interaction.renamed": "Updated the session name", + "flowChat.toolCards.interaction.inspectResult": "View this operation", + "flowChat.toolCards.interaction.inspectMessage": "View the sent message", + "flowChat.toolCards.interaction.inspectProcess": "View the process record", + "flowChat.toolCards.interaction.inspectObject": "View the object record", + "flowChat.toolCards.interaction.sessionUnavailable": "The target session is currently unavailable", + "flowChat.toolCards.interaction.resultDetails": "Operation details", + "flowChat.toolCards.interaction.separator": ":", + "flowChat.toolCards.sessionControl.sessionId": "Session ID", + "flowChat.toolCards.builtin.fields.results": "Results", + "flowChat.toolCards.common.inputParams": "Input Parameters", + "flowChat.toolCards.common.executionResult": "Execution Result", + "flowChat.toolCards.default.failed": "Execution failed", + "flowChat.toolCards.default.cancelled": "Cancelled", + "flowChat.toolCards.default.rejected": "Rejected", + "flowChat.toolCards.default.waitingConfirm": "Waiting for confirmation", + "flowChat.toolCards.default.queued": "Queued", + "component.ListModelsToolCard.description": "Enabled model discovery with provider, model identity, query and empty-result details.", + "component.ControlHubToolCard.description": "Browser, terminal and capability operations with action-aware attention and recorded results.", + "runtimeCards.modelsTitle": "List models", + "runtimeCards.modelId": "Model ID", + "runtimeCards.emptyModels": "No enabled models are configured.", + "runtimeCards.controlTitle": "Inspect capabilities", + "runtimeCards.result": "Result", + "flowChat.contextLoadGroup.summary": "{count} context loads", + "flowChat.contextLoadGroup.description": "{count} context-loading calls, including repeat loads", + "component.FlowGroup.description": "A reusable collection with shared disclosure, scrolling and arrival feedback.", + "component.ContextLoadGroup.description": "Context loads with controlled disclosure for skills, tool specifications and capability discovery.", + ...flowChatMockEn, + "component.ThinkingBlock.description": "Reasoning and summaries with controlled disclosure, shared with the conversation.", + "component.ExploreGroup.description": "A shared exploration group with controlled disclosure and natural-height content.", + "component.FlowChatRuntimeStatus.description": "A resident status slot whose label and visibility are controlled by the application.", + "detail.option.collapsed": "Collapsed", + "detail.option.streaming": "Streaming", + "detail.option.summary": "Summary", + "detail.option.visible": "Visible", + "flowChat.exploreRegion.commandCount": "Executed {count} command(s)", + "flowChat.exploreRegion.exploreCount": "Explorations: {count}", + "flowChat.exploreRegion.readFiles": "Read {count} time(s)", + "flowChat.exploreRegion.searchCount": "{count} search(es)", + "flowChat.exploreRegion.separator": ", ", + "flowChat.exploreRegion.readLabel": "$t(shared:tools.read)", + "flowChat.exploreRegion.searchLabel": "$t(shared:tools.search)", + "flowChat.exploreRegion.commandLabel": "Commands", + "flowChat.exploreRegion.exploreLabel": "$t(shared:tools.explore)", + "flowChat.toolCards.approval.waiting": "Waiting for confirmation", + "flowChat.toolCards.execProcess.copyPrimary": "Copy", + "flowChat.toolCards.execProcess.executeCommand": "Run command", + "flowChat.toolCards.execProcess.executingCommand": "Running command...", + "flowChat.toolCards.execProcess.interruptProcess": "Request interrupt:", + "flowChat.toolCards.execProcess.interruptSentNoOutput": "Interrupt sent; no output", + "flowChat.toolCards.execProcess.interruptSession": "Process #{id}", + "flowChat.toolCards.execProcess.interruptingSession": "Interrupting process...", + "flowChat.toolCards.execProcess.killProcess": "Request termination:", + "flowChat.toolCards.execProcess.killSentNoOutput": "Kill sent; no output", + "flowChat.toolCards.execProcess.killSession": "Process #{id}", + "flowChat.toolCards.execProcess.killingSession": "Killing process...", + "flowChat.toolCards.execProcess.noOutput": "No output", + "flowChat.toolCards.execProcess.pollProcess": "Read output:", + "flowChat.toolCards.execProcess.pollSession": "Process #{id}", + "flowChat.toolCards.execProcess.pollingOutput": "Reading output…", + "flowChat.toolCards.execProcess.primaryCopied": "Copied", + "flowChat.toolCards.execProcess.remote": "Remote", + "flowChat.toolCards.execProcess.session": "Session:", + "flowChat.toolCards.execProcess.sessionNotFound": "Session #{id} was not found", + "flowChat.toolCards.execProcess.tty": "TTY", + "flowChat.toolCards.execProcess.waitingForOutput": "Waiting for output...", + "flowChat.toolCards.execProcess.wallTime": "{seconds}s", + "flowChat.toolCards.execProcess.writeStdin": "Send input:", + "flowChat.toolCards.terminal.cancelled": "Cancelled", + "flowChat.toolCards.terminal.executionFailed": "Command execution failed", + "flowChat.toolCards.terminal.exitCode": "Exit code: {code}", + "flowChat.toolCards.terminal.noCommand": "[No command]", + "flowChat.toolCards.terminal.receivingParams": "Receiving parameters...", + "flowChat.toolCards.terminal.rejected": "Rejected", + "flowChat.toolCards.terminal.workingDirectory": "Working directory:", + "flowChat.scenario.title": "Conversation lifecycle", + "flowChat.scenario.description": "Step through thinking, exploration and command output. Disclosure choices persist until replay.", + "flowChat.scenario.next": "Next step", + "flowChat.scenario.reset": "Replay", + "flowChat.scenario.select": "Scenario", + "flowChat.scenario.thinking": "Thinking", + "flowChat.scenario.exploring": "Exploring", + "flowChat.scenario.reasoning": "Check the shared presentation and its callers before changing behavior.", + "flowChat.scenario.summary": "Inspect the presentation and its callers", + "flowChat.scenario.runtime": "Reviewing the results", + "flowChat.scenario.result": "The command has finished. Expand a card to inspect its output.", + "flowChat.scenario.copy": "Copy", + "flowChat.scenario.copied": "Copied", + "flowChat.scenario.copyFailed": "Copy failed", + "flowChat.scenario.phase.parameters": "Receiving parameters", + "flowChat.scenario.phase.waiting": "Waiting for output", + "flowChat.scenario.phase.output": "Streaming output", + "flowChat.scenario.phase.completed": "Completed", + "flowChat.scenario.phase.settled": "Settled", + "flowChat.scenario.phase.confirmation": "Awaiting approval", + "flowChat.scenario.phase.error": "Execution failed", + "flowChat.scenario.phase.cancelled": "Cancelled", + "flowChat.scenario.phase.rejected": "Rejected" +} as const; + +export const flowChatZhCN = { + "component.ToolRelationRow.description": "以主体、目标和操作结果呈现关系,分别点击对象和结果查看详情。", + "flowChat.toolCards.interaction.currentSession": "当前会话", + "flowChat.toolCards.interaction.unknownAgent": "子代理", + "flowChat.toolCards.interaction.process": "进程 #{id}", + "flowChat.toolCards.interaction.unknownProcess": "进程", + "flowChat.toolCards.interaction.send": "发送", + "flowChat.toolCards.interaction.receive": "获取", + "flowChat.toolCards.interaction.create": "新建", + "flowChat.toolCards.interaction.interrupt": "停止", + "flowChat.toolCards.interaction.delete": "删除", + "flowChat.toolCards.interaction.rename": "重命名", + "flowChat.toolCards.interaction.list": "会话列表", + "flowChat.toolCards.interaction.agentId": "代理 ID", + "flowChat.toolCards.interaction.messageAccepted": "指令已接收", + "flowChat.toolCards.interaction.interruptedRuns": "已中断 {count} 个后台任务", + "flowChat.toolCards.interaction.noActiveRuns": "没有运行中的任务", + "flowChat.toolCards.interaction.messageSent": "发送了 1 条消息", + "flowChat.toolCards.interaction.sendingMessage": "正在发送消息…", + "flowChat.toolCards.interaction.waitingResults": "正在等待结果…", + "flowChat.toolCards.interaction.receivedResults": "获取了 {value} 个结果", + "flowChat.toolCards.interaction.noResults": "暂无新结果", + "flowChat.toolCards.interaction.resultsReceived": "已获取结果", + "flowChat.toolCards.interaction.inputSent": "写入了输入", + "flowChat.toolCards.interaction.sendingInput": "正在写入输入…", + "flowChat.toolCards.interaction.outputRead": "读取了输出", + "flowChat.toolCards.interaction.readingOutput": "正在读取输出…", + "flowChat.toolCards.interaction.noOutput": "暂无新输出", + "flowChat.toolCards.interaction.creatingSession": "正在创建会话…", + "flowChat.toolCards.interaction.sessionCreated": "创建了会话", + "flowChat.toolCards.interaction.stopping": "正在请求中断…", + "flowChat.toolCards.interaction.stopRequested": "已请求中断", + "flowChat.toolCards.interaction.terminating": "正在终止进程…", + "flowChat.toolCards.interaction.terminated": "终止了进程", + "flowChat.toolCards.interaction.deleting": "正在删除…", + "flowChat.toolCards.interaction.sessionDeleted": "删除了会话", + "flowChat.toolCards.interaction.agentsDeleted": "删除了 {value} 个子代理", + "flowChat.toolCards.interaction.deleted": "已删除", + "flowChat.toolCards.interaction.renaming": "正在更新名称…", + "flowChat.toolCards.interaction.renamed": "更新了会话名称", + "flowChat.toolCards.interaction.inspectResult": "查看本次操作详情", + "flowChat.toolCards.interaction.inspectMessage": "查看发送的消息", + "flowChat.toolCards.interaction.inspectProcess": "查看进程记录", + "flowChat.toolCards.interaction.inspectObject": "查看对象记录", + "flowChat.toolCards.interaction.sessionUnavailable": "目标会话当前不可用", + "flowChat.toolCards.interaction.resultDetails": "本次操作详情", + "flowChat.toolCards.interaction.separator": ":", + "flowChat.toolCards.sessionControl.sessionId": "会话ID", + "flowChat.toolCards.builtin.fields.results": "结果", + "flowChat.toolCards.common.inputParams": "输入参数", + "flowChat.toolCards.common.executionResult": "执行结果", + "flowChat.toolCards.default.failed": "执行失败", + "flowChat.toolCards.default.cancelled": "已取消", + "flowChat.toolCards.default.rejected": "已拒绝", + "flowChat.toolCards.default.waitingConfirm": "等待确认", + "flowChat.toolCards.default.queued": "排队中", + "component.ListModelsToolCard.description": "查询可用模型,展示服务商、模型标识、筛选条件与空结果。", + "component.ControlHubToolCard.description": "浏览器、终端和控制能力的操作卡片,按动作区分关注级别并展示执行记录。", + "runtimeCards.modelsTitle": "查询模型", + "runtimeCards.modelId": "模型 ID", + "runtimeCards.emptyModels": "尚未配置已启用的模型。", + "runtimeCards.controlTitle": "查询控制能力", + "runtimeCards.result": "执行结果", + "flowChat.contextLoadGroup.summary": "{count} 次上下文加载", + "flowChat.contextLoadGroup.description": "{count} 次上下文加载,含重复加载", + "component.FlowGroup.description": "可复用的收纳组,统一展开收起、内容滚动和接收反馈。", + "component.ContextLoadGroup.description": "上下文加载组,收纳技能、工具说明与能力查询,统一展开收起。", + ...flowChatMockZhCN, + "component.ThinkingBlock.description": "对话共用的思考与摘要组件,统一展开收起和内容区域。", + "component.ExploreGroup.description": "对话共用的探索组,统一折叠与分组摘要,内容自然展开。", + "component.FlowChatRuntimeStatus.description": "常驻运行状态区域,由应用提供文案并控制显示。", + "detail.option.collapsed": "已收起", + "detail.option.streaming": "流式更新", + "detail.option.summary": "思考摘要", + "detail.option.visible": "显示", + "flowChat.exploreRegion.commandCount": "执行了 {count} 个命令", + "flowChat.exploreRegion.exploreCount": "{count} 次探索", + "flowChat.exploreRegion.readFiles": "读取了 {count} 次", + "flowChat.exploreRegion.searchCount": "进行了 {count} 次搜索", + "flowChat.exploreRegion.separator": ",", + "flowChat.exploreRegion.readLabel": "$t(shared:tools.read)", + "flowChat.exploreRegion.searchLabel": "$t(shared:tools.search)", + "flowChat.exploreRegion.commandLabel": "命令", + "flowChat.exploreRegion.exploreLabel": "$t(shared:tools.explore)", + "flowChat.toolCards.approval.waiting": "等待确认", + "flowChat.toolCards.execProcess.copyPrimary": "复制", + "flowChat.toolCards.execProcess.executeCommand": "运行命令", + "flowChat.toolCards.execProcess.executingCommand": "正在运行命令...", + "flowChat.toolCards.execProcess.interruptProcess": "请求中断:", + "flowChat.toolCards.execProcess.interruptSentNoOutput": "已发送中断,无输出", + "flowChat.toolCards.execProcess.interruptSession": "进程 #{id}", + "flowChat.toolCards.execProcess.interruptingSession": "正在中断进程...", + "flowChat.toolCards.execProcess.killProcess": "请求终止:", + "flowChat.toolCards.execProcess.killSentNoOutput": "已发送终止,无输出", + "flowChat.toolCards.execProcess.killSession": "进程 #{id}", + "flowChat.toolCards.execProcess.killingSession": "正在终止进程...", + "flowChat.toolCards.execProcess.noOutput": "无输出", + "flowChat.toolCards.execProcess.pollProcess": "获取输出:", + "flowChat.toolCards.execProcess.pollSession": "进程 #{id}", + "flowChat.toolCards.execProcess.pollingOutput": "正在获取输出…", + "flowChat.toolCards.execProcess.primaryCopied": "已复制", + "flowChat.toolCards.execProcess.remote": "远程", + "flowChat.toolCards.execProcess.session": "会话:", + "flowChat.toolCards.execProcess.sessionNotFound": "未找到会话 #{id}", + "flowChat.toolCards.execProcess.tty": "TTY", + "flowChat.toolCards.execProcess.waitingForOutput": "等待输出...", + "flowChat.toolCards.execProcess.wallTime": "{seconds}秒", + "flowChat.toolCards.execProcess.writeStdin": "发送输入:", + "flowChat.toolCards.terminal.cancelled": "已取消", + "flowChat.toolCards.terminal.executionFailed": "命令执行失败", + "flowChat.toolCards.terminal.exitCode": "退出码: {code}", + "flowChat.toolCards.terminal.noCommand": "[无命令]", + "flowChat.toolCards.terminal.receivingParams": "接收参数中...", + "flowChat.toolCards.terminal.rejected": "已拒绝", + "flowChat.toolCards.terminal.workingDirectory": "工作目录:", + "flowChat.scenario.title": "对话生命周期", + "flowChat.scenario.description": "逐步查看思考、探索和命令输出。手动展开收起会保留到重新播放。", + "flowChat.scenario.next": "下一步", + "flowChat.scenario.reset": "重新播放", + "flowChat.scenario.select": "场景", + "flowChat.scenario.thinking": "思考过程", + "flowChat.scenario.exploring": "探索中", + "flowChat.scenario.reasoning": "先检查共享展示层及其调用方,再确认需要调整的行为。", + "flowChat.scenario.summary": "检查展示层及其调用方", + "flowChat.scenario.runtime": "正在检查结果", + "flowChat.scenario.result": "命令已结束,可以展开卡片查看输出。", + "flowChat.scenario.copy": "复制", + "flowChat.scenario.copied": "已复制", + "flowChat.scenario.copyFailed": "复制失败", + "flowChat.scenario.phase.parameters": "接收参数", + "flowChat.scenario.phase.waiting": "等待输出", + "flowChat.scenario.phase.output": "流式输出", + "flowChat.scenario.phase.completed": "完成", + "flowChat.scenario.phase.settled": "展示稳定", + "flowChat.scenario.phase.confirmation": "等待批准", + "flowChat.scenario.phase.error": "执行失败", + "flowChat.scenario.phase.cancelled": "已取消", + "flowChat.scenario.phase.rejected": "已拒绝" +} as const; + +export const flowChatZhTW = { + "component.ToolRelationRow.description": "以主體、目標和操作結果呈現關係,分別點擊物件和結果檢視詳情。", + "flowChat.toolCards.interaction.currentSession": "目前工作階段", + "flowChat.toolCards.interaction.unknownAgent": "子代理", + "flowChat.toolCards.interaction.process": "程序 #{id}", + "flowChat.toolCards.interaction.unknownProcess": "程序", + "flowChat.toolCards.interaction.send": "傳送", + "flowChat.toolCards.interaction.receive": "取得", + "flowChat.toolCards.interaction.create": "新增", + "flowChat.toolCards.interaction.interrupt": "停止", + "flowChat.toolCards.interaction.delete": "刪除", + "flowChat.toolCards.interaction.rename": "重新命名", + "flowChat.toolCards.interaction.list": "工作階段清單", + "flowChat.toolCards.interaction.agentId": "代理 ID", + "flowChat.toolCards.interaction.messageAccepted": "指令已接收", + "flowChat.toolCards.interaction.interruptedRuns": "已中斷 {count} 個背景任務", + "flowChat.toolCards.interaction.noActiveRuns": "沒有執行中的任務", + "flowChat.toolCards.interaction.messageSent": "傳送了 1 則訊息", + "flowChat.toolCards.interaction.sendingMessage": "正在傳送訊息…", + "flowChat.toolCards.interaction.waitingResults": "正在等待結果…", + "flowChat.toolCards.interaction.receivedResults": "取得了 {value} 個結果", + "flowChat.toolCards.interaction.noResults": "暫無新結果", + "flowChat.toolCards.interaction.resultsReceived": "已取得結果", + "flowChat.toolCards.interaction.inputSent": "寫入了輸入", + "flowChat.toolCards.interaction.sendingInput": "正在寫入輸入…", + "flowChat.toolCards.interaction.outputRead": "讀取了輸出", + "flowChat.toolCards.interaction.readingOutput": "正在讀取輸出…", + "flowChat.toolCards.interaction.noOutput": "暫無新輸出", + "flowChat.toolCards.interaction.creatingSession": "正在建立工作階段…", + "flowChat.toolCards.interaction.sessionCreated": "建立了工作階段", + "flowChat.toolCards.interaction.stopping": "正在請求中斷…", + "flowChat.toolCards.interaction.stopRequested": "已請求中斷", + "flowChat.toolCards.interaction.terminating": "正在終止程序…", + "flowChat.toolCards.interaction.terminated": "終止了程序", + "flowChat.toolCards.interaction.deleting": "正在刪除…", + "flowChat.toolCards.interaction.sessionDeleted": "刪除了工作階段", + "flowChat.toolCards.interaction.agentsDeleted": "刪除了 {value} 個子代理", + "flowChat.toolCards.interaction.deleted": "已刪除", + "flowChat.toolCards.interaction.renaming": "正在更新名稱…", + "flowChat.toolCards.interaction.renamed": "更新了工作階段名稱", + "flowChat.toolCards.interaction.inspectResult": "檢視本次操作詳情", + "flowChat.toolCards.interaction.inspectMessage": "檢視傳送的訊息", + "flowChat.toolCards.interaction.inspectProcess": "檢視程序記錄", + "flowChat.toolCards.interaction.inspectObject": "檢視物件記錄", + "flowChat.toolCards.interaction.sessionUnavailable": "目標工作階段目前無法使用", + "flowChat.toolCards.interaction.resultDetails": "本次操作詳情", + "flowChat.toolCards.interaction.separator": ":", + "flowChat.toolCards.sessionControl.sessionId": "會話ID", + "flowChat.toolCards.builtin.fields.results": "結果", + "flowChat.toolCards.common.inputParams": "輸入參數", + "flowChat.toolCards.common.executionResult": "執行結果", + "flowChat.toolCards.default.failed": "執行失敗", + "flowChat.toolCards.default.cancelled": "已取消", + "flowChat.toolCards.default.rejected": "已拒絕", + "flowChat.toolCards.default.waitingConfirm": "等待確認", + "flowChat.toolCards.default.queued": "排隊中", + "component.ListModelsToolCard.description": "查詢可用模型,顯示服務商、模型識別碼、篩選條件與空結果。", + "component.ControlHubToolCard.description": "瀏覽器、終端和控制能力的操作卡片,依動作區分關注層級並顯示執行記錄。", + "runtimeCards.modelsTitle": "查詢模型", + "runtimeCards.modelId": "模型 ID", + "runtimeCards.emptyModels": "尚未設定已啟用的模型。", + "runtimeCards.controlTitle": "查詢控制能力", + "runtimeCards.result": "執行結果", + "flowChat.contextLoadGroup.summary": "{count} 次上下文載入", + "flowChat.contextLoadGroup.description": "{count} 次上下文載入,含重複載入", + "component.FlowGroup.description": "可重用的收納組,統一展開收合、內容捲動與接收回饋。", + "component.ContextLoadGroup.description": "上下文載入組,收納技能、工具說明與能力查詢,統一展開收合。", + ...flowChatMockZhTW, + "component.ThinkingBlock.description": "對話共用的思考與摘要元件,統一展開收起與內容區域。", + "component.ExploreGroup.description": "對話共用的探索組,統一折疊與分組摘要,內容自然展開。", + "component.FlowChatRuntimeStatus.description": "常駐執行狀態區域,由應用提供文案並控制顯示。", + "detail.option.collapsed": "已收合", + "detail.option.streaming": "串流更新", + "detail.option.summary": "思考摘要", + "detail.option.visible": "顯示", + "flowChat.exploreRegion.commandCount": "執行了 {count} 個命令", + "flowChat.exploreRegion.exploreCount": "{count} 次探索", + "flowChat.exploreRegion.readFiles": "讀取了 {count} 次", + "flowChat.exploreRegion.searchCount": "進行了 {count} 次搜尋", + "flowChat.exploreRegion.separator": ",", + "flowChat.exploreRegion.readLabel": "$t(shared:tools.read)", + "flowChat.exploreRegion.searchLabel": "$t(shared:tools.search)", + "flowChat.exploreRegion.commandLabel": "命令", + "flowChat.exploreRegion.exploreLabel": "$t(shared:tools.explore)", + "flowChat.toolCards.approval.waiting": "等待確認", + "flowChat.toolCards.execProcess.copyPrimary": "複製", + "flowChat.toolCards.execProcess.executeCommand": "執行命令", + "flowChat.toolCards.execProcess.executingCommand": "正在執行命令...", + "flowChat.toolCards.execProcess.interruptProcess": "請求中斷:", + "flowChat.toolCards.execProcess.interruptSentNoOutput": "已傳送中斷,無輸出", + "flowChat.toolCards.execProcess.interruptSession": "程序 #{id}", + "flowChat.toolCards.execProcess.interruptingSession": "正在中斷進程...", + "flowChat.toolCards.execProcess.killProcess": "請求終止:", + "flowChat.toolCards.execProcess.killSentNoOutput": "已傳送終止,無輸出", + "flowChat.toolCards.execProcess.killSession": "程序 #{id}", + "flowChat.toolCards.execProcess.killingSession": "正在終止進程...", + "flowChat.toolCards.execProcess.noOutput": "無輸出", + "flowChat.toolCards.execProcess.pollProcess": "取得輸出:", + "flowChat.toolCards.execProcess.pollSession": "程序 #{id}", + "flowChat.toolCards.execProcess.pollingOutput": "正在取得輸出…", + "flowChat.toolCards.execProcess.primaryCopied": "已複製", + "flowChat.toolCards.execProcess.remote": "遠端", + "flowChat.toolCards.execProcess.session": "會話:", + "flowChat.toolCards.execProcess.sessionNotFound": "未找到會話 #{id}", + "flowChat.toolCards.execProcess.tty": "TTY", + "flowChat.toolCards.execProcess.waitingForOutput": "等待輸出...", + "flowChat.toolCards.execProcess.wallTime": "{seconds}秒", + "flowChat.toolCards.execProcess.writeStdin": "傳送輸入:", + "flowChat.toolCards.terminal.cancelled": "已取消", + "flowChat.toolCards.terminal.executionFailed": "命令執行失敗", + "flowChat.toolCards.terminal.exitCode": "退出碼: {code}", + "flowChat.toolCards.terminal.noCommand": "[無命令]", + "flowChat.toolCards.terminal.receivingParams": "接收參數中...", + "flowChat.toolCards.terminal.rejected": "已拒絕", + "flowChat.toolCards.terminal.workingDirectory": "工作目錄:", + "flowChat.scenario.title": "對話生命週期", + "flowChat.scenario.description": "逐步檢視思考、探索和命令輸出。手動展開收起會保留到重新播放。", + "flowChat.scenario.next": "下一步", + "flowChat.scenario.reset": "重新播放", + "flowChat.scenario.select": "場景", + "flowChat.scenario.thinking": "思考過程", + "flowChat.scenario.exploring": "探索中", + "flowChat.scenario.reasoning": "先檢查共享展示層及其呼叫方,再確認需要調整的行為。", + "flowChat.scenario.summary": "檢查展示層及其呼叫方", + "flowChat.scenario.runtime": "正在檢查結果", + "flowChat.scenario.result": "命令已結束,可以展開卡片檢視輸出。", + "flowChat.scenario.copy": "複製", + "flowChat.scenario.copied": "已複製", + "flowChat.scenario.copyFailed": "複製失敗", + "flowChat.scenario.phase.parameters": "接收參數", + "flowChat.scenario.phase.waiting": "等待輸出", + "flowChat.scenario.phase.output": "串流輸出", + "flowChat.scenario.phase.completed": "完成", + "flowChat.scenario.phase.settled": "呈現穩定", + "flowChat.scenario.phase.confirmation": "等待批准", + "flowChat.scenario.phase.error": "執行失敗", + "flowChat.scenario.phase.cancelled": "已取消", + "flowChat.scenario.phase.rejected": "已拒絕" +} as const; diff --git a/design-system/apps/design-lab/src/i18n/flowChatMockMessages.ts b/design-system/apps/design-lab/src/i18n/flowChatMockMessages.ts new file mode 100644 index 0000000000..5a60af3fbd --- /dev/null +++ b/design-system/apps/design-lab/src/i18n/flowChatMockMessages.ts @@ -0,0 +1,242 @@ +export const flowChatMockEn = { + 'nav.flowChatMock': 'FlowChat compositions', + 'search.flowChatMockDetail': 'Complete conversations, tool groups and lifecycle playback', + 'flowChat.mock.kicker': 'Conversation playground', + 'flowChat.mock.allTools': 'All tools ({count})', + 'flowChat.mock.toolsRequest': 'Show the available tool combinations in the conversation.', + 'flowChat.mock.toolGroup': 'Tool category', + 'flowChat.mock.tools.all': 'All tools', + 'flowChat.mock.tools.files': 'Files, search and changes', + 'flowChat.mock.tools.execution': 'Commands, code and skills', + 'flowChat.mock.tools.web': 'Web research and publishing', + 'flowChat.mock.tools.collaboration': 'Agents, sessions and planning', + 'flowChat.mock.coverage': '{visible} of {total} standard tool bindings', + 'flowChat.mock.productOwned': 'These workflows retain product-specific adapters. Their complete runtime behavior is not represented by the standard card examples above:', + 'flowChat.mock.description': 'Explore thinking, tool cards and messages together in a complete conversation. Switch scenarios or replay each step.', + 'flowChat.mock.scenarios': 'Conversation scenarios', + 'flowChat.mock.enterFullscreen': 'View fullscreen', + 'flowChat.mock.exitFullscreen': 'Exit fullscreen', + 'flowChat.mock.localOnly': 'Local mock · Messages and actions stay in this preview. No commands run and no requests are sent.', + 'flowChat.mock.variant.completed': 'Complete conversation', + 'flowChat.mock.variant.running': 'In progress', + 'flowChat.mock.variant.question': 'Awaiting an answer', + 'flowChat.mock.variant.error': 'Execution failed', + 'flowChat.mock.variant.cancelled': 'Stopped', + 'flowChat.mock.sessionTitle': 'Fix the blank login page', + 'flowChat.mock.transcript': 'Conversation transcript', + 'flowChat.mock.user': 'You', + 'flowChat.mock.request': 'Fix the blank login page and add a regression test.', + 'flowChat.mock.intro': 'I will check the login component and its tests, then verify the fix.', + 'flowChat.mock.reasoning': 'Check how an empty session reaches the page. Look for direct user access and existing coverage before changing the render path.', + 'flowChat.mock.finding': 'The page reads session.user before the session is ready. An empty session throws during rendering, leaving a blank page.', + 'flowChat.mock.steering': 'Only change the frontend. Keep the existing API.', + 'flowChat.mock.applied': 'I will keep the API unchanged, guard the empty session in the page and add coverage for that state.', + 'flowChat.mock.thinkingSummary': 'Guard the empty session and preserve the API', + 'flowChat.mock.summaryDetail': 'Keep the change in the login component and its tests. The unauthenticated state should render the sign-in form.', + 'flowChat.mock.read': 'Read', + 'flowChat.mock.search': 'Search', + 'flowChat.mock.edit': 'Edit', + 'flowChat.mock.changes': 'File changes', + 'flowChat.mock.plan': 'Plan', + 'flowChat.mock.planDiagnose': 'Locate the blank-page trigger', + 'flowChat.mock.planFix': 'Guard the empty session and add coverage', + 'flowChat.mock.planVerify': 'Run the regression tests', + 'flowChat.mock.planDone': 'Fix and verification complete', + 'flowChat.mock.questionTitle': 'Choose the scope', + 'flowChat.mock.question': 'Should I apply the frontend fix or stop after diagnosis?', + 'flowChat.mock.frontend': 'Apply the frontend fix', + 'flowChat.mock.frontendDetail': 'Keep the API unchanged and add a regression test.', + 'flowChat.mock.inspect': 'Diagnosis only', + 'flowChat.mock.inspectDetail': 'Explain the cause without changing any files.', + 'flowChat.mock.confirm': 'Continue', + 'flowChat.mock.answerRecorded': 'Scope confirmed', + 'flowChat.mock.result.completed': 'The blank-page issue is fixed. All 12 tests passed.', + 'flowChat.mock.resultDetail.completed': 'The unauthenticated state now renders the sign-in form. The API is unchanged.', + 'flowChat.mock.result.error': 'The fix is ready, but verification could not run.', + 'flowChat.mock.resultDetail.error': 'The remote process is unavailable. The edits are retained; test results are still pending.', + 'flowChat.mock.result.cancelled': 'Stopped.', + 'flowChat.mock.resultDetail.cancelled': 'Verification did not finish. You can expand the command card to review the available output.', + 'flowChat.mock.resultDetail.stoppedBeforeChanges': 'Stopped before any files were changed.', + 'flowChat.mock.result.analysis': 'The cause is identified. No files were changed.', + 'flowChat.mock.resultDetail.analysis': 'The page needs an empty-session guard before reading session.user. As requested, the workflow stopped after diagnosis.', + 'flowChat.mock.fileResult': 'Handle the empty session safely', + 'flowChat.mock.testResult': 'Cover the unauthenticated state', + 'flowChat.mock.runtime.thinking': 'Checking the request', + 'flowChat.mock.runtime.exploring': 'Reading the login implementation', + 'flowChat.mock.runtime.question': 'Waiting for your answer', + 'flowChat.mock.runtime.editing': 'Updating the component and tests', + 'flowChat.mock.runtime.command': 'Checking test output', + 'flowChat.mock.runtime.result': 'Preparing the result', + 'flowChat.mock.message': 'Message', + 'flowChat.mock.model': 'Preview model', + 'flowChat.mock.placeholder': 'Add a follow-up to this preview…', + 'flowChat.mock.send': 'Send preview message', + 'flowChat.mock.enqueue': 'Add to queue', + 'flowChat.mock.queued': 'Queued messages', + 'flowChat.mock.sendQueued': 'Send queued message', + 'flowChat.mock.deleteQueued': 'Remove queued message', + 'flowChat.mock.stop': 'Stop playback', + 'flowChat.mock.localReply': 'Follow-up received. This preview shows the additional conversation turn without starting another execution.', +} as const; + +export const flowChatMockZhCN: Record = { + 'nav.flowChatMock': 'FlowChat 组合', + 'search.flowChatMockDetail': '完整对话、工具分组和生命周期回放', + 'flowChat.mock.kicker': '完整对话预览', + 'flowChat.mock.allTools': '全部工具({count})', + 'flowChat.mock.toolsRequest': '在对话中展示可用的工具组合。', + 'flowChat.mock.toolGroup': '工具分类', + 'flowChat.mock.tools.all': '全部工具', + 'flowChat.mock.tools.files': '文件、搜索与变更', + 'flowChat.mock.tools.execution': '命令、代码与技能', + 'flowChat.mock.tools.web': '网络检索与发布', + 'flowChat.mock.tools.collaboration': '智能体、会话与计划', + 'flowChat.mock.coverage': '已展示 {visible} / {total} 个标准工具绑定', + 'flowChat.mock.productOwned': '以下流程仍由产品专属适配器承载,其完整运行行为不包含在上方标准卡片示例中:', + 'flowChat.mock.description': '在一段完整对话中查看思考、工具卡片与消息的组合,支持场景切换和逐步回放。', + 'flowChat.mock.scenarios': '对话场景', + 'flowChat.mock.enterFullscreen': '全屏查看', + 'flowChat.mock.exitFullscreen': '退出全屏', + 'flowChat.mock.localOnly': '本地 Mock · 消息和操作仅作用于此预览,不会执行命令或发送请求。', + 'flowChat.mock.variant.completed': '完整对话', + 'flowChat.mock.variant.running': '运行中', + 'flowChat.mock.variant.question': '等待答复', + 'flowChat.mock.variant.error': '执行失败', + 'flowChat.mock.variant.cancelled': '已停止', + 'flowChat.mock.sessionTitle': '修复登录页白屏', + 'flowChat.mock.transcript': '对话记录', + 'flowChat.mock.user': '你', + 'flowChat.mock.request': '修复登录页白屏,并补上回归测试。', + 'flowChat.mock.intro': '我会先检查登录组件和现有测试,定位原因后修复并验证。', + 'flowChat.mock.reasoning': '先检查空会话如何传入页面,查找直接访问用户信息的位置和已有测试,再调整渲染逻辑。', + 'flowChat.mock.finding': '页面在会话就绪前读取了 session.user。空会话会在渲染时触发异常,导致白屏。', + 'flowChat.mock.steering': '只修前端,保留现有接口。', + 'flowChat.mock.applied': '我会保留现有接口,只在页面中处理空会话,并补充对应的回归测试。', + 'flowChat.mock.thinkingSummary': '处理空会话,保持接口不变', + 'flowChat.mock.summaryDetail': '修改范围限定在登录组件及其测试文件。未登录时应正常显示登录表单。', + 'flowChat.mock.read': '读取', + 'flowChat.mock.search': '搜索', + 'flowChat.mock.edit': '修改', + 'flowChat.mock.changes': '文件变更', + 'flowChat.mock.plan': '任务计划', + 'flowChat.mock.planDiagnose': '定位白屏触发条件', + 'flowChat.mock.planFix': '处理空会话并补充测试', + 'flowChat.mock.planVerify': '运行回归测试', + 'flowChat.mock.planDone': '修复与验证完成', + 'flowChat.mock.questionTitle': '确认处理范围', + 'flowChat.mock.question': '接下来直接修复前端,还是只分析原因?', + 'flowChat.mock.frontend': '直接修复前端', + 'flowChat.mock.frontendDetail': '保留现有接口,补充回归测试。', + 'flowChat.mock.inspect': '仅分析原因', + 'flowChat.mock.inspectDetail': '说明问题原因,不修改文件。', + 'flowChat.mock.confirm': '继续', + 'flowChat.mock.answerRecorded': '处理范围已确认', + 'flowChat.mock.result.completed': '登录页白屏已修复,12 项测试全部通过。', + 'flowChat.mock.resultDetail.completed': '未登录时现在会正常显示登录表单,现有接口保持不变。', + 'flowChat.mock.result.error': '修复已完成,验证暂未能执行。', + 'flowChat.mock.resultDetail.error': '远程进程不可用。文件改动已保留,测试结果仍待验证。', + 'flowChat.mock.result.cancelled': '已停止。', + 'flowChat.mock.resultDetail.cancelled': '验证尚未完成,可展开命令卡片查看已收到的输出。', + 'flowChat.mock.resultDetail.stoppedBeforeChanges': '已在修改文件前停止。', + 'flowChat.mock.result.analysis': '已定位原因,未修改文件。', + 'flowChat.mock.resultDetail.analysis': '页面需要在读取 session.user 前处理空会话。按照你的选择,流程停留在原因分析。', + 'flowChat.mock.fileResult': '安全处理空会话', + 'flowChat.mock.testResult': '覆盖未登录状态', + 'flowChat.mock.runtime.thinking': '正在分析请求', + 'flowChat.mock.runtime.exploring': '正在检查登录实现', + 'flowChat.mock.runtime.question': '等待你的答复', + 'flowChat.mock.runtime.editing': '正在修改组件和测试', + 'flowChat.mock.runtime.command': '正在检查测试输出', + 'flowChat.mock.runtime.result': '正在整理结果', + 'flowChat.mock.message': '消息', + 'flowChat.mock.model': '预览模型', + 'flowChat.mock.placeholder': '在此预览中补充一条消息…', + 'flowChat.mock.send': '发送预览消息', + 'flowChat.mock.enqueue': '加入待发送队列', + 'flowChat.mock.queued': '待发送', + 'flowChat.mock.sendQueued': '发送队列消息', + 'flowChat.mock.deleteQueued': '删除队列消息', + 'flowChat.mock.stop': '停止回放', + 'flowChat.mock.localReply': '已收到补充说明。此处展示追加消息的对话效果,不会启动新的执行。', +}; + +export const flowChatMockZhTW: Record = { + 'nav.flowChatMock': 'FlowChat 組合', + 'search.flowChatMockDetail': '完整對話、工具分組和生命週期回放', + 'flowChat.mock.kicker': '完整對話預覽', + 'flowChat.mock.allTools': '全部工具({count})', + 'flowChat.mock.toolsRequest': '在對話中展示可用的工具組合。', + 'flowChat.mock.toolGroup': '工具分類', + 'flowChat.mock.tools.all': '全部工具', + 'flowChat.mock.tools.files': '檔案、搜尋與變更', + 'flowChat.mock.tools.execution': '命令、程式碼與技能', + 'flowChat.mock.tools.web': '網路檢索與發布', + 'flowChat.mock.tools.collaboration': '代理、工作階段與計畫', + 'flowChat.mock.coverage': '已展示 {visible} / {total} 個標準工具綁定', + 'flowChat.mock.productOwned': '以下流程仍由產品專屬轉接器承載,其完整執行行為不包含在上方標準卡片範例中:', + 'flowChat.mock.description': '在一段完整對話中檢視思考、工具卡片與訊息的組合,支援場景切換和逐步回放。', + 'flowChat.mock.scenarios': '對話場景', + 'flowChat.mock.enterFullscreen': '全螢幕檢視', + 'flowChat.mock.exitFullscreen': '退出全螢幕', + 'flowChat.mock.localOnly': '本機 Mock · 訊息和操作僅作用於此預覽,不會執行命令或傳送請求。', + 'flowChat.mock.variant.completed': '完整對話', + 'flowChat.mock.variant.running': '執行中', + 'flowChat.mock.variant.question': '等待答覆', + 'flowChat.mock.variant.error': '執行失敗', + 'flowChat.mock.variant.cancelled': '已停止', + 'flowChat.mock.sessionTitle': '修復登入頁白屏', + 'flowChat.mock.transcript': '對話紀錄', + 'flowChat.mock.user': '你', + 'flowChat.mock.request': '修復登入頁白屏,並補上迴歸測試。', + 'flowChat.mock.intro': '我會先檢查登入元件和現有測試,定位原因後修復並驗證。', + 'flowChat.mock.reasoning': '先檢查空工作階段如何傳入頁面,尋找直接存取使用者資訊的位置和已有測試,再調整渲染邏輯。', + 'flowChat.mock.finding': '頁面在工作階段就緒前讀取了 session.user。空工作階段會在渲染時觸發例外,導致白屏。', + 'flowChat.mock.steering': '只修前端,保留現有介面。', + 'flowChat.mock.applied': '我會保留現有介面,只在頁面中處理空工作階段,並補充對應的迴歸測試。', + 'flowChat.mock.thinkingSummary': '處理空工作階段,保持介面不變', + 'flowChat.mock.summaryDetail': '修改範圍限定在登入元件及其測試檔案。未登入時應正常顯示登入表單。', + 'flowChat.mock.read': '讀取', + 'flowChat.mock.search': '搜尋', + 'flowChat.mock.edit': '修改', + 'flowChat.mock.changes': '檔案變更', + 'flowChat.mock.plan': '任務計畫', + 'flowChat.mock.planDiagnose': '定位白屏觸發條件', + 'flowChat.mock.planFix': '處理空工作階段並補充測試', + 'flowChat.mock.planVerify': '執行迴歸測試', + 'flowChat.mock.planDone': '修復與驗證完成', + 'flowChat.mock.questionTitle': '確認處理範圍', + 'flowChat.mock.question': '接下來直接修復前端,還是只分析原因?', + 'flowChat.mock.frontend': '直接修復前端', + 'flowChat.mock.frontendDetail': '保留現有介面,補充迴歸測試。', + 'flowChat.mock.inspect': '僅分析原因', + 'flowChat.mock.inspectDetail': '說明問題原因,不修改檔案。', + 'flowChat.mock.confirm': '繼續', + 'flowChat.mock.answerRecorded': '處理範圍已確認', + 'flowChat.mock.result.completed': '登入頁白屏已修復,12 項測試全部通過。', + 'flowChat.mock.resultDetail.completed': '未登入時現在會正常顯示登入表單,現有介面保持不變。', + 'flowChat.mock.result.error': '修復已完成,驗證暫未能執行。', + 'flowChat.mock.resultDetail.error': '遠端程序無法使用。檔案變更已保留,測試結果仍待驗證。', + 'flowChat.mock.result.cancelled': '已停止。', + 'flowChat.mock.resultDetail.cancelled': '驗證尚未完成,可展開命令卡片檢視已收到的輸出。', + 'flowChat.mock.resultDetail.stoppedBeforeChanges': '已在修改檔案前停止。', + 'flowChat.mock.result.analysis': '已定位原因,未修改檔案。', + 'flowChat.mock.resultDetail.analysis': '頁面需要在讀取 session.user 前處理空工作階段。按照你的選擇,流程停留在原因分析。', + 'flowChat.mock.fileResult': '安全處理空工作階段', + 'flowChat.mock.testResult': '涵蓋未登入狀態', + 'flowChat.mock.runtime.thinking': '正在分析請求', + 'flowChat.mock.runtime.exploring': '正在檢查登入實作', + 'flowChat.mock.runtime.question': '等待你的答覆', + 'flowChat.mock.runtime.editing': '正在修改元件和測試', + 'flowChat.mock.runtime.command': '正在檢查測試輸出', + 'flowChat.mock.runtime.result': '正在整理結果', + 'flowChat.mock.message': '訊息', + 'flowChat.mock.model': '預覽模型', + 'flowChat.mock.placeholder': '在此預覽中補充一條訊息…', + 'flowChat.mock.send': '傳送預覽訊息', + 'flowChat.mock.enqueue': '加入待傳送佇列', + 'flowChat.mock.queued': '待傳送', + 'flowChat.mock.sendQueued': '傳送佇列訊息', + 'flowChat.mock.deleteQueued': '刪除佇列訊息', + 'flowChat.mock.stop': '停止回放', + 'flowChat.mock.localReply': '已收到補充說明。此處展示追加訊息的對話效果,不會啟動新的執行。', +}; diff --git a/design-system/apps/design-lab/src/i18n/foundationsMessages.ts b/design-system/apps/design-lab/src/i18n/foundationsMessages.ts new file mode 100644 index 0000000000..8dadaee9dd --- /dev/null +++ b/design-system/apps/design-lab/src/i18n/foundationsMessages.ts @@ -0,0 +1,152 @@ +export const foundationsEn = { + "foundations.copyCSS": "Copy CSS", + "foundations.space.arrangement": "Spacing arrangement", + "foundations.space.inline": "Horizontal gap", + "foundations.space.stack": "Vertical gap", + "foundations.space.inset": "Inner padding", + "foundations.space.guides": "Measurement guides", + "foundations.space.content": "Content", + "foundations.space.inlineDescription": "{value} between the two elements, shown at actual size.", + "foundations.space.stackDescription": "{value} between the stacked elements, shown at actual size.", + "foundations.space.insetDescription": "{value} between content and each edge, shown at actual size.", + "foundations.space.selectHint": "Choose a step below to see how space changes the relationship between elements.", + "foundations.color.supporting": "Supporting information uses a quieter text role.", + "foundations.color.background": "Place the same content on a different surface", + "foundations.color.hint": "Switch the surface to compare text hierarchy against its background.", + "foundations.type.composition": "Typography in a reading layout", + "foundations.type.inspect": "Inspect type roles and try your own text", + "foundations.shape.compare": "Compare on the same surface", + "foundations.shape.cornerHint": "The guides mark the horizontal and vertical extent of the corner.", + "foundations.shape.pillHint": "The pill shape adapts to the dimensions of the surface.", + "foundations.shape.layerHint": "The same raised surface sits above a shared panel. Only the shadow changes.", + "foundations.motion.compareHint": "Hover a row to replay it, or replay all samples together to compare timing over the same distance and easing.", + "foundations.contents": "On this page", + "foundations.environment": "Preview environment", + "foundations.allColors": "Explore colors", + "foundations.copy": "Copy {name}", + "foundations.tryType": "Try your own text", + "foundations.reset": "Reset", + "foundations.fontSize": "Size", + "foundations.lineHeight": "Leading", + "foundations.weight": "Weight", + "foundations.type.heading.page": "Page heading", + "foundations.type.heading.section": "Section heading", + "foundations.type.body.lg": "Large body", + "foundations.type.body.md": "Body", + "foundations.type.label.md": "Label", + "foundations.type.code.sm": "Code", + "foundations.spacingScale": "Spacing scale", + "foundations.corners": "Corner radius", + "foundations.elevation": "Elevation", + "foundations.duration": "Duration comparison", + "foundations.replay": "Replay motion", + "foundations.reducedMotion": "Reduced motion is enabled on your device. Samples change position without animation.", + "foundations.keyboard": "Try it with a keyboard", + "foundations.keyboardHint": "Tab to the switch to see its focus ring, then press Space to change its state.", + "foundations.exampleControl": "Example switch", + "foundations.enabled": "On", + "foundations.disabled": "Off", + "foundations.openTokens": "Open workbench", +} as const; + +export const foundationsZhCN = { + "foundations.copyCSS": "复制样式", + "foundations.space.arrangement": "间距展示方式", + "foundations.space.inline": "横向间距", + "foundations.space.stack": "纵向间距", + "foundations.space.inset": "容器内边距", + "foundations.space.guides": "显示测量线", + "foundations.space.content": "内容区域", + "foundations.space.inlineDescription": "两个元素之间留出 {value},按实际尺寸展示。", + "foundations.space.stackDescription": "上下元素之间留出 {value},按实际尺寸展示。", + "foundations.space.insetDescription": "内容距离容器四边均为 {value},按实际尺寸展示。", + "foundations.space.selectHint": "选择下方刻度,观察留白如何改变元素之间的关系。", + "foundations.color.supporting": "辅助信息使用更轻的文字层级。", + "foundations.color.background": "将同一份内容放在不同表面上", + "foundations.color.hint": "切换表面,观察文字层级与背景的关系。", + "foundations.type.composition": "排版层级样张", + "foundations.type.inspect": "查看角色参数与文字试排", + "foundations.shape.compare": "在同一表面上比较", + "foundations.shape.cornerHint": "测量线标出圆角的水平与垂直范围。", + "foundations.shape.pillHint": "胶囊形态随表面尺寸变化。", + "foundations.shape.layerHint": "同样的浮层叠放在同一面板上,对照阴影带来的层次。", + "foundations.motion.compareHint": "悬停单项即可从头重播,也可统一重播所有样本,在相同距离与缓动下对照到达节奏。", + "foundations.contents": "本页目录", + "foundations.environment": "预览环境", + "foundations.allColors": "查看完整色彩", + "foundations.copy": "复制 {name}", + "foundations.tryType": "输入文字试排", + "foundations.reset": "重置", + "foundations.fontSize": "字号", + "foundations.lineHeight": "行高", + "foundations.weight": "字重", + "foundations.type.heading.page": "页面标题", + "foundations.type.heading.section": "章节标题", + "foundations.type.body.lg": "大号正文", + "foundations.type.body.md": "正文", + "foundations.type.label.md": "标签", + "foundations.type.code.sm": "代码", + "foundations.spacingScale": "间距尺度", + "foundations.corners": "圆角", + "foundations.elevation": "表面层级", + "foundations.duration": "时长对比", + "foundations.replay": "重播动效", + "foundations.reducedMotion": "设备已开启减少动态效果,示例将直接切换位置。", + "foundations.keyboard": "用键盘体验", + "foundations.keyboardHint": "按 Tab 移至开关,观察焦点轮廓,再按空格切换状态。", + "foundations.exampleControl": "示例开关", + "foundations.enabled": "已开启", + "foundations.disabled": "已关闭", + "foundations.openTokens": "打开工作台", +} satisfies Record; + +export const foundationsZhTW = { + "foundations.copyCSS": "複製樣式", + "foundations.space.arrangement": "間距展示方式", + "foundations.space.inline": "橫向間距", + "foundations.space.stack": "縱向間距", + "foundations.space.inset": "容器內距", + "foundations.space.guides": "顯示測量線", + "foundations.space.content": "內容區域", + "foundations.space.inlineDescription": "兩個元素之間留出 {value},依實際尺寸展示。", + "foundations.space.stackDescription": "上下元素之間留出 {value},依實際尺寸展示。", + "foundations.space.insetDescription": "內容距離容器四邊均為 {value},依實際尺寸展示。", + "foundations.space.selectHint": "選擇下方刻度,觀察留白如何改變元素之間的關係。", + "foundations.color.supporting": "輔助資訊使用更輕的文字層級。", + "foundations.color.background": "將同一份內容放在不同表面上", + "foundations.color.hint": "切換表面,觀察文字層級與背景的關係。", + "foundations.type.composition": "排版層級樣張", + "foundations.type.inspect": "查看角色參數與文字試排", + "foundations.shape.compare": "在同一表面上比較", + "foundations.shape.cornerHint": "測量線標出圓角的水平與垂直範圍。", + "foundations.shape.pillHint": "膠囊形態隨表面尺寸變化。", + "foundations.shape.layerHint": "同樣的浮層疊放在同一面板上,對照陰影帶來的層次。", + "foundations.motion.compareHint": "懸停單項即可從頭重播,也可統一重播所有樣本,在相同距離與緩動下對照到達節奏。", + "foundations.contents": "本頁目錄", + "foundations.environment": "預覽環境", + "foundations.allColors": "查看完整色彩", + "foundations.copy": "複製 {name}", + "foundations.tryType": "輸入文字試排", + "foundations.reset": "重設", + "foundations.fontSize": "字級", + "foundations.lineHeight": "行高", + "foundations.weight": "字重", + "foundations.type.heading.page": "頁面標題", + "foundations.type.heading.section": "章節標題", + "foundations.type.body.lg": "大號內文", + "foundations.type.body.md": "內文", + "foundations.type.label.md": "標籤", + "foundations.type.code.sm": "程式碼", + "foundations.spacingScale": "間距尺度", + "foundations.corners": "圓角", + "foundations.elevation": "表面層級", + "foundations.duration": "時長比較", + "foundations.replay": "重播動效", + "foundations.reducedMotion": "裝置已開啟減少動態效果,範例會直接切換位置。", + "foundations.keyboard": "用鍵盤體驗", + "foundations.keyboardHint": "按 Tab 移至開關,觀察焦點輪廓,再按空白鍵切換狀態。", + "foundations.exampleControl": "範例開關", + "foundations.enabled": "已開啟", + "foundations.disabled": "已關閉", + "foundations.openTokens": "開啟工作台", +} satisfies Record; diff --git a/design-system/apps/design-lab/src/i18n/messages.ts b/design-system/apps/design-lab/src/i18n/messages.ts index a2fe69ea23..59520e22c7 100644 --- a/design-system/apps/design-lab/src/i18n/messages.ts +++ b/design-system/apps/design-lab/src/i18n/messages.ts @@ -1,6 +1,34 @@ +import { semanticToolEn, semanticToolZhCN, semanticToolZhTW } from "./semanticToolMessages"; +import { previewEn, previewZhCN, previewZhTW } from "./previewMessages"; +import { brandAssetsEn, brandAssetsZhCN, brandAssetsZhTW } from "./brandMessages"; +import { designEn, designZhCN, designZhTW } from "./designMessages"; +import { flowChatEn, flowChatZhCN, flowChatZhTW } from "./flowChatMessages"; +import { subagentMotionEn, subagentMotionZhCN, subagentMotionZhTW } from "./subagentMotionMessages"; import type { DesignLabLocale } from "./core.mjs"; export const enUSMessages = { + ...semanticToolEn, + ...previewEn, + ...designEn, + ...brandAssetsEn, + ...subagentMotionEn, + ...flowChatEn, + "component.OpenBitFunSolidMark.description": "The original silver solid mark on a transparent canvas, preserving its material and shading.", + "component.OpenBitFunAppIcon.description": "The application icon used by the installed product: silver mark, black rounded-square tile, and assets for different display sizes.", + "nav.brand": "OpenBitFun Brand", + "brand.kicker": "Brand library", + "brand.description": "One home for the OpenBitFun mark and its motion. Use these shared components wherever the product introduces itself.", + "brand.play": "Play motion", + "brand.pause": "Pause motion", + "brand.identity": "Product identity", + "brand.identityDescription": "The same identity, from the first launch to every conversation.", + "brand.inspect": "States and API", + "brand.usage": "Using the brand", + "brand.usageDescription": "Use the mark alongside the product name, or provide a label when it stands alone. Color follows the surrounding surface; keep the authored proportions.", + "brand.motionDescription": "Breathing belongs to startup and loading, circulating highlights to brand introductions, and particles to voice. Playback respects reduced motion and pauses when hidden. The application supplies active state and real audio.", + "brand.assetsDescription": "Application, tray and launcher icons retain their silver artwork and generated platform assets. The pre-React startup screen uses the SVG generated from the same mark master.", + "component.OpenBitFunMark.description": "The transparent brand mark, with a quiet breathing motion for startup and loading.", + "component.OpenBitFunBrandMotion.description": "OpenBitFun motion: circulating highlights and a compact engineering drawing that forms the original mark.", "component.Icon.description": "Lucide icons with shared sizing, color and accessibility. The four modes and Git branch retain their original artwork.", "component.VoiceCallPanel.description": "A controlled live-call surface with a particle logo, transcripts and call controls.", "component.VoiceParticleLogo.description": "A reusable particle logo that reacts separately to microphone and assistant playback audio.", @@ -34,6 +62,16 @@ export const enUSMessages = { "nav.flowChat": "FlowChat", "nav.docs": "Docs", "nav.resources": "Resources", + "nav.subagentIp": "Subagent IP", + "subagentIp.kicker": "Character assets", + "subagentIp.description": "Explore {count} characters, their avatar sizes, and motion.", + "subagentIp.galleryLabel": "Subagent character family", + "subagentIp.previewTitle": "Character preview", + "subagentIp.avatarAlt": "{id} Subagent character", + "subagentIp.sizesTitle": "Avatar sizes", + "subagentIp.sizesDescription": "28 px is the default avatar size in the current conversation cards.", + "subagentIp.download": "Download SVG", + "search.subagentIpDetail": "{count} Subagent SVG characters and avatar sizes", "search.label": "Search Design Lab", "search.placeholder": "Search components, tokens, docs…", "search.noResults": "No Design Lab destinations match “{query}”.", @@ -99,10 +137,10 @@ export const enUSMessages = { "component.MobileTextarea.description": "A touch-friendly multiline field for expanded mobile composition and forms.", "component.ActionItem.description": "A native button row with independent leading, shortcut, and sibling action areas.", "component.ActivityItem.description": "A compact activity row with independent identity, description, metadata, and sibling action areas.", - "component.AgentControlToolCard.description": "A prominent subagent card with an openable identity, lifecycle state, and expandable prompt.", + "component.AgentControlToolCard.description": "A compact agent capsule with lifecycle status that opens its conversation in the side pane.", "component.AgentWaitToolCard.description": "An ambient trace for background-agent wait progress and completion summaries.", "component.AmbientToolCard.description": "A low-attention tool trace that stays glanceable in the conversation and can reveal supporting detail.", - "component.AskUser.description": "A controlled question card with responsive choices, custom answers, submission feedback, and an answered disclosure summary.", + "component.AskUser.description": "A controlled question card with step navigation, custom answers, and a question-and-answer message after submission.", "component.Button.description": "A compact action with outline, filled, primary, and text presentation variants.", "component.LauncherButton.description": "A shell-edge launcher with a leading icon and distinct default, hover, and pressed emphasis states.", "component.Card.description": "A composable content surface with independent media, header, body, footer, spacing, clipping, and elevation contracts.", @@ -150,7 +188,7 @@ export const enUSMessages = { "components.preview.rollingTextLong": "Review workspace navigation and session switching", "detail.option.replacing": "Replacement", "component.TerminalControlToolCard.description": "An ambient trace for interrupting or terminating a terminal session.", - "component.TodoToolCard.description": "An ambient task-progress card with compact and expandable list presentations.", + "component.TodoToolCard.description": "A prominent task-progress card with a current-task summary and an expandable list.", "component.Toolbar.description": "A responsive bar with independent leading, centered, trailing, and horizontally scrollable composition regions.", "component.Tooltip.description": "A portaled, delay-managed hover label that flips placement at viewport edges and supports cursor-following and interactive content.", "component.ViewImageToolCard.description": "An ambient image-result card with an expandable preview and accessible lightbox.", @@ -163,7 +201,7 @@ export const enUSMessages = { "overview.footerLicense": "MIT licensed · Contract 0.1", "gettingStarted.kicker": "Start here", "gettingStarted.title": "Build with the real package contract.", - "gettingStarted.description": "Connect tokens, the OpenBitFun theme, and public UI components without coupling product routes or state into the library.", + "gettingStarted.description": "Add the theme and components to your application.", "gettingStarted.browseComponents": "Browse components", "gettingStarted.openTokens": "Open token workbench", "gettingStarted.stepsLabel": "Getting started steps", @@ -185,7 +223,7 @@ export const enUSMessages = { "gettingStarted.viewResources": "View resources", "resources.kicker": "System", "resources.title": "Resources", - "resources.description": "Real package documentation, authoring boundaries, and release rules for this independent component library.", + "resources.description": "Package guides, contribution rules, and release documentation.", "resources.factsLabel": "Current design system facts", "resources.componentsFact": "registered components", "resources.tokensFact": "editable tokens", @@ -207,8 +245,8 @@ export const enUSMessages = { "resources.boundaryTitle": "Tokens → theme → components → Design Lab", "resources.boundaryDescription": "Design Lab is an authoring and inspection surface. Public packages remain independent from its routes, state, and locale catalog.", "patterns.kicker": "Recipes", - "patterns.title": "Product patterns from the reference design.", - "patterns.description": "Reusable settings, navigation, command-search, and device compositions built only from public design-system contracts.", + "patterns.title": "Patterns", + "patterns.description": "Explore how components work together in common interfaces.", "patterns.settings.title": "Settings form", "patterns.settings.description": "A 216-pixel navigation companion, clear page hierarchy, and compact grouped fields mirror the reference settings surface.", "patterns.settings.language": "Interface language", @@ -308,6 +346,10 @@ export const enUSMessages = { "components.preview.flowChat.askUserBetaDescription": "Latest Beta pre-release — newer and has passed basic testing", "components.preview.flowChat.askUserError": "Questions could not be loaded", "components.preview.flowChat.askUserHeader": "1 question", + "components.preview.flowChat.askUserBack": "Back", + "components.preview.flowChat.askUserNext": "Next", + "components.preview.flowChat.askUserProgress": "{current} of {total}", + "components.preview.flowChat.askUserSelection": "{selected} of {total} selected", "components.preview.flowChat.askUserLoading": "Loading questions…", "components.preview.flowChat.askUserNightly": "Nightly build", "components.preview.flowChat.askUserNightlyDescription": "Daily automatic builds — contain the latest code but are untested", @@ -600,7 +642,7 @@ export const enUSMessages = { "tokens.valueInput": "{name} value", "tokens.kicker": "Token workbench", "tokens.title": "Design Tokens", - "tokens.description": "Inspect and edit the generated non-color contract for typography, spacing, geometry, motion, and elevation.", + "tokens.description": "Find a token, edit its value, and inspect the effect.", "tokens.palette.kicker": "Reference palette", "tokens.palette.title": "Foundational color scales", "tokens.palette.description": "Named numeric steps describe hue and tone before semantic roles map them into each theme mode.", @@ -677,7 +719,7 @@ export const enUSMessages = { "tokens.validation.fontWeight": "Use an integer from 1 to 1000.", "tokens.validation.cubicBezier": "Use cubic-bezier(x1, y1, x2, y2).", "colors.breadcrumbLabel": "Colors breadcrumb", - "colors.description": "A semantic color system with multiple themes and display modes.", + "colors.description": "Browse semantic colors and compare their values across themes.", "colors.theme": "Theme", "colors.themeName": "OpenBitFun Theme v{version}", "colors.mode": "Mode", @@ -764,6 +806,28 @@ export type MessageKey = keyof typeof enUSMessages; export type MessageCatalog = Readonly>; export const zhCNMessages = { + ...semanticToolZhCN, + ...previewZhCN, + ...designZhCN, + ...brandAssetsZhCN, + ...subagentMotionZhCN, + ...flowChatZhCN, + "component.OpenBitFunSolidMark.description": "透明底的银色实体标志,保留原稿的材质、光泽与立体明暗。", + "component.OpenBitFunAppIcon.description": "实际应用使用的图标:银色实体标志、黑色圆角底板,以及适配不同显示尺寸的资源。", + "nav.brand": "OpenBitFun 品牌", + "brand.kicker": "品牌组件库", + "brand.description": "统一管理 OpenBitFun 标志与品牌动效,让应用在每一个品牌触点使用同一套组件。", + "brand.play": "播放动效", + "brand.pause": "暂停动效", + "brand.identity": "产品标识", + "brand.identityDescription": "从首次启动到每一次对话,保持一致的品牌识别。", + "brand.inspect": "查看状态与用法", + "brand.usage": "使用方式", + "brand.usageDescription": "标志与产品名称并列时作为装饰;独立使用时提供无障碍名称。颜色跟随所在界面,保持原有图形比例。", + "brand.motionDescription": "呼吸动效用于启动与加载,流光用于品牌介绍,粒子用于语音。动效遵守系统的减少动态效果设置,隐藏时暂停;应用传入播放状态与真实音频。", + "brand.assetsDescription": "应用、托盘和启动器图标继续使用银色图形及生成的各平台资源。React 启动前的静态画面使用同一标志母版生成的 SVG。", + "component.OpenBitFunMark.description": "透明品牌标志,可开启用于启动与加载的轻微呼吸动效。", + "component.OpenBitFunBrandMotion.description": "品牌动效:沿轮廓流动的高光,以及适合小尺寸加载的工程制图成形过程。", "component.Icon.description": "统一尺寸、颜色和无障碍行为的 Lucide 图标;四种模式与 Git 分支保留原图形。", "component.VoiceCallPanel.description": "受控通话面板,包含粒子标志、转写文本和通话控件。", "component.VoiceParticleLogo.description": "可复用的粒子标志,分别响应麦克风与 AI 播放音频。", @@ -797,6 +861,16 @@ export const zhCNMessages = { "nav.flowChat": "FlowChat", "nav.docs": "文档", "nav.resources": "资源", + "nav.subagentIp": "Subagent IP", + "subagentIp.kicker": "角色资产", + "subagentIp.description": "查看 {count} 位角色的形象、头像尺寸与动效。", + "subagentIp.galleryLabel": "Subagent 全系列形象", + "subagentIp.previewTitle": "形象预览", + "subagentIp.avatarAlt": "{id} Subagent 形象", + "subagentIp.sizesTitle": "头像尺寸", + "subagentIp.sizesDescription": "28 px 为当前对话卡片中的默认头像尺寸。", + "subagentIp.download": "下载 SVG", + "search.subagentIpDetail": "{count} 个 Subagent SVG 角色与头像尺寸预览", "search.label": "搜索 Design Lab", "search.placeholder": "搜索组件、Token、文档…", "search.noResults": "没有与“{query}”匹配的 Design Lab 条目。", @@ -862,10 +936,10 @@ export const zhCNMessages = { "component.MobileTextarea.description": "用于展开态输入和表单的触控友好多行文本框。", "component.ActionItem.description": "使用原生按钮语义,并拆分前置、快捷键与同级尾部操作区域的行项目。", "component.ActivityItem.description": "紧凑的活动行,可独立配置标识、描述、统计信息和同级尾部操作。", - "component.AgentControlToolCard.description": "关注型子 Agent 卡片,统一呈现可打开的身份、生命周期状态和可展开提示词。", + "component.AgentControlToolCard.description": "紧凑的子 Agent 胶囊,呈现任务和状态,点击在侧栏打开会话。", "component.AgentWaitToolCard.description": "低关注等待轨迹,用于呈现后台 Agent 的等待进度与完成摘要。", "component.AmbientToolCard.description": "用于低关注工具轨迹,在对话中保持轻量易扫读,并可按需展开辅助详情。", - "component.AskUser.description": "受控的提问卡片,包含响应式选项、自定义答案、提交反馈与已回答展开摘要。", + "component.AskUser.description": "受控的提问卡片,支持逐题导航和自定义答案,提交后以消息形式展示问题与回答。", "component.Button.description": "紧凑的操作组件,支持描边、填充、主要和文字呈现方式。", "component.LauncherButton.description": "贴合应用边缘的启动按钮,支持前置图标以及明确的默认、悬停和按下高亮状态。", "component.Card.description": "媒体、头部、主体、底部、间距、裁切与层级彼此独立的可组合内容表面。", @@ -913,7 +987,7 @@ export const zhCNMessages = { "components.preview.rollingTextLong": "检查工作区导航与会话切换时的交互行为", "detail.option.replacing": "替换", "component.TerminalControlToolCard.description": "低关注终端控制轨迹,用于呈现中断或终止终端会话的结果。", - "component.TodoToolCard.description": "低关注任务进度卡片,支持紧凑摘要与可展开列表两种呈现。", + "component.TodoToolCard.description": "关键任务进度卡片,展示当前任务摘要与可展开的任务列表。", "component.Toolbar.description": "具备独立前置、居中、尾部与横向滚动区域的响应式工具栏。", "component.Tooltip.description": "具备 Portal、延迟管理、视口边缘翻转,并支持跟随光标与可交互内容的悬停提示。", "component.ViewImageToolCard.description": "低关注图片结果卡片,包含可展开预览和无障碍灯箱。", @@ -926,7 +1000,7 @@ export const zhCNMessages = { "overview.footerLicense": "MIT 许可 · 契约 0.1", "gettingStarted.kicker": "从这里开始", "gettingStarted.title": "基于真实的包契约开始构建。", - "gettingStarted.description": "连接 Token、OpenBitFun 主题和公共 UI 组件,同时避免将产品路由或状态耦合进组件库。", + "gettingStarted.description": "将主题和组件接入你的应用。", "gettingStarted.browseComponents": "浏览组件", "gettingStarted.openTokens": "打开 Token 工作台", "gettingStarted.stepsLabel": "开始使用步骤", @@ -948,7 +1022,7 @@ export const zhCNMessages = { "gettingStarted.viewResources": "查看资源", "resources.kicker": "系统", "resources.title": "资源", - "resources.description": "这个独立组件库真实存在的包文档、创作边界与发布规则。", + "resources.description": "包文档、贡献指南与发布规范。", "resources.factsLabel": "当前设计系统事实", "resources.componentsFact": "个已注册组件", "resources.tokensFact": "个可编辑 Token", @@ -970,8 +1044,8 @@ export const zhCNMessages = { "resources.boundaryTitle": "Token → 主题 → 组件 → Design Lab", "resources.boundaryDescription": "Design Lab 是创作与检查界面,公共包继续与它的路由、状态和语言目录保持独立。", "patterns.kicker": "组合范式", - "patterns.title": "来自参考设计的产品模式。", - "patterns.description": "仅使用公开设计系统契约构建的设置、导航、命令搜索和设备组合。", + "patterns.title": "组合示例", + "patterns.description": "查看组件在常见界面中的组合与交互。", "patterns.settings.title": "设置表单", "patterns.settings.description": "216 像素导航搭档、清晰页面层级与紧凑分组字段复现参考设置界面。", "patterns.settings.language": "界面语言", @@ -1071,6 +1145,10 @@ export const zhCNMessages = { "components.preview.flowChat.askUserBetaDescription": "最新 Beta 预发布版——版本更新,且已通过基础测试", "components.preview.flowChat.askUserError": "无法加载问题", "components.preview.flowChat.askUserHeader": "1 个问题", + "components.preview.flowChat.askUserBack": "返回", + "components.preview.flowChat.askUserNext": "下一步", + "components.preview.flowChat.askUserProgress": "第 {current} / {total} 题", + "components.preview.flowChat.askUserSelection": "已选 {selected} / {total} 项", "components.preview.flowChat.askUserLoading": "正在加载问题…", "components.preview.flowChat.askUserNightly": "Nightly 构建", "components.preview.flowChat.askUserNightlyDescription": "每日自动构建——包含最新代码,但尚未测试", @@ -1363,7 +1441,7 @@ export const zhCNMessages = { "tokens.valueInput": "{name} 的值", "tokens.kicker": "Token 工作台", "tokens.title": "Design Token", - "tokens.description": "检查并编辑排版、间距、几何、动效与层级等非颜色契约。", + "tokens.description": "查找 Token,修改取值,查看实际效果。", "tokens.palette.kicker": "基础色板", "tokens.palette.title": "名称 + 数字的基础色阶", "tokens.palette.description": "基础色阶先描述色相与明度,再由语义 Token 将它们映射到各个主题模式。", @@ -1440,7 +1518,7 @@ export const zhCNMessages = { "tokens.validation.fontWeight": "请输入 1 到 1000 之间的整数。", "tokens.validation.cubicBezier": "请使用 cubic-bezier(x1, y1, x2, y2)。", "colors.breadcrumbLabel": "颜色页面面包屑", - "colors.description": "语义颜色系统,支持多主题和多模式。", + "colors.description": "按用途查找颜色,对照不同主题中的取值。", "colors.theme": "主题", "colors.themeName": "OpenBitFun Theme v{version}", "colors.mode": "模式", @@ -1525,6 +1603,31 @@ export const zhCNMessages = { export const zhTWMessages = { ...zhCNMessages, + ...semanticToolZhTW, + ...designZhTW, + ...previewZhTW, + ...brandAssetsZhTW, + ...subagentMotionZhTW, + ...flowChatZhTW, + "patterns.description": "查看元件在常見介面中的組合與互動。", + "patterns.title": "組合範例", + "component.OpenBitFunSolidMark.description": "透明底的銀色實體標誌,保留原稿的材質、光澤與立體明暗。", + "component.OpenBitFunAppIcon.description": "實際應用程式使用的圖示:銀色實體標誌、黑色圓角底板,以及適配不同顯示尺寸的資源。", + "nav.brand": "OpenBitFun 品牌", + "brand.kicker": "品牌元件庫", + "brand.description": "統一管理 OpenBitFun 標誌與品牌動效,讓應用程式在每個品牌接觸點使用同一套元件。", + "brand.play": "播放動效", + "brand.pause": "暫停動效", + "brand.identity": "產品標識", + "brand.identityDescription": "從首次啟動到每一次對話,保持一致的品牌識別。", + "brand.inspect": "檢視狀態與用法", + "brand.usage": "使用方式", + "brand.usageDescription": "標誌與產品名稱並列時作為裝飾;獨立使用時提供無障礙名稱。色彩跟隨所在介面,保持原有圖形比例。", + "brand.motionDescription": "呼吸動效用於啟動與載入,流光用於品牌介紹,粒子用於語音。動效遵守系統減少動態效果設定,隱藏時暫停;應用程式傳入播放狀態與真實音訊。", + "brand.assetsDescription": "應用程式、系統匣和啟動器圖示繼續使用銀色圖形及產生的各平台資源。React 啟動前的靜態畫面使用同一標誌母版產生的 SVG。", + "component.OpenBitFunMark.description": "透明品牌標誌,可開啟用於啟動與載入的輕微呼吸動效。", + "component.OpenBitFunBrandMotion.description": "品牌動效:沿輪廓流動的高光,以及適合小尺寸載入的工程製圖成形過程。", + "component.Icon.description": "統一尺寸、顏色和無障礙行為的 Lucide 圖示;四種模式與 Git 分支保留原圖形。", "component.VoiceCallPanel.description": "受控通話面板,包含粒子標誌、轉寫文字與通話控制項。", "component.VoiceParticleLogo.description": "可重用的粒子標誌,分別回應麥克風與 AI 播放音訊。", @@ -1603,6 +1706,16 @@ export const zhTWMessages = { "nav.flowChat": "FlowChat", "nav.docs": "文件", "nav.resources": "資源", + "nav.subagentIp": "Subagent IP", + "subagentIp.kicker": "角色素材", + "subagentIp.description": "查看 {count} 位角色的形象、頭像尺寸與動效。", + "subagentIp.galleryLabel": "Subagent 全系列形象", + "subagentIp.previewTitle": "形象預覽", + "subagentIp.avatarAlt": "{id} Subagent 形象", + "subagentIp.sizesTitle": "頭像尺寸", + "subagentIp.sizesDescription": "28 px 為目前對話卡片中的預設頭像尺寸。", + "subagentIp.download": "下載 SVG", + "search.subagentIpDetail": "{count} 個 Subagent SVG 角色與頭像尺寸預覽", "search.label": "搜尋 Design Lab", "search.placeholder": "搜尋元件、Token、文件…", "search.noResults": "沒有與「{query}」相符的 Design Lab 項目。", @@ -1666,10 +1779,10 @@ export const zhTWMessages = { "component.MobileTextarea.description": "用於展開態輸入和表單的觸控友好多行文字欄位。", "component.ActionItem.description": "使用原生按鈕語意,並拆分前置、快捷鍵與同級尾端操作區域的列項目。", "component.ActivityItem.description": "緊湊的活動列,可獨立設定標識、描述、統計資訊和同級尾端操作。", - "component.AgentControlToolCard.description": "關注型子 Agent 卡片,統一呈現可開啟的身分、生命週期狀態和可展開提示詞。", + "component.AgentControlToolCard.description": "精簡的子 Agent 膠囊,呈現任務與狀態,點擊在側欄開啟對話。", "component.AgentWaitToolCard.description": "低關注等待軌跡,用於呈現背景 Agent 的等待進度與完成摘要。", "component.AmbientToolCard.description": "用於低關注工具軌跡,在對話中保持輕量易掃讀,並可按需展開輔助詳情。", - "component.AskUser.description": "受控的提問卡片,包含響應式選項、自訂答案、提交回饋與已回答展開摘要。", + "component.AskUser.description": "受控的提問卡片,支援逐題導覽和自訂答案,提交後以訊息形式顯示問題與回答。", "component.Button.description": "緊湊的中性操作元件,支援描邊和填滿兩種呈現方式。", "component.LauncherButton.description": "貼合應用邊緣的啟動按鈕,支援前置圖示以及明確的預設、懸停和按下高亮狀態。", "component.Card.description": "媒體、頂部、主體、底部、間距、裁切與層級彼此獨立的可組合內容表面。", @@ -1713,7 +1826,7 @@ export const zhTWMessages = { "components.preview.rollingTextLong": "檢查工作區導覽與工作階段切換時的互動行為", "detail.option.replacing": "替換", "component.TerminalControlToolCard.description": "低關注終端控制軌跡,用於呈現中斷或終止終端工作階段的結果。", - "component.TodoToolCard.description": "低關注任務進度卡片,支援緊湊摘要與可展開列表兩種呈現。", + "component.TodoToolCard.description": "關鍵任務進度卡片,顯示目前任務摘要與可展開的任務清單。", "component.Toolbar.description": "具備獨立前置、置中、尾端與橫向捲動區域的響應式工具列。", "component.Tooltip.description": "具備 Portal、延遲管理、視口邊緣翻轉,並支援跟隨游標與可互動內容的懸停提示。", "component.ViewImageToolCard.description": "低關注圖片結果卡片,包含可展開預覽和無障礙燈箱。", @@ -1726,7 +1839,7 @@ export const zhTWMessages = { "overview.footerLicense": "MIT 授權 · 契約 0.1", "gettingStarted.kicker": "從這裡開始", "gettingStarted.title": "基於真實的套件契約開始建構。", - "gettingStarted.description": "連接 Token、OpenBitFun 主題和公共 UI 元件,同時避免將產品路由或狀態耦合進元件庫。", + "gettingStarted.description": "將主題與元件接入你的應用。", "gettingStarted.browseComponents": "瀏覽元件", "gettingStarted.openTokens": "開啟 Token 工作台", "gettingStarted.stepsLabel": "開始使用步驟", @@ -1748,7 +1861,7 @@ export const zhTWMessages = { "gettingStarted.viewResources": "檢視資源", "resources.kicker": "系統", "resources.title": "資源", - "resources.description": "這個獨立元件庫真實存在的套件文件、創作邊界與發佈規則。", + "resources.description": "套件文件、貢獻指南與發佈規範。", "resources.factsLabel": "目前設計系統事實", "resources.componentsFact": "個已註冊元件", "resources.tokensFact": "個可編輯 Token", @@ -1784,6 +1897,10 @@ export const zhTWMessages = { "components.preview.flowChat.askUserBetaDescription": "最新 Beta 預發佈版——版本更新,且已通過基礎測試", "components.preview.flowChat.askUserError": "無法載入問題", "components.preview.flowChat.askUserHeader": "1 個問題", + "components.preview.flowChat.askUserBack": "返回", + "components.preview.flowChat.askUserNext": "下一步", + "components.preview.flowChat.askUserProgress": "第 {current} / {total} 題", + "components.preview.flowChat.askUserSelection": "已選 {selected} / {total} 項", "components.preview.flowChat.askUserLoading": "正在載入問題…", "components.preview.flowChat.askUserNightly": "Nightly 建置", "components.preview.flowChat.askUserNightlyDescription": "每日自動建置——包含最新程式碼,但尚未測試", @@ -2062,7 +2179,7 @@ export const zhTWMessages = { "tokens.colorPicker": "{name} 顏色選擇器", "tokens.valueInput": "{name} 的值", "tokens.kicker": "Token 工作台", - "tokens.description": "檢查並編輯排版、間距、幾何、動效與層級等非顏色契約。", + "tokens.description": "尋找 Token,修改數值,查看實際效果。", "tokens.palette.kicker": "基礎色板", "tokens.palette.title": "名稱 + 數字的基礎色階", "tokens.palette.description": "基礎色階先描述色相與明度,再由語意 Token 將它們映射到各個主題模式。", @@ -2137,7 +2254,7 @@ export const zhTWMessages = { "tokens.validation.fontWeight": "請輸入 1 到 1000 之間的整數。", "tokens.validation.cubicBezier": "請使用 cubic-bezier(x1, y1, x2, y2)。", "colors.breadcrumbLabel": "顏色頁面麵包屑", - "colors.description": "語意顏色系統,支援多主題和多模式。", + "colors.description": "按用途尋找色彩,對照不同主題中的值。", "colors.theme": "主題", "colors.themeName": "OpenBitFun Theme v{version}", "colors.mode": "模式", diff --git a/design-system/apps/design-lab/src/i18n/previewMessages.ts b/design-system/apps/design-lab/src/i18n/previewMessages.ts new file mode 100644 index 0000000000..fdd313a376 --- /dev/null +++ b/design-system/apps/design-lab/src/i18n/previewMessages.ts @@ -0,0 +1,114 @@ +export const previewEn = { + "preview.examples": "Examples", + "preview.inspect": "Try {component}: {state}", + "preview.note.matrix": "Compare each style across interaction states. Switch to a single preview to adjust its properties.", + "preview.note.compact": "Compare the component’s distinct states at their actual size. Each example can be tried independently.", + "preview.note.fields": "Compare editable, validation and disabled states. Type in the available fields to try them.", + "preview.note.cards": "Compare complete compositions, including their content, actions and surface treatment.", + "preview.note.stack": "See each example at its natural content width, with the surrounding anatomy intact.", + "preview.note.icons": "Search the icon catalog and select a symbol to update its code example. Adjust size and tone in the single preview.", + "preview.note.interactive": "Choose a state, then use the control to open and dismiss the real surface. One instance runs at a time.", + "preview.note.composition": "Try the component in its working layout. Use the state selector to explore other conditions.", + "preview.note.conversation": "Inspect a single card or place it in the conversation. The same component stays mounted while switching context.", + "preview.note.motion": "Use the controls to try the motion and its lifecycle, one active instance at a time.", + "preview.note.brand": "Preview the original artwork and its playback states. Brand resources provide size comparisons and downloads.", + "preview.searchIcons": "Search icons", + "preview.styles": "Styles", + "preview.nativeDisclosure": "Native disclosure", + "preview.states": "States", + "preview.hidden": "This state intentionally hides the component. Select a visible state to inspect it again.", + "preview.mobileWidth": "Mobile content width", + "preview.scrim": "Open backdrop", + "preview.scrimHint": "Click the backdrop to dismiss it.", + "preview.sent": "The preview message has been added to the conversation.", + "preview.state.accent": "Accent", "preview.state.neutral": "Neutral", "preview.state.danger": "Danger", + "preview.state.image": "Image", "preview.state.fallback": "Fallback", "preview.state.grouped": "Group", + "preview.state.indeterminate": "Indeterminate", "preview.state.checked": "Checked", + "preview.state.indicator": "Indicator", "preview.state.with-label": "With label", + "preview.state.with-title": "With title", "preview.state.with-actions": "With actions", + "preview.state.matrix": "Matrix", "preview.state.bars": "Bars", "preview.state.reduced-motion": "Reduced motion", + "preview.state.counter-rotate": "Counter-rotating hexagons", + "preview.state.construction": "Engineering drawing", + "preview.state.secondary": "Secondary", "preview.state.elevated": "Elevated", "preview.state.floating": "Floating", + "preview.state.floating-footer": "Floating footer", "preview.state.alert": "Alert dialog", + "preview.state.disabled-option": "Disabled option", "preview.state.instant": "Immediate tooltip", "preview.state.interactive": "Interactive tooltip", + "preview.state.content-only": "Content only", "preview.state.with-heading": "With heading", "preview.state.with-action": "With action", + "preview.state.centered": "Centered", "preview.state.with-subtitle": "With subtitle", + "preview.state.narrow": "Narrow", "preview.state.wide": "Wide", "preview.state.safe-area": "Safe area", + "preview.state.closed": "Closed", "preview.state.exiting": "Exit transition", + "preview.state.user": "User", "preview.state.assistant": "Assistant", "preview.state.system": "System", +} as const; + +export const previewZhCN: Record = { + "preview.examples": "示例总览", + "preview.inspect": "试用 {component}:{state}", + "preview.note.matrix": "并列比较不同样式与交互状态;切换到单个预览,可进一步调整属性。", + "preview.note.compact": "按实际尺寸对比各个状态,每个示例都可以独立体验。", + "preview.note.fields": "对比输入、校验和禁用状态,也可以直接在可编辑的字段中输入。", + "preview.note.cards": "通过完整内容、操作和表面样式,比较组件的不同组合方式。", + "preview.note.stack": "以适合内容的宽度呈现完整示例,保留标题、操作和内容之间的关系。", + "preview.note.icons": "搜索并选择图标,代码示例会同步更新;单个预览中可调整尺寸与颜色语义。", + "preview.note.interactive": "选择状态后,通过真实控件体验打开、操作和关闭;一次展示一个实例。", + "preview.note.composition": "在实际组合中体验组件,通过状态选择器查看其他情况。", + "preview.note.conversation": "分别检查单个组件与对话中的表现,切换上下文时保留同一个组件实例。", + "preview.note.motion": "通过控件体验动态效果和不同阶段,一次播放一个实例。", + "preview.note.brand": "查看原始品牌图形与播放状态;尺寸对照和下载请进入品牌资源。", + "preview.searchIcons": "搜索图标", + "preview.styles": "样式", + "preview.nativeDisclosure": "原生折叠交互", + "preview.states": "状态", + "preview.hidden": "此状态下组件会隐藏,可切换到其他状态继续查看。", + "preview.mobileWidth": "移动端内容宽度", + "preview.scrim": "打开遮罩", + "preview.scrimHint": "点击遮罩可将其关闭。", + "preview.sent": "预览消息已加入对话。", + "preview.state.accent": "强调", "preview.state.neutral": "中性", "preview.state.danger": "危险", + "preview.state.image": "图片", "preview.state.fallback": "缺省头像", "preview.state.grouped": "头像组", + "preview.state.indeterminate": "部分选中", "preview.state.checked": "选中", + "preview.state.indicator": "指示器", "preview.state.with-label": "附带文字", + "preview.state.with-title": "附带标题", "preview.state.with-actions": "附带操作", + "preview.state.matrix": "点阵", "preview.state.bars": "条形", "preview.state.reduced-motion": "减少动态效果", + "preview.state.counter-rotate": "双六边形对转", + "preview.state.construction": "工程制图", + "preview.state.secondary": "次要", "preview.state.elevated": "浮起表面", "preview.state.floating": "悬浮", + "preview.state.floating-footer": "悬浮页脚", "preview.state.alert": "提醒弹窗", + "preview.state.disabled-option": "禁用选项", "preview.state.instant": "即时提示", "preview.state.interactive": "可交互提示", + "preview.state.content-only": "仅内容", "preview.state.with-heading": "附带标题", "preview.state.with-action": "附带操作", + "preview.state.centered": "居中", "preview.state.with-subtitle": "附带副标题", + "preview.state.narrow": "窄屏", "preview.state.wide": "宽屏", "preview.state.safe-area": "安全区域", + "preview.state.closed": "关闭", "preview.state.exiting": "退出过渡", + "preview.state.user": "用户", "preview.state.assistant": "助手", "preview.state.system": "系统", +}; + +export const previewZhTW: Record = { + ...previewZhCN, + "preview.examples": "範例總覽", + "preview.inspect": "試用 {component}:{state}", + "preview.note.matrix": "並列比較不同樣式與互動狀態;切換到單獨預覽,可進一步調整屬性。", + "preview.note.compact": "按實際尺寸比較各個狀態,每個範例都可以獨立體驗。", + "preview.note.fields": "比較輸入、驗證與停用狀態,也可以直接在可編輯的欄位中輸入。", + "preview.note.cards": "透過完整內容、操作與表面樣式,比較元件的不同組合方式。", + "preview.note.stack": "以適合內容的寬度呈現完整範例,保留標題、操作與內容之間的關係。", + "preview.note.icons": "搜尋並選取圖示,程式碼範例會同步更新;單獨預覽中可調整尺寸與色彩語義。", + "preview.note.interactive": "選擇狀態後,透過真實控制項體驗開啟、操作與關閉;一次展示一個實例。", + "preview.note.composition": "在實際組合中體驗元件,透過狀態選擇器查看其他情況。", + "preview.note.conversation": "分別檢查單獨元件與對話中的表現,切換上下文時保留同一個元件實例。", + "preview.note.motion": "透過控制項體驗動態效果與不同階段,一次播放一個實例。", + "preview.note.brand": "查看原始品牌圖形與播放狀態;尺寸對照與下載請進入品牌資源。", + "preview.searchIcons": "搜尋圖示", "preview.styles": "樣式", "preview.states": "狀態", + "preview.nativeDisclosure": "原生摺疊互動", + "preview.hidden": "此狀態下元件會隱藏,可切換到其他狀態繼續查看。", + "preview.mobileWidth": "行動版內容寬度", "preview.scrim": "開啟遮罩", + "preview.scrimHint": "點擊遮罩可將其關閉。", "preview.sent": "預覽訊息已加入對話。", + "preview.state.accent": "強調", "preview.state.danger": "危險", "preview.state.image": "圖片", + "preview.state.fallback": "預設頭像", "preview.state.grouped": "頭像群組", "preview.state.indeterminate": "部分選取", "preview.state.checked": "選取", + "preview.state.indicator": "指示器", "preview.state.with-label": "附帶文字", "preview.state.with-title": "附帶標題", "preview.state.with-actions": "附帶操作", + "preview.state.matrix": "點陣", "preview.state.bars": "條形", "preview.state.reduced-motion": "減少動態效果", + "preview.state.counter-rotate": "雙六邊形對轉", + "preview.state.construction": "工程製圖", + "preview.state.floating": "懸浮", "preview.state.floating-footer": "懸浮頁尾", "preview.state.alert": "提醒對話框", + "preview.state.disabled-option": "停用選項", "preview.state.instant": "即時提示", "preview.state.interactive": "可互動提示", + "preview.state.content-only": "僅內容", "preview.state.with-heading": "附帶標題", "preview.state.with-action": "附帶操作", + "preview.state.with-subtitle": "附帶副標題", "preview.state.narrow": "窄螢幕", "preview.state.wide": "寬螢幕", "preview.state.safe-area": "安全區域", + "preview.state.closed": "關閉", "preview.state.exiting": "退出過渡", "preview.state.user": "使用者", "preview.state.system": "系統", +}; diff --git a/design-system/apps/design-lab/src/i18n/semanticToolMessages.ts b/design-system/apps/design-lab/src/i18n/semanticToolMessages.ts new file mode 100644 index 0000000000..09b6f7d5b1 --- /dev/null +++ b/design-system/apps/design-lab/src/i18n/semanticToolMessages.ts @@ -0,0 +1,557 @@ +export const semanticToolEn = { + "flowChat.builtin.tools.get_goal": "Read goal", + "flowChat.builtin.tools.create_goal": "Start goal", + "flowChat.builtin.tools.update_goal": "Update goal", + "flowChat.builtin.tools.AgentList": "View agents", + "flowChat.builtin.tools.AgentDelete": "Delete agents", + "flowChat.builtin.tools.SessionHistory": "Export history", + "flowChat.builtin.tools.analyze_image": "Analyze image", + "flowChat.builtin.tools.GetTime": "Read time", + "flowChat.builtin.tools.ListMCPResources": "Discover resources", + "flowChat.builtin.tools.ReadMCPResource": "Read resource", + "flowChat.builtin.tools.ListMCPPrompts": "Find prompt templates", + "flowChat.builtin.tools.GetMCPPrompt": "Load prompt template", + "flowChat.builtin.tools.Worktree": "Worktree", + "flowChat.builtin.tools.PortForward": "Port forwarding", + "flowChat.builtin.tools.ReviewPlatform": "Review platform", + "flowChat.builtin.tools.FrontendWorkbench": "Frontend customization", + "flowChat.builtin.tools.FinalizeMiniApp": "Update Mini App", + "flowChat.builtin.tools.PublishMiniApp": "Submit Mini App", + "flowChat.builtin.tools.PublishAppearance": "Submit Skin", + "flowChat.builtin.tools.Playbook": "Read operation guide", + "flowChat.builtin.fields.results": "Results", + "flowChat.builtin.fields.objective": "Objective", + "flowChat.builtin.fields.state": "State", + "flowChat.builtin.fields.tokenBudget": "Token budget", + "flowChat.builtin.fields.tokensUsed": "Tokens used", + "flowChat.builtin.fields.tokensRemaining": "Tokens remaining", + "flowChat.builtin.fields.elapsed": "Elapsed time", + "flowChat.builtin.fields.completionReport": "Completion report", + "flowChat.builtin.fields.agents": "Agents", + "flowChat.builtin.fields.deletedAgents": "Deleted agent sessions", + "flowChat.builtin.fields.session": "Session", + "flowChat.builtin.fields.workspace": "Workspace", + "flowChat.builtin.fields.path": "Path", + "flowChat.builtin.fields.turns": "Turns", + "flowChat.builtin.fields.index": "Index lines", + "flowChat.builtin.fields.includeTools": "Include tool results", + "flowChat.builtin.fields.includeToolInputs": "Include tool inputs", + "flowChat.builtin.fields.includeThinking": "Include thinking", + "flowChat.builtin.fields.model": "Vision model", + "flowChat.builtin.fields.dimensions": "Image size", + "flowChat.builtin.fields.question": "Question", + "flowChat.builtin.fields.analysis": "Analysis", + "flowChat.builtin.fields.imageCoordinates": "Coordinate context", + "flowChat.builtin.fields.imageResize": "Image resizing", + "flowChat.builtin.fields.localTime": "Execution host time", + "flowChat.builtin.fields.utc": "UTC time", + "flowChat.builtin.fields.timezone": "UTC offset", + "flowChat.builtin.fields.weekday": "Weekday", + "flowChat.builtin.fields.timestampSeconds": "Unix timestamp (seconds)", + "flowChat.builtin.fields.timestampMillis": "Unix timestamp (milliseconds)", + "flowChat.builtin.fields.server": "Source service", + "flowChat.builtin.fields.uri": "Resource URI", + "flowChat.builtin.fields.template": "Template", + "flowChat.builtin.fields.resources": "Resources", + "flowChat.builtin.fields.templates": "Templates", + "flowChat.builtin.fields.mimeType": "Content type", + "flowChat.builtin.fields.requiredArguments": "Required parameters", + "flowChat.builtin.fields.content": "Content", + "flowChat.builtin.fields.description": "Description", + "flowChat.builtin.fields.prompt": "Rendered prompt", + "flowChat.builtin.fields.steps": "Steps", + "flowChat.builtin.fields.playbooks": "Operation guides", + "flowChat.builtin.fields.stepCount": "Steps", + "flowChat.builtin.fields.baseRef": "Base ref", + "flowChat.builtin.fields.branch": "Branch", + "flowChat.builtin.fields.copyLocalChanges": "Copy local changes", + "flowChat.builtin.fields.worktree": "Worktree ID", + "flowChat.builtin.fields.worktrees": "Worktrees", + "flowChat.builtin.fields.managed": "Managed", + "flowChat.builtin.fields.target": "SSH host", + "flowChat.builtin.fields.remoteEndpoint": "Remote endpoint", + "flowChat.builtin.fields.localEndpoint": "Bound local address", + "flowChat.builtin.fields.requestedPort": "Requested local port", + "flowChat.builtin.fields.forwardId": "Forward ID", + "flowChat.builtin.fields.accessScope": "Access scope", + "flowChat.builtin.fields.connectionError": "Connection error", + "flowChat.builtin.fields.bindAddress": "Listening address", + "flowChat.builtin.fields.process": "Process", + "flowChat.builtin.fields.connected": "Connected", + "flowChat.builtin.fields.repository": "Repository", + "flowChat.builtin.fields.remote": "Remote", + "flowChat.builtin.fields.sourceBranch": "Source branch", + "flowChat.builtin.fields.targetBranch": "Target branch", + "flowChat.builtin.fields.reviewEvent": "Review decision", + "flowChat.builtin.fields.resolved": "Thread resolved", + "flowChat.builtin.fields.total": "Total", + "flowChat.builtin.fields.body": "Description or submitted content", + "flowChat.builtin.fields.ciLog": "CI log", + "flowChat.builtin.fields.checks": "Checks", + "flowChat.builtin.fields.draft": "Draft", + "flowChat.builtin.fields.baseRevision": "Base revision", + "flowChat.builtin.fields.activeRevision": "Active revision", + "flowChat.builtin.fields.previousRevision": "Previous revision", + "flowChat.builtin.fields.pendingRevision": "Pending revision", + "flowChat.builtin.fields.command": "Command", + "flowChat.builtin.fields.reason": "Reason", + "flowChat.builtin.fields.app": "Mini App", + "flowChat.builtin.fields.version": "Version", + "flowChat.builtin.fields.theme": "Theme", + "flowChat.builtin.fields.contentChanged": "Content changed", + "flowChat.builtin.fields.sourceRevision": "Source revision", + "flowChat.builtin.fields.release": "Submission release", + "flowChat.builtin.fields.submission": "Submission ID", + "flowChat.builtin.fields.slug": "Marketplace identifier", + "flowChat.builtin.fields.package": "Package", + "flowChat.builtin.fields.license": "License", + "flowChat.builtin.fields.minimumVersion": "Minimum client version", + "flowChat.builtin.fields.changelog": "Release notes", + "flowChat.builtin.fields.lifecycle": "Worktree lifecycle", + "flowChat.builtin.fields.dirty": "Uncommitted changes", + "flowChat.builtin.fields.locked": "Worktree locked", + "flowChat.builtin.fields.missing": "Worktree missing", + "flowChat.builtin.fields.unpublishedCommits": "Unpublished commits", + "flowChat.builtin.fields.associatedSessions": "Associated sessions", + "flowChat.builtin.fields.runningSessions": "Running sessions", + "flowChat.builtin.fields.changedFiles": "Changed files", + "flowChat.builtin.fields.checksPassed": "Checks passed", + "flowChat.builtin.fields.checksFailed": "Checks failed", + "flowChat.builtin.fields.checksPending": "Checks pending", + "flowChat.builtin.fields.author": "Author", + "flowChat.builtin.fields.lastOutcome": "Last transaction outcome", + "flowChat.builtin.states.active": "Active", + "flowChat.builtin.states.running": "Running", + "flowChat.builtin.states.complete": "Done", + "flowChat.builtin.states.paused": "Paused", + "flowChat.builtin.states.blocked": "Blocked", + "flowChat.builtin.states.usageLimited": "Usage limited", + "flowChat.builtin.states.budgetLimited": "Budget limited", + "flowChat.builtin.states.queued": "Queued", + "flowChat.builtin.states.waiting": "Waiting", + "flowChat.builtin.states.failed": "Failed", + "flowChat.builtin.states.cancelled": "Cancelled", + "flowChat.builtin.states.submitted": "Submitted for review", + "flowChat.builtin.states.pendingReview": "Under review", + "flowChat.builtin.states.signIn": "Sign-in required", + "flowChat.builtin.states.confirmed": "Applied and confirmed", + "flowChat.builtin.states.rolledBack": "Rolled back", + "flowChat.builtin.states.prepared": "Draft prepared", + "flowChat.builtin.states.ready": "Ready", + "flowChat.builtin.states.awaitingConfirmation": "Awaiting confirmation", + "flowChat.builtin.states.awaitingReady": "Awaiting activation", + "flowChat.builtin.states.deleted": "Deleted", + "flowChat.builtin.states.open": "Open", + "flowChat.builtin.states.closed": "Closed", + "flowChat.builtin.states.merged": "Merged", + "flowChat.builtin.states.draft": "Draft", + "flowChat.builtin.states.exported": "History exported", + "flowChat.builtin.states.loaded": "Loaded", + "flowChat.builtin.states.removed": "Removed", + "flowChat.builtin.states.forwardStarted": "Forward started", + "flowChat.builtin.states.stopped": "Stopped", + "flowChat.builtin.states.selectRemote": "Select a repository", + "flowChat.builtin.states.updated": "Updated", + "flowChat.builtin.states.unchanged": "Recompiled, content unchanged", + "flowChat.builtin.states.interrupted": "Interrupted", + "flowChat.builtin.states.partialTimeout": "Partial timeout", + "flowChat.builtin.states.idle": "Idle", + "flowChat.builtin.states.managed": "Managed worktree", + "flowChat.builtin.states.permanent": "Permanent worktree", + "flowChat.builtin.states.external": "External worktree", + "flowChat.builtin.rawResult": "Recorded result details", + "flowChat.builtin.directChildren": "Direct child agents", + "flowChat.builtin.deleteAgentScope": "Deletes the selected agents and their descendants, including their sessions and pending results. Active work is cancelled.", + "flowChat.builtin.portMoved": "The requested local port was occupied. Use the actual address shown above.", + "flowChat.builtin.runtimeNotified": "Open Mini App runtimes were notified to reload.", + "flowChat.builtin.reviewPending": "The submission is awaiting marketplace review. Follow its status in My submissions.", + "flowChat.builtin.playbookInstructions": "These are the resolved instructions. Their steps are executed through subsequent tool calls.", + "flowChat.builtin.samples.goal": "Improve keyboard navigation", + "flowChat.builtin.samples.analysis": "The page contains a navigation rail, a summary and a results table.", + "flowChat.builtin.samples.error": "The host could not finish this operation. Recorded details remain available.", + "component.GoalToolCard.description": "Read goal", + "component.AgentRosterToolCard.description": "View agents", + "component.SessionHistoryToolCard.description": "Export history", + "component.ImageAnalysisToolCard.description": "Analyze image", + "component.TimeToolCard.description": "Read time", + "component.McpResourceToolCard.description": "Discover resources", + "component.WorktreeToolCard.description": "Worktree", + "component.PortForwardToolCard.description": "Port forwarding", + "component.ReviewPlatformToolCard.description": "Review platform", + "component.FrontendWorkbenchToolCard.description": "Frontend customization", + "component.MiniAppFinalizeToolCard.description": "Update Mini App", + "component.MarketplacePublishToolCard.description": "Submit Mini App", + "component.PlaybookToolCard.description": "Read operation guide" +} as const; + +export const semanticToolZhCN = { + "flowChat.builtin.tools.get_goal": "查看目标", + "flowChat.builtin.tools.create_goal": "开始目标", + "flowChat.builtin.tools.update_goal": "更新目标状态", + "flowChat.builtin.tools.AgentList": "查看子代理", + "flowChat.builtin.tools.AgentDelete": "删除子代理", + "flowChat.builtin.tools.SessionHistory": "导出会话历史", + "flowChat.builtin.tools.analyze_image": "分析图片", + "flowChat.builtin.tools.GetTime": "读取时间", + "flowChat.builtin.tools.ListMCPResources": "发现资源", + "flowChat.builtin.tools.ReadMCPResource": "读取资源", + "flowChat.builtin.tools.ListMCPPrompts": "查找提示模板", + "flowChat.builtin.tools.GetMCPPrompt": "载入提示模板", + "flowChat.builtin.tools.Worktree": "工作树", + "flowChat.builtin.tools.PortForward": "端口转发", + "flowChat.builtin.tools.ReviewPlatform": "代码审查平台", + "flowChat.builtin.tools.FrontendWorkbench": "界面定制", + "flowChat.builtin.tools.FinalizeMiniApp": "更新小应用", + "flowChat.builtin.tools.PublishMiniApp": "提交小应用审核", + "flowChat.builtin.tools.PublishAppearance": "提交皮肤审核", + "flowChat.builtin.tools.Playbook": "读取操作流程", + "flowChat.builtin.fields.results": "结果", + "flowChat.builtin.fields.objective": "目标", + "flowChat.builtin.fields.state": "状态", + "flowChat.builtin.fields.tokenBudget": "Token 预算", + "flowChat.builtin.fields.tokensUsed": "已用 Token", + "flowChat.builtin.fields.tokensRemaining": "剩余 Token", + "flowChat.builtin.fields.elapsed": "已用时间", + "flowChat.builtin.fields.completionReport": "完成报告", + "flowChat.builtin.fields.agents": "子代理", + "flowChat.builtin.fields.deletedAgents": "已删除代理会话数", + "flowChat.builtin.fields.session": "会话", + "flowChat.builtin.fields.workspace": "工作区", + "flowChat.builtin.fields.path": "路径", + "flowChat.builtin.fields.turns": "轮次范围", + "flowChat.builtin.fields.index": "索引行范围", + "flowChat.builtin.fields.includeTools": "包含工具结果", + "flowChat.builtin.fields.includeToolInputs": "包含工具参数", + "flowChat.builtin.fields.includeThinking": "包含思考", + "flowChat.builtin.fields.model": "视觉模型", + "flowChat.builtin.fields.dimensions": "图片尺寸", + "flowChat.builtin.fields.question": "分析问题", + "flowChat.builtin.fields.analysis": "分析结果", + "flowChat.builtin.fields.imageCoordinates": "坐标说明", + "flowChat.builtin.fields.imageResize": "图片缩放说明", + "flowChat.builtin.fields.localTime": "执行主机时间", + "flowChat.builtin.fields.utc": "UTC 时间", + "flowChat.builtin.fields.timezone": "时区偏移", + "flowChat.builtin.fields.weekday": "星期", + "flowChat.builtin.fields.timestampSeconds": "Unix 时间戳(秒)", + "flowChat.builtin.fields.timestampMillis": "Unix 时间戳(毫秒)", + "flowChat.builtin.fields.server": "来源服务", + "flowChat.builtin.fields.uri": "资源 URI", + "flowChat.builtin.fields.template": "模板", + "flowChat.builtin.fields.resources": "资源", + "flowChat.builtin.fields.templates": "模板", + "flowChat.builtin.fields.mimeType": "内容类型", + "flowChat.builtin.fields.requiredArguments": "必需参数", + "flowChat.builtin.fields.content": "内容", + "flowChat.builtin.fields.description": "说明", + "flowChat.builtin.fields.prompt": "载入的提示内容", + "flowChat.builtin.fields.steps": "操作步骤", + "flowChat.builtin.fields.playbooks": "操作流程", + "flowChat.builtin.fields.stepCount": "步骤数", + "flowChat.builtin.fields.baseRef": "基准引用", + "flowChat.builtin.fields.branch": "分支", + "flowChat.builtin.fields.copyLocalChanges": "复制本地修改", + "flowChat.builtin.fields.worktree": "工作树 ID", + "flowChat.builtin.fields.worktrees": "工作树", + "flowChat.builtin.fields.managed": "受管理", + "flowChat.builtin.fields.target": "SSH 主机", + "flowChat.builtin.fields.remoteEndpoint": "远端地址", + "flowChat.builtin.fields.localEndpoint": "实际本地地址", + "flowChat.builtin.fields.requestedPort": "请求的本地端口", + "flowChat.builtin.fields.forwardId": "转发 ID", + "flowChat.builtin.fields.accessScope": "访问范围", + "flowChat.builtin.fields.connectionError": "连接错误", + "flowChat.builtin.fields.bindAddress": "监听地址", + "flowChat.builtin.fields.process": "进程", + "flowChat.builtin.fields.connected": "已连接", + "flowChat.builtin.fields.repository": "仓库", + "flowChat.builtin.fields.remote": "远程仓库", + "flowChat.builtin.fields.sourceBranch": "源分支", + "flowChat.builtin.fields.targetBranch": "目标分支", + "flowChat.builtin.fields.reviewEvent": "审查决策", + "flowChat.builtin.fields.resolved": "讨论已解决", + "flowChat.builtin.fields.total": "总数", + "flowChat.builtin.fields.body": "说明或提交内容", + "flowChat.builtin.fields.ciLog": "CI 日志", + "flowChat.builtin.fields.checks": "检查结果", + "flowChat.builtin.fields.draft": "草稿", + "flowChat.builtin.fields.baseRevision": "基准版本", + "flowChat.builtin.fields.activeRevision": "当前生效版本", + "flowChat.builtin.fields.previousRevision": "上一版本", + "flowChat.builtin.fields.pendingRevision": "待确认版本", + "flowChat.builtin.fields.command": "操作命令", + "flowChat.builtin.fields.reason": "原因", + "flowChat.builtin.fields.app": "小应用", + "flowChat.builtin.fields.version": "版本", + "flowChat.builtin.fields.theme": "主题", + "flowChat.builtin.fields.contentChanged": "内容有变化", + "flowChat.builtin.fields.sourceRevision": "源码修订", + "flowChat.builtin.fields.release": "投稿版本", + "flowChat.builtin.fields.submission": "投稿 ID", + "flowChat.builtin.fields.slug": "市场标识", + "flowChat.builtin.fields.package": "安装包", + "flowChat.builtin.fields.license": "许可证", + "flowChat.builtin.fields.minimumVersion": "最低客户端版本", + "flowChat.builtin.fields.changelog": "版本说明", + "flowChat.builtin.fields.lifecycle": "工作树类型", + "flowChat.builtin.fields.dirty": "未提交的更改", + "flowChat.builtin.fields.locked": "工作树已锁定", + "flowChat.builtin.fields.missing": "工作树已丢失", + "flowChat.builtin.fields.unpublishedCommits": "未发布的提交", + "flowChat.builtin.fields.associatedSessions": "关联会话数", + "flowChat.builtin.fields.runningSessions": "运行中会话数", + "flowChat.builtin.fields.changedFiles": "变更文件数", + "flowChat.builtin.fields.checksPassed": "检查通过数", + "flowChat.builtin.fields.checksFailed": "检查失败数", + "flowChat.builtin.fields.checksPending": "待完成检查数", + "flowChat.builtin.fields.author": "作者", + "flowChat.builtin.fields.lastOutcome": "上次事务结果", + "flowChat.builtin.states.active": "进行中", + "flowChat.builtin.states.running": "运行中", + "flowChat.builtin.states.complete": "已完成", + "flowChat.builtin.states.paused": "已暂停", + "flowChat.builtin.states.blocked": "受阻", + "flowChat.builtin.states.usageLimited": "用量受限", + "flowChat.builtin.states.budgetLimited": "预算受限", + "flowChat.builtin.states.queued": "排队中", + "flowChat.builtin.states.waiting": "等待中", + "flowChat.builtin.states.failed": "失败", + "flowChat.builtin.states.cancelled": "已取消", + "flowChat.builtin.states.submitted": "已提交审核", + "flowChat.builtin.states.pendingReview": "审核中", + "flowChat.builtin.states.signIn": "需要登录", + "flowChat.builtin.states.confirmed": "已应用并确认", + "flowChat.builtin.states.rolledBack": "已回滚", + "flowChat.builtin.states.prepared": "草稿已准备", + "flowChat.builtin.states.ready": "就绪", + "flowChat.builtin.states.awaitingConfirmation": "等待确认", + "flowChat.builtin.states.awaitingReady": "等待界面就绪", + "flowChat.builtin.states.deleted": "已删除", + "flowChat.builtin.states.open": "开放中", + "flowChat.builtin.states.closed": "已关闭", + "flowChat.builtin.states.merged": "已合并", + "flowChat.builtin.states.draft": "草稿", + "flowChat.builtin.states.exported": "历史已导出", + "flowChat.builtin.states.loaded": "已载入", + "flowChat.builtin.states.removed": "已移除", + "flowChat.builtin.states.forwardStarted": "已启动转发", + "flowChat.builtin.states.stopped": "已停止", + "flowChat.builtin.states.selectRemote": "需要选择仓库", + "flowChat.builtin.states.updated": "已更新", + "flowChat.builtin.states.unchanged": "已重新编译,内容未变化", + "flowChat.builtin.states.interrupted": "已中断", + "flowChat.builtin.states.partialTimeout": "部分超时", + "flowChat.builtin.states.idle": "空闲", + "flowChat.builtin.states.managed": "托管工作树", + "flowChat.builtin.states.permanent": "永久工作树", + "flowChat.builtin.states.external": "外部工作树", + "flowChat.builtin.rawResult": "原始结果详情", + "flowChat.builtin.directChildren": "直属子代理", + "flowChat.builtin.deleteAgentScope": "删除所选子代理及其后代的会话和待处理结果,并取消进行中的工作。", + "flowChat.builtin.portMoved": "请求的本地端口已被占用,请使用上方显示的实际地址。", + "flowChat.builtin.runtimeNotified": "已通知打开的小应用重新加载。", + "flowChat.builtin.reviewPending": "投稿正在等待市场审核,可在“我的投稿”查看进度。", + "flowChat.builtin.playbookInstructions": "这里显示的是已载入的操作步骤,实际执行由后续工具调用完成。", + "flowChat.builtin.samples.goal": "完善键盘导航", + "flowChat.builtin.samples.analysis": "页面包含导航栏、摘要和结果表格。", + "flowChat.builtin.samples.error": "主机未能完成此操作,仍可查看已记录的详情。", + "component.GoalToolCard.description": "查看目标", + "component.AgentRosterToolCard.description": "查看子代理", + "component.SessionHistoryToolCard.description": "导出会话历史", + "component.ImageAnalysisToolCard.description": "分析图片", + "component.TimeToolCard.description": "读取时间", + "component.McpResourceToolCard.description": "发现资源", + "component.WorktreeToolCard.description": "工作树", + "component.PortForwardToolCard.description": "端口转发", + "component.ReviewPlatformToolCard.description": "代码审查平台", + "component.FrontendWorkbenchToolCard.description": "界面定制", + "component.MiniAppFinalizeToolCard.description": "更新小应用", + "component.MarketplacePublishToolCard.description": "提交小应用审核", + "component.PlaybookToolCard.description": "读取操作流程" +} as const; + +export const semanticToolZhTW = { + "flowChat.builtin.tools.get_goal": "檢視目標", + "flowChat.builtin.tools.create_goal": "開始目標", + "flowChat.builtin.tools.update_goal": "更新目標狀態", + "flowChat.builtin.tools.AgentList": "檢視子代理", + "flowChat.builtin.tools.AgentDelete": "刪除子代理", + "flowChat.builtin.tools.SessionHistory": "匯出工作階段歷史", + "flowChat.builtin.tools.analyze_image": "分析圖片", + "flowChat.builtin.tools.GetTime": "讀取時間", + "flowChat.builtin.tools.ListMCPResources": "探索資源", + "flowChat.builtin.tools.ReadMCPResource": "讀取資源", + "flowChat.builtin.tools.ListMCPPrompts": "尋找提示範本", + "flowChat.builtin.tools.GetMCPPrompt": "載入提示範本", + "flowChat.builtin.tools.Worktree": "工作樹", + "flowChat.builtin.tools.PortForward": "連接埠轉送", + "flowChat.builtin.tools.ReviewPlatform": "程式碼審查平台", + "flowChat.builtin.tools.FrontendWorkbench": "介面自訂", + "flowChat.builtin.tools.FinalizeMiniApp": "更新小應用程式", + "flowChat.builtin.tools.PublishMiniApp": "提交小應用程式審核", + "flowChat.builtin.tools.PublishAppearance": "提交外觀審核", + "flowChat.builtin.tools.Playbook": "讀取操作流程", + "flowChat.builtin.fields.results": "結果", + "flowChat.builtin.fields.objective": "目標", + "flowChat.builtin.fields.state": "狀態", + "flowChat.builtin.fields.tokenBudget": "Token 預算", + "flowChat.builtin.fields.tokensUsed": "已用 Token", + "flowChat.builtin.fields.tokensRemaining": "剩餘 Token", + "flowChat.builtin.fields.elapsed": "已用時間", + "flowChat.builtin.fields.completionReport": "完成報告", + "flowChat.builtin.fields.agents": "子代理", + "flowChat.builtin.fields.deletedAgents": "已刪除代理工作階段數", + "flowChat.builtin.fields.session": "工作階段", + "flowChat.builtin.fields.workspace": "工作區", + "flowChat.builtin.fields.path": "路徑", + "flowChat.builtin.fields.turns": "回合範圍", + "flowChat.builtin.fields.index": "索引行範圍", + "flowChat.builtin.fields.includeTools": "包含工具結果", + "flowChat.builtin.fields.includeToolInputs": "包含工具參數", + "flowChat.builtin.fields.includeThinking": "包含思考", + "flowChat.builtin.fields.model": "視覺模型", + "flowChat.builtin.fields.dimensions": "圖片尺寸", + "flowChat.builtin.fields.question": "分析問題", + "flowChat.builtin.fields.analysis": "分析結果", + "flowChat.builtin.fields.imageCoordinates": "座標說明", + "flowChat.builtin.fields.imageResize": "圖片縮放說明", + "flowChat.builtin.fields.localTime": "執行主機時間", + "flowChat.builtin.fields.utc": "UTC 時間", + "flowChat.builtin.fields.timezone": "時區偏移", + "flowChat.builtin.fields.weekday": "星期", + "flowChat.builtin.fields.timestampSeconds": "Unix 時間戳(秒)", + "flowChat.builtin.fields.timestampMillis": "Unix 時間戳(毫秒)", + "flowChat.builtin.fields.server": "來源服務", + "flowChat.builtin.fields.uri": "資源 URI", + "flowChat.builtin.fields.template": "範本", + "flowChat.builtin.fields.resources": "資源", + "flowChat.builtin.fields.templates": "範本", + "flowChat.builtin.fields.mimeType": "內容類型", + "flowChat.builtin.fields.requiredArguments": "必要參數", + "flowChat.builtin.fields.content": "內容", + "flowChat.builtin.fields.description": "說明", + "flowChat.builtin.fields.prompt": "載入的提示內容", + "flowChat.builtin.fields.steps": "操作步驟", + "flowChat.builtin.fields.playbooks": "操作流程", + "flowChat.builtin.fields.stepCount": "步驟數", + "flowChat.builtin.fields.baseRef": "基準參照", + "flowChat.builtin.fields.branch": "分支", + "flowChat.builtin.fields.copyLocalChanges": "複製本機修改", + "flowChat.builtin.fields.worktree": "工作樹 ID", + "flowChat.builtin.fields.worktrees": "工作樹", + "flowChat.builtin.fields.managed": "受管理", + "flowChat.builtin.fields.target": "SSH 主機", + "flowChat.builtin.fields.remoteEndpoint": "遠端位址", + "flowChat.builtin.fields.localEndpoint": "實際本機位址", + "flowChat.builtin.fields.requestedPort": "要求的本機連接埠", + "flowChat.builtin.fields.forwardId": "轉送 ID", + "flowChat.builtin.fields.accessScope": "存取範圍", + "flowChat.builtin.fields.connectionError": "連線錯誤", + "flowChat.builtin.fields.bindAddress": "監聽位址", + "flowChat.builtin.fields.process": "處理程序", + "flowChat.builtin.fields.connected": "已連線", + "flowChat.builtin.fields.repository": "儲存庫", + "flowChat.builtin.fields.remote": "遠端儲存庫", + "flowChat.builtin.fields.sourceBranch": "來源分支", + "flowChat.builtin.fields.targetBranch": "目標分支", + "flowChat.builtin.fields.reviewEvent": "審查決策", + "flowChat.builtin.fields.resolved": "討論已解決", + "flowChat.builtin.fields.total": "總數", + "flowChat.builtin.fields.body": "說明或提交內容", + "flowChat.builtin.fields.ciLog": "CI 記錄", + "flowChat.builtin.fields.checks": "檢查結果", + "flowChat.builtin.fields.draft": "草稿", + "flowChat.builtin.fields.baseRevision": "基準版本", + "flowChat.builtin.fields.activeRevision": "目前生效版本", + "flowChat.builtin.fields.previousRevision": "上一版本", + "flowChat.builtin.fields.pendingRevision": "待確認版本", + "flowChat.builtin.fields.command": "操作命令", + "flowChat.builtin.fields.reason": "原因", + "flowChat.builtin.fields.app": "小應用程式", + "flowChat.builtin.fields.version": "版本", + "flowChat.builtin.fields.theme": "佈景主題", + "flowChat.builtin.fields.contentChanged": "內容有變更", + "flowChat.builtin.fields.sourceRevision": "原始碼修訂", + "flowChat.builtin.fields.release": "投稿版本", + "flowChat.builtin.fields.submission": "投稿 ID", + "flowChat.builtin.fields.slug": "市集識別碼", + "flowChat.builtin.fields.package": "套件", + "flowChat.builtin.fields.license": "授權條款", + "flowChat.builtin.fields.minimumVersion": "最低用戶端版本", + "flowChat.builtin.fields.changelog": "版本說明", + "flowChat.builtin.fields.lifecycle": "工作樹類型", + "flowChat.builtin.fields.dirty": "未提交的變更", + "flowChat.builtin.fields.locked": "工作樹已鎖定", + "flowChat.builtin.fields.missing": "工作樹已遺失", + "flowChat.builtin.fields.unpublishedCommits": "未發佈的提交", + "flowChat.builtin.fields.associatedSessions": "關聯對話數", + "flowChat.builtin.fields.runningSessions": "執行中對話數", + "flowChat.builtin.fields.changedFiles": "變更檔案數", + "flowChat.builtin.fields.checksPassed": "檢查通過數", + "flowChat.builtin.fields.checksFailed": "檢查失敗數", + "flowChat.builtin.fields.checksPending": "待完成檢查數", + "flowChat.builtin.fields.author": "作者", + "flowChat.builtin.fields.lastOutcome": "上次交易結果", + "flowChat.builtin.states.active": "進行中", + "flowChat.builtin.states.running": "執行中", + "flowChat.builtin.states.complete": "已完成", + "flowChat.builtin.states.paused": "已暫停", + "flowChat.builtin.states.blocked": "受阻", + "flowChat.builtin.states.usageLimited": "用量受限", + "flowChat.builtin.states.budgetLimited": "預算受限", + "flowChat.builtin.states.queued": "排隊中", + "flowChat.builtin.states.waiting": "等待中", + "flowChat.builtin.states.failed": "失敗", + "flowChat.builtin.states.cancelled": "已取消", + "flowChat.builtin.states.submitted": "已提交審核", + "flowChat.builtin.states.pendingReview": "審核中", + "flowChat.builtin.states.signIn": "需要登入", + "flowChat.builtin.states.confirmed": "已套用並確認", + "flowChat.builtin.states.rolledBack": "已復原", + "flowChat.builtin.states.prepared": "草稿已準備", + "flowChat.builtin.states.ready": "就緒", + "flowChat.builtin.states.awaitingConfirmation": "等待確認", + "flowChat.builtin.states.awaitingReady": "等待介面就緒", + "flowChat.builtin.states.deleted": "已刪除", + "flowChat.builtin.states.open": "開啟中", + "flowChat.builtin.states.closed": "已關閉", + "flowChat.builtin.states.merged": "已合併", + "flowChat.builtin.states.draft": "草稿", + "flowChat.builtin.states.exported": "歷史已匯出", + "flowChat.builtin.states.loaded": "已載入", + "flowChat.builtin.states.removed": "已移除", + "flowChat.builtin.states.forwardStarted": "已啟動轉送", + "flowChat.builtin.states.stopped": "已停止", + "flowChat.builtin.states.selectRemote": "需要選擇儲存庫", + "flowChat.builtin.states.updated": "已更新", + "flowChat.builtin.states.unchanged": "已重新編譯,內容未變更", + "flowChat.builtin.states.interrupted": "已中斷", + "flowChat.builtin.states.partialTimeout": "部分逾時", + "flowChat.builtin.states.idle": "閒置", + "flowChat.builtin.states.managed": "受管理工作樹", + "flowChat.builtin.states.permanent": "永久工作樹", + "flowChat.builtin.states.external": "外部工作樹", + "flowChat.builtin.rawResult": "原始結果詳細資料", + "flowChat.builtin.directChildren": "直屬子代理", + "flowChat.builtin.deleteAgentScope": "刪除所選子代理及其後代的工作階段和待處理結果,並取消進行中的工作。", + "flowChat.builtin.portMoved": "要求的本機連接埠已被占用,請使用上方顯示的實際位址。", + "flowChat.builtin.runtimeNotified": "已通知開啟的小應用程式重新載入。", + "flowChat.builtin.reviewPending": "投稿正在等待市集審核,可在「我的投稿」檢視進度。", + "flowChat.builtin.playbookInstructions": "此處顯示已載入的操作步驟,實際執行由後續工具呼叫完成。", + "flowChat.builtin.samples.goal": "完善鍵盤導覽", + "flowChat.builtin.samples.analysis": "頁面包含導覽列、摘要與結果表格。", + "flowChat.builtin.samples.error": "主機未能完成此操作,仍可檢視已記錄的詳情。", + "component.GoalToolCard.description": "檢視目標", + "component.AgentRosterToolCard.description": "檢視子代理", + "component.SessionHistoryToolCard.description": "匯出工作階段歷史", + "component.ImageAnalysisToolCard.description": "分析圖片", + "component.TimeToolCard.description": "讀取時間", + "component.McpResourceToolCard.description": "探索資源", + "component.WorktreeToolCard.description": "工作樹", + "component.PortForwardToolCard.description": "連接埠轉送", + "component.ReviewPlatformToolCard.description": "程式碼審查平台", + "component.FrontendWorkbenchToolCard.description": "介面自訂", + "component.MiniAppFinalizeToolCard.description": "更新小應用程式", + "component.MarketplacePublishToolCard.description": "提交小應用程式審核", + "component.PlaybookToolCard.description": "讀取操作流程" +} as const; diff --git a/design-system/apps/design-lab/src/i18n/subagentMotionMessages.ts b/design-system/apps/design-lab/src/i18n/subagentMotionMessages.ts new file mode 100644 index 0000000000..33fca41a16 --- /dev/null +++ b/design-system/apps/design-lab/src/i18n/subagentMotionMessages.ts @@ -0,0 +1,211 @@ +export const subagentMotionEn = { + "component.SubagentHatch.description": "An antenna-topped egg incubates during delegation, then opens into the assigned character.", + "subagentMotion.hatch.title": "Hatch into a Subagent", + "subagentMotion.hatch.hint": "The egg rocks while waiting. Create the agent to open the shell once and reveal the selected character.", + "subagentMotion.hatch.begin": "Start incubating", + "subagentMotion.hatch.reveal": "Agent created", + "subagentMotion.hatch.stop": "Stop", + "subagentMotion.hoverBlink.label": "Notice you", + "subagentMotion.hoverBlink.hint": "A blink on hover", + "subagentMotion.hoverBlink.description": "The character acknowledges pointer or keyboard attention with a small blink.", + "subagentMotion.tabs": "Subagent views", + "subagentMotion.motionTab": "Motion preview", + "subagentMotion.galleryTab": "Character family", + "subagentMotion.intro": "Explore all {count} characters in motion. Switch characters to compare their breathing, blinking, soft rebound, and responses.", + "subagentMotion.characters": "Choose a character", + "subagentMotion.viewMotion": "Preview this character's motion", + "subagentMotion.actions": "Basic actions", + "subagentMotion.transitions": "Transitions", + "subagentMotion.interact": "Interact with {name}", + "subagentMotion.stageHint": "Choose an action, or click the character to replay it.", + "subagentMotion.lookHint": "Move your pointer here. The character follows your attention.", + "subagentMotion.pressHint": "Press and hold, then release. You can also use Space or Enter.", + "subagentMotion.sizes": "Actual sizes", + "subagentMotion.replay": "Replay", + "subagentMotion.pause": "Pause", + "subagentMotion.resume": "Resume", + "subagentMotion.reset": "Settle", + "subagentMotion.speed": "Playback speed", + "subagentMotion.reduced": "Your system requests reduced motion. The character remains still.", + "subagentMotion.sequence": "A complete interaction", + "subagentMotion.sequenceHint": "Watch the character arrive, take a task, work, wait for you, and finish.", + "subagentMotion.playSequence": "Play sequence", + "subagentMotion.restartSequence": "Restart sequence", + "subagentMotion.status.static": "Reduced motion", + "subagentMotion.status.paused": "Paused", + "subagentMotion.status.held": "At rest", + "subagentMotion.status.looping": "Looping", + "subagentMotion.status.playing": "Playing", + "subagentMotion.idle.label": "Breathe & blink", + "subagentMotion.idle.hint": "Quiet companionship", + "subagentMotion.idle.description": "A small breath, an occasional blink, and plenty of stillness. Loops gently.", + "subagentMotion.look.label": "Look at you", + "subagentMotion.look.hint": "Notice your attention", + "subagentMotion.look.description": "The face leads, the body leans slightly, and the joystick follows. Try moving your pointer over the character.", + "subagentMotion.press.label": "Press & rebound", + "subagentMotion.press.hint": "A soft, tactile response", + "subagentMotion.press.description": "The body compresses under pressure. On release it springs back, with the top settling a moment later.", + "subagentMotion.nod.label": "Acknowledge", + "subagentMotion.nod.hint": "Ready to take over", + "subagentMotion.nod.description": "One small nod acknowledges taking the task. The body moves first; the joystick follows and settles.", + "subagentMotion.working.label": "Focused work", + "subagentMotion.working.hint": "A measured rhythm", + "subagentMotion.working.description": "The body stays grounded while the joystick moves gently, with pauses between movements. Loops while working.", + "subagentMotion.waiting.label": "Wait for you", + "subagentMotion.waiting.hint": "Look up, then hold", + "subagentMotion.waiting.description": "The character lifts its gaze once, then holds still while waiting for a response.", + "subagentMotion.success.label": "A little celebration", + "subagentMotion.success.hint": "One soft landing", + "subagentMotion.success.description": "A brief crouch, one small hop, happy eyes, and a soft landing. Plays once, then rests.", + "subagentMotion.blocked.label": "A gentle stop", + "subagentMotion.blocked.hint": "Something needs attention", + "subagentMotion.blocked.description": "A short pause and one restrained sway mark a problem, then the character holds still.", + "subagentMotion.enter.label": "Arrive", + "subagentMotion.enter.description": "The character appears and settles gently into its place.", + "subagentMotion.exit.label": "Leave", + "subagentMotion.exit.description": "The character draws in and fades out. Use Settle or another action to bring it back.", + "subagentMotion.settle.label": "Settle", + "subagentMotion.settle.description": "Release the current pose and return smoothly to the original stance. Also interrupts a loop or sequence.", +} as const; + +type MotionMessages = Record; + +export const subagentMotionZhCN = { + "component.SubagentHatch.description": "委派时摇杆蛋轻摇,创建完成后破壳,露出对应角色。", + "subagentMotion.hatch.title": "孵化为 Subagent", + "subagentMotion.hatch.hint": "等待时蛋壳轻摇。点击创建完成,蛋壳打开一次,露出当前选中的角色。", + "subagentMotion.hatch.begin": "开始孵化", + "subagentMotion.hatch.reveal": "创建完成", + "subagentMotion.hatch.stop": "停止", + "subagentMotion.hoverBlink.label": "注意到你", + "subagentMotion.hoverBlink.hint": "悬停时眨眼", + "subagentMotion.hoverBlink.description": "鼠标悬停或键盘聚焦时,角色轻轻眨眼回应。", + "subagentMotion.tabs": "Subagent 展示内容", + "subagentMotion.motionTab": "动作预览", + "subagentMotion.galleryTab": "系列形象", + "subagentMotion.intro": "{count} 位摇杆伙伴都已拥有完整动作。切换形象,对比呼吸、眨眼、柔软回弹,以及每一次回应。", + "subagentMotion.characters": "选择形象", + "subagentMotion.viewMotion": "预览这个形象的动作", + "subagentMotion.actions": "基本动作", + "subagentMotion.transitions": "状态过渡", + "subagentMotion.interact": "与{name}互动", + "subagentMotion.stageHint": "选择一个动作,或点击形象重新播放。", + "subagentMotion.lookHint": "在这里移动鼠标,让它看向你。", + "subagentMotion.pressHint": "按住,再松开;也可以用空格键或回车键体验。", + "subagentMotion.sizes": "实际尺寸", + "subagentMotion.replay": "重播", + "subagentMotion.pause": "暂停", + "subagentMotion.resume": "继续", + "subagentMotion.reset": "收势", + "subagentMotion.speed": "播放速度", + "subagentMotion.reduced": "系统已启用减少动态效果,形象保持静止。", + "subagentMotion.sequence": "完整交互流程", + "subagentMotion.sequenceHint": "看它出现、接手、工作、等你回应,再完成任务。", + "subagentMotion.playSequence": "播放完整流程", + "subagentMotion.restartSequence": "重新播放流程", + "subagentMotion.status.static": "减少动态效果", + "subagentMotion.status.paused": "已暂停", + "subagentMotion.status.held": "已停留", + "subagentMotion.status.looping": "循环播放", + "subagentMotion.status.playing": "播放中", + "subagentMotion.idle.label": "呼吸与眨眼", + "subagentMotion.idle.hint": "安静地陪在一旁", + "subagentMotion.idle.description": "轻微呼吸,偶尔眨眼,大部分时间保持安静。适合低频循环的待机状态。", + "subagentMotion.look.label": "看向你", + "subagentMotion.look.hint": "回应你的关注", + "subagentMotion.look.description": "视线先转向,身体稍微倾斜,顶部摇杆随后跟上。可以直接移动鼠标体验。", + "subagentMotion.press.label": "按压回弹", + "subagentMotion.press.hint": "柔软而明确的触感", + "subagentMotion.press.description": "按住时身体压扁、圆球下沉;松开后身体弹回,顶部圆球稍晚晃动收住。", + "subagentMotion.nod.label": "接手点头", + "subagentMotion.nod.hint": "这件事交给我", + "subagentMotion.nod.description": "身体先轻轻点头,顶部摇杆延迟跟随,再回到原位。用于任务实际被接手之后。", + "subagentMotion.working.label": "专注工作", + "subagentMotion.working.hint": "有停顿的工作节奏", + "subagentMotion.working.description": "身体保持稳定,顶部摇杆小幅摆动,动作之间留出停顿。工作期间轻缓循环。", + "subagentMotion.waiting.label": "等待回应", + "subagentMotion.waiting.hint": "抬眼,安静等你", + "subagentMotion.waiting.description": "抬起视线看向你,只提示一次,然后保持注视,等待确认或补充信息。", + "subagentMotion.success.label": "完成轻跃", + "subagentMotion.success.hint": "轻轻落地,开心一下", + "subagentMotion.success.description": "先微微蓄力,再轻跳一次,眯起眼睛,柔和落地。播放一次后恢复自然站姿。", + "subagentMotion.blocked.label": "受阻轻顿", + "subagentMotion.blocked.hint": "有件事需要处理", + "subagentMotion.blocked.description": "短暂停顿,身体稍微收缩,摇杆轻摆一次后停住,为错误信息留出注意力。", + "subagentMotion.enter.label": "出现", + "subagentMotion.enter.description": "轻轻出现,身体先落定,顶部摇杆随后回正。", + "subagentMotion.exit.label": "离开", + "subagentMotion.exit.description": "身体略微收小并淡出。点击“收势”或其他动作可让它重新出现。", + "subagentMotion.settle.label": "收势", + "subagentMotion.settle.description": "从当前姿态平稳回到原始站姿,也可以用来中断工作循环或完整流程。", +} satisfies MotionMessages; + +export const subagentMotionZhTW = { + "component.SubagentHatch.description": "委派時搖桿蛋輕搖,建立完成後破殼,露出對應角色。", + "subagentMotion.hatch.title": "孵化為 Subagent", + "subagentMotion.hatch.hint": "等待時蛋殼輕搖。點擊建立完成,蛋殼打開一次,露出目前選取的角色。", + "subagentMotion.hatch.begin": "開始孵化", + "subagentMotion.hatch.reveal": "建立完成", + "subagentMotion.hatch.stop": "停止", + "subagentMotion.hoverBlink.label": "注意到你", + "subagentMotion.hoverBlink.hint": "懸停時眨眼", + "subagentMotion.hoverBlink.description": "滑鼠懸停或鍵盤聚焦時,角色輕輕眨眼回應。", + "subagentMotion.tabs": "Subagent 展示內容", + "subagentMotion.motionTab": "動作預覽", + "subagentMotion.galleryTab": "系列形象", + "subagentMotion.intro": "{count} 位搖桿夥伴都已擁有完整動作。切換形象,比較呼吸、眨眼、柔軟回彈,以及每一次回應。", + "subagentMotion.characters": "選擇形象", + "subagentMotion.viewMotion": "預覽這個形象的動作", + "subagentMotion.actions": "基本動作", + "subagentMotion.transitions": "狀態過渡", + "subagentMotion.interact": "與{name}互動", + "subagentMotion.stageHint": "選擇一個動作,或點擊形象重新播放。", + "subagentMotion.lookHint": "在這裡移動滑鼠,讓它看向你。", + "subagentMotion.pressHint": "按住,再放開;也可以用空白鍵或 Enter 鍵體驗。", + "subagentMotion.sizes": "實際尺寸", + "subagentMotion.replay": "重播", + "subagentMotion.pause": "暫停", + "subagentMotion.resume": "繼續", + "subagentMotion.reset": "收勢", + "subagentMotion.speed": "播放速度", + "subagentMotion.reduced": "系統已啟用減少動態效果,形象保持靜止。", + "subagentMotion.sequence": "完整互動流程", + "subagentMotion.sequenceHint": "看它出現、接手、工作、等你回應,再完成任務。", + "subagentMotion.playSequence": "播放完整流程", + "subagentMotion.restartSequence": "重新播放流程", + "subagentMotion.status.static": "減少動態效果", + "subagentMotion.status.paused": "已暫停", + "subagentMotion.status.held": "已停留", + "subagentMotion.status.looping": "循環播放", + "subagentMotion.status.playing": "播放中", + "subagentMotion.idle.label": "呼吸與眨眼", + "subagentMotion.idle.hint": "安靜地陪在一旁", + "subagentMotion.idle.description": "輕微呼吸,偶爾眨眼,大部分時間保持安靜。適合低頻循環的待機狀態。", + "subagentMotion.look.label": "看向你", + "subagentMotion.look.hint": "回應你的關注", + "subagentMotion.look.description": "視線先轉向,身體稍微傾斜,頂部搖桿隨後跟上。可以直接移動滑鼠體驗。", + "subagentMotion.press.label": "按壓回彈", + "subagentMotion.press.hint": "柔軟而明確的觸感", + "subagentMotion.press.description": "按住時身體壓扁、圓球下沉;放開後身體彈回,頂部圓球稍晚晃動收住。", + "subagentMotion.nod.label": "接手點頭", + "subagentMotion.nod.hint": "這件事交給我", + "subagentMotion.nod.description": "身體先輕輕點頭,頂部搖桿延遲跟隨,再回到原位。用於任務實際被接手之後。", + "subagentMotion.working.label": "專注工作", + "subagentMotion.working.hint": "有停頓的工作節奏", + "subagentMotion.working.description": "身體保持穩定,頂部搖桿小幅擺動,動作之間留出停頓。工作期間輕緩循環。", + "subagentMotion.waiting.label": "等待回應", + "subagentMotion.waiting.hint": "抬眼,安靜等你", + "subagentMotion.waiting.description": "抬起視線看向你,只提示一次,然後保持注視,等待確認或補充資訊。", + "subagentMotion.success.label": "完成輕躍", + "subagentMotion.success.hint": "輕輕落地,開心一下", + "subagentMotion.success.description": "先微微蓄力,再輕跳一次,瞇起眼睛,柔和落地。播放一次後恢復自然站姿。", + "subagentMotion.blocked.label": "受阻輕頓", + "subagentMotion.blocked.hint": "有件事需要處理", + "subagentMotion.blocked.description": "短暫停頓,身體稍微收縮,搖桿輕擺一次後停住,為錯誤資訊留出注意力。", + "subagentMotion.enter.label": "出現", + "subagentMotion.enter.description": "輕輕出現,身體先落定,頂部搖桿隨後回正。", + "subagentMotion.exit.label": "離開", + "subagentMotion.exit.description": "身體略微收小並淡出。點擊「收勢」或其他動作可讓它重新出現。", + "subagentMotion.settle.label": "收勢", + "subagentMotion.settle.description": "從目前姿態平穩回到原始站姿,也可以用來中斷工作循環或完整流程。", +} satisfies MotionMessages; diff --git a/design-system/apps/design-lab/src/main.tsx b/design-system/apps/design-lab/src/main.tsx index fbfd5ee6c1..933f53d309 100644 --- a/design-system/apps/design-lab/src/main.tsx +++ b/design-system/apps/design-lab/src/main.tsx @@ -6,6 +6,7 @@ import "@openbitfun/ui/mobile.css"; import { App } from "./App"; import { I18nProvider } from "./i18n"; import "./styles.css"; +import "./design-layout.css"; const rootElement = document.getElementById("root"); diff --git a/design-system/apps/design-lab/src/pages/BrandPage.css b/design-system/apps/design-lab/src/pages/BrandPage.css new file mode 100644 index 0000000000..0e7342dbf6 --- /dev/null +++ b/design-system/apps/design-lab/src/pages/BrandPage.css @@ -0,0 +1,395 @@ +/* Shared by the component catalog and component detail previews. */ +.lab-brand-solid-stage { + display: grid; + place-items: center; + width: 200px; + max-width: 100%; + height: 200px; + border-radius: var(--openbitfun-radius-lg); + background: var(--openbitfun-color-content-on-light); +} + +.lab-page.brand-gallery { + padding-top: var(--openbitfun-space-6); +} + +.brand-gallery :is(h1, h2, h3, p) { margin: 0; } + +.brand-gallery-heading { + display: flex; + align-items: baseline; + justify-content: space-between; + flex-wrap: wrap; + gap: var(--openbitfun-space-4) var(--openbitfun-space-8); + margin-bottom: var(--openbitfun-space-6); +} + +.brand-gallery-heading h1 { + font-family: var(--openbitfun-type-display-md-font-family); + font-size: var(--openbitfun-type-display-md-font-size); + font-weight: var(--openbitfun-type-display-md-font-weight); + line-height: var(--openbitfun-type-display-md-line-height); + letter-spacing: var(--openbitfun-type-display-md-letter-spacing); +} + +.brand-gallery-index { + display: flex; + align-items: center; + gap: var(--openbitfun-space-6); +} + +.brand-gallery-index a { + padding-block: var(--openbitfun-space-2); + color: var(--openbitfun-color-content-secondary); + font-size: var(--openbitfun-type-body-sm-font-size); + line-height: var(--openbitfun-type-body-sm-line-height); + text-decoration: none; +} + +.brand-gallery-index a:hover { color: var(--openbitfun-color-content-primary); } + +.brand-gallery :is(a, button, summary):focus-visible { + outline: var(--openbitfun-focus-width) solid var(--openbitfun-color-focus-ring); + outline-offset: var(--openbitfun-focus-offset); +} + +.brand-gallery-grid { + display: grid; + grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); + grid-template-rows: repeat(2, 220px); + gap: var(--openbitfun-space-4); +} + +.brand-gallery-tile { + position: relative; + display: grid; + grid-template-rows: minmax(0, 1fr) auto; + min-width: 0; + border-radius: var(--openbitfun-radius-xl); + color: var(--openbitfun-color-content-primary); + background: var(--openbitfun-color-surface-subtle); +} + +.brand-gallery-tile--silver { + grid-row: span 2; +} + +.brand-gallery-tile--outline { + background: var(--openbitfun-color-surface-panel); +} + +.brand-gallery-tile-options { + position: absolute; + top: var(--openbitfun-space-4); + right: var(--openbitfun-space-4); + z-index: 1; +} + +.brand-gallery-backgrounds { + display: inline-flex; + align-items: center; + gap: var(--openbitfun-space-1); +} + +.brand-gallery-backgrounds button { + display: grid; + place-items: center; + width: var(--openbitfun-control-height-md); + height: var(--openbitfun-control-height-md); + padding: var(--openbitfun-space-2); + border: var(--openbitfun-border-width-default) solid transparent; + border-radius: var(--openbitfun-radius-pill); + background: transparent; + cursor: pointer; +} + +.brand-gallery-backgrounds button[aria-pressed="true"] { + border-width: var(--openbitfun-border-width-strong); + border-color: var(--openbitfun-color-content-primary); +} + +.brand-gallery-backgrounds button:hover { + background: var(--openbitfun-color-action-quiet-hover); +} + +.brand-gallery-backgrounds span { + display: block; + width: var(--openbitfun-space-3); + height: var(--openbitfun-space-3); + border: var(--openbitfun-border-width-default) solid var(--openbitfun-color-content-secondary); + border-radius: var(--openbitfun-radius-pill); +} + +.brand-gallery-backgrounds [data-scheme="light"] span { + background: var(--openbitfun-color-content-on-dark); +} + +.brand-gallery-backgrounds [data-scheme="dark"] span { + background: var(--openbitfun-color-content-on-light); +} + +.brand-gallery-tile-art { + display: flex; + align-items: center; + justify-content: center; + min-width: 0; + min-height: 0; + padding: var(--openbitfun-space-4); +} + +.brand-gallery-silver-art { + display: flex; + align-items: center; + justify-content: center; + width: min(82%, 440px); + height: 100%; + min-height: 0; +} + +.brand-gallery-tile-art img { + max-height: 100%; + object-fit: contain; +} + +.brand-gallery-tile-footer { + display: flex; + align-items: center; + justify-content: space-between; + flex-wrap: wrap; + gap: var(--openbitfun-space-2) var(--openbitfun-space-4); + padding: var(--openbitfun-space-3) var(--openbitfun-space-5) var(--openbitfun-space-5); +} + +.brand-gallery-tile h2, +.brand-gallery-wordmark h2 { + font-family: var(--openbitfun-type-heading-panel-font-family); + font-size: var(--openbitfun-type-heading-panel-font-size); + font-weight: var(--openbitfun-type-heading-panel-font-weight); + line-height: var(--openbitfun-type-heading-panel-line-height); +} + +.brand-gallery-tile--silver h2 { + font-size: var(--openbitfun-type-heading-section-font-size); +} + +.brand-gallery-actions { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: var(--openbitfun-space-2); +} + +.brand-gallery-download { + display: inline-flex; + align-items: center; + gap: var(--openbitfun-space-2); + min-height: var(--openbitfun-control-height-sm); + padding: var(--openbitfun-space-2) var(--openbitfun-space-3); + border-radius: var(--openbitfun-radius-pill); + color: var(--openbitfun-color-content-primary); + background: transparent; + font-family: var(--openbitfun-type-label-md-font-family); + font-size: var(--openbitfun-type-body-xs-font-size); + line-height: var(--openbitfun-type-body-xs-line-height); + text-decoration: none; +} + +.brand-gallery-download:hover { + background: var(--openbitfun-color-action-quiet-hover); +} + +.brand-gallery-wordmark { + display: grid; + grid-template-columns: minmax(0, 1fr) minmax(0, 2.4fr) minmax(0, 1fr); + align-items: center; + gap: var(--openbitfun-space-6); + margin-top: var(--openbitfun-space-4); + padding: var(--openbitfun-space-4) var(--openbitfun-space-5); + border-radius: var(--openbitfun-radius-xl); + color: var(--openbitfun-color-content-primary); + background: var(--openbitfun-color-surface-panel); +} + +.brand-gallery-wordmark img { + display: block; + justify-self: center; + width: min(100%, 520px); + height: auto; +} + +.brand-gallery-wordmark .brand-gallery-actions { justify-self: end; } + +.brand-gallery-section { + margin-top: var(--openbitfun-space-12); +} + +.brand-gallery-section-heading { + display: flex; + align-items: center; + justify-content: space-between; + flex-wrap: wrap; + gap: var(--openbitfun-space-4); + margin-bottom: var(--openbitfun-space-5); +} + +.brand-gallery-section-heading h2 { + font-family: var(--openbitfun-type-heading-section-font-family); + font-size: var(--openbitfun-type-heading-section-font-size); + font-weight: var(--openbitfun-type-heading-section-font-weight); + line-height: var(--openbitfun-type-heading-section-line-height); +} + +.brand-gallery-motion { + display: grid; + grid-template-rows: minmax(0, 1fr) auto; + gap: var(--openbitfun-space-3); + min-height: 400px; + padding: var(--openbitfun-space-5); + border-radius: var(--openbitfun-radius-xl); + color: var(--openbitfun-color-content-primary); + background: var(--openbitfun-color-surface-subtle); +} + +.brand-gallery-motion[data-voice] { + background: var(--openbitfun-color-content-on-light); +} + +.brand-gallery-motion-art { + display: grid; + place-items: center; + min-width: 0; + min-height: 320px; +} + +.brand-gallery-motion-art > * { max-width: 100%; } + +.brand-gallery-voice { + width: min(280px, 100%); + aspect-ratio: 1; +} + +.brand-gallery-motion-controls { + display: flex; + align-items: center; + justify-content: space-between; + gap: var(--openbitfun-space-4); +} + +.brand-gallery-idle { + color: var(--openbitfun-color-content-secondary); + font-size: var(--openbitfun-type-body-xs-font-size); + line-height: var(--openbitfun-type-body-xs-line-height); +} + +.brand-gallery-characters { + display: block; + color: var(--openbitfun-color-content-primary); + text-decoration: none; +} + +.brand-gallery-characters > .brand-gallery-section-heading { + padding-bottom: var(--openbitfun-space-5); +} + +.brand-gallery-family { + display: grid; + grid-template-columns: repeat(6, minmax(0, 1fr)); + align-items: center; + justify-items: center; + gap: var(--openbitfun-space-4); + padding-block: var(--openbitfun-space-8) var(--openbitfun-space-10); +} + +.brand-gallery-family img { + display: block; + width: min(100%, 128px); + height: auto; +} + +.brand-gallery-notes { + margin-top: var(--openbitfun-space-8); +} + +.brand-gallery-notes > summary { + display: flex; + align-items: center; + justify-content: space-between; + gap: var(--openbitfun-space-4); + padding-block: var(--openbitfun-space-5); + color: var(--openbitfun-color-content-secondary); + font-size: var(--openbitfun-type-body-sm-font-size); + line-height: var(--openbitfun-type-body-sm-line-height); + list-style: none; + cursor: pointer; +} + +.brand-gallery-notes > summary::-webkit-details-marker { display: none; } +.brand-gallery-notes[open] > summary > svg { transform: rotate(180deg); } + +.brand-gallery-notes-grid { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: var(--openbitfun-space-6); + padding-bottom: var(--openbitfun-space-5); +} + +.brand-gallery-notes-grid > div { + display: grid; + align-content: start; + gap: var(--openbitfun-space-2); +} + +.brand-gallery-notes-grid h3 { + font-size: var(--openbitfun-type-label-md-font-size); + font-weight: var(--openbitfun-type-label-md-font-weight); + line-height: var(--openbitfun-type-label-md-line-height); +} + +.brand-gallery-notes-grid :is(p, span, figcaption) { + color: var(--openbitfun-color-content-secondary); + font-size: var(--openbitfun-type-body-xs-font-size); + line-height: var(--openbitfun-type-body-xs-line-height); +} + +.brand-gallery-motion-note { grid-column: 1 / -1; } + +.brand-gallery-size-list { + display: flex; + align-items: flex-end; + flex-wrap: wrap; + gap: var(--openbitfun-space-3); + padding-top: var(--openbitfun-space-3); +} + +.brand-gallery-size-list figure { + display: grid; + justify-items: center; + gap: var(--openbitfun-space-2); + margin: 0; +} + +@media (max-width: 960px) { + .brand-gallery-grid { + grid-template-columns: repeat(2, minmax(0, 1fr)); + grid-template-rows: repeat(2, 220px); + } + .brand-gallery-tile--silver { grid-column: 1 / -1; grid-row: auto; } + .brand-gallery-silver-art { width: min(72%, 340px); } + .brand-gallery-notes-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } +} + +@media (max-width: 600px) { + .lab-page.brand-gallery { padding-top: var(--openbitfun-space-5); } + .brand-gallery-heading h1 { font-size: var(--openbitfun-type-display-sm-font-size); } + .brand-gallery-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: repeat(2, 220px); } + .brand-gallery-wordmark { grid-template-columns: minmax(0, 1fr) auto; } + .brand-gallery-wordmark img { grid-column: 1 / -1; grid-row: 1; } + .brand-gallery-section { margin-top: var(--openbitfun-space-8); } + .brand-gallery-motion { padding: var(--openbitfun-space-4); min-height: 360px; } + .brand-gallery-motion-art { min-height: 280px; } + .brand-gallery-family { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: var(--openbitfun-space-6); } + .brand-gallery-family img { width: min(100%, 104px); } + .brand-gallery-notes-grid { grid-template-columns: minmax(0, 1fr); } +} + +.brand-motion-selector { max-width: 100%; overflow-x: auto; } diff --git a/design-system/apps/design-lab/src/pages/BrandPage.tsx b/design-system/apps/design-lab/src/pages/BrandPage.tsx new file mode 100644 index 0000000000..840ed6a54f --- /dev/null +++ b/design-system/apps/design-lab/src/pages/BrandPage.tsx @@ -0,0 +1,238 @@ +import { useState } from "react"; +import { Code2, Pause, Play } from "lucide-react"; +import { SegmentedControl, Icon, IconButton, ThemeRoot } from "@openbitfun/ui"; +import { + OpenBitFunAppIcon, + OpenBitFunBrandMotion, + OpenBitFunMark, + OpenBitFunSolidMark, + VoiceParticleLogo, +} from "@openbitfun/ui/brand"; +import { useI18n, type MessageKey } from "../i18n"; +import { SUBAGENT_AVATAR_CATALOG } from "../assets/subagentAvatars"; +import silverUrl from "../../../../packages/ui/src/brand/assets/openbitfun-app-mark.png?url"; +import outlineUrl from "../../../../packages/ui/src/brand/assets/openbitfun-mark.svg?url"; +import appPngUrl from "../../../../../assets/brand/exports/openbitfun-app-icon-512.png?url"; +import appIcoUrl from "../../../../../assets/brand/exports/openbitfun-app-icon.ico?url"; +import appIcnsUrl from "../../../../../assets/brand/exports/openbitfun-app-icon.icns?url"; +import wordmarkUrl from "../../../../../png/openbitfun-wordmark.png?url"; +import "./BrandPage.css"; + +type BrandResource = { + name: string; + label: MessageKey; + description: MessageKey; + specification?: string; + motion?: boolean; + downloads?: readonly { label: string; url: string; filename: string }[]; +}; + +export const brandResources: readonly BrandResource[] = [ + { + name: "OpenBitFunSolidMark", label: "design.silverMark", + description: "brandAssets.silverDescription", specification: "PNG · 512 × 512", + downloads: [{ label: "PNG", url: silverUrl, filename: "openbitfun-silver-mark.png" }], + }, + { + name: "OpenBitFunAppIcon", label: "design.appIcon", + description: "brandAssets.appDescription", specification: "PNG · 512 × 512 / ICO / ICNS", + downloads: [ + { label: "PNG", url: appPngUrl, filename: "openbitfun-app-icon-512.png" }, + { label: "ICO", url: appIcoUrl, filename: "openbitfun-app-icon.ico" }, + { label: "ICNS", url: appIcnsUrl, filename: "openbitfun-app-icon.icns" }, + ], + }, + { + name: "OpenBitFunMark", label: "design.lineMark", motion: true, + description: "brandAssets.outlineDescription", specification: "SVG", + downloads: [{ label: "SVG", url: outlineUrl, filename: "openbitfun-mark.svg" }], + }, + { + name: "wordmark", label: "design.wordmark", + description: "brandAssets.wordmarkDescription", specification: "PNG · 2172 × 724", + downloads: [{ label: "PNG", url: wordmarkUrl, filename: "openbitfun-wordmark.png" }], + }, + { + name: "OpenBitFunBrandMotion", label: "design.aboutMotion", motion: true, + description: "brandAssets.aboutDescription", + }, + { + name: "VoiceParticleLogo", label: "design.voiceMotion", motion: true, + description: "brandAssets.voiceDescription", + }, +]; + +const motionScenes = [ + { name: "OpenBitFunMark", label: "brandAssets.breathe" }, + { name: "OpenBitFunBrandMotion", label: "brandAssets.flow" }, + { name: "VoiceParticleLogo", label: "brandAssets.particles" }, +] as const; +type Background = "light" | "dark"; +type OpenComponent = (name: string) => void; + +function BackgroundPicker({ value, onChange, asset }: { value: Background; onChange: (value: Background) => void; asset: string }) { + const { t } = useI18n(); + return ( +
+ {(["light", "dark"] as const).map(background => ( + + ))} +
+ ); +} + +function ComponentLink({ name, label, onOpen }: { name: string; label: string; onOpen: OpenComponent }) { + const { t } = useI18n(); + const accessibleLabel = `${label} · ${t("design.relatedComponent")}`; + return } onClick={() => onOpen(name)} />; +} + +function AssetActions({ resource, onOpenComponent }: { resource: BrandResource; onOpenComponent: OpenComponent }) { + const { t } = useI18n(); + return ( +
+ {resource.downloads?.map(asset => ( + + {asset.label} + + ))} + {resource.name !== "wordmark" && } +
+ ); +} + +function IdentityTile({ resource, onOpenComponent }: { resource: BrandResource; onOpenComponent: OpenComponent }) { + const { t } = useI18n(); + const silver = resource.name === "OpenBitFunSolidMark"; + const app = resource.name === "OpenBitFunAppIcon"; + const [background, setBackground] = useState(silver ? "dark" : "light"); + const kind = silver ? "silver" : app ? "app" : "outline"; + return ( + + {!app &&
+ +
} +
+ {silver ?
+ : app ? + : } +
+
+

{t(resource.label)}

+ +
+
+ ); +} + +function BrandMotionShowcase({ onOpenComponent }: { onOpenComponent: OpenComponent }) { + const { t } = useI18n(); + const [selected, setSelected] = useState<(typeof motionScenes)[number]>(motionScenes[1]); + const [playing, setPlaying] = useState(true); + const [background, setBackground] = useState("dark"); + const voice = selected.name === "VoiceParticleLogo"; + return ( +
+
+

{t("brandAssets.motionTitle")}

+ setSelected(motionScenes.find(scene => scene.name === value) ?? motionScenes[0])} + options={motionScenes.map(scene => ({ value: scene.name, label: t(scene.label) }))} /> +
+ +
+ {selected.name === "OpenBitFunMark" && } + {selected.name === "OpenBitFunBrandMotion" && } + {voice &&
} +
+
+ {voice ? {t("brandAssets.voiceIdle")} + : } +
+ } + onClick={() => setPlaying(value => !value)} /> + +
+
+
+
+ ); +} + +export function BrandPage({ onOpenComponent }: { onOpenComponent: OpenComponent }) { + const { t } = useI18n(); + const wordmark = brandResources[3]!; + return ( +
+
+

{t("design.brand")}

+ +
+ +
+
+ {brandResources.slice(0, 3).map(resource => ( + + ))} +
+ +

{t(wordmark.label)}

+ OpenBitFun + +
+
+ + + +
+ +
+

{t("brandAssets.charactersTitle")}

+ +
+ +
+
+ +
+ {t("brandAssets.usageTitle")} +
+ {brandResources.map(resource => ( +
+

{t(resource.label)}

+

{t(resource.description)}

+ {resource.specification && {resource.specification}} + {resource.name === "OpenBitFunAppIcon" && ( +
+ {[16, 24, 32, 48, 64].map(size => ( +
{size} px
+ ))} +
+ )} +
+ ))} +

{t("brandAssets.motionPreference")}

+
+
+
+ ); +} diff --git a/design-system/apps/design-lab/src/pages/ColorsPage.tsx b/design-system/apps/design-lab/src/pages/ColorsPage.tsx index 83b20c17f5..02e8ad3b11 100644 --- a/design-system/apps/design-lab/src/pages/ColorsPage.tsx +++ b/design-system/apps/design-lab/src/pages/ColorsPage.tsx @@ -1,6 +1,6 @@ import { Fragment, useMemo, useState, type CSSProperties } from "react"; import { Contrast, LayoutGrid, Moon, Sun } from "lucide-react"; -import { Icon, type DensityMode } from "@openbitfun/ui"; +import { Button, Icon, SearchField, Select, TabGroup, type DensityMode } from "@openbitfun/ui"; import { themeContractVersion, themeTokenCatalog, @@ -137,12 +137,12 @@ function formatColorValue(value: string): string { function ModeIcon({ mode }: { mode: ThemeDataName }) { if (mode === "light") { - return