CoCalc -- indentationStructure.spec.ts

GitHub Repository: microsoft/vscode
Path: blob/main/extensions/copilot/src/platform/parser/test/node/indentationStructure.spec.ts
¹³⁴⁰⁵ views
1
/*---------------------------------------------------------------------------------------------
2
 *  Copyright (c) Microsoft Corporation. All rights reserved.
3
 *  Licensed under the MIT License. See License.txt in the project root for license information.
4
 *--------------------------------------------------------------------------------------------*/
5

6
import { outdent } from 'outdent';
7
import { afterAll, describe, expect, test } from 'vitest';
8
import type * as vscode from 'vscode';
9
import { StringTextDocument } from '../../../editing/common/abstractText';
10
import { getStructureUsingIndentation } from '../../node/indentationStructure';
11
import { OverlayNode } from '../../node/nodes';
12
import { _dispose } from '../../node/parserImpl';
13
import { insertRangeMarkers } from './markers';
14

15
describe('getStructure', () => {
16
	afterAll(() => _dispose());
17

18
	function treeToFlatList(
19
		node: OverlayNode
20
	): { startIndex: number; endIndex: number; kind: string }[] {
21
		const result: { startIndex: number; endIndex: number; kind: string }[] =
22
			[];
23
		for (const child of node.children) {
24
			result.push({
25
				startIndex: child.startIndex,
26
				endIndex: child.endIndex,
27
				kind: child.kind.toUpperCase(),
28
			});
29
			result.push(...treeToFlatList(child));
30
		}
31
		return result;
32
	}
33

34
	async function srcWithAnnotatedStructure(
35
		source: string,
36
		languageId: string,
37
		formattingOptions: vscode.FormattingOptions
38
	) {
39
		const structure = await getStructureUsingIndentation(
40
			new StringTextDocument(source),
41
			languageId,
42
			formattingOptions
43
		);
44
		const flatList = structure ? treeToFlatList(structure) : [];
45
		return insertRangeMarkers(source, flatList);
46
	}
47

48
	describe('indentation structure', () => {
49
		test('csharp file', async () => {
50
			const source = outdent`
51
				using System.Collections.Generic;
52
				using System.Threading.Tasks;
53
				using Ardalis.GuardClauses;
54
				using Ardalis.Result;
55
				using Microsoft.eShopWeb.ApplicationCore.Entities.BasketAggregate;
56
				using Microsoft.eShopWeb.ApplicationCore.Interfaces;
57
				using Microsoft.eShopWeb.ApplicationCore.Specifications;
58

59
				namespace Microsoft.eShopWeb.ApplicationCore.Services;
60

61
				public class BasketService : IBasketService
62
				{
63
					private readonly IRepository<Basket> _basketRepository;
64
					private readonly IAppLogger<BasketService> _logger;
65

66
					public BasketService(IRepository<Basket> basketRepository,
67
						IAppLogger<BasketService> logger)
68
					{
69
						_basketRepository = basketRepository;
70
						_logger = logger;
71
					}
72

73
					public async Task<Basket> AddItemToBasket(string username, int catalogItemId, decimal price, int quantity = 1)
74
					{
75
						var basketSpec = new BasketWithItemsSpecification(username);
76
						var basket = await _basketRepository.FirstOrDefaultAsync(basketSpec);
77

78
						if (basket == null)
79
						{
80
							basket = new Basket(username);
81
							await _basketRepository.AddAsync(basket);
82
						}
83

84
						basket.AddItem(catalogItemId, price, quantity);
85

86
						await _basketRepository.UpdateAsync(basket);
87
						return basket;
88
					}
89

90
					public async Task DeleteBasketAsync(int basketId)
91
					{
92
						var basket = await _basketRepository.GetByIdAsync(basketId);
93
						Guard.Against.Null(basket, nameof(basket));
94
						await _basketRepository.DeleteAsync(basket);
95
					}
96

97
					public async Task<Result<Basket>> SetQuantities(int basketId, Dictionary<string, int> quantities)
98
					{
99
						var basketSpec = new BasketWithItemsSpecification(basketId);
100
						var basket = await _basketRepository.FirstOrDefaultAsync(basketSpec);
101

102
						foreach (var item in basket.Items)
103
						{
104
							if (quantities.TryGetValue(item.Id.ToString(), out var quantity))
105
							{
106
								_logger.LogInformation($"Updating quantity of item ID:{item.Id} to {quantity}.");
107
								item.SetQuantity(quantity);
108
							}
109
						}
110
						basket.RemoveEmptyItems();
111
						await _basketRepository.UpdateAsync(basket);
112
						return basket;
113
					}
114

115
					public async Task TransferBasketAsync(string anonymousId, string userName)
116
					{
117
						var anonymousBasketSpec = new BasketWithItemsSpecification(anonymousId);
118
						var anonymousBasket = await _basketRepository.FirstOrDefaultAsync(anonymousBasketSpec);
119
						if (anonymousBasket == null) return;
120
						var userBasketSpec = new BasketWithItemsSpecification(userName);
121
						var userBasket = await _basketRepository.FirstOrDefaultAsync(userBasketSpec);
122
						if (userBasket == null)
123
						{
124
							userBasket = new Basket(userName);
125
							await _basketRepository.AddAsync(userBasket);
126
						}
127
						foreach (var item in anonymousBasket.Items)
128
						{
129
							userBasket.AddItem(item.CatalogItemId, item.UnitPrice, item.Quantity);
130
						}
131
						await _basketRepository.UpdateAsync(userBasket);
132
						await _basketRepository.DeleteAsync(anonymousBasket);
133
					}
134
				}
135
				`;
136
			expect(
137
				await srcWithAnnotatedStructure(source, 'csharp', {
138
					tabSize: 4,
139
					insertSpaces: false,
140
				})
141
			).toMatchInlineSnapshot(`
142
				"<LINE>using System.Collections.Generic;
143
				</LINE><LINE-1>using System.Threading.Tasks;
144
				</LINE-1><LINE-2>using Ardalis.GuardClauses;
145
				</LINE-2><LINE-3>using Ardalis.Result;
146
				</LINE-3><LINE-4>using Microsoft.eShopWeb.ApplicationCore.Entities.BasketAggregate;
147
				</LINE-4><LINE-5>using Microsoft.eShopWeb.ApplicationCore.Interfaces;
148
				</LINE-5><LINE-6>using Microsoft.eShopWeb.ApplicationCore.Specifications;
149
				</LINE-6><LINE-7>
150
				</LINE-7><LINE-8>namespace Microsoft.eShopWeb.ApplicationCore.Services;
151
				</LINE-8><LINE-9>
152
				</LINE-9><LINE-10>public class BasketService : IBasketService
153
				</LINE-10><FOLD>{
154
				<LINE-11>	private readonly IRepository<Basket> _basketRepository;
155
				</LINE-11><LINE-12>	private readonly IAppLogger<BasketService> _logger;
156
				</LINE-12><LINE-13>
157
				</LINE-13><FOLD-1>	public BasketService(IRepository<Basket> basketRepository,
158
						IAppLogger<BasketService> logger)
159
				</FOLD-1><FOLD-2>	{
160
				<LINE-14>		_basketRepository = basketRepository;
161
				</LINE-14><LINE-15>		_logger = logger;
162
				</LINE-15>	}
163
				</FOLD-2><LINE-16>
164
				</LINE-16><LINE-17>	public async Task<Basket> AddItemToBasket(string username, int catalogItemId, decimal price, int quantity = 1)
165
				</LINE-17><FOLD-3>	{
166
				<LINE-18>		var basketSpec = new BasketWithItemsSpecification(username);
167
				</LINE-18><LINE-19>		var basket = await _basketRepository.FirstOrDefaultAsync(basketSpec);
168
				</LINE-19><LINE-20>
169
				</LINE-20><LINE-21>		if (basket == null)
170
				</LINE-21><FOLD-4>		{
171
				<LINE-22>			basket = new Basket(username);
172
				</LINE-22><LINE-23>			await _basketRepository.AddAsync(basket);
173
				</LINE-23>		}
174
				</FOLD-4><LINE-24>
175
				</LINE-24><LINE-25>		basket.AddItem(catalogItemId, price, quantity);
176
				</LINE-25><LINE-26>
177
				</LINE-26><LINE-27>		await _basketRepository.UpdateAsync(basket);
178
				</LINE-27><LINE-28>		return basket;
179
				</LINE-28>	}
180
				</FOLD-3><LINE-29>
181
				</LINE-29><LINE-30>	public async Task DeleteBasketAsync(int basketId)
182
				</LINE-30><FOLD-5>	{
183
				<LINE-31>		var basket = await _basketRepository.GetByIdAsync(basketId);
184
				</LINE-31><LINE-32>		Guard.Against.Null(basket, nameof(basket));
185
				</LINE-32><LINE-33>		await _basketRepository.DeleteAsync(basket);
186
				</LINE-33>	}
187
				</FOLD-5><LINE-34>
188
				</LINE-34><LINE-35>	public async Task<Result<Basket>> SetQuantities(int basketId, Dictionary<string, int> quantities)
189
				</LINE-35><FOLD-6>	{
190
				<LINE-36>		var basketSpec = new BasketWithItemsSpecification(basketId);
191
				</LINE-36><LINE-37>		var basket = await _basketRepository.FirstOrDefaultAsync(basketSpec);
192
				</LINE-37><LINE-38>
193
				</LINE-38><LINE-39>		foreach (var item in basket.Items)
194
				</LINE-39><FOLD-7>		{
195
				<LINE-40>			if (quantities.TryGetValue(item.Id.ToString(), out var quantity))
196
				</LINE-40><FOLD-8>			{
197
				<LINE-41>				_logger.LogInformation($"Updating quantity of item ID:{item.Id} to {quantity}.");
198
				</LINE-41><LINE-42>				item.SetQuantity(quantity);
199
				</LINE-42>			}
200
				</FOLD-8>		}
201
				</FOLD-7><LINE-43>		basket.RemoveEmptyItems();
202
				</LINE-43><LINE-44>		await _basketRepository.UpdateAsync(basket);
203
				</LINE-44><LINE-45>		return basket;
204
				</LINE-45>	}
205
				</FOLD-6><LINE-46>
206
				</LINE-46><LINE-47>	public async Task TransferBasketAsync(string anonymousId, string userName)
207
				</LINE-47><FOLD-9>	{
208
				<LINE-48>		var anonymousBasketSpec = new BasketWithItemsSpecification(anonymousId);
209
				</LINE-48><LINE-49>		var anonymousBasket = await _basketRepository.FirstOrDefaultAsync(anonymousBasketSpec);
210
				</LINE-49><LINE-50>		if (anonymousBasket == null) return;
211
				</LINE-50><LINE-51>		var userBasketSpec = new BasketWithItemsSpecification(userName);
212
				</LINE-51><LINE-52>		var userBasket = await _basketRepository.FirstOrDefaultAsync(userBasketSpec);
213
				</LINE-52><LINE-53>		if (userBasket == null)
214
				</LINE-53><FOLD-10>		{
215
				<LINE-54>			userBasket = new Basket(userName);
216
				</LINE-54><LINE-55>			await _basketRepository.AddAsync(userBasket);
217
				</LINE-55>		}
218
				</FOLD-10><LINE-56>		foreach (var item in anonymousBasket.Items)
219
				</LINE-56><FOLD-11>		{
220
				<LINE-57>			userBasket.AddItem(item.CatalogItemId, item.UnitPrice, item.Quantity);
221
				</LINE-57>		}
222
				</FOLD-11><LINE-58>		await _basketRepository.UpdateAsync(userBasket);
223
				</LINE-58><LINE-59>		await _basketRepository.DeleteAsync(anonymousBasket);
224
				</LINE-59>	}
225
				</FOLD-9>}</FOLD>"
226
			`);
227
		});
228

229
		test('issue #1034', async () => {
230
			const source = outdent`
231
				if(something) {
232
					console.log('something')
233
				} else {
234
					console.log('!something');
235
				}
236
					console.log('a line');
237
				`;
238
			expect(
239
				await srcWithAnnotatedStructure(source, 'plaintext', {
240
					tabSize: 4,
241
					insertSpaces: false,
242
				})
243
			).toMatchInlineSnapshot(`
244
				"<FOLD>if(something) {
245
					console.log('something')
246
				</FOLD><FOLD-1>} else {
247
					console.log('!something');
248
				</FOLD-1><FOLD-2>}
249
					console.log('a line');</FOLD-2>"
250
			`);
251
		});
252

253
		test('issue #6614', async () => {
254
			const source = outdent`
255
				<!-- Copyright (C) Microsoft Corporation. All rights reserved. -->
256
				<!DOCTYPE html>
257
				<html>
258
					<head>
259
						<meta charset="utf-8" />
260
					</head>
261

262
					<body aria-label="">
263
					</body>
264

265
					<!-- Startup (do not modify order of script tags!) -->
266
					<script src="../../../../bootstrap.js"></script>
267
					<script src="../../../../vs/loader.js"></script>
268
					<script src="../../../../bootstrap-window.js"></script>
269
					<script src="workbench.js"></script>
270
				</html>
271
				`;
272
			expect(
273
				await srcWithAnnotatedStructure(source, 'plaintext', {
274
					tabSize: 4,
275
					insertSpaces: false,
276
				})
277
			).toMatchInlineSnapshot(`
278
				"<LINE><!-- Copyright (C) Microsoft Corporation. All rights reserved. -->
279
				</LINE><LINE-1><!DOCTYPE html>
280
				</LINE-1><FOLD><html>
281
				<FOLD-1>	<head>
282
				<LINE-2>		<meta charset="utf-8" />
283
				</LINE-2>	</head>
284
				</FOLD-1><LINE-3>
285
				</LINE-3><LINE-4>	<body aria-label="">
286
				</LINE-4><LINE-5>	</body>
287
				</LINE-5><LINE-6>
288
				</LINE-6><LINE-7>	<!-- Startup (do not modify order of script tags!) -->
289
				</LINE-7><LINE-8>	<script src="../../../../bootstrap.js"></script>
290
				</LINE-8><LINE-9>	<script src="../../../../vs/loader.js"></script>
291
				</LINE-9><LINE-10>	<script src="../../../../bootstrap-window.js"></script>
292
				</LINE-10><LINE-11>	<script src="workbench.js"></script>
293
				</LINE-11></html></FOLD>"
294
			`);
295
		});
296

297
		test('issue #12306', async () => {
298
			const source = outdent`
299
				/*---------------------------------------------------------------------------------------------
300
				*  Copyright (c) Microsoft Corporation. All rights reserved.
301
				*  Licensed under the MIT License. See License.txt in the project root for license information.
302
				*--------------------------------------------------------------------------------------------*/
303

304
				/*
305
					@keyframes blink { 50% { border-color: orange; }  }
306
				*/
307

308
				.monaco-editor {
309
					.inline-edits-view-indicator {
310
						display: flex;
311

312
						z-index: 34; /* Below the find widget */
313
						height: 20px;
314

315
						color: var(--vscode-inlineEdit-indicator-foreground);
316
						background-color: var(--vscode-inlineEdit-indicator-background);
317
						border: 1px solid var(--vscode-inlineEdit-indicator-border);
318
						border-radius: 3px;
319

320
						align-items: center;
321
						padding: 2px;
322
						padding-right: 10px;
323
						margin: 0 4px;
324

325
						/*
326
						animation: blink 1s;
327
						animation-iteration-count: 3;
328
						*/
329

330
						opacity: 0;
331

332
						&.contained {
333
							transition: opacity 0.2s ease-in-out;
334
							transition-delay: 0.4s;
335
						}
336

337
						&.visible {
338
							opacity: 1;
339
						}
340

341
						&.top {
342
							opacity: 1;
343

344
							.icon {
345
								transform: rotate(90deg);
346
							}
347
						}
348

349
						&.bottom {
350
							opacity: 1;
351

352
							.icon {
353
								transform: rotate(-90deg);
354
							}
355
						}
356

357
						.icon {
358
							display: flex;
359
							align-items: center;
360
							margin: 0 2px;
361
							transform: none;
362
							transition: transform 0.2s ease-in-out;
363
							.codicon {
364
								color: var(--vscode-inlineEdit-indicator-foreground);
365
							}
366
						}
367

368
						.label {
369
							margin: 0 2px;
370

371
							display: flex;
372
							justify-content: center;
373
							width: 100%;
374
						}
375
					}
376

377
					.inline-edits-view {
378
						&.toolbarDropdownVisible, .editorContainer.showHover:hover {
379
							.toolbar {
380
								display: block;
381
							}
382
						}
383

384
						.editorContainer {
385
							color: var(--vscode-editorHoverWidget-foreground);
386

387
							.toolbar {
388
								display: none;
389
								border-top: 1px solid rgba(69, 69, 69, 0.5);
390
								background-color: var(--vscode-editorHoverWidget-statusBarBackground);
391

392
								a {
393
									color: var(--vscode-foreground);
394
								}
395

396
								a:hover {
397
									color: var(--vscode-foreground);
398
								}
399

400
								.keybinding {
401
									display: flex;
402
									margin-left: 4px;
403
									opacity: 0.6;
404
								}
405

406
								.keybinding .monaco-keybinding-key {
407
									font-size: 8px;
408
									padding: 2px 3px;
409
								}
410

411
								.availableSuggestionCount a {
412
									display: flex;
413
									min-width: 19px;
414
									justify-content: center;
415
								}
416

417
								.inlineSuggestionStatusBarItemLabel {
418
									margin-right: 2px;
419
								}
420

421
							}
422

423
							.preview {
424
								.monaco-editor {
425
									.view-overlays .current-line-exact {
426
										border: none;
427
									}
428

429
									.current-line-margin {
430
										border: none;
431
									}
432
								}
433
							}
434

435
							.inline-edits-view-zone.diagonal-fill {
436
								opacity: 0.5;
437
							}
438
						}
439
					}
440

441
					.strike-through {
442
						text-decoration: line-through;
443
					}
444

445
					.inlineCompletions-line-insert {
446
						background: var(--vscode-inlineEdit-modifiedChangedLineBackground);
447
					}
448

449
					.inlineCompletions-line-delete {
450
						background: var(--vscode-inlineEdit-originalChangedLineBackground);
451
					}
452

453
					.inlineCompletions-char-insert {
454
						background: var(--vscode-inlineEdit-modifiedChangedTextBackground);
455
					}
456

457
					.inlineCompletions-char-delete {
458
						background: var(--vscode-inlineEdit-originalChangedTextBackground);
459
					}
460

461
					.inlineCompletions-char-delete.diff-range-empty {
462
						margin-left: -1px;
463
						border-left: solid var(--vscode-inlineEdit-originalChangedTextBackground) 3px;
464
					}
465

466
					.inlineCompletions-char-insert.diff-range-empty {
467
						border-left: solid var(--vscode-inlineEdit-modifiedChangedTextBackground) 3px;
468
					}
469

470
					.inlineCompletions-char-delete.single-line-inline,
471
					.inlineCompletions-char-insert.single-line-inline {
472
						border-radius: 4px;
473
						border: 1px solid var(--vscode-editorHoverWidget-border);
474
						padding: 2px;
475
					}
476

477
					.inlineCompletions-char-delete.single-line-inline.empty,
478
					.inlineCompletions-char-insert.single-line-inline.empty {
479
						display: none;
480
					}
481

482
					/* Adjustments due to being a decoration */
483
					.inlineCompletions-char-delete.single-line-inline {
484
						margin: -2px 0 0 -2px;
485
					}
486

487
					.inlineCompletions.strike-through {
488
						text-decoration-thickness: 1px;
489
					}
490

491
					/* line replacement bubbles */
492

493
					.inlineCompletions-modified-bubble{
494
						background: var(--vscode-inlineEdit-modifiedChangedTextBackground);
495
					}
496

497
					.inlineCompletions-original-bubble{
498
						background: var(--vscode-inlineEdit-originalChangedTextBackground);
499
						border-radius: 4px;
500
					}
501

502
					.inlineCompletions-modified-bubble,
503
					.inlineCompletions-original-bubble {
504
						pointer-events: none;
505
					}
506

507
					.inlineCompletions-modified-bubble.start {
508
						border-top-left-radius: 4px;
509
						border-bottom-left-radius: 4px;
510
					}
511

512
					.inlineCompletions-modified-bubble.end {
513
						border-top-right-radius: 4px;
514
						border-bottom-right-radius: 4px;
515
					}
516

517
					.inline-edit.ghost-text,
518
					.inline-edit.ghost-text-decoration,
519
					.inline-edit.ghost-text-decoration-preview,
520
					.inline-edit.suggest-preview-text .ghost-text {
521
						&.syntax-highlighted {
522
							opacity: 1 !important;
523
						}
524
						background: var(--vscode-inlineEdit-modifiedChangedTextBackground) !important;
525
						outline: 2px slid var(--vscode-inlineEdit-modifiedChangedTextBackground) !important;
526

527
						font-style: normal !important;
528
					}
529
				}
530

531
				.monaco-menu-option {
532
					color: var(--vscode-editorActionList-foreground);
533
					font-size: 13px;
534
					padding: 0 10px;
535
					line-height: 26px;
536
					display: flex;
537
					gap: 8px;
538
					align-items: center;
539
					border-radius: 4px;
540
					cursor: pointer;
541

542
					&.active {
543
						background: var(--vscode-editorActionList-focusBackground);
544
						color: var(--vscode-editorActionList-focusForeground);
545
						outline: 1px solid var(--vscode-menu-selectionBorder, transparent);
546
						outline-offset: -1px;
547
					}
548
				}
549

550
				.inline-edits-view-gutter-indicator .codicon {
551
					margin-top: 1px; /* TODO: Move into gutter DOM initialization */
552
				}
553

554
				@keyframes wiggle {
555
					0% {
556
						transform: rotate(0) scale(1);
557
					}
558

559
					15%,
560
					45% {
561
						transform: rotate(.04turn) scale(1.1);
562
					}
563

564
					30%,
565
					60% {
566
						transform: rotate(-.04turn) scale(1.2);
567
					}
568

569
					100% {
570
						transform: rotate(0) scale(1);
571
					}
572
				}
573

574
				.inline-edits-view-gutter-indicator.wiggle .icon {
575
					animation-duration: .8s;
576
					animation-iteration-count: 1;
577
					animation-name: wiggle;
578
				}
579
				`;
580
			expect(
581
				await srcWithAnnotatedStructure(source, 'css', {
582
					tabSize: 4,
583
					insertSpaces: false,
584
				})
585
			).toMatchInlineSnapshot(`
586
				"<LINE>/*---------------------------------------------------------------------------------------------
587
				</LINE><LINE-1>*  Copyright (c) Microsoft Corporation. All rights reserved.
588
				</LINE-1><LINE-2>*  Licensed under the MIT License. See License.txt in the project root for license information.
589
				</LINE-2><LINE-3>*--------------------------------------------------------------------------------------------*/
590
				</LINE-3><LINE-4>
591
				</LINE-4><FOLD>/*
592
					@keyframes blink { 50% { border-color: orange; }  }
593
				</FOLD><LINE-5>*/
594
				</LINE-5><LINE-6>
595
				</LINE-6><FOLD-1>.monaco-editor {
596
				<FOLD-2>	.inline-edits-view-indicator {
597
				<LINE-7>		display: flex;
598
				</LINE-7><LINE-8>
599
				</LINE-8><LINE-9>		z-index: 34; /* Below the find widget */
600
				</LINE-9><LINE-10>		height: 20px;
601
				</LINE-10><LINE-11>
602
				</LINE-11><LINE-12>		color: var(--vscode-inlineEdit-indicator-foreground);
603
				</LINE-12><LINE-13>		background-color: var(--vscode-inlineEdit-indicator-background);
604
				</LINE-13><LINE-14>		border: 1px solid var(--vscode-inlineEdit-indicator-border);
605
				</LINE-14><LINE-15>		border-radius: 3px;
606
				</LINE-15><LINE-16>
607
				</LINE-16><LINE-17>		align-items: center;
608
				</LINE-17><LINE-18>		padding: 2px;
609
				</LINE-18><LINE-19>		padding-right: 10px;
610
				</LINE-19><LINE-20>		margin: 0 4px;
611
				</LINE-20><LINE-21>
612
				</LINE-21><LINE-22>		/*
613
				</LINE-22><LINE-23>		animation: blink 1s;
614
				</LINE-23><LINE-24>		animation-iteration-count: 3;
615
				</LINE-24><LINE-25>		*/
616
				</LINE-25><LINE-26>
617
				</LINE-26><LINE-27>		opacity: 0;
618
				</LINE-27><LINE-28>
619
				</LINE-28><FOLD-3>		&.contained {
620
				<LINE-29>			transition: opacity 0.2s ease-in-out;
621
				</LINE-29><LINE-30>			transition-delay: 0.4s;
622
				</LINE-30>		}
623
				</FOLD-3><LINE-31>
624
				</LINE-31><FOLD-4>		&.visible {
625
				<LINE-32>			opacity: 1;
626
				</LINE-32>		}
627
				</FOLD-4><LINE-33>
628
				</LINE-33><FOLD-5>		&.top {
629
				<LINE-34>			opacity: 1;
630
				</LINE-34><LINE-35>
631
				</LINE-35><FOLD-6>			.icon {
632
				<LINE-36>				transform: rotate(90deg);
633
				</LINE-36>			}
634
				</FOLD-6>		}
635
				</FOLD-5><LINE-37>
636
				</LINE-37><FOLD-7>		&.bottom {
637
				<LINE-38>			opacity: 1;
638
				</LINE-38><LINE-39>
639
				</LINE-39><FOLD-8>			.icon {
640
				<LINE-40>				transform: rotate(-90deg);
641
				</LINE-40>			}
642
				</FOLD-8>		}
643
				</FOLD-7><LINE-41>
644
				</LINE-41><FOLD-9>		.icon {
645
				<LINE-42>			display: flex;
646
				</LINE-42><LINE-43>			align-items: center;
647
				</LINE-43><LINE-44>			margin: 0 2px;
648
				</LINE-44><LINE-45>			transform: none;
649
				</LINE-45><LINE-46>			transition: transform 0.2s ease-in-out;
650
				</LINE-46><FOLD-10>			.codicon {
651
				<LINE-47>				color: var(--vscode-inlineEdit-indicator-foreground);
652
				</LINE-47>			}
653
				</FOLD-10>		}
654
				</FOLD-9><LINE-48>
655
				</LINE-48><FOLD-11>		.label {
656
				<LINE-49>			margin: 0 2px;
657
				</LINE-49><LINE-50>
658
				</LINE-50><LINE-51>			display: flex;
659
				</LINE-51><LINE-52>			justify-content: center;
660
				</LINE-52><LINE-53>			width: 100%;
661
				</LINE-53>		}
662
				</FOLD-11>	}
663
				</FOLD-2><LINE-54>
664
				</LINE-54><FOLD-12>	.inline-edits-view {
665
				<FOLD-13>		&.toolbarDropdownVisible, .editorContainer.showHover:hover {
666
				<FOLD-14>			.toolbar {
667
				<LINE-55>				display: block;
668
				</LINE-55>			}
669
				</FOLD-14>		}
670
				</FOLD-13><LINE-56>
671
				</LINE-56><FOLD-15>		.editorContainer {
672
				<LINE-57>			color: var(--vscode-editorHoverWidget-foreground);
673
				</LINE-57><LINE-58>
674
				</LINE-58><FOLD-16>			.toolbar {
675
				<LINE-59>				display: none;
676
				</LINE-59><LINE-60>				border-top: 1px solid rgba(69, 69, 69, 0.5);
677
				</LINE-60><LINE-61>				background-color: var(--vscode-editorHoverWidget-statusBarBackground);
678
				</LINE-61><LINE-62>
679
				</LINE-62><FOLD-17>				a {
680
				<LINE-63>					color: var(--vscode-foreground);
681
				</LINE-63>				}
682
				</FOLD-17><LINE-64>
683
				</LINE-64><FOLD-18>				a:hover {
684
				<LINE-65>					color: var(--vscode-foreground);
685
				</LINE-65>				}
686
				</FOLD-18><LINE-66>
687
				</LINE-66><FOLD-19>				.keybinding {
688
				<LINE-67>					display: flex;
689
				</LINE-67><LINE-68>					margin-left: 4px;
690
				</LINE-68><LINE-69>					opacity: 0.6;
691
				</LINE-69>				}
692
				</FOLD-19><LINE-70>
693
				</LINE-70><FOLD-20>				.keybinding .monaco-keybinding-key {
694
				<LINE-71>					font-size: 8px;
695
				</LINE-71><LINE-72>					padding: 2px 3px;
696
				</LINE-72>				}
697
				</FOLD-20><LINE-73>
698
				</LINE-73><FOLD-21>				.availableSuggestionCount a {
699
				<LINE-74>					display: flex;
700
				</LINE-74><LINE-75>					min-width: 19px;
701
				</LINE-75><LINE-76>					justify-content: center;
702
				</LINE-76>				}
703
				</FOLD-21><LINE-77>
704
				</LINE-77><FOLD-22>				.inlineSuggestionStatusBarItemLabel {
705
				<LINE-78>					margin-right: 2px;
706
				</LINE-78>				}
707
				</FOLD-22><LINE-79>
708
				</LINE-79>			}
709
				</FOLD-16><LINE-80>
710
				</LINE-80><FOLD-23>			.preview {
711
				<FOLD-24>				.monaco-editor {
712
				<FOLD-25>					.view-overlays .current-line-exact {
713
				<LINE-81>						border: none;
714
				</LINE-81>					}
715
				</FOLD-25><LINE-82>
716
				</LINE-82><FOLD-26>					.current-line-margin {
717
				<LINE-83>						border: none;
718
				</LINE-83>					}
719
				</FOLD-26>				}
720
				</FOLD-24>			}
721
				</FOLD-23><LINE-84>
722
				</LINE-84><FOLD-27>			.inline-edits-view-zone.diagonal-fill {
723
				<LINE-85>				opacity: 0.5;
724
				</LINE-85>			}
725
				</FOLD-27>		}
726
				</FOLD-15>	}
727
				</FOLD-12><LINE-86>
728
				</LINE-86><FOLD-28>	.strike-through {
729
				<LINE-87>		text-decoration: line-through;
730
				</LINE-87>	}
731
				</FOLD-28><LINE-88>
732
				</LINE-88><FOLD-29>	.inlineCompletions-line-insert {
733
				<LINE-89>		background: var(--vscode-inlineEdit-modifiedChangedLineBackground);
734
				</LINE-89>	}
735
				</FOLD-29><LINE-90>
736
				</LINE-90><FOLD-30>	.inlineCompletions-line-delete {
737
				<LINE-91>		background: var(--vscode-inlineEdit-originalChangedLineBackground);
738
				</LINE-91>	}
739
				</FOLD-30><LINE-92>
740
				</LINE-92><FOLD-31>	.inlineCompletions-char-insert {
741
				<LINE-93>		background: var(--vscode-inlineEdit-modifiedChangedTextBackground);
742
				</LINE-93>	}
743
				</FOLD-31><LINE-94>
744
				</LINE-94><FOLD-32>	.inlineCompletions-char-delete {
745
				<LINE-95>		background: var(--vscode-inlineEdit-originalChangedTextBackground);
746
				</LINE-95>	}
747
				</FOLD-32><LINE-96>
748
				</LINE-96><FOLD-33>	.inlineCompletions-char-delete.diff-range-empty {
749
				<LINE-97>		margin-left: -1px;
750
				</LINE-97><LINE-98>		border-left: solid var(--vscode-inlineEdit-originalChangedTextBackground) 3px;
751
				</LINE-98>	}
752
				</FOLD-33><LINE-99>
753
				</LINE-99><FOLD-34>	.inlineCompletions-char-insert.diff-range-empty {
754
				<LINE-100>		border-left: solid var(--vscode-inlineEdit-modifiedChangedTextBackground) 3px;
755
				</LINE-100>	}
756
				</FOLD-34><LINE-101>
757
				</LINE-101><LINE-102>	.inlineCompletions-char-delete.single-line-inline,
758
				</LINE-102><FOLD-35>	.inlineCompletions-char-insert.single-line-inline {
759
				<LINE-103>		border-radius: 4px;
760
				</LINE-103><LINE-104>		border: 1px solid var(--vscode-editorHoverWidget-border);
761
				</LINE-104><LINE-105>		padding: 2px;
762
				</LINE-105>	}
763
				</FOLD-35><LINE-106>
764
				</LINE-106><LINE-107>	.inlineCompletions-char-delete.single-line-inline.empty,
765
				</LINE-107><FOLD-36>	.inlineCompletions-char-insert.single-line-inline.empty {
766
				<LINE-108>		display: none;
767
				</LINE-108>	}
768
				</FOLD-36><LINE-109>
769
				</LINE-109><LINE-110>	/* Adjustments due to being a decoration */
770
				</LINE-110><FOLD-37>	.inlineCompletions-char-delete.single-line-inline {
771
				<LINE-111>		margin: -2px 0 0 -2px;
772
				</LINE-111>	}
773
				</FOLD-37><LINE-112>
774
				</LINE-112><FOLD-38>	.inlineCompletions.strike-through {
775
				<LINE-113>		text-decoration-thickness: 1px;
776
				</LINE-113>	}
777
				</FOLD-38><LINE-114>
778
				</LINE-114><LINE-115>	/* line replacement bubbles */
779
				</LINE-115><LINE-116>
780
				</LINE-116><FOLD-39>	.inlineCompletions-modified-bubble{
781
				<LINE-117>		background: var(--vscode-inlineEdit-modifiedChangedTextBackground);
782
				</LINE-117>	}
783
				</FOLD-39><LINE-118>
784
				</LINE-118><FOLD-40>	.inlineCompletions-original-bubble{
785
				<LINE-119>		background: var(--vscode-inlineEdit-originalChangedTextBackground);
786
				</LINE-119><LINE-120>		border-radius: 4px;
787
				</LINE-120>	}
788
				</FOLD-40><LINE-121>
789
				</LINE-121><LINE-122>	.inlineCompletions-modified-bubble,
790
				</LINE-122><FOLD-41>	.inlineCompletions-original-bubble {
791
				<LINE-123>		pointer-events: none;
792
				</LINE-123>	}
793
				</FOLD-41><LINE-124>
794
				</LINE-124><FOLD-42>	.inlineCompletions-modified-bubble.start {
795
				<LINE-125>		border-top-left-radius: 4px;
796
				</LINE-125><LINE-126>		border-bottom-left-radius: 4px;
797
				</LINE-126>	}
798
				</FOLD-42><LINE-127>
799
				</LINE-127><FOLD-43>	.inlineCompletions-modified-bubble.end {
800
				<LINE-128>		border-top-right-radius: 4px;
801
				</LINE-128><LINE-129>		border-bottom-right-radius: 4px;
802
				</LINE-129>	}
803
				</FOLD-43><LINE-130>
804
				</LINE-130><LINE-131>	.inline-edit.ghost-text,
805
				</LINE-131><LINE-132>	.inline-edit.ghost-text-decoration,
806
				</LINE-132><LINE-133>	.inline-edit.ghost-text-decoration-preview,
807
				</LINE-133><FOLD-44>	.inline-edit.suggest-preview-text .ghost-text {
808
				<FOLD-45>		&.syntax-highlighted {
809
				<LINE-134>			opacity: 1 !important;
810
				</LINE-134>		}
811
				</FOLD-45><LINE-135>		background: var(--vscode-inlineEdit-modifiedChangedTextBackground) !important;
812
				</LINE-135><LINE-136>		outline: 2px slid var(--vscode-inlineEdit-modifiedChangedTextBackground) !important;
813
				</LINE-136><LINE-137>
814
				</LINE-137><LINE-138>		font-style: normal !important;
815
				</LINE-138>	}
816
				</FOLD-44>}
817
				</FOLD-1><LINE-139>
818
				</LINE-139><FOLD-46>.monaco-menu-option {
819
				<LINE-140>	color: var(--vscode-editorActionList-foreground);
820
				</LINE-140><LINE-141>	font-size: 13px;
821
				</LINE-141><LINE-142>	padding: 0 10px;
822
				</LINE-142><LINE-143>	line-height: 26px;
823
				</LINE-143><LINE-144>	display: flex;
824
				</LINE-144><LINE-145>	gap: 8px;
825
				</LINE-145><LINE-146>	align-items: center;
826
				</LINE-146><LINE-147>	border-radius: 4px;
827
				</LINE-147><LINE-148>	cursor: pointer;
828
				</LINE-148><LINE-149>
829
				</LINE-149><FOLD-47>	&.active {
830
				<LINE-150>		background: var(--vscode-editorActionList-focusBackground);
831
				</LINE-150><LINE-151>		color: var(--vscode-editorActionList-focusForeground);
832
				</LINE-151><LINE-152>		outline: 1px solid var(--vscode-menu-selectionBorder, transparent);
833
				</LINE-152><LINE-153>		outline-offset: -1px;
834
				</LINE-153>	}
835
				</FOLD-47>}
836
				</FOLD-46><LINE-154>
837
				</LINE-154><FOLD-48>.inline-edits-view-gutter-indicator .codicon {
838
				<LINE-155>	margin-top: 1px; /* TODO: Move into gutter DOM initialization */
839
				</LINE-155>}
840
				</FOLD-48><LINE-156>
841
				</LINE-156><FOLD-49>@keyframes wiggle {
842
				<FOLD-50>	0% {
843
				<LINE-157>		transform: rotate(0) scale(1);
844
				</LINE-157>	}
845
				</FOLD-50><LINE-158>
846
				</LINE-158><LINE-159>	15%,
847
				</LINE-159><FOLD-51>	45% {
848
				<LINE-160>		transform: rotate(.04turn) scale(1.1);
849
				</LINE-160>	}
850
				</FOLD-51><LINE-161>
851
				</LINE-161><LINE-162>	30%,
852
				</LINE-162><FOLD-52>	60% {
853
				<LINE-163>		transform: rotate(-.04turn) scale(1.2);
854
				</LINE-163>	}
855
				</FOLD-52><LINE-164>
856
				</LINE-164><FOLD-53>	100% {
857
				<LINE-165>		transform: rotate(0) scale(1);
858
				</LINE-165>	}
859
				</FOLD-53>}
860
				</FOLD-49><LINE-166>
861
				</LINE-166><FOLD-54>.inline-edits-view-gutter-indicator.wiggle .icon {
862
				<LINE-167>	animation-duration: .8s;
863
				</LINE-167><LINE-168>	animation-iteration-count: 1;
864
				</LINE-168><LINE-169>	animation-name: wiggle;
865
				</LINE-169>}</FOLD-54>"
866
			`);
867
		});
868
	});
869
});
870

871
Product

Resources

Company
