@diskette/palette 0.19.0 → 0.20.0

package/dist/index.js

@@ -64,5 +64,5 @@ export const colors = {
 };
 export default colors;
 export { accentColors, grayColors } from "./types.js";
-export { css } from "./css.js";
+export { applyColorVars, css } from "./css.js";
 export { getMatchingGrayColor, toVarName } from "./utils.js";

package/dist/types.d.ts

@@ -4,28 +4,32 @@ export declare const accentColors: readonly ["gray", "gold", "bronze", "brown",
 export type AccentColor = (typeof accentColors)[number];
 export type Color = AccentColor | GrayColor;
 type Tuple<T, N extends number, R extends T[] = []> = R['length'] extends N ? R : Tuple<T, N, [...R, T]>;
-type ScaleSteps = Tuple<string, 24>;
+export type ScaleSteps = Tuple<string, 12>;
+export interface ColorScale {
+    solid: ScaleSteps;
+    alpha: ScaleSteps;
+}
 export interface PaletteColor<C extends Color> {
     name: C;
-    srgb: {
-        light: ScaleSteps;
-        dark: ScaleSteps;
+    contrast: string;
+    indicator: number;
+    track: number;
+    light: {
+        srgb: ColorScale;
+        p3: ColorScale;
     };
-    p3: {
-        light: ScaleSteps;
-        dark: ScaleSteps;
+    dark: {
+        srgb: ColorScale;
+        p3: ColorScale;
     };
-    contrast: string;
-    indicator: string;
-    track: string;
     surface: {
-        srgb: {
-            light: string;
-            dark: string;
+        light: {
+            srgb: string;
+            p3: string;
         };
-        p3: {
-            light: string;
-            dark: string;
+        dark: {
+            srgb: string;
+            p3: string;
         };
     };
 }

package/dist/utils.d.ts

@@ -1,5 +1,4 @@
 import type { AccentColor, GrayColor } from './types.ts';
-export declare function writeFileIfNotExists(path: string, data: string | NodeJS.ArrayBufferView): boolean;
 export declare function getMatchingGrayColor(accentColor: AccentColor): GrayColor;
 export declare const LIGHT_SELECTOR = ":root, .light, .light-theme";
 export declare const DARK_SELECTOR = ".dark, .dark-theme";
@@ -9,3 +8,12 @@ export declare const toVarName: (key: string) => string;
 export declare const formatRule: (selector: string, vars: string[]) => string;
 export declare const formatP3: (selector: string, vars: string[]) => string;
 export declare const formatNestedBlock: (selector: string, vars: string[]) => string;
+/**
+ * get package.json content from startDir
+ * @param cwd
+ * @returns package.json content
+ */
+export declare const getPackageJson: (cwd: string) => {
+    pkg: any;
+    packageJsonPath: string;
+} | undefined;

package/dist/utils.js

@@ -1,11 +1,7 @@
-import { existsSync, writeFileSync } from 'node:fs';
-export function writeFileIfNotExists(path, data) {
-    if (existsSync(path)) {
-        return false;
-    }
-    writeFileSync(path, data);
-    return true;
-}
+import fs from 'node:fs';
+import { createRequire } from 'node:module';
+import path from 'node:path';
+import * as url from 'node:url';
 export function getMatchingGrayColor(accentColor) {
     switch (accentColor) {
         case 'tomato':
@@ -51,3 +47,43 @@ export const toVarName = (key) => `--${key.replace(/A?(\d+)/, (m, n) => (m.start
 export const formatRule = (selector, vars) => `${selector} {\n  ${vars.join(';\n  ')};\n}`;
 export const formatP3 = (selector, vars) => `@supports (color: color(display-p3 1 1 1)) {\n  @media (color-gamut: p3) {\n    ${selector} {\n      ${vars.join(';\n      ')};\n    }\n  }\n}`;
 export const formatNestedBlock = (selector, vars) => `&:where(${selector}) {\n    ${vars.join(';\n    ')};\n  }`;
+const require = createRequire(import.meta.url);
+/**
+ * get package.json content from startDir
+ * @param cwd
+ * @returns package.json content
+ */
+export const getPackageJson = (cwd) => {
+    try {
+        const startDir = path.dirname(url.fileURLToPath(cwd));
+        const packageJsonPath = findPackageJson(startDir);
+        if (packageJsonPath) {
+            const pkg = require(packageJsonPath);
+            return { pkg, packageJsonPath };
+        }
+        return undefined;
+    }
+    catch (error) {
+        // ignore error
+        return undefined;
+    }
+};
+/**
+ * search package.json from startDir
+ * @param startDir
+ * @returns
+ */
+const findPackageJson = (startDir) => {
+    let currentDir = startDir;
+    while (true) {
+        const packageJsonPath = path.join(currentDir, 'package.json');
+        if (fs.existsSync(packageJsonPath)) {
+            return packageJsonPath;
+        }
+        const parentDir = path.resolve(currentDir, '..');
+        if (parentDir === currentDir) {
+            return '';
+        }
+        currentDir = parentDir;
+    }
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@diskette/palette",
   "type": "module",
-  "version": "0.19.0",
+  "version": "0.20.0",
   "bin": {
     "palette": "./dist/cli/cli.js"
   },
@@ -23,12 +23,13 @@
     "dist"
   ],
   "dependencies": {
-    "cleye": "^2.0.1",
-    "type-flag": "^4.0.2"
+    "citty": "^0.1.6"
   },
   "devDependencies": {
     "@changesets/cli": "^2.29.7",
+    "@diskette/fs": "^0.17.0",
     "@types/node": "^24.3.0",
+    "magicast": "^0.5.1",
     "oxlint": "^1.16.0",
     "oxlint-tsgolint": "^0.2.0",
     "prettier": "^3.6.2",

package/dist/cli/commands/generate.d.ts

@@ -1,54 +0,0 @@
-export declare const generate: import("cleye").Command<{
-    name: "generate";
-    alias: "gen";
-    parameters: "[colors]"[];
-    flags: {
-        accents: {
-            type: BooleanConstructor;
-            alias: string;
-            description: string;
-            default: boolean;
-        };
-        output: {
-            type: StringConstructor;
-            alias: string;
-            description: string;
-        };
-    };
-    help: {
-        description: string;
-        examples: string[];
-    };
-}, {
-    command: "generate";
-} & import("type-flag").TypeFlag<{
-    accents: {
-        type: BooleanConstructor;
-        alias: string;
-        description: string;
-        default: boolean;
-    };
-    output: {
-        type: StringConstructor;
-        alias: string;
-        description: string;
-    };
-} & {
-    help: BooleanConstructor;
-}> & {
-    _: {
-        colors: string | undefined;
-    };
-    showHelp: (options?: {
-        version?: string;
-        description?: string;
-        usage?: false | string | string[];
-        examples?: string | string[];
-        render?: (nodes: {
-            id?: string;
-            type: keyof import("cleye").Renderers;
-            data: any;
-        }[], renderers: import("cleye").Renderers) => string;
-    }) => void;
-    showVersion: () => void;
-}>;

package/dist/cli/commands/generate.js

@@ -1,86 +0,0 @@
-import { command } from 'cleye';
-import { mkdirSync } from 'node:fs';
-import { resolve } from 'node:path';
-import * as palette from "../../colors/index.js";
-import { css } from "../../css.js";
-import { accentColors, grayColors } from "../../types.js";
-import { writeFileIfNotExists } from "../../utils.js";
-// Combined list of all colors (deduplicated since 'gray' appears in both)
-const allColors = [...new Set([...accentColors, ...grayColors])];
-function parseColors(input, available) {
-    if (!input)
-        return [];
-    if (input === 'all')
-        return [...available];
-    return input.split(',').filter((c) => available.includes(c));
-}
-export const generate = command({
-    name: 'generate',
-    alias: 'gen',
-    parameters: ['[colors]'],
-    flags: {
-        accents: {
-            type: Boolean,
-            alias: 'a',
-            description: 'Generate accents.css with semantic accent tokens',
-            default: false,
-        },
-        output: {
-            type: String,
-            alias: 'o',
-            description: 'Output directory',
-        },
-    },
-    help: {
-        description: 'Generate CSS files for color palettes',
-        examples: [
-            'palette generate blue,red,slate -a -o ./styles',
-            'palette gen all -a -o ./styles',
-        ],
-    },
-}, (argv) => {
-    if (!argv.flags.output) {
-        console.error('Error: --output (-o) is required');
-        process.exit(1);
-    }
-    const selectedColors = parseColors(argv._.colors, allColors);
-    if (selectedColors.length === 0) {
-        console.error('No colors selected.');
-        console.error('Run "palette list" to see available colors.');
-        process.exit(1);
-    }
-    const outputPath = resolve(process.cwd(), argv.flags.output);
-    mkdirSync(outputPath, { recursive: true });
-    for (const name of selectedColors) {
-        const color = palette[name];
-        writeFileIfNotExists(`${outputPath}/${name}.css`, css.palette(color, { schemes: ['light'], alpha: true }));
-        writeFileIfNotExists(`${outputPath}/${name}-dark.css`, css.palette(color, { schemes: ['dark'], alpha: true }));
-        console.log(`  ${name}.css, ${name}-dark.css`);
-    }
-    writeFileIfNotExists(`${outputPath}/black-alpha.css`, css.alpha(palette.blackAlpha));
-    writeFileIfNotExists(`${outputPath}/white-alpha.css`, css.alpha(palette.whiteAlpha));
-    console.log('  black-alpha.css, white-alpha.css');
-    if (argv.flags.accents) {
-        // Partition selected colors: gray is treated as accent, other grayColors are grays
-        const selectedAccents = selectedColors.filter((c) => accentColors.includes(c));
-        const selectedGrays = selectedColors.filter((c) => c !== 'gray' && grayColors.includes(c));
-        const accents = css.accents(selectedAccents);
-        const grays = css.grays(selectedGrays, 'diskette-palette');
-        writeFileIfNotExists(`${outputPath}/accents.css`, `${accents}\n${grays}`);
-        console.log('  accents.css');
-    }
-    const imports = [
-        ...(argv.flags.accents ? ['./accents.css'] : []),
-        ...selectedColors.flatMap((name) => [
-            `./${name}.css`,
-            `./${name}-dark.css`,
-        ]),
-        './black-alpha.css',
-        './white-alpha.css',
-    ]
-        .map((path) => `@import '${path}';`)
-        .join('\n');
-    writeFileIfNotExists(`${outputPath}/index.css`, `${imports}\n\n${css.tailwind(['white', 'black', 'accent', ...selectedColors])}`);
-    console.log('  index.css');
-    console.log(`\nCSS saved to ${outputPath}`);
-});

package/dist/cli/commands/list.d.ts

@@ -1,48 +0,0 @@
-export declare const list: import("cleye").Command<{
-    name: "list";
-    alias: "ls";
-    flags: {
-        accent: {
-            type: BooleanConstructor;
-            description: string;
-            default: boolean;
-        };
-        gray: {
-            type: BooleanConstructor;
-            description: string;
-            default: boolean;
-        };
-    };
-    help: {
-        description: string;
-    };
-}, {
-    command: "list";
-} & import("type-flag").TypeFlag<{
-    accent: {
-        type: BooleanConstructor;
-        description: string;
-        default: boolean;
-    };
-    gray: {
-        type: BooleanConstructor;
-        description: string;
-        default: boolean;
-    };
-} & {
-    help: BooleanConstructor;
-}> & {
-    _: {};
-    showHelp: (options?: {
-        version?: string;
-        description?: string;
-        usage?: false | string | string[];
-        examples?: string | string[];
-        render?: (nodes: {
-            id?: string;
-            type: keyof import("cleye").Renderers;
-            data: any;
-        }[], renderers: import("cleye").Renderers) => string;
-    }) => void;
-    showVersion: () => void;
-}>;

package/dist/cli/commands/list.js

@@ -1,33 +0,0 @@
-import { command } from 'cleye';
-import { accentColors, grayColors } from "../../index.js";
-export const list = command({
-    name: 'list',
-    alias: 'ls',
-    flags: {
-        accent: {
-            type: Boolean,
-            description: 'List only accent colors',
-            default: false,
-        },
-        gray: {
-            type: Boolean,
-            description: 'List only gray colors',
-            default: false,
-        },
-    },
-    help: {
-        description: 'List available colors',
-    },
-}, (argv) => {
-    const showAll = !argv.flags.accent && !argv.flags.gray;
-    if (showAll || argv.flags.accent) {
-        console.log('Accent colors:');
-        console.log(`  ${accentColors.join(', ')}`);
-    }
-    if (showAll)
-        console.log();
-    if (showAll || argv.flags.gray) {
-        console.log('Gray colors:');
-        console.log(`  ${grayColors.filter((g) => g !== 'gray').join(', ')}`);
-    }
-});