feat: refactored CLI into sub commands
This commit is contained in:
parent
c4b5c02417
commit
fb6d27f18a
3
package-lock.json
generated
3
package-lock.json
generated
|
@ -9,7 +9,8 @@
|
||||||
"version": "0.1.0",
|
"version": "0.1.0",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@priduck-color-theme/cli": "^0.0.1"
|
"@priduck-color-theme/cli": "^0.0.1",
|
||||||
|
"yargs": "^17.7.2"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"mkdirp": "^3.0.1"
|
"mkdirp": "^3.0.1"
|
||||||
|
|
|
@ -16,6 +16,7 @@
|
||||||
"mkdirp": "^3.0.1"
|
"mkdirp": "^3.0.1"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@priduck-color-theme/cli": "^0.0.1"
|
"@priduck-color-theme/cli": "^0.0.1",
|
||||||
|
"yargs": "^17.7.2"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
12
src/cli.mjs
Normal file
12
src/cli.mjs
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
import yargs from "yargs";
|
||||||
|
import { hideBin } from "yargs/helpers";
|
||||||
|
import * as cssCmd from "./cmds/css.mjs";
|
||||||
|
|
||||||
|
// Set up the top-level command.
|
||||||
|
yargs(hideBin(process.argv))
|
||||||
|
.scriptName("priduck")
|
||||||
|
.usage("$0 <cmd> [args]")
|
||||||
|
.command(cssCmd)
|
||||||
|
.demand(2)
|
||||||
|
.help()
|
||||||
|
.parse();
|
10
src/cmds/css.mjs
Normal file
10
src/cmds/css.mjs
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
import * as variablesCmd from "./css/variables.mjs";
|
||||||
|
|
||||||
|
export const command = "css";
|
||||||
|
export const desc = "Generate CSS files";
|
||||||
|
|
||||||
|
export function builder(yargv) {
|
||||||
|
yargv.command(variablesCmd).demand(2);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function handler(argv) {}
|
69
src/cmds/css/variables.mjs
Normal file
69
src/cmds/css/variables.mjs
Normal file
|
@ -0,0 +1,69 @@
|
||||||
|
import { mkdirp } from "mkdirp";
|
||||||
|
import { fileURLToPath } from "url";
|
||||||
|
import path from "path";
|
||||||
|
import fs from "node:fs/promises";
|
||||||
|
|
||||||
|
export const command = "variables [path.css]";
|
||||||
|
export const desc = "Generate a CSS file that uses variables to generate";
|
||||||
|
|
||||||
|
export function builder(argv) {
|
||||||
|
argv
|
||||||
|
.option("c", {
|
||||||
|
alias: "hue",
|
||||||
|
default: 220,
|
||||||
|
describe: "The hue (0-360) for the base color",
|
||||||
|
type: "number",
|
||||||
|
})
|
||||||
|
.option("o", {
|
||||||
|
alias: "output",
|
||||||
|
demandOption: true,
|
||||||
|
describe: "The output path for colors.css",
|
||||||
|
type: "string",
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function handler(argv) {
|
||||||
|
// Figure out where we need to write the files.
|
||||||
|
const file = argv.output;
|
||||||
|
const dir = path.dirname(file);
|
||||||
|
|
||||||
|
console.log("writing", file);
|
||||||
|
|
||||||
|
await mkdirp(dir);
|
||||||
|
|
||||||
|
// Start with the basic CSS header.
|
||||||
|
let lines = [":root {"];
|
||||||
|
|
||||||
|
// We have ten colors, with 0 being the base hue and the others being evenly
|
||||||
|
// rotated around the color wheel.
|
||||||
|
for (let color = 0; color < 10; color++) {
|
||||||
|
// Figure out the rotation.
|
||||||
|
const rotation = color * 36; // 1/10th of a circle
|
||||||
|
|
||||||
|
// For each hue, we have ten levels of brightness ranging from very dark
|
||||||
|
// to very light.
|
||||||
|
for (let brightness = 0; brightness < 10; brightness++) {
|
||||||
|
// We use a standard code (--color-cXbY) for our codes.
|
||||||
|
const code = `--color-priduck-c${color}b${brightness}`;
|
||||||
|
|
||||||
|
// Figure out the ramps we are using for brighteness.
|
||||||
|
const l = brightness * 11;
|
||||||
|
const s = 50 - brightness * 5;
|
||||||
|
|
||||||
|
// Write out the CSS.
|
||||||
|
lines.push(
|
||||||
|
` ${code}: lch(${l.toFixed(1)} ${s.toFixed(
|
||||||
|
1,
|
||||||
|
)} calc(var(--color-priduck-hue) + ${rotation}));`,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Finish up the lines.
|
||||||
|
lines.push("}");
|
||||||
|
|
||||||
|
// Write out the files.
|
||||||
|
await fs.writeFile(file, Buffer.from(lines.join("\n")));
|
||||||
|
|
||||||
|
console.log("wrote", file);
|
||||||
|
}
|
|
@ -1,50 +0,0 @@
|
||||||
import { mkdirp } from "mkdirp";
|
|
||||||
import { fileURLToPath } from "url";
|
|
||||||
import path from "path";
|
|
||||||
import fs from "node:fs/promises";
|
|
||||||
|
|
||||||
// Figure out where we need to write the files.
|
|
||||||
const __dirname = path.dirname(fileURLToPath(import.meta.url));
|
|
||||||
const distPath = __dirname + "/..";
|
|
||||||
|
|
||||||
console.log("writing", distPath);
|
|
||||||
|
|
||||||
await mkdirp(distPath);
|
|
||||||
|
|
||||||
// Start with the basic CSS header.
|
|
||||||
let lines = [":root {"];
|
|
||||||
|
|
||||||
// We have ten colors, with 0 being the base hue and the others being evenly
|
|
||||||
// rotated around the color wheel.
|
|
||||||
for (let color = 0; color < 10; color++) {
|
|
||||||
// Figure out the rotation.
|
|
||||||
const rotation = color * 36; // 1/10th of a circle
|
|
||||||
|
|
||||||
// For each hue, we have ten levels of brightness ranging from very dark
|
|
||||||
// to very light.
|
|
||||||
for (let brightness = 0; brightness < 10; brightness++) {
|
|
||||||
// We use a standard code (--color-cXbY) for our codes.
|
|
||||||
const code = `--color-priduck-c${color}b${brightness}`;
|
|
||||||
|
|
||||||
// Figure out the ramps we are using for brighteness.
|
|
||||||
const l = brightness * 11;
|
|
||||||
const s = 50 - brightness * 5;
|
|
||||||
|
|
||||||
// Write out the CSS.
|
|
||||||
lines.push(
|
|
||||||
` ${code}: lch(${l.toFixed(1)} ${s.toFixed(
|
|
||||||
1,
|
|
||||||
)} calc(var(--color-priduck-hue) + ${rotation}));`,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Finish up the lines.
|
|
||||||
lines.push("}");
|
|
||||||
|
|
||||||
// Write out the files.
|
|
||||||
const colorsPath = path.join(distPath, "colors.css");
|
|
||||||
|
|
||||||
await fs.writeFile(colorsPath, Buffer.from(lines.join("\n")));
|
|
||||||
|
|
||||||
console.log("wrote", colorsPath);
|
|
Loading…
Reference in a new issue