blob: 9ff8ba838aff6333c9686531ea11155a4dd0aab4 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
|
import SwiftUI
struct MullvadSecondaryTextField: View {
let placeholder: String
@Binding var text: String
var isValid = true
@FocusState private var isFocused: Bool
@Environment(\.isEnabled) private var isEnabled
var body: some View {
HStack(spacing: 4) {
Image.mullvadIconSearch
TextField(
placeholder,
text: $text,
prompt: Text(placeholder)
.foregroundColor(
isEnabled ? .MullvadTextField.inputPlaceholder : .MullvadTextField.textDisabled
)
)
.focused($isFocused)
if !text.isEmpty && isEnabled {
Button {
withAnimation {
text = ""
}
} label: {
Image.mullvadIconCross
}
}
}
.padding(8)
.background(
isEnabled
? Color.MullvadTextField.background
: Color.MullvadTextField
.backgroundDisabled
)
.foregroundColor(isEnabled ? .MullvadTextField.textInput : .MullvadTextField.textDisabled)
.overlay {
if isFocused {
RoundedRectangle(cornerRadius: 12)
.inset(by: 1)
.stroke(
isValid ? Color.MullvadTextField.borderFocused : Color.MullvadTextField.borderError,
lineWidth: 2
)
} else if isEnabled,
!isValid
{
RoundedRectangle(cornerRadius: 12)
.inset(by: 0.5)
.stroke(
Color.MullvadTextField.borderError,
lineWidth: 1
)
}
}
.clipShape(
RoundedRectangle(cornerRadius: 12)
)
}
}
#Preview {
StatefulPreviewWrapper("") { text in
VStack {
MullvadSecondaryTextField(
placeholder: "Placeholder text",
text: text
)
MullvadSecondaryTextField(
placeholder: "Placeholder text",
text: text,
isValid: false
)
MullvadSecondaryTextField(
placeholder: "Placeholder text",
text: text
)
.disabled(true)
}
.padding()
.background(Color.mullvadBackground)
}
}
|
