@seyuna/postcss 1.0.0-canary.27 → 1.0.0-canary.29

package/dist/config.js

@@ -1,87 +1,42 @@
-import fs from 'fs';
-import path from 'path';
 const DEFAULT_OPTIONS = {
-    configPath: 'seyuna.json',
-    modeAttribute: 'data-mode',
+    configPath: "seyuna.json",
+    modeAttribute: "data-mode",
     strict: false,
     config: undefined,
     functions: undefined,
 };
-let cachedConfig = null;
-let cachedConfigPath = null;
 export function loadConfig(options = {}) {
     const mergedOptions = { ...DEFAULT_OPTIONS, ...options };
     if (mergedOptions.config) {
         return { config: mergedOptions.config, options: mergedOptions };
     }
-    const configPath = path.resolve(process.cwd(), mergedOptions.configPath);
-    // Cache config if it's the same path
-    if (cachedConfig && cachedConfigPath === configPath) {
-        return { config: cachedConfig, options: mergedOptions };
-    }
-    try {
-        if (!fs.existsSync(configPath)) {
-            if (mergedOptions.strict) {
-                throw new Error(`Seyuna config not found at ${configPath}`);
-            }
-            return {
-                config: { ui: { theme: { hues: {}, light: { colors: {} }, dark: { colors: {} } } } },
-                options: mergedOptions,
-            };
-        }
-        const data = JSON.parse(fs.readFileSync(configPath, 'utf-8'));
-        cachedConfig = data;
-        cachedConfigPath = configPath;
-        return { config: data, options: mergedOptions };
-    }
-    catch (error) {
-        if (mergedOptions.strict) {
-            throw error;
-        }
-        console.warn(`[Seyuna PostCSS] Warning: Failed to load config: ${error instanceof Error ? error.message : String(error)}`);
-        return {
-            config: { ui: { theme: { hues: {}, light: { colors: {} }, dark: { colors: {} } } } },
-            options: mergedOptions,
-        };
-    }
+    // Return base empty config - we'll populate it from CSS
+    return {
+        config: {
+            ui: {
+                theme: {
+                    hues: {},
+                    colors: {},
+                    light: {
+                        chroma: 0,
+                        lightness: 0,
+                        background: { lightness: 0, chroma: 0, hue: 0 },
+                        text: { lightness: 0, chroma: 0, hue: 0 },
+                        colors: {},
+                    },
+                    dark: {
+                        chroma: 0,
+                        lightness: 0,
+                        background: { lightness: 0, chroma: 0, hue: 0 },
+                        text: { lightness: 0, chroma: 0, hue: 0 },
+                        colors: {},
+                    },
+                },
+            },
+        },
+        options: mergedOptions,
+    };
 }
 export async function loadConfigAsync(options = {}) {
-    const mergedOptions = { ...DEFAULT_OPTIONS, ...options };
-    if (mergedOptions.config) {
-        return { config: mergedOptions.config, options: mergedOptions };
-    }
-    const configPath = path.resolve(process.cwd(), mergedOptions.configPath);
-    // Cache config if it's the same path
-    if (cachedConfig && cachedConfigPath === configPath) {
-        return { config: cachedConfig, options: mergedOptions };
-    }
-    try {
-        try {
-            await fs.promises.access(configPath);
-        }
-        catch {
-            if (mergedOptions.strict) {
-                throw new Error(`Seyuna config not found at ${configPath}`);
-            }
-            return {
-                config: { ui: { theme: { hues: {}, light: { colors: {} }, dark: { colors: {} } } } },
-                options: mergedOptions,
-            };
-        }
-        const content = await fs.promises.readFile(configPath, 'utf-8');
-        const data = JSON.parse(content);
-        cachedConfig = data;
-        cachedConfigPath = configPath;
-        return { config: data, options: mergedOptions };
-    }
-    catch (error) {
-        if (mergedOptions.strict) {
-            throw error;
-        }
-        console.warn(`[Seyuna PostCSS] Warning: Failed to load config: ${error instanceof Error ? error.message : String(error)}`);
-        return {
-            config: { ui: { theme: { hues: {}, light: { colors: {} }, dark: { colors: {} } } } },
-            options: mergedOptions,
-        };
-    }
+    return loadConfig(options);
 }

