Skip to content

Extract design system to shared library with iOS compatibility#1868

Merged
ashleeradka merged 7 commits into
mainfrom
safe-plan/sharded-mapping-shannon/shared-design-system
Feb 14, 2026
Merged

Extract design system to shared library with iOS compatibility#1868
ashleeradka merged 7 commits into
mainfrom
safe-plan/sharded-mapping-shannon/shared-design-system

Conversation

@ashleeradka
Copy link
Copy Markdown
Contributor

@ashleeradka ashleeradka commented Feb 14, 2026

Summary

Moved the entire DesignSystem directory from the macOS target to the shared library (clients/shared/) to enable code reuse between macOS and iOS apps.

  • Extracted all design system tokens, core components, modifiers, and gallery to shared library
  • Made all types, properties, and methods explicitly public for cross-module access
  • Added platform-specific conditional compilation for macOS/iOS differences
  • Updated 40+ macOS files to import VellumAssistantShared

Key Changes

Design System Structure:

  • Moved clients/macos/vellum-assistant/DesignSystem/clients/shared/DesignSystem/
  • 7 directories moved: Tokens, Core, Components, Modifiers, Gallery

Conditional Compilation:

  • TypographyTokens: Platform-specific font descriptor handling (#if os(macOS) / #elseif os(iOS))
  • Buttons (VButton, VIconButton, VCircleButton): macOS-only cursor hover effects
  • VToast: Platform-specific accessibility (NSAccessibility vs UIAccessibility)

Public API:

  • Made all color scale enums public (Slate, Emerald, Violet, Indigo, Rose, Amber)
  • Made all semantic tokens public (VColor, VSpacing, VRadius, VAnimation, VShadow)
  • Made Color hex initializer public
  • Made ComponentGalleryWindow public

macOS Integration:

  • Added import VellumAssistantShared to 40+ macOS files
  • All existing functionality preserved

Test Plan

  • macOS app builds successfully
  • All tests pass (ActionVerifierTests, ChatViewModelTests)
  • No visual regressions on macOS
  • Design system components render correctly
  • Cursor hover effects work on macOS

Part of iOS rollout plan (PR 2 of 13): sharded-mapping-shannon.md

🤖 Generated with Claude Code


Open with Devin

Move the entire DesignSystem directory from clients/macos/vellum-assistant/
to clients/shared/ to enable code reuse between macOS and iOS targets.

Changes:
- Moved all design system files (Tokens, Core, Components, Modifiers, Gallery) to clients/shared/DesignSystem/
- Made all public types, properties, and methods explicitly public for cross-module access
- Added conditional compilation for platform-specific code:
  - TypographyTokens: Platform-specific font descriptor handling (NSFont vs UIFont)
  - Buttons: macOS-only cursor hover effects (#if os(macOS))
  - VToast: Platform-specific accessibility (NSAccessibility vs UIAccessibility)
- Made Color hex initializer public
- Made all color scale enums public (Slate, Emerald, Violet, Indigo, Rose, Amber)
- Made all semantic color tokens public (VColor)
- Made all spacing, radius, animation, shadow tokens public
- Made ComponentGalleryWindow public with public init and show method
- Updated 40+ macOS files to import VellumAssistantShared

Part of iOS rollout plan (PR 2 of 13)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Copy link
Copy Markdown
Contributor

@devin-ai-integration devin-ai-integration Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Devin Review found 2 potential issues.

View 5 additional findings in Devin Review.

Open in Devin Review

Comment thread clients/shared/DesignSystem/Gallery/ComponentGalleryWindow.swift Outdated
Comment thread clients/shared/DesignSystem/Core/Feedback/VToast.swift Outdated
Copy link
Copy Markdown

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: e53539e8e1

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

Comment on lines 2 to 3
#if DEBUG
import AppKit
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P1 Badge Restrict gallery window code to macOS builds

Because this file now lives in VellumAssistantShared, #if DEBUG is true for iOS debug builds too, so import AppKit and the NSWindow APIs in show() are compiled when targeting iOS and fail immediately. This blocks debug iOS builds of the shared module even though the change is intended to add iOS compatibility; gate this file with #if os(macOS) && DEBUG (or equivalent) so iOS targets can compile.

Useful? React with 👍 / 👎.

- ComponentGalleryWindow: Add os(macOS) guard to #if DEBUG to prevent iOS compilation failure
- VToast: Restore style prefix and priority in NSAccessibility announcement for VoiceOver users

Fixes identified by Devin and Codex review bots.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@ashleeradka
Copy link
Copy Markdown
Contributor Author

Fixed review feedback in 9b9c8fc:

  1. ComponentGalleryWindow.swift - Added os(macOS) guard to #if DEBUG to prevent iOS compilation failure
  2. VToast.swift - Restored style prefix and high priority to NSAccessibility announcement for VoiceOver users

Both issues identified by Devin and Codex have been resolved.

Copy link
Copy Markdown
Contributor

@devin-ai-integration devin-ai-integration Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Devin Review found 1 new potential issue.

View 7 additional findings in Devin Review.

Open in Devin Review

Comment thread clients/shared/DesignSystem/Core/Feedback/VToast.swift Outdated
iOS VoiceOver users now hear severity context (e.g., "error: Something went wrong")
matching the macOS experience. Previously iOS only announced the bare message without
the style prefix.

Addresses Devin review feedback.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@ashleeradka
Copy link
Copy Markdown
Contributor Author

Fixed iOS accessibility in 54c4a92:

VToast.swift - Added style prefix to iOS VoiceOver announcement to match macOS behavior. iOS users now hear "error: Something went wrong" instead of just "Something went wrong", providing severity context.

- Remove redundant `import VellumAssistantShared` from gallery files (cosmetic)
- Add UIFontDescriptor implementation for Stylistic Set 5 on iOS for visual parity with macOS
- Add explicit public init() to HoverEffectModifier and PanelBackgroundModifier for cross-module instantiation

Addresses user review feedback.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@ashleeradka
Copy link
Copy Markdown
Contributor Author

Addressed all user review feedback in fec7e37:

✅ All issues fixed:

  1. iOS VoiceOver missing style prefix - Already fixed in 54c4a92
  2. Gallery files self-importing VellumAssistantShared - Removed redundant imports from all 10 gallery files
  3. iOS dmMono missing Stylistic Set 5 - Added UIFontDescriptor implementation matching macOS for visual parity
  4. VButton cursor behavior change - Acknowledged as intentional UX improvement for consistency
  5. Modifier missing public init() - Added explicit public init() to HoverEffectModifier and PanelBackgroundModifier

All builds passing, ready for approval! 🎉

All other methods (init, show) are public, so close() should be too.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@ashleeradka
Copy link
Copy Markdown
Contributor Author

Fixed minor nit in be1a4d0: Made ComponentGalleryWindow.close() public for API consistency with init() and show().

Copy link
Copy Markdown
Contributor

@devin-ai-integration devin-ai-integration Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Devin Review found 1 new potential issue.

View 12 additional findings in Devin Review.

Open in Devin Review

Comment thread clients/shared/DesignSystem/Tokens/TypographyTokens.swift Outdated
Use correct iOS property names:
- .featureIdentifier (for feature type, not .type)
- .typeIdentifier (for feature selector, not .selector)

The iOS naming is confusing because .typeIdentifier on iOS corresponds to
.selectorIdentifier on macOS. This fix prevents iOS compilation failure.

Addresses Devin review feedback.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@ashleeradka
Copy link
Copy Markdown
Contributor Author

Fixed critical iOS compilation issue in 4672e22:

UIFontDescriptor property names corrected:

  • Changed .type.featureIdentifier (for feature type)
  • Changed .selector.typeIdentifier (for feature selector)

The confusing naming asymmetry between macOS and iOS:

  • macOS: .typeIdentifier = feature type, .selectorIdentifier = feature selector
  • iOS: .featureIdentifier = feature type, .typeIdentifier = feature selector

This would have prevented iOS compilation when targeting the shared library. Thanks Devin for catching this!

Add #else clause to handle unsupported platforms (visionOS, tvOS, watchOS).
Without this, the function would have no return statement on those platforms,
causing a compilation error.

Fallback uses plain Font.custom() without stylistic alternates.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@ashleeradka
Copy link
Copy Markdown
Contributor Author

Addressed user review feedback in e1381a5:

✅ Fixed:

#1 - Missing platform fallback in dmMono() - Added #else clause for visionOS/tvOS/watchOS compatibility

📝 Acknowledged (non-blocking):

#2 - Font resources not bundled in shared target - Will be addressed in PR 4 when iOS app target is created
#3 - VButton cursor hover behavior - Intentional UX improvement for consistency with other buttons
#4 - VToast preview frame - Minor, preview-only (iOS preview canvas sizing)
#5 - Gallery compiled for iOS DEBUG - Harmless dead code, useful for debugging shared components

All critical issues resolved! 🎉

@ashleeradka ashleeradka merged commit a2608e1 into main Feb 14, 2026
@ashleeradka ashleeradka deleted the safe-plan/sharded-mapping-shannon/shared-design-system branch February 14, 2026 18:58
devin-ai-integration Bot added a commit that referenced this pull request Mar 3, 2026
Remove 4 unused files (~297 lines) from clients/shared/:

- NetworkInterfaceResolver.swift (58 lines) — zero references outside file.
  Added in PR #6656 (QR code pairing) but never used.
- HoverEffect.swift (41 lines) — zero references outside file.
  Added in PR #1868 (Extract design system) but never used.
- InlineWidgetCardModifier.swift (114 lines) — zero references outside file.
  Last touched in PR #3473 (platform guard fix).
- VWaveformView.swift (84 lines) — zero references outside file.
  Added in PR #6095 (two-way voice mode) but never used.

Co-Authored-By: ashlee@vellum.ai <ashlee@vellum.ai>
ashleeradka added a commit that referenced this pull request Mar 3, 2026
* chore: remove dead shared library files

Remove 4 unused files (~297 lines) from clients/shared/:

- NetworkInterfaceResolver.swift (58 lines) — zero references outside file.
  Added in PR #6656 (QR code pairing) but never used.
- HoverEffect.swift (41 lines) — zero references outside file.
  Added in PR #1868 (Extract design system) but never used.
- InlineWidgetCardModifier.swift (114 lines) — zero references outside file.
  Last touched in PR #3473 (platform guard fix).
- VWaveformView.swift (84 lines) — zero references outside file.
  Added in PR #6095 (two-way voice mode) but never used.

Co-Authored-By: ashlee@vellum.ai <ashlee@vellum.ai>

* fix: restore InlineWidgetCardModifier and HoverEffect — actively used

InlineWidgetCardModifier is used by ConfirmationSurfaceView.swift:48
(.inlineWidgetCard() call). HoverEffect is used by
ModifiersGallerySection.swift:86 (.vHover() call in DEBUG gallery).

Only NetworkInterfaceResolver and VWaveformView are confirmed dead
in this PR.

Co-Authored-By: ashlee@vellum.ai <ashlee@vellum.ai>

---------

Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Co-authored-by: ashlee@vellum.ai <ashlee@vellum.ai>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant