Skip to content

Commit

Permalink
Actually remove dependency on css
Browse files Browse the repository at this point in the history
  • Loading branch information
garronej committed Nov 4, 2022
1 parent d2dcb34 commit 1ee4349
Show file tree
Hide file tree
Showing 7 changed files with 129 additions and 125 deletions.
121 changes: 0 additions & 121 deletions src/bin/css_to_ts/icons.ts

This file was deleted.

55 changes: 55 additions & 0 deletions src/bin/css_to_ts/icons/generateIconsRawCssCode.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
import type { Icon } from "../css_to_ts";

type IconLike = Icon.Dsfr | Omit<Icon.Remixicon, "rawSvgCode">;

export function generateIconsRawCssCode(params: {
usedIcons: IconLike[];
patchedRawCssCodeForCompatWithRemixIcon: string;
}): string {
const { usedIcons, patchedRawCssCodeForCompatWithRemixIcon } = params;

const buildRule = (icon: IconLike, isHighContrast: boolean) => {
const { iconId, prefix } = icon;

const className = `${prefix}${iconId}`;

const relativePath = (() => {
switch (icon.prefix) {
case "fr-icon-":
return `../../icons/${icon.category}/${iconId}.svg`;
case "ri-":
return `../../icons/remixicon/${iconId}.svg`;
}
})();

return [
`.${className}::before,`,
`.${className}::after {`,
...(isHighContrast
? [` background-image: url("${relativePath}");`]
: [
` -webkit-mask-image: url("${relativePath}");`,
` mask-image: url("${relativePath}");`
]),
`}`,
``
]
.map(!isHighContrast ? line => line : line => ` ${line}`)
.join("\n");
};

return [
...usedIcons.map(icon => buildRule(icon, false)),
...(usedIcons.length === 0
? []
: [
`@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {`,
...usedIcons.map(icon => buildRule(icon, true)),
`}`,
``
]),
...(usedIcons.find(({ prefix }) => prefix === "ri-") === undefined
? []
: [patchedRawCssCodeForCompatWithRemixIcon])
].join("\n");
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
import { exclude } from "tsafe/exclude";
import { sep } from "path";
import * as css from "css";
import { pathOfPatchedRawCssCodeForCompatWithRemixIconRelativeToDsfrDist } from "./pathOfPatchedRawCssCodeForCompatWithRemixIconRelativeToDsfrDist";

export function getPatchedRawCssCodeForCompatWithRemixIcon(params: { rawCssCode: string }) {
const { rawCssCode } = params;

const parsedCss = css.parse(rawCssCode);

const prefixRegExp = /fr-icon-[^-]/;

(parsedCss as any).stylesheet.rules = (parsedCss as any).stylesheet.rules
.map((rule: any) => {
if (rule.type === "media") {
rule.rules = rule.rules
.map((rule: any) => {
if (rule.type !== "rule") {
return undefined;
}

if (prefixRegExp.test(rule.selectors.join(", "))) {
return rule;
}

return undefined;
})
.filter(exclude(undefined));

if (rule.rules.length === 0) {
return undefined;
}

return rule;
}

if (rule.type !== "rule") {
return undefined;
}

if (prefixRegExp.test(rule.selectors.join(", "))) {
return rule;
}

return undefined;
})
.filter(exclude(undefined));

const back =
new Array(
pathOfPatchedRawCssCodeForCompatWithRemixIconRelativeToDsfrDist.split(sep).length - 1
)
.fill("..")
.join("/") + "/";

return css
.stringify(parsedCss)
.replace(/fr-icon-/g, "ri-")
.replace(/url\("/g, `url("${back}`)
.replace(/url\('/g, `url('${back}`);
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
export * from "./getPatchedRawCssCodeForCompatWithRemixIcon";
export * from "./pathOfPatchedRawCssCodeForCompatWithRemixIconRelativeToDsfrDist";
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { join as pathJoin } from "path";

export const pathOfPatchedRawCssCodeForCompatWithRemixIconRelativeToDsfrDist = pathJoin(
"utility",
"icons",
"dsfr_remixicon.css"
);
2 changes: 2 additions & 0 deletions src/bin/css_to_ts/icons/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
export * from "./generateIconsRawCssCode";
export * from "./getPatchedRawCssCodeForCompatWithRemixIcon";
6 changes: 2 additions & 4 deletions src/bin/only_include_used_icons.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,7 @@
#!/usr/bin/env node
import { collectIcons } from "./css_to_ts";
import {
generateIconsRawCssCode,
pathOfPatchedRawCssCodeForCompatWithRemixIconRelativeToDsfrDist
} from "./css_to_ts/icons";
import { generateIconsRawCssCode } from "./css_to_ts/icons/generateIconsRawCssCode";
import { pathOfPatchedRawCssCodeForCompatWithRemixIconRelativeToDsfrDist } from "./css_to_ts/icons/getPatchedRawCssCodeForCompatWithRemixIcon/pathOfPatchedRawCssCodeForCompatWithRemixIconRelativeToDsfrDist";
import { getProjectRoot } from "./tools/getProjectRoot";
import * as fs from "fs";
import { join as pathJoin } from "path";
Expand Down

0 comments on commit 1ee4349

Please sign in to comment.