@@ -102,7 +102,61 @@ public struct AsyncCodeBlock: View {
102
102
return " Hold ⌥ for full suggestion "
103
103
}
104
104
105
- @ScaledMetric var ellipsisPadding : CGFloat = 5
105
+
106
+ @ScaledMetric var keyPadding : Double = 3.0
107
+
108
+ @ViewBuilder
109
+ func keyBackground( content: ( ) -> some View ) -> some View {
110
+ content ( )
111
+ . padding ( . horizontal, keyPadding)
112
+ . background (
113
+ RoundedRectangle ( cornerRadius: 2 )
114
+ . stroke ( foregroundColor, lineWidth: 1 )
115
+ . foregroundColor ( . clear)
116
+ . frame (
117
+ minWidth: fontHeight,
118
+ minHeight: fontHeight,
119
+ maxHeight: fontHeight
120
+ )
121
+ )
122
+ }
123
+
124
+ @ViewBuilder
125
+ var optionKey : some View {
126
+ keyBackground {
127
+ Image ( systemName: " option " )
128
+ . resizable ( )
129
+ . renderingMode ( . template)
130
+ . scaledToFit ( )
131
+ . frame ( height: font. capHeight)
132
+ }
133
+ }
134
+
135
+ @ViewBuilder
136
+ var popoverContent : some View {
137
+ HStack {
138
+ if isExpanded {
139
+ Text ( " Press " )
140
+ optionKey
141
+ keyBackground {
142
+ Text ( " tab " )
143
+ . font ( . init( font) )
144
+ }
145
+ Text ( " to accept full suggestion " )
146
+ } else {
147
+ Text ( " Hold " )
148
+ optionKey
149
+ Text ( " for full suggestion " )
150
+ }
151
+ }
152
+ . padding ( 8 )
153
+ . font ( . body)
154
+ . fixedSize ( )
155
+ }
156
+
157
+ @ScaledMetric var iconPadding : CGFloat = 9.0
158
+ @ScaledMetric var iconSpacing : CGFloat = 6.0
159
+ @ScaledMetric var optionPadding : CGFloat = 0.5
106
160
107
161
@ViewBuilder
108
162
var contentView : some View {
@@ -116,30 +170,39 @@ public struct AsyncCodeBlock: View {
116
170
. foregroundColor ( foregroundTextColor)
117
171
. lineSpacing ( lineSpacing) // This only has effect if a line wraps
118
172
if lines. count > 1 {
119
- Image ( systemName: " ellipsis " )
120
- . renderingMode ( . template)
121
- . foregroundColor ( foregroundTextColor)
122
- . padding ( . horizontal, ellipsisPadding)
123
- . background (
124
- RoundedRectangle ( cornerRadius: 12 )
125
- . fill ( Color . gray. opacity ( isExpanded ? 0.1 : 0.4 ) )
126
- . frame ( height: fontHeight * 0.75 )
127
- )
128
- . popover ( isPresented: $isHovering) {
129
- Text ( hintText)
130
- . font ( . body)
131
- . padding ( 8 )
132
- . fixedSize ( )
133
- }
134
- . task {
135
- isHovering = !completionHintShown
136
- completionHintShown = true
137
- }
173
+ HStack ( spacing: iconSpacing) {
174
+ Image ( " CopilotLogo " )
175
+ . resizable ( )
176
+ . renderingMode ( . template)
177
+ . scaledToFit ( )
178
+ Image ( systemName: " option " )
179
+ . resizable ( )
180
+ . renderingMode ( . template)
181
+ . scaledToFit ( )
182
+ . padding ( . vertical, optionPadding)
183
+ }
184
+ . frame ( height: lineHeight * 0.7 )
185
+ . padding ( . horizontal, iconPadding)
186
+ . background (
187
+ Capsule ( )
188
+ . fill ( foregroundColor. opacity ( isExpanded ? 0.1 : 0.2 ) )
189
+ . frame ( height: lineHeight)
190
+ )
191
+ . frame ( height: lineHeight) // Moves popover attachment
192
+ . popover ( isPresented: $isHovering) {
193
+ popoverContent
194
+ }
195
+ . task {
196
+ isHovering = !completionHintShown
197
+ completionHintShown = true
198
+ }
138
199
}
139
200
}
140
- . background ( currentLineBackgroundColor ?? backgroundColor)
201
+ . frame ( height: lineHeight)
202
+ . background (
203
+ HalfCapsule ( ) . fill ( currentLineBackgroundColor ?? backgroundColor)
204
+ )
141
205
. padding ( . leading, firstLineIndent)
142
- . frame ( minHeight: lineHeight)
143
206
. onHover { hovering in
144
207
guard hovering != isHovering else { return }
145
208
withAnimation {
0 commit comments