Skip to content

Commit 377a766

Browse files
committed
Actually support all icons in fr-icon-xxx
1 parent 2f99140 commit 377a766

File tree

13 files changed

+246
-215
lines changed

13 files changed

+246
-215
lines changed

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,11 +69,11 @@
6969
},
7070
"dependencies": {
7171
"@gouvfr/dsfr": "1.8.2",
72-
"remixicon": "^2.5.0",
7372
"tsafe": "^1.1.1"
7473
},
7574
"devDependencies": {
7675
"css": "^3.0.0",
76+
"remixicon": "^2.5.0",
7777
"@emotion/react": "^11.10.4",
7878
"@emotion/styled": "^11.10.4",
7979
"@mui/material": "^5.10.7",

src/bin/copy_dsfr_dist_to_root.ts

Lines changed: 41 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -3,27 +3,50 @@ import * as fs from "fs";
33
import { getProjectRoot } from "./tools/getProjectRoot";
44
import {
55
pathOfPatchedRawCssCodeForCompatWithRemixIconRelativeToDsfrDist,
6-
getPatchedRawCssCodeForCompatWithRemixIcon
6+
getPatchedRawCssCodeForCompatWithRemixIcon,
7+
pathOfIconsJson,
8+
collectIcons
79
} from "./css_to_ts/icons";
810

9-
const projectRootDirPath = getProjectRoot();
11+
(async () => {
12+
const projectRootDirPath = getProjectRoot();
1013

11-
const dsfrDirPath = pathJoin(projectRootDirPath, "dsfr");
14+
const dsfrDirPath = pathJoin(projectRootDirPath, "dsfr");
1215

13-
if (fs.existsSync(dsfrDirPath)) {
14-
fs.rmSync(dsfrDirPath, { "recursive": true, "force": true });
15-
}
16+
if (fs.existsSync(dsfrDirPath)) {
17+
fs.rmSync(dsfrDirPath, { "recursive": true, "force": true });
18+
}
1619

17-
fs.cpSync(pathJoin(projectRootDirPath, "node_modules", "@gouvfr", "dsfr", "dist"), dsfrDirPath, {
18-
"recursive": true
19-
});
20+
const nodeModuleDirPath = pathJoin(projectRootDirPath, "node_modules");
2021

21-
fs.writeFileSync(
22-
pathJoin(dsfrDirPath, pathOfPatchedRawCssCodeForCompatWithRemixIconRelativeToDsfrDist),
23-
Buffer.from(
24-
getPatchedRawCssCodeForCompatWithRemixIcon({
25-
"rawCssCode": fs.readFileSync(pathJoin(dsfrDirPath, "dsfr.css")).toString("utf8")
26-
}),
27-
"utf8"
28-
)
29-
);
22+
fs.cpSync(pathJoin(nodeModuleDirPath, "@gouvfr", "dsfr", "dist"), dsfrDirPath, {
23+
"recursive": true
24+
});
25+
26+
fs.writeFileSync(
27+
pathJoin(dsfrDirPath, pathOfPatchedRawCssCodeForCompatWithRemixIconRelativeToDsfrDist),
28+
Buffer.from(
29+
getPatchedRawCssCodeForCompatWithRemixIcon({
30+
"rawCssCode": fs.readFileSync(pathJoin(dsfrDirPath, "dsfr.css")).toString("utf8")
31+
}),
32+
"utf8"
33+
)
34+
);
35+
36+
fs.writeFileSync(
37+
pathJoin(dsfrDirPath, pathOfIconsJson),
38+
Buffer.from(
39+
JSON.stringify(
40+
await collectIcons({
41+
"remixiconDirPath": pathJoin(nodeModuleDirPath, "remixicon"),
42+
"iconsCssRawCode": fs
43+
.readFileSync(pathJoin(dsfrDirPath, "utility", "icons", "icons.css"))
44+
.toString("utf8")
45+
}),
46+
null,
47+
2
48+
),
49+
"utf8"
50+
)
51+
);
52+
})();

src/bin/css_to_ts/css_to_ts.ts

Lines changed: 94 additions & 97 deletions
Original file line numberDiff line numberDiff line change
@@ -5,116 +5,113 @@ import { getProjectRoot } from "../tools/getProjectRoot";
55
import { generateTypographyTsCode } from "./typography";
66
import { generateSpacingTsCode } from "./spacing";
77
import { generateClassNamesTsCode } from "./classNames";
8-
import { collectIcons } from "./icons";
98
import * as fs from "fs";
109
import { join as pathJoin, basename as pathBasename, relative as pathRelative } from "path";
10+
import { pathOfIconsJson } from "./icons";
11+
import type { Icon } from "./icons";
1112

12-
(async () => {
13-
const projectRoot = getProjectRoot();
13+
const projectRoot = getProjectRoot();
1414

15-
const dsfrDistDirPath = pathJoin(projectRoot, "dsfr");
15+
const dsfrDistDirPath = pathJoin(projectRoot, "dsfr");
1616

17-
const rawCssCode = fs.readFileSync(pathJoin(dsfrDistDirPath, "dsfr.css")).toString("utf8");
17+
const rawCssCode = fs.readFileSync(pathJoin(dsfrDistDirPath, "dsfr.css")).toString("utf8");
1818

19-
const generatedDirPath = pathJoin(projectRoot, "src", "lib", "generatedFromCss");
19+
const generatedDirPath = pathJoin(projectRoot, "src", "lib", "generatedFromCss");
2020

21-
fs.mkdirSync(generatedDirPath, { "recursive": true });
21+
fs.mkdirSync(generatedDirPath, { "recursive": true });
2222

23-
const warningMessage = [
24-
`// This file is generated automatically by ${pathRelative(
25-
projectRoot,
26-
__filename
27-
)}, please don't edit.`
28-
].join("\n");
23+
const warningMessage = [
24+
`// This file is generated automatically by ${pathRelative(
25+
projectRoot,
26+
__filename
27+
)}, please don't edit.`
28+
].join("\n");
2929

30-
const targetOptionFilePath = pathJoin(generatedDirPath, "getColorOptions.ts");
30+
const targetOptionFilePath = pathJoin(generatedDirPath, "getColorOptions.ts");
3131

32-
fs.writeFileSync(
33-
targetOptionFilePath,
34-
Buffer.from(
35-
[
36-
warningMessage,
37-
``,
38-
generateGetColorOptionsTsCode(rawCssCode),
39-
``,
40-
`export type ColorOptions = ReturnType<typeof getColorOptions>;`,
41-
``
42-
].join("\n"),
43-
"utf8"
44-
)
45-
);
32+
fs.writeFileSync(
33+
targetOptionFilePath,
34+
Buffer.from(
35+
[
36+
warningMessage,
37+
``,
38+
generateGetColorOptionsTsCode(rawCssCode),
39+
``,
40+
`export type ColorOptions = ReturnType<typeof getColorOptions>;`,
41+
``
42+
].join("\n"),
43+
"utf8"
44+
)
45+
);
4646

47-
fs.writeFileSync(
48-
pathJoin(generatedDirPath, "getColorDecisions.ts"),
49-
Buffer.from(
50-
[
51-
warningMessage,
52-
`import type { ColorOptions } from "./${pathBasename(targetOptionFilePath).replace(
53-
/\.ts$/,
54-
""
55-
)}";`,
56-
``,
57-
generateGetColorDecisionsTsCode(rawCssCode),
58-
``,
59-
`export type ColorDecisions = ReturnType<typeof getColorDecisions>;`,
60-
``
61-
].join("\n"),
62-
"utf8"
63-
)
64-
);
47+
fs.writeFileSync(
48+
pathJoin(generatedDirPath, "getColorDecisions.ts"),
49+
Buffer.from(
50+
[
51+
warningMessage,
52+
`import type { ColorOptions } from "./${pathBasename(targetOptionFilePath).replace(
53+
/\.ts$/,
54+
""
55+
)}";`,
56+
``,
57+
generateGetColorDecisionsTsCode(rawCssCode),
58+
``,
59+
`export type ColorDecisions = ReturnType<typeof getColorDecisions>;`,
60+
``
61+
].join("\n"),
62+
"utf8"
63+
)
64+
);
6565

66-
fs.writeFileSync(
67-
pathJoin(generatedDirPath, "breakpoints.ts"),
68-
Buffer.from([warningMessage, ``, generateBreakpointsTsCode(rawCssCode)].join("\n"), "utf8")
69-
);
66+
fs.writeFileSync(
67+
pathJoin(generatedDirPath, "breakpoints.ts"),
68+
Buffer.from([warningMessage, ``, generateBreakpointsTsCode(rawCssCode)].join("\n"), "utf8")
69+
);
7070

71-
fs.writeFileSync(
72-
pathJoin(generatedDirPath, "typography.ts"),
73-
Buffer.from(
74-
[
75-
warningMessage,
76-
`import { breakpoints } from "../breakpoints";`,
77-
``,
78-
generateTypographyTsCode(rawCssCode),
79-
``
80-
].join("\n"),
81-
"utf8"
82-
)
83-
);
71+
fs.writeFileSync(
72+
pathJoin(generatedDirPath, "typography.ts"),
73+
Buffer.from(
74+
[
75+
warningMessage,
76+
`import { breakpoints } from "../breakpoints";`,
77+
``,
78+
generateTypographyTsCode(rawCssCode),
79+
``
80+
].join("\n"),
81+
"utf8"
82+
)
83+
);
8484

85-
fs.writeFileSync(
86-
pathJoin(generatedDirPath, "spacing.ts"),
87-
Buffer.from([warningMessage, ``, generateSpacingTsCode(rawCssCode), ``].join("\n"), "utf8")
88-
);
85+
fs.writeFileSync(
86+
pathJoin(generatedDirPath, "spacing.ts"),
87+
Buffer.from([warningMessage, ``, generateSpacingTsCode(rawCssCode), ``].join("\n"), "utf8")
88+
);
8989

90-
fs.writeFileSync(
91-
pathJoin(generatedDirPath, "classNames.ts"),
92-
Buffer.from(
93-
[
94-
warningMessage,
95-
``,
96-
generateClassNamesTsCode({
97-
rawCssCode,
90+
fs.writeFileSync(
91+
pathJoin(generatedDirPath, "classNames.ts"),
92+
Buffer.from(
93+
[
94+
warningMessage,
95+
``,
96+
generateClassNamesTsCode({
97+
rawCssCode,
98+
...(() => {
99+
const icons: Icon[] = JSON.parse(
100+
fs.readFileSync(pathJoin(dsfrDistDirPath, pathOfIconsJson)).toString("utf8")
101+
);
98102

99-
...(await (async () => {
100-
const icons = await collectIcons({
101-
dsfrDistDirPath,
102-
"remixiconDirPath": pathJoin(projectRoot, "node_modules", "remixicon")
103-
});
104-
105-
return {
106-
"dsfrIconClassNames": icons
107-
.filter(({ prefix }) => prefix === "fr-icon-")
108-
.map(({ iconId, prefix }) => `${prefix}${iconId}`),
109-
"remixiconClassNames": icons
110-
.filter(({ prefix }) => prefix === "ri-")
111-
.map(({ iconId, prefix }) => `${prefix}${iconId}`)
112-
};
113-
})())
114-
}),
115-
``
116-
].join("\n"),
117-
"utf8"
118-
)
119-
);
120-
})();
103+
return {
104+
"dsfrIconClassNames": icons
105+
.filter(({ prefix }) => prefix === "fr-icon-")
106+
.map(({ iconId, prefix }) => `${prefix}${iconId}`),
107+
"remixiconClassNames": icons
108+
.filter(({ prefix }) => prefix === "ri-")
109+
.map(({ iconId, prefix }) => `${prefix}${iconId}`)
110+
};
111+
})()
112+
}),
113+
``
114+
].join("\n"),
115+
"utf8"
116+
)
117+
);

src/bin/css_to_ts/icons/collectIcons.ts

Lines changed: 0 additions & 67 deletions
This file was deleted.

0 commit comments

Comments
 (0)