Update README with complete feature documentation
This commit is contained in:
parent
fa7d848f52
commit
7afa45698f
168
README.md
168
README.md
@ -6,15 +6,27 @@ A foundational design system and UI component library for building consistent, b
|
||||
|
||||
Bedrock is designed to be the foundation upon which apps are built, providing:
|
||||
|
||||
- **Design System**: Consistent spacing, typography, and animations
|
||||
- **Design System**: Consistent spacing, typography, colors, and animations
|
||||
- **Color Protocols**: Define consistent color naming with custom palettes per app
|
||||
- **Settings Components**: Ready-to-use toggle, picker, and selector views
|
||||
- **Utilities**: Common helpers for device detection, debugging, and more
|
||||
- **Sound & Haptics**: Generic sound and haptic feedback management
|
||||
- **Onboarding**: Track user onboarding progress and contextual hints
|
||||
- **Cloud Sync**: Generic iCloud and local data synchronization
|
||||
- **Visual Effects**: Confetti, pulsing animations, debug borders
|
||||
- **Utilities**: Device detection, debugging helpers, and more
|
||||
|
||||
## Installation
|
||||
|
||||
Add Bedrock as a dependency in your `Package.swift`:
|
||||
|
||||
```swift
|
||||
dependencies: [
|
||||
.package(url: "https://github.com/yourname/Bedrock.git", from: "1.0.0")
|
||||
]
|
||||
```
|
||||
|
||||
Or for local development:
|
||||
|
||||
```swift
|
||||
dependencies: [
|
||||
.package(path: "../Bedrock")
|
||||
@ -77,41 +89,120 @@ VStack { }
|
||||
Apps can define custom color palettes by conforming to the color protocols:
|
||||
|
||||
```swift
|
||||
// In CasinoKit - define casino-themed accent colors
|
||||
public enum CasinoAccentColors: AccentColorProvider {
|
||||
public static let primary = Color(red: 0.9, green: 0.75, blue: 0.3) // Gold
|
||||
// Define custom accent colors
|
||||
public enum MyAppAccentColors: AccentColorProvider {
|
||||
public static let primary = Color(red: 0.9, green: 0.75, blue: 0.3)
|
||||
public static let light = Color(red: 1.0, green: 0.85, blue: 0.4)
|
||||
public static let dark = Color(red: 0.7, green: 0.55, blue: 0.2)
|
||||
public static let secondary = Color(red: 0.2, green: 0.7, blue: 0.7) // Teal
|
||||
public static let secondary = Color(red: 0.2, green: 0.7, blue: 0.7)
|
||||
}
|
||||
|
||||
// Create a complete theme
|
||||
public enum CasinoTheme: AppColorTheme {
|
||||
public typealias Surface = CasinoSurfaceColors
|
||||
public typealias Text = DefaultTextColors // Reuse Bedrock defaults
|
||||
public typealias Accent = CasinoAccentColors // Custom gold accents
|
||||
public typealias Button = CasinoButtonColors
|
||||
public typealias Status = DefaultStatusColors // Reuse Bedrock defaults
|
||||
public enum MyAppTheme: AppColorTheme {
|
||||
public typealias Surface = DefaultSurfaceColors // Reuse Bedrock defaults
|
||||
public typealias Text = DefaultTextColors
|
||||
public typealias Accent = MyAppAccentColors // Custom accents
|
||||
public typealias Button = DefaultButtonColors
|
||||
public typealias Status = DefaultStatusColors
|
||||
public typealias Border = DefaultBorderColors
|
||||
public typealias Interactive = DefaultInteractiveColors
|
||||
}
|
||||
|
||||
// Use in views
|
||||
Button("Deal") { }
|
||||
.background(CasinoTheme.Accent.primary)
|
||||
Button("Action") { }
|
||||
.background(MyAppTheme.Accent.primary)
|
||||
```
|
||||
|
||||
#### Available Color Protocols
|
||||
### Sound & Haptic Feedback
|
||||
|
||||
| Protocol | Properties |
|
||||
|----------|------------|
|
||||
| `SurfaceColorProvider` | primary, secondary, tertiary, overlay, card, groupedFill, sectionFill |
|
||||
| `TextColorProvider` | primary, secondary, tertiary, disabled, placeholder, inverse |
|
||||
| `AccentColorProvider` | primary, light, dark, secondary |
|
||||
| `ButtonColorProvider` | primaryLight, primaryDark, secondary, destructive, cancelText |
|
||||
| `StatusColorProvider` | success, warning, error, info |
|
||||
| `BorderColorProvider` | subtle, standard, emphasized, selected |
|
||||
| `InteractiveColorProvider` | selected, hover, pressed, focus |
|
||||
Bedrock provides a generic sound manager that works with any app-defined sounds:
|
||||
|
||||
```swift
|
||||
// Define your app's sounds
|
||||
enum MySound: String, AppSound {
|
||||
case tap, success, error
|
||||
|
||||
var resourceName: String { rawValue }
|
||||
var resourceExtension: String { "mp3" }
|
||||
var bundle: Bundle { .main }
|
||||
var fallbackSystemSoundID: UInt32? { nil }
|
||||
}
|
||||
|
||||
// Play sounds and haptics
|
||||
let soundManager = SoundManager.shared
|
||||
soundManager.play(MySound.success)
|
||||
soundManager.playHaptic(.success)
|
||||
```
|
||||
|
||||
### Onboarding State
|
||||
|
||||
Track user onboarding and progressive feature discovery:
|
||||
|
||||
```swift
|
||||
let onboarding = OnboardingState(appIdentifier: "myApp")
|
||||
|
||||
// Register all hint keys for skip functionality
|
||||
onboarding.registerHintKeys("welcome", "feature1", "feature2")
|
||||
|
||||
// Check and show hints
|
||||
if onboarding.shouldShowHint("welcome") {
|
||||
// Show welcome hint
|
||||
onboarding.markHintShown("welcome")
|
||||
}
|
||||
|
||||
// Skip or complete onboarding
|
||||
onboarding.completeWelcome() // Mark as completed
|
||||
onboarding.skipOnboarding() // Skip all hints
|
||||
```
|
||||
|
||||
### Cloud Sync
|
||||
|
||||
Synchronize data between iCloud and local storage:
|
||||
|
||||
```swift
|
||||
// Define your persistable data
|
||||
struct MyAppData: PersistableData {
|
||||
static var dataIdentifier = "myApp"
|
||||
static var empty = MyAppData()
|
||||
|
||||
var syncPriority: Int { totalActions }
|
||||
var lastModified: Date = .now
|
||||
var totalActions: Int = 0
|
||||
}
|
||||
|
||||
// Use the cloud sync manager
|
||||
let syncManager = CloudSyncManager<MyAppData>()
|
||||
await syncManager.save(myData)
|
||||
let loaded = await syncManager.load()
|
||||
```
|
||||
|
||||
### Visual Effects
|
||||
|
||||
#### Confetti
|
||||
|
||||
```swift
|
||||
ZStack {
|
||||
MainContentView()
|
||||
|
||||
if showCelebration {
|
||||
ConfettiView(colors: [.red, .blue, .green, .yellow])
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### Pulsing Animation
|
||||
|
||||
```swift
|
||||
Button("Tap Here") { }
|
||||
.pulsing(isActive: shouldHighlight, color: .white)
|
||||
```
|
||||
|
||||
#### Debug Borders
|
||||
|
||||
```swift
|
||||
MyComplexView()
|
||||
.debugBorder(showDebug, color: .red, label: "Header")
|
||||
```
|
||||
|
||||
### Settings Components
|
||||
|
||||
@ -155,6 +246,9 @@ if DeviceInfo.isPad {
|
||||
} else {
|
||||
TabBarView()
|
||||
}
|
||||
|
||||
let bounds = DeviceInfo.screenBounds
|
||||
let isLandscape = DeviceInfo.isLandscape
|
||||
```
|
||||
|
||||
## Design System Reference
|
||||
@ -186,22 +280,24 @@ if DeviceInfo.isPad {
|
||||
| `heavy` | 0.8 | Heavy overlays |
|
||||
| `almostFull` | 0.9 | Nearly opaque |
|
||||
|
||||
### Default Colors
|
||||
### Color Protocols
|
||||
|
||||
Default colors use a neutral blue accent. Apps should define custom themes for branding:
|
||||
|
||||
| Category | Purpose |
|
||||
|----------|---------|
|
||||
| `Color.Surface.*` | Background colors |
|
||||
| `Color.Text.*` | Text colors |
|
||||
| `Color.Accent.*` | Accent/highlight colors (default: blue) |
|
||||
| `Color.Button.*` | Button colors |
|
||||
| `Color.Status.*` | Success/warning/error colors |
|
||||
| `Color.Border.*` | Border and divider colors |
|
||||
| `Color.Interactive.*` | Interactive state colors |
|
||||
| Protocol | Properties |
|
||||
|----------|------------|
|
||||
| `SurfaceColorProvider` | primary, secondary, tertiary, overlay, card, groupedFill, sectionFill |
|
||||
| `TextColorProvider` | primary, secondary, tertiary, disabled, placeholder, inverse |
|
||||
| `AccentColorProvider` | primary, light, dark, secondary |
|
||||
| `ButtonColorProvider` | primaryLight, primaryDark, secondary, destructive, cancelText |
|
||||
| `StatusColorProvider` | success, warning, error, info |
|
||||
| `BorderColorProvider` | subtle, standard, emphasized, selected |
|
||||
| `InteractiveColorProvider` | selected, hover, pressed, focus |
|
||||
|
||||
## Requirements
|
||||
|
||||
- iOS 18.0+
|
||||
- macOS 15.0+
|
||||
- Swift 6.0+
|
||||
|
||||
## License
|
||||
|
||||
MIT License
|
||||
|
||||
Loading…
Reference in New Issue
Block a user