Skip to content

Commit c733d4a

Browse files
amirsaamamirsaam
committed
Various Changes
- Added: Radio ToggleGroup - Added: Checkbox and Switch Toggle Variants - Fixed Some Issues + Code Cleanup -
1 parent 48654cc commit c733d4a

File tree

9 files changed

+344
-181
lines changed

9 files changed

+344
-181
lines changed

‎Sources/RadixUI/DemoViews/ToggleDemoView.swift‎

Lines changed: 30 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,12 @@
77

88
import SwiftUI
99

10+
struct Option: Identifiable, Equatable {
11+
let id = UUID()
12+
let title: LocalizedStringKey
13+
}
14+
15+
1016
struct ToggleDemoView: View {
1117

1218
@State private var checkbox = false
@@ -16,8 +22,23 @@ struct ToggleDemoView: View {
1622

1723
private var radixColor = RadixAutoColor.self
1824

25+
@State private var selectedOption: Option? = nil
26+
private let options = [
27+
Option(title: "Option 1"),
28+
Option(title: "Option 2"),
29+
Option(title: "Option 3")
30+
]
31+
1932
var body: some View {
2033
VStack(alignment: .leading, spacing: 25) {
34+
RadixRadioGroup(
35+
options: options,
36+
selected: $selectedOption,
37+
style: (variant: .surface, layout: .trailing, color: .grass)
38+
) {
39+
Text($0.title)
40+
.foregroundStyle(radixColor.grass.text2)
41+
}
2142
HStack {
2243
Text("Label Text")
2344
.foregroundStyle(radixColor.grass.text2)
@@ -31,8 +52,8 @@ struct ToggleDemoView: View {
3152
}
3253
.toggleStyle(
3354
.radixCheckbox(
34-
bgColor: .grass,
35-
iconColor: .whiteA
55+
variant: .surface,
56+
color: .grass
3657
)
3758
)
3859
}
@@ -42,9 +63,9 @@ struct ToggleDemoView: View {
4263
}
4364
.toggleStyle(
4465
.radixSwitch(
45-
style: (variant: .surface, radius: .full),
46-
onColor: .grass,
47-
thumbColor: .whiteA
66+
variant: .surface,
67+
radius: .full,
68+
color: .grass
4869
)
4970
)
5071
Toggle(isOn: $switchSoft) {
@@ -53,9 +74,9 @@ struct ToggleDemoView: View {
5374
}
5475
.toggleStyle(
5576
.radixSwitch(
56-
style: (variant: .soft, radius: .full),
57-
onColor: .grass,
58-
thumbColor: .whiteA
77+
variant: .soft,
78+
radius: .full,
79+
color: .grass
5980
)
6081
)
6182
HStack {
@@ -72,8 +93,7 @@ struct ToggleDemoView: View {
7293
}
7394
.toggleStyle(
7495
.radixToggle(
75-
bgColor: .grass,
76-
iconColor: .whiteA
96+
color: .grass
7797
)
7898
)
7999
}

‎Sources/RadixUI/Helpers/Enums.swift‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -77,9 +77,13 @@ public enum RadixTextFieldVariant {
7777

7878
// MARK: - Enums used in ToggleStyle
7979
public enum RadixToggleType {
80-
case checkbox, `switch`, toggle
80+
case checkbox, radio, `switch`, toggle
8181
}
8282

83-
public enum RadixSwitchVariant {
83+
public enum RadixToggleVariant {
8484
case surface, soft
8585
}
86+
87+
public enum RadixToggleLayout {
88+
case leading, trailing
89+
}

‎Sources/RadixUI/Helpers/Extensions/Toggle+Extensions.swift‎

Lines changed: 33 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -10,46 +10,60 @@ import SwiftUI
1010
extension ToggleStyle where Self == RadixToggleStyle {
1111

1212
public static func radixCheckbox(
13-
bgColor: RadixAutoColor? = nil,
14-
iconColor: RadixAutoColor? = nil,
13+
variant: RadixToggleVariant,
14+
color: RadixAutoColor? = nil,
1515
boxSize: CGFloat? = nil
1616
) -> Self {
1717
.init(
1818
type: .checkbox,
19-
switchStyle: nil,
20-
backgroundColor: bgColor,
21-
foregroundColor: iconColor,
19+
variant: variant,
20+
layout: .leading,
21+
radius: .large,
22+
color: color,
2223
size: boxSize
2324
)
2425
}
2526

27+
public static func radixRadio(
28+
variant: RadixToggleVariant,
29+
layout: RadixToggleLayout,
30+
color: RadixAutoColor?
31+
) -> Self {
32+
.init(
33+
type: .radio,
34+
variant: variant,
35+
layout: layout,
36+
radius: .full,
37+
color: color,
38+
size: nil
39+
)
40+
}
41+
2642
public static func radixSwitch(
27-
style: (
28-
variant: RadixSwitchVariant,
29-
radius: RadixElementShapeRadius
30-
),
31-
onColor: RadixAutoColor? = nil,
32-
thumbColor: RadixAutoColor? = nil
43+
variant: RadixToggleVariant,
44+
radius: RadixElementShapeRadius,
45+
color: RadixAutoColor? = nil
3346
) -> Self {
3447
.init(
3548
type: .switch,
36-
switchStyle: style,
37-
backgroundColor: onColor,
38-
foregroundColor: thumbColor,
49+
variant: variant,
50+
layout: .leading,
51+
radius: radius,
52+
color: color,
3953
size: nil
4054
)
4155
}
4256

4357
public static func radixToggle(
44-
bgColor: RadixAutoColor? = nil,
45-
iconColor: RadixAutoColor? = nil,
58+
color: RadixAutoColor? = nil,
4659
boxSize: CGFloat? = nil
4760
) -> Self {
4861
.init(
4962
type: .toggle,
50-
switchStyle: nil,
51-
backgroundColor: bgColor,
52-
foregroundColor: iconColor,
63+
variant: .soft,
64+
layout: .leading,
65+
radius: .large,
66+
color: color,
5367
size: boxSize
5468
)
5569
}

‎Sources/RadixUI/RadixDesign/Button/RadixButtonStyle.swift‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ public struct RadixButtonStyle: ButtonStyle {
2929
self.color = color
3030
}
3131

32-
private var newColor: RadixAutoColor {
32+
private var unwrappedColor: RadixAutoColor {
3333
guard let color else { return .blue }
3434
return color
3535
}
@@ -51,7 +51,7 @@ public struct RadixButtonStyle: ButtonStyle {
5151
isLoading: isLoading,
5252
isPressed: configuration.isPressed,
5353
isEnabled: isEnabled,
54-
color: newColor,
54+
color: unwrappedColor,
5555
layout: layout,
5656
radius: radius,
5757
variant: variant

‎Sources/RadixUI/RadixDesign/Slider/RadixSliderStyle.swift‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ public struct RadixSliderStyle: RxSliderStyle {
5252
trackFill(
5353
percentage: configuration.filledPercentage,
5454
height: trackSize,
55-
color: newColor.border2
55+
color: unwrappedColor.border2
5656
)
5757
case .surface:
5858
trackBase(
@@ -63,7 +63,7 @@ public struct RadixSliderStyle: RxSliderStyle {
6363
trackFill(
6464
percentage: configuration.filledPercentage,
6565
height: trackSize,
66-
color: newColor.solid2
66+
color: unwrappedColor.solid2
6767
)
6868
}
6969
}
@@ -75,33 +75,33 @@ public struct RadixSliderStyle: RxSliderStyle {
7575
// MARK: - Computed Variables
7676
extension RadixSliderStyle {
7777

78-
private var newColor: RadixAutoColor {
78+
private var unwrappedColor: RadixAutoColor {
7979
guard let color else { return .blue }
8080
return color
8181
}
8282

83-
private var newSize: RadixSliderSize {
83+
private var unwrappedSize: RadixSliderSize {
8484
guard let size else { return .medium }
8585
return size
8686
}
8787

8888
private var trackSize: CGFloat {
89-
switch newSize {
89+
switch unwrappedSize {
9090
case .small: 6
9191
case .medium: 8
9292
case .large: 10
9393
}
9494
}
9595

9696
private var roundedRectangleRadius: CGFloat {
97-
switch newSize {
97+
switch unwrappedSize {
9898
case .small: 1
9999
case .medium: 2
100100
case .large: 3
101101
}
102102
}
103103
private var thumbSize: CGSize {
104-
switch newSize {
104+
switch unwrappedSize {
105105
case .small: .init(width: 12, height: 12)
106106
case .medium: .init(width: 16, height: 16)
107107
case .large: .init(width: 20, height: 20)

‎Sources/RadixUI/RadixDesign/TextField/RadixTextFieldStyle.swift‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -47,18 +47,18 @@ public struct RadixTextFieldStyle: TextFieldStyle {
4747
if isLoading.wrappedValue {
4848
ProgressView()
4949
.progressViewStyle(.circular)
50-
.tint(isFocused ? newColor.solid1 : newColor.border2)
50+
.tint(isFocused ? unwrappedColor.solid1 : unwrappedColor.border2)
5151
.controlSize(.regular)
5252
} else {
5353
iconLabel
5454
.resizable()
5555
.aspectRatio(contentMode: .fit)
5656
.frame(width: iconSize, height: iconSize)
57-
.foregroundStyle(isFocused ? newColor.solid1 : newColor.border2)
57+
.foregroundStyle(isFocused ? unwrappedColor.solid1 : unwrappedColor.border2)
5858
}
5959
}
6060
configuration
61-
.foregroundStyle(newColor.text2)
61+
.foregroundStyle(unwrappedColor.text2)
6262
if let action {
6363
Spacer()
6464
Button(action: action) {
@@ -137,7 +137,7 @@ public struct RadixTextFieldStyle: TextFieldStyle {
137137

138138
extension RadixTextFieldStyle {
139139

140-
private var newColor: RadixAutoColor {
140+
private var unwrappedColor: RadixAutoColor {
141141
guard let color else { return .blue }
142142
return color
143143
}
@@ -147,13 +147,13 @@ extension RadixTextFieldStyle {
147147
// 1st Entry is Fill and 2nd is Stroke Colors
148148
case .soft:
149149
[
150-
newColor.component1,
151-
isFocused ? newColor.solid1 : newColor.border2
150+
unwrappedColor.component1,
151+
isFocused ? unwrappedColor.solid1 : unwrappedColor.border2
152152
]
153153
case .surface:
154154
[
155155
.clear,
156-
isFocused ? newColor.solid1 : newColor.border2
156+
isFocused ? unwrappedColor.solid1 : unwrappedColor.border2
157157
]
158158
}
159159
}
@@ -165,14 +165,14 @@ extension RadixTextFieldStyle {
165165
variant: .solid,
166166
layout: .icon,
167167
radius: radius,
168-
color: newColor
168+
color: unwrappedColor
169169
)
170170
case .surface:
171171
return RadixButtonStyle(
172172
variant: .soft,
173173
layout: .icon,
174174
radius: radius,
175-
color: newColor
175+
color: unwrappedColor
176176
)
177177
}
178178
}

0 commit comments

Comments
 (0)