package/dist/types.d.ts

@@ -34,14 +34,12 @@ export type Mode = "system" | "light" | "dark";
  */
 export interface UI {
     theme: Theme;
-    mode: Mode;
     output_dir?: string;
 }
 /**
  * Root configuration structure for a Seyuna project.
  */
 export interface SeyunaConfig {
-    license?: string;
     ui?: UI;
 }
 export type FunctionMap = Record<string, (context: PluginContext, ...args: string[]) => string>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seyuna/postcss",
-  "version": "1.0.0-canary.27",
+  "version": "1.0.0-canary.29",
   "description": "Seyuna UI's postcss plugin",
   "type": "module",
   "main": "dist/index.js",

package/src/at-rules/config.ts

@@ -0,0 +1,78 @@
+import { PluginContext } from "../types.js";
+
+/**
+ * Handler for @config "seyuna"
+ * Parses the configuration defined directly in CSS.
+ */
+export function handleConfig(atRule: any, context: PluginContext) {
+  const params = atRule.params.replace(/['"]/g, "");
+
+  if (params === "seyuna") {
+    const { config } = context;
+    if (!config.ui) {
+      config.ui = {
+        theme: {
+          hues: {},
+          colors: {},
+          light: {
+            chroma: 0,
+            lightness: 0,
+            background: { lightness: 0, chroma: 0, hue: 0 },
+            text: { lightness: 0, chroma: 0, hue: 0 },
+            colors: {},
+          },
+          dark: {
+            chroma: 0,
+            lightness: 0,
+            background: { lightness: 0, chroma: 0, hue: 0 },
+            text: { lightness: 0, chroma: 0, hue: 0 },
+            colors: {},
+          },
+        },
+      };
+    }
+
+    const theme = config.ui.theme;
+
+    atRule.walkDecls((decl: any) => {
+      const prop = decl.prop;
+      const value = decl.value;
+
+      // Hues: --hue-alpha: 0;
+      if (prop.startsWith("--hue-")) {
+        const name = prop.replace("--hue-", "");
+        theme.hues[name] = parseFloat(value);
+      }
+
+      // Fixed Colors: --color-primary: 0.66 0.26 240;
+      else if (prop.startsWith("--color-")) {
+        const name = prop.replace("--color-", "");
+        const [l, c, h] = value.split(/\s+/).map(parseFloat);
+        theme.colors[name] = { lightness: l, chroma: c, hue: h };
+      }
+
+      // Theme Palettes: --light-lightness: 0.66;
+      else if (prop.startsWith("--light-") || prop.startsWith("--dark-")) {
+        const isLight = prop.startsWith("--light-");
+        const palette = isLight ? theme.light : theme.dark;
+        const key = prop.replace(isLight ? "--light-" : "--dark-", "");
+
+        if (key === "lightness") palette.lightness = parseFloat(value);
+        else if (key === "chroma") palette.chroma = parseFloat(value);
+        else if (key === "background" || key === "text") {
+          const [l, c, h] = value.split(/\s+/).map(parseFloat);
+          (palette as any)[key] = { lightness: l, chroma: c, hue: h };
+        } else {
+          // Custom colors in palette: --light-surface: 1 0 0;
+          // Also supports overrides like --light-color-primary: 0.8 0.1 240;
+          const cleanKey = key.replace(/^color-/, "");
+          const [l, c, h] = value.split(/\s+/).map(parseFloat);
+          palette.colors[cleanKey] = { lightness: l, chroma: c, hue: h };
+        }
+      }
+    });
+
+    // Remove the at-rule from CSS output
+    atRule.remove();
+  }
+}

package/src/at-rules/import.ts

@@ -10,10 +10,6 @@ import postcss from "postcss";
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
-const STANDARD_HUES = [
-  'alpha', 'beta', 'gamma', 'delta', 'epsilon', 'zeta', 'eta', 'theta', 'iota', 'kappa', 'lambda', 'mu', 'nu', 'xi', 'omicron', 'pi', 'rho', 'sigma', 'tau', 'upsilon', 'phi', 'chi', 'psi', 'omega'
-];
-
 /**
  * Handler for @import "seyuna"
  * Injects the core Seyuna Design System variables and base styles
@@ -56,14 +52,12 @@ export function handleImport(atRule: any, context: PluginContext) {
     // 2. Global Hues and Base Colors (:root)
     const rootRule = new Rule({ selector: ":root", source: atRule.source });
     
-    // Process all hues from config plus defaults
-    const allHues = new Set([...STANDARD_HUES, ...Object.keys(theme.hues || {})]);
-    allHues.forEach((name) => {
-        const i = STANDARD_HUES.indexOf(name);
-        const defaultValue = i !== -1 ? i * 15 : 0;
-        const value = (theme.hues && theme.hues[name] !== undefined) ? theme.hues[name] : defaultValue;
-        rootRule.append(new Declaration({ prop: `--${name}-hue`, value: String(value) }));
-    });
+    // Process all hues from config
+    if (theme.hues) {
+        for (const [name, value] of Object.entries(theme.hues)) {
+             rootRule.append(new Declaration({ prop: `--${name}-hue`, value: String(value) }));
+        }
+    }
 
     // Add shared colors from theme.colors
     if (theme.colors) {

package/src/at-rules/index.ts

@@ -3,6 +3,7 @@ import { eachStandardColor, eachFixedColor } from "./color.js";
 import container from "./container.js";
 import { light, dark } from "./color-scheme.js";
 import { handleImport } from "./import.js";
+import { handleConfig } from "./config.js";
 import { PluginContext } from "../types.js";
 
 // Each handler has a name (matches the at-rule) and the function
@@ -13,6 +14,7 @@ export interface AtRuleHandler {
 
 // Ordered array ensures execution order
 export const atRuleHandlers: AtRuleHandler[] = [
+  { name: "config", handler: handleConfig },
   { name: "import", handler: handleImport },
   { name: "each-standard-color", handler: eachStandardColor },
   { name: "each-fixed-color", handler: eachFixedColor },

package/src/config.ts

@@ -1,104 +1,63 @@
-import fs from 'fs';
-import path from 'path';
-import { SeyunaConfig, PluginOptions, PluginContext, FunctionMap } from './types.js';
+import fs from "fs";
+import path from "path";
+import {
+  SeyunaConfig,
+  PluginOptions,
+  PluginContext,
+  FunctionMap,
+} from "./types.js";
 
 // Re-export types for backwards compatibility
-export type { PluginOptions, PluginContext, FunctionMap } from './types.js';
+export type { PluginOptions, PluginContext, FunctionMap } from "./types.js";
 
 const DEFAULT_OPTIONS: Required<PluginOptions> = {
-  configPath: 'seyuna.json',
-  modeAttribute: 'data-mode',
+  configPath: "seyuna.json",
+  modeAttribute: "data-mode",
   strict: false,
   config: undefined as any,
   functions: undefined as any,
 };
 
-let cachedConfig: SeyunaConfig | null = null;
-let cachedConfigPath: string | null = null;
-
-export function loadConfig(options: PluginOptions = {}): { config: SeyunaConfig, options: Required<PluginOptions> } {
+export function loadConfig(options: PluginOptions = {}): {
+  config: SeyunaConfig;
+  options: Required<PluginOptions>;
+} {
   const mergedOptions = { ...DEFAULT_OPTIONS, ...options };
 
   if (mergedOptions.config) {
     return { config: mergedOptions.config, options: mergedOptions };
   }
 
-  const configPath = path.resolve(process.cwd(), mergedOptions.configPath);
-
-  // Cache config if it's the same path
-  if (cachedConfig && cachedConfigPath === configPath) {
-    return { config: cachedConfig, options: mergedOptions };
-  }
-
-  try {
-    if (!fs.existsSync(configPath)) {
-      if (mergedOptions.strict) {
-        throw new Error(`Seyuna config not found at ${configPath}`);
-      }
-      return {
-        config: { ui: { theme: { hues: {}, light: { colors: {} }, dark: { colors: {} } } } } as any,
-        options: mergedOptions,
-      };
-    }
-
-    const data = JSON.parse(fs.readFileSync(configPath, 'utf-8'));
-    cachedConfig = data;
-    cachedConfigPath = configPath;
-
-    return { config: data, options: mergedOptions };
-  } catch (error) {
-    if (mergedOptions.strict) {
-      throw error;
-    }
-    console.warn(`[Seyuna PostCSS] Warning: Failed to load config: ${error instanceof Error ? error.message : String(error)}`);
-    return {
-      config: { ui: { theme: { hues: {}, light: { colors: {} }, dark: { colors: {} } } } } as any,
-      options: mergedOptions,
-    };
-  }
+  // Return base empty config - we'll populate it from CSS
+  return {
+    config: {
+      ui: {
+        theme: {
+          hues: {},
+          colors: {},
+          light: {
+            chroma: 0,
+            lightness: 0,
+            background: { lightness: 0, chroma: 0, hue: 0 },
+            text: { lightness: 0, chroma: 0, hue: 0 },
+            colors: {},
+          },
+          dark: {
+            chroma: 0,
+            lightness: 0,
+            background: { lightness: 0, chroma: 0, hue: 0 },
+            text: { lightness: 0, chroma: 0, hue: 0 },
+            colors: {},
+          },
+        },
+      },
+    } as any,
+    options: mergedOptions,
+  };
 }
 
-export async function loadConfigAsync(options: PluginOptions = {}): Promise<{ config: SeyunaConfig, options: Required<PluginOptions> }> {
-  const mergedOptions = { ...DEFAULT_OPTIONS, ...options };
-
-  if (mergedOptions.config) {
-    return { config: mergedOptions.config, options: mergedOptions };
-  }
-
-  const configPath = path.resolve(process.cwd(), mergedOptions.configPath);
-
-  // Cache config if it's the same path
-  if (cachedConfig && cachedConfigPath === configPath) {
-    return { config: cachedConfig, options: mergedOptions };
-  }
-
-  try {
-    try {
-      await fs.promises.access(configPath);
-    } catch {
-       if (mergedOptions.strict) {
-        throw new Error(`Seyuna config not found at ${configPath}`);
-      }
-      return {
-         config: { ui: { theme: { hues: {}, light: { colors: {} }, dark: { colors: {} } } } } as any,
-         options: mergedOptions,
-      };
-    }
-
-    const content = await fs.promises.readFile(configPath, 'utf-8');
-    const data = JSON.parse(content);
-    cachedConfig = data;
-    cachedConfigPath = configPath;
-
-    return { config: data, options: mergedOptions };
-  } catch (error) {
-    if (mergedOptions.strict) {
-      throw error;
-    }
-    console.warn(`[Seyuna PostCSS] Warning: Failed to load config: ${error instanceof Error ? error.message : String(error)}`);
-    return {
-      config: { ui: { theme: { hues: {}, light: { colors: {} }, dark: { colors: {} } } } } as any,
-      options: mergedOptions,
-    };
-  }
+export async function loadConfigAsync(
+  options: PluginOptions = {},
+): Promise<{ config: SeyunaConfig; options: Required<PluginOptions> }> {
+  return loadConfig(options);
 }

package/src/types.ts

@@ -41,7 +41,6 @@ export type Mode = "system" | "light" | "dark";
  */
 export interface UI {
   theme: Theme;
-  mode: Mode;
   output_dir?: string;
 }
 
@@ -49,7 +48,6 @@ export interface UI {
  * Root configuration structure for a Seyuna project.
  */
 export interface SeyunaConfig {
-  license?: string;
   ui?: UI;
 }