chore: script file to generate prefix
MODIFY
CONTRIBUTING.md
CONTRIBUTING.md
@@ -180,3 +180,13 @@ The `category` is one of the category folders inside the `language` folders.
```
The created files will be displayed in the console output.
+
+### `compiler-create-prefix`
+
+This is used to generate a new prefix boilerplate
+
+```bash
+./script compiler-create-prefix [prefixName]
+```
+
+Prefix names with dashes are preferable.

MODIFY
internal/compiler/transforms/compile/css-handler/prefix/index.ts
internal/compiler/transforms/compile/css-handler/prefix/index.ts
-/* GENERATED:START(hash:5fb179e874f73fc64e32026cfd46a65fd59630e1,id:main) Everything below is automatically generated. DO NOT MODIFY. Run `./rome run scripts/generated-files/lint-rules` to update. */
+/* GENERATED:START(hash:5fb179e874f73fc64e32026cfd46a65fd59630e1,id:main) Everything below is automatically generated. DO NOT MODIFY. Run `./rome run scripts/generated-files/css-prefix` to update. */
import display from "./prefixes/display";
import transform from "./prefixes/transform";
import transition from "./prefixes/transition";

MODIFY
internal/path/classes/AbsoluteFilePath.ts
internal/path/classes/AbsoluteFilePath.ts
@@ -362,6 +362,7 @@ export default class AbsoluteFilePath
}
public async createDirectory(): Promise<void> {
+ if (await this.notExists()) {
await fs.promises.mkdir(
this.join(),
{
@@ -369,6 +370,7 @@ export default class AbsoluteFilePath
},
);
}
+ }
public openFile(
flags: fs.OpenMode = "r",

MODIFY
scripts/_utils.ts
scripts/_utils.ts
@@ -231,7 +231,13 @@ async function formatFile(
);
}
+export async function createDirectory(path: AbsoluteFilePath) {
+ await path.createDirectory();
+ reporter.success(markup`Wrote directory <emphasis>${path}</emphasis>`);
+}
+
export async function writeFile(path: AbsoluteFilePath, sourceText: string) {
+ try {
sourceText = await formatFile(path, sourceText);
// Windows: `content` will always have `\r` stripped so add it back
@@ -242,6 +248,9 @@ export async function writeFile(path: AbsoluteFilePath, sourceText: string) {
// Write
await path.writeFile(sourceText);
reporter.success(markup`Wrote <emphasis>${path}</emphasis>`);
+ } catch (e) {
+ reporter.error(e.message);
+ }
}
export function waitChildProcess(

ADD
scripts/compiler-create-prefix.ts
+import {INTERNAL, ROOT, createDirectory, reporter, writeFile} from "./_utils";
+import {dedent} from "@internal/string-utils";
+import {main as generatedPrefixes} from "./generated-files/css-prefix";
+import {markup} from "@internal/markup";
+
+const basePath = INTERNAL.append("compiler", "transforms", "compile");
+const compilerPath = basePath.append("css-handler", "prefix", "prefixes");
+const testPath = basePath.append("test-fixtures", "css-handler", "prefix");
+
+export async function main([propertyName]: string[]): Promise<number> {
+ if (propertyName === undefined) {
+ reporter.error(markup`./script compiler-create-prefix [prefixName]`);
+ return 1;
+ }
+
+ // Write rule
+ await writeFile(
+ compilerPath.append(`${propertyName}.ts`),
+ dedent`
+ import {
+ createPrefixVisitor,
+ prefixCSSProperty,
+ } from "@internal/compiler/transforms/compile/css-handler/prefix/utils";
+
+ export default [
+ createPrefixVisitor({
+ name: "${propertyName}",
+ enter(path) {
+ return prefixCSSProperty({
+ path,
+ propertyName: "${propertyName}",
+ browserFeaturesKey: "",
+ });
+ },
+ }),
+ ];
+ `,
+ );
+
+ const fileName = testPath.append(propertyName);
+ await createDirectory(fileName);
+
+ // Write test fixture
+ await writeFile(
+ fileName.append("input.css"),
+ dedent`
+ .style {
+ ${propertyName}: none;
+ }
+ `,
+ );
+
+ // Write docs
+ await writeFile(
+ ROOT.append(
+ "website",
+ "src",
+ "docs",
+ "css-handler",
+ "prefix",
+ `${propertyName}.md`,
+ ),
+ dedent`
+ ---
+ title: Prefix ${propertyName}
+ layout: layouts/prefix.liquid
+ showHero: false
+ description: MISSING DOCUMENTATION
+ eleventyNavigation:
+ key: css-handler/prefix/${propertyName}
+ parent: css-handler
+ title: ${propertyName}
+ ---
+
+ # ${propertyName}
+
+ MISSING DOCUMENTATION
+ `,
+ );
+
+ // TODO: check later
+ // Add description
+ // const diagDescriptionsPath = INTERNAL.append(
+ // "diagnostics",
+ // "descriptions",
+ // "lint.ts",
+ // );
+ // let descriptions = await diagDescriptionsPath.readFileText();
+ // let message = "markup`INSERT MESSAGE HERE`";
+ // descriptions = descriptions.replace(
+ // "createDiagnosticsCategory({",
+ // `createDiagnosticsCategory({\n ${descriptionKey}: {
+ // category: DIAGNOSTIC_CATEGORIES["${categoryName}"],
+ // message: ${message},
+ // },`,
+ // );
+ // await writeFile(diagDescriptionsPath, descriptions);
+
+ await generatedPrefixes();
+
+ return 0;
+}

MODIFY
scripts/generated-files/css-prefix.ts
scripts/generated-files/css-prefix.ts
import {INTERNAL, modifyGeneratedFile} from "../_utils";
+import {toCamelCase} from "@internal/string-utils";
const cssPrefixFolder = INTERNAL.append(
"compiler",
@@ -36,17 +37,19 @@ export async function main() {
await modifyGeneratedFile(
{
path: cssPrefixFolder.append("index.ts"),
- scriptName: "generated-files/lint-rules",
+ scriptName: "generated-files/css-prefix",
},
async () => {
let lines = [];
for (const {basename} of defs) {
- lines.push(`import ${basename} from "./prefixes/${basename}";`);
+ lines.push(
+ `import ${toCamelCase(basename)} from "./prefixes/${basename}";`,
+ );
}
lines.push("");
lines.push("export default [");
for (const {basename} of defs) {
- lines.push(`\t...${basename},`);
+ lines.push(`\t...${toCamelCase(basename)},`);
}
lines.push("];");

MODIFY
scripts/lint-create-rule.ts
scripts/lint-create-rule.ts
@@ -7,9 +7,7 @@ const rulesPath = INTERNAL.append("compiler", "lint", "rules");
export async function main([ruleName]: string[]): Promise<number> {
if (ruleName === undefined) {
- reporter.error(
- markup`./rome run scripts/ast-create-node scripts/lint/add.cjs [ruleName]`,
- );
+ reporter.error(markup`./scripts lint-create-node [ruleName]`);
return 1;
}

ADD
website/src/_includes/layouts/prefix.liquid
+---
+layout: layouts/base.liquid
+social-image: social-logo.png
+---
+
+<main id="main-content" class="content single">
+ <section>
+
+ {{ content | safe }}
+
+ </section>
+</main>

ADD
website/src/docs/css-handler/index.md
+---
+title: CSS Handler
+layout: layouts/page.liquid
+layout-type: split
+main-class: css-handler
+eleventyNavigation:
+key: css-handler
+---

chore: script file to generate prefix (#1424)