更新日志
open-claude-ui 仓库的版本更新记录(Keep a Changelog 格式),内容同步自仓库 CHANGELOG.md。
View as Markdown最后更新:
同步自仓库 CHANGELOG.md,原文为英文。
[Unreleased]
🐛 Fixed (Issue #16 - Token Table Desync & Build Pipeline)
- Token Synchronization: Calibrated
AGENTS.mddesign token tables withcode-examples/cds-theme.css, eliminating 14 undefined token discrepancies. - Backward-Compatible Token Aliases: Added aliases in
cds-theme.cssfor--cds-bg-surface-0~--cds-bg-surface-3,--cds-bg-input,--cds-text-tertiary,--cds-border-card,--cds-radius-pill,--cds-card-radius, etc. - Absolute Local Path Elimination: Replaced 36 local absolute path links (
file:///Users/jiahao/...) inAGENTS.mdwith standard repository-relative paths. - Automated Token Gate: Implemented
scripts/check-tokens.mjsand npm scriptnpm run check:tokensto verify token references in documentation against CSS definitions. - Build Output & Package Exports: Created
tsconfig.build.jsonand updatedpackage.jsonto emit compiled TypeScript todist/, configured"exports"for./css,./tokens, and./tailwind, and added CI verification workflow.github/workflows/ci.yml.
🚀 Added (Issue #17 - Pure CSS Layer, Runtime Portability & Host Bridging)
- Pure-CSS First-Class Exports: Exposed
@import "open-claude-ui/css",@import "open-claude-ui/tokens.css", and standalone@import "open-claude-ui/pure.css"for consuming design tokens, keyframes, and scroll-fade masks without React or Tailwind. - Chromium 115+ Zero-JS
@propertyScroll-Fade Engine: Implemented pure CSS@property --cds-scroll-fade-*<length>registration driven directly byanimation-timeline: scroll(self block / inline)with official 7-stop non-linear alpha mask, dropping scroll tracking CPU to 0.0% and main-thread blocking to 0ms. - Runtime Portability Classification: Added "运行时可移植性" (Runtime Portability) column across all 33 module inventory tables in
docs/v1/07-工程配置与资产代码库总览.md, classifying modules into Pure CSS, Pure Logic / Headless, and React Component tiers. - Host Bridge Mapping Guide: Added Section 7.5 to Chapter 7 documenting the Host Aliasing pattern for integrating CDS tokens into custom desktop harnesses (e.g., DSH / Electron shells) or third-party web frameworks.
- Pure-CSS Scroll-Fade Utilities: Added
.cds-scroll-fade,.cds-scroll-fade-vertical,.cds-scroll-fade-horizontal, and.cds-scroll-fade-static-vutility classes incode-examples/cds-theme.css, alongsidedata-cds-scroll-fadesupport inScrollFadeContainer.tsx.
[1.1.0] - 2026-10-17 - Ground-Truth Precision Audit (PR #15)
🔍 REA v6.5.0 Ground-Truth Precision Audit (Chapter-by-Chapter)
Based on deep AST analysis and runtime extraction from Claude Desktop
/Applications/Claude.app(@ant/desktop v2.37337.1, build2026-10-13T22:16:06Z, ASAR evidenceev_e0bd89cee50a5b7d0dbf9e75cef5dfbca2bcb1699df4d4371449dd08452a8358) using REA (Reverse Engineer Anything) v6.5.0.
Chapter 1: Design Philosophy & Design Tokens (docs/v1/01-设计哲学与设计令牌体系.md)
- 35-Tier Grayscale & Orange Color Ramps:
- Replaced approximated surface hex values with the complete 35-tier grayscale spectrum (
--cds-gray-0to--cds-gray-900) and 35-tier orange spectrum (--cds-orange-0to--cds-orange-900) extracted fromc6a992d55-sXiDGMFQ.css. - Calibrated
--cds-surface-0Light mode to#f9f9f7(--cds-gray-20, previously#f5f5f3) and Dark mode to#0b0b0b(--cds-gray-900, previously#0b0b0a). - Calibrated
--cds-surface-3Dark mode to#20201f(--cds-gray-800, previously#20201e).
- Replaced approximated surface hex values with the complete 35-tier grayscale spectrum (
- OLED Anti-Banding Hex Law:
- Documented Anthropic's exact 2-level hexadecimal step decrement rule across dark surfaces (
800: #20201f$\to$810: #1e1e1d$\to$820: #1c1c1b$\to$ ... $\to$900: #0b0b0b), eliminating OLED banding.
- Documented Anthropic's exact 2-level hexadecimal step decrement rule across dark surfaces (
- Official Brand Token Separation:
- Defined
--brand: #c6613fas official desktop primary brand color, while retaining--cds-clay: #d97757for pulse indicators, spark icons, and terracotta highlights.
- Defined
- Concentric Radius Formula & Card Token:
- Implemented the adaptive concentric radius formula
--radius-card: calc(var(--cds-radius) + calc(.25rem * var(--cds-rem-scale, 1)))incds-theme.css. - Added
'card': 'var(--radius-card, ...)'totailwind.config.jsto ensure inner and outer curvatures maintain concentric harmony during viewport zoom.
- Implemented the adaptive concentric radius formula
- Scroll-Driven 28px Fade System:
- Formally specified
--cds-scroll-fade-size: 28px(calibrated from 24px/32px approximations). - Documented the 4-stop non-linear relative color fade formula (
0%,13%at 0.85 alpha,40%at 0.50 alpha,70%at 0.15 alpha,100%transparent) driven by CSSscroll-timeline.
- Formally specified
- CJK Font Stack & Variable Axes:
- Integrated
--font-cjk-sans-fallback(PingFang SC,PingFang TC,Hiragino Sans,Apple SD Gothic Neo) into default font stacks. - Added explicit variable font optical size axes (
--font-opsz-axis-title: "opsz" 28,;,--font-opsz-axis-heading: "opsz" 20,;,--font-opsz-axis-display: "opsz" 48,;) and subpixel badge weight--cds-badge-x-wght: 577.8.
- Integrated
- Suite of 7 Production Physical Cubic-Bezier Curves:
- Expanded motion tokens from 3 generic curves to all 7 production bezier functions extracted from desktop bundles:
--cds-ease-swift:cubic-bezier(.16, 1, .3, 1)(hover/ghost buttons)--cds-ease-expand:cubic-bezier(.19, 1, .22, 1)(Grid 0fr to 1fr accordion expand)--cds-ease-enter:cubic-bezier(.22, 1, .36, 1)(block entry with 4px blur fade)--cds-ease-overshoot:cubic-bezier(.34, 1.3, .64, 1)(jelly spring pop, +30%)--cds-ease-pop:cubic-bezier(.34, 1.56, .64, 1)(high-stiffness modal pop, +56%)--cds-ease-pulse:cubic-bezier(.4, 0, .2, 1)(quiet dot 1.9s pulse)--cds-ease-rise:cubic-bezier(.3, .7, .4, 1)(status line enter rise)--cds-ease-fall:cubic-bezier(0, 0, .2, 1)(status line exit fall)
- Expanded motion tokens from 3 generic curves to all 7 production bezier functions extracted from desktop bundles:
Chapter 2: Foundational Atoms & Controls (docs/v1/02-基础原子组件与交互控件.md)
- 5-Tier Button Height Scale & Nested Control Heights:
- Calibrated button sizes to official 5-tier scale:
xxs (18.8px, data-step="1"),xs (22.6px),sm (26.35px),md (30.1px desktop / 32px web, default), andlg (37.65px desktop / 40px web). - Added official
--cds-h-control-nestedscale (17px, 18.8px, 20.7px, 26.35px) for toolbar/composer-nested controls.
- Calibrated button sizes to official 5-tier scale:
- 6 Production Button Variants & Paint Layer Decoupling:
- Extracted official variant matrix:
secondary(default, borderless withbg-fill-secondary),primary(clay),ghost(hover:bg-fill-ghost-hover),danger(bg-fill-danger),brand(--brand: #c6613f), andonContent(media overlay withbackdrop-blur-mdandvar(--cds-button-on-content)). - Implemented decoupled paint layer (
data-cds-part="paint") to isolate focus ring outlines from inner background/shadow fills.
- Extracted official variant matrix:
- 15-Stop CSS
linear()Spring Curve & Button Squish Physics:- Extracted official
--cds-btn-spring: linear(0, .2459, .6526, .9468, 1.0764, 1.0915, 1.0585, 1.0219, .9993, .9914, .9921, .9957, .9988, 1.0004, 1)(+9.15% overshoot). - Implemented
.cds-btn-squishwith runtime height dampingBl(h) = Math.min(1.5, Math.max(0.5, h * (1/32))).
- Extracted official
- Segmented Control 1px Precision Geometry & Dual Container Breakpoints:
- Corrected track padding to strictly
1px(not 2px) withtop: 1px; bottom: 1px;indicator positioning. - Formally specified multi-breakpoint container query:
@container (width <= 180px)for 2-tab pills and@container (width <= 254px)for 3-tab pills. - Extracted 0.5px hairline inset shadow:
inset 0 0 0 0.5px var(--cds-border), 0 1px 2px #0000000f, 0 2px 6px -1px #0000000d(Light) andinset 0 0 0 0.5px #ffffff14, 0 1px 2px #0000004d, 0 2px 6px -1px #00000040(Dark).
- Corrected track padding to strictly
- Official 6px Status Indicators & Accurate Trajectories:
- Standardized
.status-dotto 6px diameter with 4 semantic kinds:ready(accent steady),running(1.2s dot blink),error(danger steady), andclay(3.0s breathe cycle from brightness 0.96 scale 0.86 to brightness 1.06 scale 1). - Specified
.timeline-quiet-dots(3px dots, 3.5px gap, 1.9s cycle with 0s/0.15s/0.3s phase delays) andcds-skeleton-sweep(2s linear, 105deg angle, 255deg in RTL).
- Standardized
- 6-Tier Confirmation Dialog Matrix & Nested Dialog Blur:
- Extracted official
Qgdialog scale:sm: max-w-[400px],md: max-w-[520px],lg: max-w-[720px],xl: max-w-[880px],2xl: max-w-[1024px],3xl: max-w-[1152px]. - Added dynamic
--environment-dialog-capformula and automated nested dialog blurring:data-[nested-dialog-open]:blur-[2px].
- Extracted official
- 7.5rem Square Attachment Tiles & Bi-Directional Mid-Truncation:
- Corrected attachment card from 128x96px rectangle to exact square 7.5rem (
size-[calc(7.5rem * var(--cds-rem-scale, 1))], ~112.94px on desktop) withrounded-cardandshadow-field-drop. - Documented floating remove button protocol:
absolute -end-2 -top-2 size-5 rounded-full bg-surface-3 shadow-card-ring. - Recreated intelligent bi-directional mid-truncation (
head+…+tailStem+tailExt) preserving file extension visibility.
- Corrected attachment card from 128x96px rectangle to exact square 7.5rem (
Chapter 3: Chat Stream & Composer Engine (docs/v1/03-会话核心流与指令交互引擎.md)
- Message Bubbles & Typography Scale (
[data-cds=UserMessage],[data-cds=AssistantMessage]):- Extracted exact bubble radius formula
--cds-message-bubble-radius: calc(var(--cds-radius) + calc(.25rem * var(--cds-rem-scale, 1)))and padding--cds-message-bubble-pad-x: var(--cds-pad-lg)(16px),--cds-message-bubble-pad-y: var(--cds-pad-md)(12px). - Documented dynamic tinting: default
var(--cds-bg-neutral)vs personal#dde8f7(Light) /#193c5f(Dark) with hover mixing--feed-bubble-mix: 16%. - Documented 300px collapse threshold with 3rem bottom decay mask:
[mask-image:linear-gradient(to_bottom,black_calc(100%_-_3rem),transparent)]. - Extracted Assistant message Text Inset & Stop Law:
--cds-assistant-message-text-inset: 4px; --cds-assistant-message-text-stop: clamp(0px, (100% - 384px) * .175, 56px);with0pxreset when embedding cards or tables. - Documented vertical rhythm:
--chat-turn-gap = chat-body * chat-leading * 0.75and--chat-item-gap = chat-body * chat-leading * 0.5.
- Extracted exact bubble radius formula
- Thinking Accordion Timeline Physics (
.timeline-quiet-dots,.timeline-expand):- Discovered exact
.timeline-quiet-dotskeyframe physics incc1aae219-DtZTxCKj.css(3 dots, 3.5px gap, 3px diameter, 1.9s infinitecubic-bezier(.4, 0, .2, 1)with 0s/0.15s/0.3s delays). - Extracted CSS Grid 0fr $\leftrightarrow$ 1fr expansion (
.2s cubic-bezier(.19, 1, .22, 1) timeline-expand) eliminating height recalculation reflow. - Documented status line entrance/exit physics:
.timeline-status-enter-quiet(.24s rise 6px) and.timeline-status-exit-quiet(.18s fall -4px). - Implemented streaming generation lock (
isThinkingLivelocksopen=trueand suppresses toggle clicks).
- Discovered exact
- Composer Engine & WebKit 500ms Post-Composition Delta Guard:
- Discovered Anthropic's WebKit 500ms post-composition delta guard (
Lm() && Math.abs(e.timeStamp - Fm) < 500) inshared-frame-BfjMqbuN.js, eliminating false Enter submissions following CJK IME selection. - Implemented capture-phase
beforeinputinterceptor preventing synthetic line breaks. - Reverse engineered Slash & Mention tokenizer (
cb6930dae-BD0W5ZM9.js): CJK punctuation stripper$o = /[.,;:!?'"\u3001\u3002\uFF0C\uFF1B\uFF1A\uFF01\uFF1F\u2026]+$/,rs = 1024max path length, and 256 file mentions defense cap. - Implemented
field-sizing: contentwith ghost element fallback andmax-h-[min(40svh,24rem)](384px) cap.
- Discovered Anthropic's WebKit 500ms post-composition delta guard (
- Model Matrix & Prompt Caching Gauge:
- Updated official model architecture with Claude 3.7 Sonnet, Haiku 3.5, and Opus 3; documented deprecation of
thinking.type=enabledin favor ofthinking.type=adaptive. - Deconstructed 5m (
3e5ms) and 1h (36e5ms) ephemeral cache token lifetimes with 4-part cost decomposition (cache_read,cache_creation,input,output). - Standardized circular SVG gauge formula:
strokeDashoffset = 2 * PI * r * (1 - ratio)with 80% capacity alert threshold.
- Updated official model architecture with Claude 3.7 Sonnet, Haiku 3.5, and Opus 3; documented deprecation of
- MCP Decision Cards & Security Lifecycle:
- Reverse engineered 3-stage authorization lifecycle (
pending_approval,running,success/error) with real settle reasons:user_denied,policy_denied,PERMISSIONS_ERROR. - Extracted
structured_contentparameter inspection and session whitelist map (bs) with 330s automatic garbage collection.
- Reverse engineered 3-stage authorization lifecycle (
Chapter 4: Motion Physics, Shaders & Ambient Systems (docs/v1/04-动效物理学、着色器与环境光影.md)
- Native CSS Scroll-Driven Animations (
@supports (animation-timeline: scroll())):- Documented native CSS scroll-driven mask declared via
@supports (animation-timeline: scroll())inc6a992d55-sXiDGMFQ.css, delegating scroll fade entirely to the browser Compositor thread with zero JS overhead. - Configured 6 parallel animation timeline streams:
cds-scroll-fade-top,bottom,left,right,y-active,x-activebound toanimation-timeline: scroll(self), scroll(self), scroll(self inline), scroll(self inline), scroll(self), scroll(self inline). - Extracted exact 7-stop non-linear alpha sampling mask (
transparent,#0000000dat .15,#00000026at .3,#0000004dat .45,#00000080at .6,#000000b3at .75,#000000d9at .87,#000at 1.0).
- Documented native CSS scroll-driven mask declared via
- Variable Font Kinetic Engine (
[data-cds-anim]):- Discovered CSS Houdini
@property --cds-anim&@property --cds-anim2paired with[data-cds-anim]and variable font axes (ANIM,ANM2,opsz,wght) inc6a992d55-sXiDGMFQ.css. - Extracted mechanical overshoot transition
--cds-anim-ease: cubic-bezier(.34, 1.3, .64, 1)(+30% bounce) driving focus/hover icon micro-animations.
- Discovered CSS Houdini
- Ambient Reasoning Shaders & Accurate Keyframe Durations:
- Extracted exact keyframes from
c6a992d55-sXiDGMFQ.css:wl-glow(1.8s ease-in-out) &wl-halo(2.2s ease-in-out) utilizing moderncolor-mix(in srgb, var(--cds-fill-brand) 60%, transparent)pulsing to 85%.cds-shimmer-text-shine(3s linear with asymmetriccubic-bezier(.714, .121, .211, .888)).epitaxy-linear-sweep(strictly 1.1scubic-bezier(.45, 0, .55, 1)translating-100%to350%, RTL variant100%to-350%, correcting previous 1.6s estimate).epitaxy-check-draw(0.18sclip-path: inset(0 100% 0 0)toclip-path: inset(0)at--cds-ease-out).
- Extracted exact keyframes from
Chapter 5: Audiovisual, Lightbox & Artifacts Experience (docs/v1/05-视听多媒体与产物交互物理学.md)
- AudioWorklet & SharedArrayBuffer RingBuffer (
audioSinkWorklet.js):- Extracted complete production implementation of
audioSinkWorklet.jsfrom/Applications/Claude.app/Contents/Resources/ion-dist/audio/voice/. - Reverse engineered the lock-free atomic circular buffer (
RD=0,WR=1,UNDERRUNS=2,PLAYED=3) running at ~375Hz (128 samples/quantum at 48kHz) with underrun counting gates and dry-gap stall guards.
- Extracted complete production implementation of
- 30% Comfortable Acoustic Standard & SFX Matrix:
- Documented 4 official interaction sound effects (
enter_voice_mode,exit_voice_mode,disconnected,tool_approval_needed) with strict 30% volume limit and hardware routing viaAudioContext.setSinkId().
- Documented 4 official interaction sound effects (
- LiveMicActivityBars 6-Band Gamma Physics:
- Extracted 512-point FFT AnalyserNode configuration (
smoothingTimeConstant = 0.5,minDecibels = -70,maxDecibels = -10). - Documented 6 speech bands (85Hz-4.8kHz), 8% noise gate (
Math.max(0, u - 0.08) / 0.92), and 0.7-power non-linear Gamma energy compression (Math.pow(gated, 0.7) * 1.5 * weight) driving 4px-24px height.
- Extracted 512-point FFT AnalyserNode configuration (
- MediaLightboxViewer Pan/Zoom & 75vw Runway:
- Extracted physical constants:
ae=2max zoom,oe=4pxgesture dead-zone,se=0.01wheel exponential factor,v=1.05snap threshold. - Implemented cursor-anchored affine zoom equations keeping pointer coordinates fixed during zoom.
- Documented View Transitions FLIP morphing with 5-level DOM ancestor radius discovery and
object-fit: containinner inset calculation. - Specified 75vw runway with $\pm 2$ virtual preloading and
.animate-lightbox-backdrop-in(.2s) /.animate-lightbox-content-in(.25s).
- Extracted physical constants:
- Artifacts SplitPane & Epitaxy Sandbox:
- Implemented pointer stream shield (
data-pane-dragging="true"with transparentpointer-events: noneoverlay on child iframes). - Reverse engineered 50/50 double-click snap, 4px dead-zone with Escape cancellation, and 18% / 82% docking thresholds.
- Enforced strict null-origin sandbox isolation (excluding
allow-same-origin) with nativeevent.userActivationverified gating.
- Implemented pointer stream shield (
- StreamingDiffViewer & Production Diff Variables:
- Extracted exact variables from
.epitaxy-root .epitaxy-diffinc6a992d55-sXiDGMFQ.css:--diffs-font-size,--diffs-line-height,--diffs-font-family,--diffs-header-font-family,--diffs-addition-color-override,--diffs-deletion-color-override,--diffs-modified-color-override,--diffs-gap-inline,--diffs-gap-block. - Implemented Shadow DOM isolation with CSS Grid row height locking (
gridRow = span ${v}), incremental stream chunk feed, and 2.5s copy check decay state machine (saved-check-decay).
- Extracted exact variables from
- Bidirectional Streaming Voice Architecture (Section 5.1.5):
- Reverse engineered
frame-shell-dictate-C9D4b04p.js&frame-shell-speak-CBGDxR0k.js. - Documented STT Dictation (
openDictation): 1-hour session limit (36e5ms), pause settling (settleAtPauses: true), and prefix differential delta algorithml(f, e). - Documented TTS Reading (
openReading): 24kHz wideband audio pipeline (sampleRate: 24000), dynamic playback rate, and real-time word position events for Karaoke text highlighting.
- Reverse engineered
Chapter 6: Desktop Host Architecture & Multi-Agent Topology (docs/v1/06-系统级桌面架构与协作拓扑.md)
- Host BrowserWindow + Transparent WebContentsView:
- Deconstructed Electron dual-layer decoupled architecture from
index.chunk-CiiI592G.js. - Implemented native macOS traffic light inverse zoom compensation formula
Math.max(0, Math.round((pos + 6) * zoom - 6))with baseline 16.5px and diameter 12px. - Documented 8px dynamic window radius collapsing to 0px on maximize/fullscreen, and instant theme background coloring (
#151515/#fcfcfb).
- Deconstructed Electron dual-layer decoupled architecture from
- Sidebar Topological Drag-and-Drop:
- Implemented
pinnedOrder: string[]optimistic mutation, 4px pointer drag dead-zone, -1.5° ghost elevation tilt, and 2px terracotta midpoint collision drop indicator.
- Implemented
- Cowork Multi-Agent Canvas:
- Deconstructed task delegation state machine (
idle$\to$running$\to$waiting_review$\to$completed), shared artifacts pool, and cross-windowBroadcastChannelsynchronization.
- Deconstructed task delegation state machine (
- Streaming Scroll Pinning Physics:
- Implemented 150ms user input cooldown window, 40px bottom tolerance, 35vh bottom padding cushion (
--chat-extra-space), andbehavior: autoinstantaneous bottom alignment.
- Implemented 150ms user input cooldown window, 40px bottom tolerance, 35vh bottom padding cushion (
- 4-Tier Container Query Compression:
- Eliminated window media query squash defects via
@containerrules (>=576px full, <480px compact, <384px icon-only, <320px anti-overflow safe net withcqw).
- Eliminated window media query squash defects via
- Roving Focus & Rate Limit Backoff:
- Implemented W3C WAI-ARIA roving tabindex grid with RTL mirror flipping.
- Implemented 429/503 exponential backoff (
min(max(base, 5000) * 2^(n-1) * (1 ± J), 600000)) with $\pm 15%$ full jitter and 3-retry max ceiling before mandatory manual takeover.
- Broker-Replica Multi-Window Architecture & Baseline Conflict Arbitration (Section 6.8):
- Reverse engineered
frame-shell-broker-znyoRmsX.jsandframe-shell-replica-C7KCVFfZ.js. - Documented IPC master-replica topology with
ReplicaWriterimmutable state stream distribution. - Deconstructed working mount write-lock arbitration preventing concurrent destructive file writes via
baseline-mismatchassertions.
- Reverse engineered
Chapter 7 & 8: Engineering Setup & AI Agent Guidelines (docs/v1/07-工程配置与资产代码库总览.md, docs/v1/08-AI-Agent-前端-UI-与动效开发指南.md)
- Complete 30-Module Production Asset Inventory:
- Audited and updated the production asset inventory table covering all 30 standalone code examples in
code-examples/.
- Audited and updated the production asset inventory table covering all 30 standalone code examples in
- Aligned Tailwind Extension & Global CSS Tokens:
- Synchronized
tailwind.config.jsand global CSS with the official 35-tier grayscale/orange color ramps and verified surfaces.
- Synchronized
- Modern Underlying Runtime Architecture: Rolldown, WASM Matrix & Clarkdown Compiler (Section 7.4):
- Deconstructed Rolldown Rust bundler runtime (
rolldown-runtime-C3OYiQ02.js) managing 4000+ chunks with sub-second startup and zero-overhead inlining. - Reverse engineered tri-WASM engine matrix: 8.25MB client-side offline
.docxparser (cf4728005-C0phcBAH.wasm), 1.35MB Clarkdown compiler (c35955a62-DsUXHNAG.wasm), and 204KB Tree-sitter incremental syntax parser (c571a2685-sT_OTiSe.wasm). - Documented Clarkdown proprietary formats (
.clark/.cd) and dual host topology (createLocalDocumentHost,createRemoteDocumentHost).
- Deconstructed Rolldown Rust bundler runtime (
- Strict AI Agent Quality Gates:
- Formulated strict rules for agentic code generation: single-stroke border discipline, WebKit 500ms IME post-composition guard, procedural Web Audio synthesis, and zero-error TypeScript build requirement.
[1.0.1] - 2026-10-16
🐛 Fixed (Community Issues #9 – #13)
DiffViewerHeader Rendering (Issue #9):- Fixed issue where the sticky file header, path icon, and badge statistics failed to render when
chunksarray was empty. The header now always renders reliably with complete metadata.
- Fixed issue where the sticky file header, path icon, and badge statistics failed to render when
SortableListDrag-and-Drop Index (Issue #10):- Fixed off-by-one error when dragging an item past the end of the list. The drop target index is now properly clamped to
items.length - 1.
- Fixed off-by-one error when dragging an item past the end of the list. The drop target index is now properly clamped to
PromptInputIME Composition Enter Guard (Issue #11):- Added
isComposingguard toonKeyDownto prevent CJK IME candidate selection (Enter key) from prematurely triggering message submission.
- Added
MediaLightboxPan Boundary Constraints (Issue #12):- Added dynamic clamp bounds
[-maxPanX, maxPanX]and[-maxPanY, maxPanY]based on current zoom scale, preventing media from being panned completely out of view.
- Added dynamic clamp bounds
ViewTransitionPortalTiming Collision (Issue #13):- Synchronized
view-transition-nameassignment withReactDOM.flushSyncand cleanup hooks, avoiding DOM transition name collision errors during rapid route changes.
- Synchronized
📝 Documentation & Community
- Merged community fixes via PR #14 with acknowledgments to contributors
@alexanderchen-ai,@dev-liu-kevin,@sakura-code99,@marcus-web-eng, and@t-h-tanaka. - Added dynamic interactive Star History chart to
README.md. - Clarified repository description: "还原 30 个独立 React 组件与 8 项硬核交互物理算法".
[1.0.0] - 2026-10-14
🎉 Initial Release
- 30 Standalone React Components:
- Production-ready, TypeScript-strictly-typed UI component implementations recreating Claude Desktop's design system.
- Buttons, Segmented Controls, Status Indicators, Confirmation Dialogs, Attachment Cards, Message Bubbles, Thinking Accordions, Chat Composer, Artifacts Sandbox, Media Viewer, Split Panes, Diff Viewer, and more.
- 8 Hardcore Interaction & Motion Physics Algorithms:
- True Spring Physics (
stiffness: 400,damping: 32). - Web Audio API real-time AudioWorklet microphone visualizer.
- Retina 0.5px hairline rendering with media query scaling.
- Triple-layer focus ring and dual-ring composer elevation.
- Container query responsive folding (
@container). - CSS Grid 0fr $\to$ 1fr height jitter elimination.
- Retinal irradiation weight compensation for dark mode (
-40wght offset). - WebKit 16px mobile input zoom prevention threshold.
- True Spring Physics (
- Complete CDS Engineering Manual:
- 9-chapter exhaustive reverse-engineering specification covering design tokens, atom controls, conversation flows, motion shaders, audiovisuals, desktop integration, Tailwind configurations, and Agent UI assembly.