Skip to content

Commit c8a9182

Browse files
aeschliaeschli
committed
define find widget codicons
1 parent dcd813e commit c8a9182

2 files changed

Lines changed: 27 additions & 24 deletions

File tree

‎src/vs/editor/contrib/find/findWidget.ts‎

Lines changed: 21 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,15 @@ import { INotificationService } from 'vs/platform/notification/common/notificati
3939
import { IStorageKeysSyncRegistryService } from 'vs/platform/userDataSync/common/storageKeys';
4040
import { Codicon, registerIcon } from 'vs/base/browser/ui/codicons/codicons';
4141

42-
export const findSelectionIcon = registerIcon('find-selection', Codicon.selection);
42+
const findSelectionIcon = registerIcon('find-selection', Codicon.selection);
43+
const findCollapsedIcon = registerIcon('find-collapsed', Codicon.chevronRight);
44+
const findExpandedIcon = registerIcon('find-expanded', Codicon.chevronDown);
45+
46+
export const findCloseIcon = registerIcon('find-close', Codicon.close);
47+
export const findReplaceIcon = registerIcon('find-replace', Codicon.replace);
48+
export const findReplaceAllIcon = registerIcon('find-replace-all', Codicon.replaceAll);
49+
export const findPreviousMatchIcon = registerIcon('find-previous-match', Codicon.arrowUp);
50+
export const findNextMatchIcon = registerIcon('find-next-match', Codicon.arrowDown);
4351

