blob: 34d7f7509ff542fd12b39f6f69fad71e95ad47be (
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
|
// Copyright 2020 The Chromium Authors
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import './icons.html.js';
import 'chrome://resources/cr_elements/cr_shared_vars.css.js';
import {PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
import {getTemplate} from './option.html.js';
import {Option} from './types.js';
/**
* Represents a substring of the option title, annotated with whether it's part
* of a match or not.
*/
export interface MatchSpan {
text: string;
isMatch: boolean;
}
export class CommanderOptionElement extends PolymerElement {
static get is() {
return 'commander-option';
}
static get template() {
return getTemplate();
}
static get properties() {
return {
model: Object,
};
}
model: Option;
/**
* Splits this.model.title into a list of substrings, each marked with
* whether they should be displayed as a match or not.
*/
private computeMatchSpans_(): MatchSpan[] {
const result: MatchSpan[] = [];
let firstNonmatch = 0;
for (const r of this.model.matchedRanges) {
const [start, end] = r;
if (start !== 0) {
result.push({
text: this.model.title.substring(firstNonmatch, start),
isMatch: false,
});
}
result.push(
{text: this.model.title.substring(start, end), isMatch: true});
firstNonmatch = end;
}
if (firstNonmatch < this.model.title.length) {
result.push(
{text: this.model.title.substring(firstNonmatch), isMatch: false});
}
return result;
}
private getClassForMatch_(isMatch: boolean): string {
return isMatch ? 'match' : '';
}
}
declare global {
interface HTMLElementTagNameMap {
'commander-option': CommanderOptionElement;
}
}
customElements.define(CommanderOptionElement.is, CommanderOptionElement);
|