Skip to content

Commit eccae9a

Browse files
d13d13
committed
Adds template to generate glicons map for web components
1 parent 7c6fb52 commit eccae9a

File tree

5 files changed

+105
-51
lines changed

5 files changed

+105
-51
lines changed

‎.fantasticonrc.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,12 @@ const config = {
1212
fontTypes: ['woff2'],
1313
normalize: true,
1414
// @ts-ignore
15-
assetTypes: ['html', 'scss', 'css', 'json'],
15+
assetTypes: ['html', 'scss', 'css', 'json', 'sass'],
1616
templates: {
1717
html: './images/icons/template/icons-contribution.hbs',
1818
scss: './images/icons/template/styles.hbs',
1919
css: './images/icons/template/css-properties.hbs',
20+
sass: './images/icons/template/icon-map.hbs',
2021
},
2122
formatOptions: {
2223
json: {
@@ -29,6 +30,7 @@ const config = {
2930
css: './dist/glicons-properties.scss',
3031
html: './dist/icons-contribution.json',
3132
json: './images/icons/template/mapping.json',
33+
sass: './dist/glicons.ts',
3234
},
3335
};
3436

‎images/icons/template/icon-map.hbs‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
/*
2+
3+
Must be placed at the end of body in the HTML file of any webview that needs it (because of CSP)
4+
5+
<style nonce="#{cspNonce}">
6+
@font-face {
7+
font-family: '{{ name }}';
8+
font-display: block;
9+
src: {{{ fontSrc }}};
10+
}
11+
</style>
12+
*/
13+
14+
export const gliconsFontFamily = '{{ name }}';
15+
16+
export const gliconsMap = Object.freeze({
17+
{{#each codepoints}}
18+
'gl-{{ @key }}': '\\\{{ codepoint this }}',
19+
{{/each}}
20+
});

‎scripts/applyIconsContribution.mjs‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@ const scssPromises = Promise.all([
1010
fs.promises.readFile('./src/webviews/apps/shared/glicons.scss', 'utf8'),
1111
fs.promises.readFile('./dist/glicons-properties.scss', 'utf8'),
1212
fs.promises.readFile('./src/webviews/apps/shared/glicons-properties.scss', 'utf8'),
13+
fs.promises.readFile('./dist/glicons.ts', 'utf8'),
14+
fs.promises.readFile('./src/webviews/apps/shared/components/glicons.ts', 'utf8'),
1315
]);
1416

1517
let pending = [];
@@ -26,7 +28,7 @@ if (JSON.stringify(packageJSON.contributes.icons) !== JSON.stringify(icons.icons
2628
}
2729

2830
// Update the scss file
29-
const [newScss, scss, newPropertiesScss, propertiesScss] = await scssPromises;
31+
const [newScss, scss, newPropertiesScss, propertiesScss, newMapTs, mapTs] = await scssPromises;
3032

3133
if (scss !== newScss) {
3234
pending.push(fs.promises.writeFile('./src/webviews/apps/shared/glicons.scss', newScss));
@@ -36,9 +38,14 @@ if (propertiesScss !== newPropertiesScss) {
3638
pending.push(fs.promises.writeFile('./src/webviews/apps/shared/glicons-properties.scss', newPropertiesScss));
3739
}
3840

41+
if (mapTs !== newMapTs) {
42+
pending.push(fs.promises.writeFile('./src/webviews/apps/shared/components/glicons.ts', newMapTs));
43+
}
44+
3945
pending.push(
4046
fs.promises.rm('./dist/icons-contribution.json'),
4147
fs.promises.rm('./dist/glicons.scss'),
4248
fs.promises.rm('./dist/glicons-properties.scss'),
49+
fs.promises.rm('./dist/glicons.ts'),
4350
);
4451
await Promise.allSettled(pending);

‎src/webviews/apps/shared/components/code-icon.ts‎

Lines changed: 9 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import { css, LitElement, unsafeCSS } from 'lit';
22
import { customElement, property } from 'lit/decorators.js';
3+
import { gliconsMap } from './glicons';
34

4-
const iconMap = Object.freeze({
5-
// codicons
5+
const codiconsMap = Object.freeze({
66
add: '\\ea60',
77
plus: '\\ea60',
88
'gist-new': '\\ea60',
@@ -573,50 +573,6 @@ const iconMap = Object.freeze({
573573
percentage: '\\ec33',
574574
'sort-percentage': '\\ec33',
575575
'git-fetch': '\\f101',
576-
// glicons
577-
'gl-commit-horizontal': '\\f101',
578-
'gl-graph': '\\f102',
579-
'gl-next-commit': '\\f103',
580-
'gl-prev-commit-menu': '\\f104',
581-
'gl-prev-commit': '\\f105',
582-
'gl-compare-ref-working': '\\f106',
583-
'gl-branches-view': '\\f107',
584-
'gl-commit-view': '\\f108',
585-
'gl-commits-view': '\\f109',
586-
'gl-compare-view': '\\f10a',
587-
'gl-contributors-view': '\\f10b',
588-
'gl-history-view': '\\f10c',
589-
'gl-remotes-view': '\\f10d',
590-
'gl-repositories-view': '\\f10e',
591-
'gl-search-view': '\\f10f',
592-
'gl-stashes-view': '\\f110',
593-
'gl-tags-view': '\\f111',
594-
'gl-worktrees-view': '\\f112',
595-
'gl-gitlens': '\\f113',
596-
'gl-stash-pop': '\\f114',
597-
'gl-stash-save': '\\f115',
598-
'gl-unplug': '\\f116',
599-
'gl-open-revision': '\\f117',
600-
'gl-switch': '\\f118',
601-
'gl-expand': '\\f119',
602-
'gl-list-auto': '\\f11a',
603-
'gl-repo-force-push': '\\f11b',
604-
'gl-pinned-filled': '\\f11c',
605-
'gl-clock': '\\f11d',
606-
'gl-provider-azdo': '\\f11e',
607-
'gl-provider-bitbucket': '\\f11f',
608-
'gl-provider-gerrit': '\\f120',
609-
'gl-provider-gitea': '\\f121',
610-
'gl-provider-github': '\\f122',
611-
'gl-provider-gitlab': '\\f123',
612-
'gl-gitlens-inspect': '\\f124',
613-
'gl-workspaces-view': '\\f125',
614-
'gl-cloud-patch': '\\f128',
615-
'gl-cloud-patch-share': '\\f129',
616-
'gl-inspect': '\\f12a',
617-
'gl-repository-filled': '\\f12b',
618-
'gl-code-suggestion': '\\f12d',
619-
'gl-provider-jira': '\\f12e',
620576
});
621577

622578
@customElement('code-icon')
@@ -646,13 +602,17 @@ export class CodeIcon extends LitElement {
646602
}
647603
648604
${unsafeCSS(
649-
Object.entries(iconMap)
650-
.map(
651-
([key, value]) => /*css*/ `
605+
[codiconsMap, gliconsMap]
606+
.map(icons =>
607+
Object.entries(icons)
608+
.map(
609+
([key, value]) => /*css*/ `
652610
:host([icon='${key}'])::before {
653611
content: '${value}';
654612
}
655613
`,
614+
)
615+
.join(''),
656616
)
657617
.join(''),
658618
)}

‎src/webviews/apps/shared/components/glicons.ts‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
/*
2+
3+
Must be placed at the end of body in the HTML file of any webview that needs it (because of CSP)
4+
5+
<style nonce="#{cspNonce}">
6+
@font-face {
7+
font-family: 'glicons';
8+
font-display: block;
9+
src: url("#{root}/dist/glicons.woff2?887e981267645659b15471f86c55a40e") format("woff2");
10+
}
11+
</style>
12+
*/
13+
14+
export const gliconsFontFamily = 'glicons';
15+
16+
export const gliconsMap = Object.freeze({
17+
'gl-commit-horizontal': '\\f101',
18+
'gl-graph': '\\f102',
19+
'gl-next-commit': '\\f103',
20+
'gl-prev-commit-menu': '\\f104',
21+
'gl-prev-commit': '\\f105',
22+
'gl-compare-ref-working': '\\f106',
23+
'gl-branches-view': '\\f107',
24+
'gl-commit-view': '\\f108',
25+
'gl-commits-view': '\\f109',
26+
'gl-compare-view': '\\f10a',
27+
'gl-contributors-view': '\\f10b',
28+
'gl-history-view': '\\f10c',
29+
'gl-history': '\\f10c',
30+
'gl-remotes-view': '\\f10d',
31+
'gl-repositories-view': '\\f10e',
32+
'gl-search-view': '\\f10f',
33+
'gl-stashes-view': '\\f110',
34+
'gl-stashes': '\\f110',
35+
'gl-tags-view': '\\f111',
36+
'gl-worktrees-view': '\\f112',
37+
'gl-gitlens': '\\f113',
38+
'gl-stash-pop': '\\f114',
39+
'gl-stash-save': '\\f115',
40+
'gl-unplug': '\\f116',
41+
'gl-open-revision': '\\f117',
42+
'gl-switch': '\\f118',
43+
'gl-expand': '\\f119',
44+
'gl-list-auto': '\\f11a',
45+
'gl-repo-force-push': '\\f11b',
46+
'gl-pinned-filled': '\\f11c',
47+
'gl-clock': '\\f11d',
48+
'gl-provider-azdo': '\\f11e',
49+
'gl-provider-bitbucket': '\\f11f',
50+
'gl-provider-gerrit': '\\f120',
51+
'gl-provider-gitea': '\\f121',
52+
'gl-provider-github': '\\f122',
53+
'gl-provider-gitlab': '\\f123',
54+
'gl-gitlens-inspect': '\\f124',
55+
'gl-workspaces-view': '\\f125',
56+
'gl-confirm-checked': '\\f126',
57+
'gl-confirm-unchecked': '\\f127',
58+
'gl-cloud-patch': '\\f128',
59+
'gl-cloud-patch-share': '\\f129',
60+
'gl-inspect': '\\f12a',
61+
'gl-repository-filled': '\\f12b',
62+
'gl-gitlens-filled': '\\f12c',
63+
'gl-code-suggestion': '\\f12d',
64+
'gl-provider-jira': '\\f12e',
65+
});

0 commit comments

Comments
 (0)