4452
export interface IFindController {
4553
replace(): void;
@@ -470,8 +478,6 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
470478
this._replaceAllBtn.setEnabled(this._isVisible && this._isReplaceVisible && findInputIsNonEmpty);
471479

472480
dom.toggleClass(this._domNode, 'replaceToggled', this._isReplaceVisible);
473-
this._toggleReplaceBtn.toggleClass('codicon-chevron-right', !this._isReplaceVisible);
474-
this._toggleReplaceBtn.toggleClass('codicon-chevron-down', this._isReplaceVisible);
475481
this._toggleReplaceBtn.setExpanded(this._isReplaceVisible);
476482

477483
let canReplace = !this._codeEditor.getOption(EditorOption.readOnly);
@@ -993,7 +999,7 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
993999
// Previous button
9941000
this._prevBtn = this._register(new SimpleButton({
9951001
label: NLS_PREVIOUS_MATCH_BTN_LABEL + this._keybindingLabelFor(FIND_IDS.PreviousMatchFindAction),
996-
className: 'codicon codicon-arrow-up',
1002+
className: findPreviousMatchIcon.classNames,
9971003
onTrigger: () => {
9981004
this._codeEditor.getAction(FIND_IDS.PreviousMatchFindAction).run().then(undefined, onUnexpectedError);
9991005
}
@@ -1002,7 +1008,7 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
10021008
// Next button
10031009
this._nextBtn = this._register(new SimpleButton({
10041010
label: NLS_NEXT_MATCH_BTN_LABEL + this._keybindingLabelFor(FIND_IDS.NextMatchFindAction),
1005-
className: 'codicon codicon-arrow-down',
1011+
className: findNextMatchIcon.classNames,
10061012
onTrigger: () => {
10071013
this._codeEditor.getAction(FIND_IDS.NextMatchFindAction).run().then(undefined, onUnexpectedError);
10081014
}
@@ -1046,7 +1052,7 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
10461052
// Close button
10471053
this._closeBtn = this._register(new SimpleButton({
10481054
label: NLS_CLOSE_BTN_LABEL + this._keybindingLabelFor(FIND_IDS.CloseFindWidgetCommand),
1049-
className: 'codicon codicon-close',
1055+
className: findCloseIcon.classNames,
10501056
onTrigger: () => {
10511057
this._state.change({ isRevealed: false, searchScope: null }, false);
10521058
},
@@ -1109,7 +1115,7 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
11091115
// Replace one button
11101116
this._replaceBtn = this._register(new SimpleButton({
11111117
label: NLS_REPLACE_BTN_LABEL + this._keybindingLabelFor(FIND_IDS.ReplaceOneAction),
1112-
className: 'codicon codicon-replace',
1118+
className: findReplaceIcon.classNames,
11131119
onTrigger: () => {
11141120
this._controller.replace();
11151121
},
@@ -1124,7 +1130,7 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
11241130
// Replace all button
11251131
this._replaceAllBtn = this._register(new SimpleButton({
11261132
label: NLS_REPLACE_ALL_BTN_LABEL + this._keybindingLabelFor(FIND_IDS.ReplaceAllAction),
1127-
className: 'codicon codicon-replace-all',
1133+
className: findReplaceAllIcon.classNames,
11281134
onTrigger: () => {
11291135
this._controller.replaceAll();
11301136
}
@@ -1154,8 +1160,6 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
11541160
this._showViewZone();
11551161
}
11561162
}));
1157-
this._toggleReplaceBtn.toggleClass('codicon-chevron-down', this._isReplaceVisible);
1158-
this._toggleReplaceBtn.toggleClass('codicon-chevron-right', !this._isReplaceVisible);
11591163
this._toggleReplaceBtn.setExpanded(this._isReplaceVisible);
11601164

11611165
// Widget
@@ -1298,10 +1302,13 @@ export class SimpleButton extends Widget {
12981302

12991303
public setExpanded(expanded: boolean): void {
13001304
this._domNode.setAttribute('aria-expanded', String(!!expanded));
1301-
}
1302-
1303-
public toggleClass(className: string, shouldHaveIt: boolean): void {
1304-
dom.toggleClass(this._domNode, className, shouldHaveIt);
1305+
if (expanded) {
1306+
dom.removeClasses(this._domNode, findCollapsedIcon.classNames);
1307+
dom.addClasses(this._domNode, findExpandedIcon.classNames);
1308+
} else {
1309+
dom.removeClasses(this._domNode, findExpandedIcon.classNames);
1310+
dom.addClasses(this._domNode, findCollapsedIcon.classNames);
1311+
}
13051312
}
13061313
}
13071314

‎src/vs/workbench/contrib/codeEditor/browser/find/simpleFindReplaceWidget.ts‎

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { Delayer } from 'vs/base/common/async';
1212
import { KeyCode } from 'vs/base/common/keyCodes';
1313
import { FindReplaceState, FindReplaceStateChangedEvent } from 'vs/editor/contrib/find/findState';
1414
import { IMessage as InputBoxMessage } from 'vs/base/browser/ui/inputbox/inputBox';
15-
import { SimpleButton } from 'vs/editor/contrib/find/findWidget';
15+
import { SimpleButton, findCloseIcon, findNextMatchIcon, findPreviousMatchIcon, findReplaceIcon, findReplaceAllIcon } from 'vs/editor/contrib/find/findWidget';
1616
import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
1717
import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
1818
import { editorWidgetBackground, inputActiveOptionBorder, inputActiveOptionBackground, inputBackground, inputBorder, inputForeground, inputValidationErrorBackground, inputValidationErrorBorder, inputValidationErrorForeground, inputValidationInfoBackground, inputValidationInfoBorder, inputValidationInfoForeground, inputValidationWarningBackground, inputValidationWarningBorder, inputValidationWarningForeground, widgetShadow, editorWidgetForeground } from 'vs/platform/theme/common/colorRegistry';
@@ -90,8 +90,6 @@ export abstract class SimpleFindReplaceWidget extends Widget {
9090
}
9191
}
9292
}));
93-
this._toggleReplaceBtn.toggleClass('codicon-chevron-down', this._isReplaceVisible);
94-
this._toggleReplaceBtn.toggleClass('codicon-chevron-right', !this._isReplaceVisible);
9593
this._toggleReplaceBtn.setExpanded(this._isReplaceVisible);
9694
this._domNode.appendChild(this._toggleReplaceBtn.domNode);
9795

@@ -147,23 +145,23 @@ export abstract class SimpleFindReplaceWidget extends Widget {
147145

148146
this.prevBtn = this._register(new SimpleButton({
149147
label: NLS_PREVIOUS_MATCH_BTN_LABEL,
150-
className: 'codicon codicon-arrow-up',
148+
className: findPreviousMatchIcon.classNames,
151149
onTrigger: () => {
152150
this.find(true);
153151
}
154152
}));
155153

156154
this.nextBtn = this._register(new SimpleButton({
157155
label: NLS_NEXT_MATCH_BTN_LABEL,
158-
className: 'codicon codicon-arrow-down',
156+
className: findNextMatchIcon.classNames,
159157
onTrigger: () => {
160158
this.find(false);
161159
}
162160
}));
163161

164162
const closeBtn = this._register(new SimpleButton({
165163
label: NLS_CLOSE_BTN_LABEL,
166-
className: 'codicon codicon-close',
164+
className: findCloseIcon.classNames,
167165
onTrigger: () => {
168166
this.hide();
169167
}
@@ -221,7 +219,7 @@ export abstract class SimpleFindReplaceWidget extends Widget {
221219

222220
this._replaceBtn = this._register(new SimpleButton({
223221
label: NLS_REPLACE_BTN_LABEL,
224-
className: 'codicon codicon-replace',
222+
className: findReplaceIcon.classNames,
225223
onTrigger: () => {
226224
this.replaceOne();
227225
}
@@ -230,7 +228,7 @@ export abstract class SimpleFindReplaceWidget extends Widget {
230228
// Replace all button
231229
this._replaceAllBtn = this._register(new SimpleButton({
232230
label: NLS_REPLACE_ALL_BTN_LABEL,
233-
className: 'codicon codicon-replace-all',
231+
className: findReplaceAllIcon.classNames,
234232
onTrigger: () => {
235233
this.replaceAll();
236234
}
@@ -315,8 +313,6 @@ export abstract class SimpleFindReplaceWidget extends Widget {
315313
this._replaceAllBtn.setEnabled(this._isVisible && this._isReplaceVisible && findInputIsNonEmpty);
316314

317315
dom.toggleClass(this._domNode, 'replaceToggled', this._isReplaceVisible);
318-
this._toggleReplaceBtn.toggleClass('codicon-chevron-right', !this._isReplaceVisible);
319-
this._toggleReplaceBtn.toggleClass('codicon-chevron-down', this._isReplaceVisible);
320316
this._toggleReplaceBtn.setExpanded(this._isReplaceVisible);
321317
}
322318

0 commit comments

Comments
 (0)