@seyuna/postcss 1.0.0-canary.21 → 1.0.0-canary.23

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [1.0.0-canary.23](https://github.com/seyuna-corp/seyuna-postcss/compare/v1.0.0-canary.22...v1.0.0-canary.23) (2026-01-10)
+
+
+### Bug Fixes
+
+* **esm:** prevent deadlock by making config load async ([e8b2d46](https://github.com/seyuna-corp/seyuna-postcss/commit/e8b2d461080bc773a552fdcf4847ee841708ca64))
+
+# [1.0.0-canary.22](https://github.com/seyuna-corp/seyuna-postcss/compare/v1.0.0-canary.21...v1.0.0-canary.22) (2026-01-10)
+
+
+### Bug Fixes
+
+* **esm:** convert to esm and use lazy initialization to resolve deadlock ([4179e78](https://github.com/seyuna-corp/seyuna-postcss/commit/4179e786f3264a475ae89616b6078d80e51ba978))
+
 # [1.0.0-canary.21](https://github.com/seyuna-corp/seyuna-postcss/compare/v1.0.0-canary.20...v1.0.0-canary.21) (2026-01-10)
 
 

package/dist/at-rules/color-scheme.js

@@ -1,10 +1,4 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.dark = exports.light = void 0;
-const postcss_1 = __importDefault(require("postcss"));
+import postcss from "postcss";
 /**
  * Custom PostCSS plugin handler factory for `@light` and `@dark` at-rules.
  */
@@ -20,7 +14,7 @@ function createColorSchemeHandler(scheme) {
         /**
          * Rule 1: [data-mode="scheme"] & { ... } (Explicit mode)
          */
-        const explicitRule = new postcss_1.default.Rule({
+        const explicitRule = new postcss.Rule({
             selector: `[${modeAttribute}="${scheme}"] &`,
             source: atRule.source,
         });
@@ -28,12 +22,12 @@ function createColorSchemeHandler(scheme) {
         /**
          * Rule 2: @media (prefers-color-scheme: scheme) { [data-mode="system"] & { ... } } (System preference)
          */
-        const mediaAtRule = new postcss_1.default.AtRule({
+        const mediaAtRule = new postcss.AtRule({
             name: "media",
             params: `(prefers-color-scheme: ${scheme})`,
             source: atRule.source,
         });
-        const systemRule = new postcss_1.default.Rule({
+        const systemRule = new postcss.Rule({
             selector: `[${modeAttribute}="system"] &`,
             source: atRule.source,
         });
@@ -45,5 +39,5 @@ function createColorSchemeHandler(scheme) {
         atRule.replaceWith(mediaAtRule, explicitRule);
     };
 }
-exports.light = createColorSchemeHandler('light');
-exports.dark = createColorSchemeHandler('dark');
+export const light = createColorSchemeHandler('light');
+export const dark = createColorSchemeHandler('dark');

package/dist/at-rules/color.js

@@ -1,15 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.eachStandardColor = eachStandardColor;
-exports.eachFixedColor = eachFixedColor;
-const helpers_js_1 = require("../helpers.js");
+import { generateRules } from "../helpers.js";
 /**
  * Handler for @each-standard-color
  */
-function eachStandardColor(atRule, context) {
+export function eachStandardColor(atRule, context) {
     const { config } = context;
     const hueNames = config.ui ? Object.keys(config.ui.theme.hues) : [];
-    const rules = (0, helpers_js_1.generateRules)(hueNames, atRule, context);
+    const rules = generateRules(hueNames, atRule, context);
     if (rules.length)
         atRule.replaceWith(...rules);
     else
@@ -18,7 +14,7 @@ function eachStandardColor(atRule, context) {
 /**
  * Handler for @each-fixed-color
  */
-function eachFixedColor(atRule, context) {
+export function eachFixedColor(atRule, context) {
     const { config } = context;
     const mergedNames = [
         ...new Set([
@@ -26,7 +22,7 @@ function eachFixedColor(atRule, context) {
             ...(config.ui ? Object.keys(config.ui.theme.dark.colors) : []),
         ]),
     ];
-    const rules = (0, helpers_js_1.generateRules)(mergedNames, atRule, context);
+    const rules = generateRules(mergedNames, atRule, context);
     if (rules.length)
         atRule.replaceWith(...rules);
     else

package/dist/at-rules/container.js

@@ -1,10 +1,4 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = container;
-const postcss_1 = __importDefault(require("postcss"));
+import postcss from "postcss";
 /**
  * Custom PostCSS plugin handler for responsive at-rules.
  *
@@ -21,8 +15,7 @@ const postcss_1 = __importDefault(require("postcss"));
  *   }
  *
  */
-function container(atRule, context) {
-    var _a, _b;
+export default function container(atRule, context) {
     const { config } = context;
     // Default breakpoints
     const defaultBreakpoints = {
@@ -36,7 +29,7 @@ function container(atRule, context) {
     // Merge with config if available (assuming config.ui.breakpoints exists)
     const breakpoints = {
         ...defaultBreakpoints,
-        ...(((_b = (_a = config.ui) === null || _a === void 0 ? void 0 : _a.theme) === null || _b === void 0 ? void 0 : _b.breakpoints) || {}),
+        ...(config.ui?.theme?.breakpoints || {}),
     };
     if (Object.keys(breakpoints).includes(atRule.name)) {
         const minWidth = breakpoints[atRule.name];
@@ -44,7 +37,7 @@ function container(atRule, context) {
         atRule.each((node) => {
             clonedNodes.push(node.clone());
         });
-        const containerAtRule = new postcss_1.default.AtRule({
+        const containerAtRule = new postcss.AtRule({
             name: "container",
             params: `(min-width: ${minWidth})`,
             source: atRule.source,

package/dist/at-rules/index.js

@@ -1,22 +1,16 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.atRuleHandlers = void 0;
-const color_js_1 = require("./color.js");
-const container_js_1 = __importDefault(require("./container.js"));
-const color_scheme_js_1 = require("./color-scheme.js");
+import { eachStandardColor, eachFixedColor } from "./color.js";
+import container from "./container.js";
+import { light, dark } from "./color-scheme.js";
 // Ordered array ensures execution order
-exports.atRuleHandlers = [
-    { name: "each-standard-color", handler: color_js_1.eachStandardColor },
-    { name: "each-fixed-color", handler: color_js_1.eachFixedColor },
-    { name: "light", handler: color_scheme_js_1.light },
-    { name: "dark", handler: color_scheme_js_1.dark },
-    { name: "xs", handler: container_js_1.default },
-    { name: "sm", handler: container_js_1.default },
-    { name: "md", handler: container_js_1.default },
-    { name: "lg", handler: container_js_1.default },
-    { name: "xl", handler: container_js_1.default },
-    { name: "2xl", handler: container_js_1.default },
+export const atRuleHandlers = [
+    { name: "each-standard-color", handler: eachStandardColor },
+    { name: "each-fixed-color", handler: eachFixedColor },
+    { name: "light", handler: light },
+    { name: "dark", handler: dark },
+    { name: "xs", handler: container },
+    { name: "sm", handler: container },
+    { name: "md", handler: container },
+    { name: "lg", handler: container },
+    { name: "xl", handler: container },
+    { name: "2xl", handler: container },
 ];

package/dist/config.d.ts

@@ -4,3 +4,7 @@ export declare function loadConfig(options?: PluginOptions): {
     config: SeyunaConfig;
     options: Required<PluginOptions>;
 };
+export declare function loadConfigAsync(options?: PluginOptions): Promise<{
+    config: SeyunaConfig;
+    options: Required<PluginOptions>;
+}>;

package/dist/config.js

@@ -1,11 +1,5 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.loadConfig = loadConfig;
-const fs_1 = __importDefault(require("fs"));
-const path_1 = __importDefault(require("path"));
+import fs from 'fs';
+import path from 'path';
 const DEFAULT_OPTIONS = {
     configPath: 'seyuna.json',
     modeAttribute: 'data-mode',
@@ -15,18 +9,57 @@ const DEFAULT_OPTIONS = {
 };
 let cachedConfig = null;
 let cachedConfigPath = null;
-function loadConfig(options = {}) {
+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,
+        };
+    }
+}
+export async function loadConfigAsync(options = {}) {
     const mergedOptions = { ...DEFAULT_OPTIONS, ...options };
     if (mergedOptions.config) {
         return { config: mergedOptions.config, options: mergedOptions };
     }
-    const configPath = path_1.default.resolve(process.cwd(), mergedOptions.configPath);
+    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_1.default.existsSync(configPath)) {
+        try {
+            await fs.promises.access(configPath);
+        }
+        catch {
             if (mergedOptions.strict) {
                 throw new Error(`Seyuna config not found at ${configPath}`);
             }
@@ -35,7 +68,8 @@ function loadConfig(options = {}) {
                 options: mergedOptions,
             };
         }
-        const data = JSON.parse(fs_1.default.readFileSync(configPath, 'utf-8'));
+        const content = await fs.promises.readFile(configPath, 'utf-8');
+        const data = JSON.parse(content);
         cachedConfig = data;
         cachedConfigPath = configPath;
         return { config: data, options: mergedOptions };

package/dist/errors.js

@@ -1,8 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.reportError = reportError;
-exports.reportWarning = reportWarning;
-function reportError(message, node, context, options = {}) {
+export function reportError(message, node, context, options = {}) {
     const { options: pluginOptions } = context;
     const formattedMessage = `[Seyuna PostCSS] ${message}`;
     if (pluginOptions.strict) {
@@ -12,7 +8,7 @@ function reportError(message, node, context, options = {}) {
         reportWarning(formattedMessage, node);
     }
 }
-function reportWarning(message, node) {
+export function reportWarning(message, node) {
     const result = node.root().toResult();
     node.warn(result, `[Seyuna PostCSS] ${message}`);
 }

package/dist/functions/color.js

@@ -1,21 +1,12 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.sc = sc;
-exports.fc = fc;
-exports.alpha = alpha;
-exports.lighten = lighten;
-exports.darken = darken;
-exports.contrast = contrast;
 /**
  * Resolves a color name to its CSS variables based on its type (standard or fixed)
  */
 function getColorVariables(context, color, type) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
     const { config } = context;
-    const hues = ((_b = (_a = config === null || config === void 0 ? void 0 : config.ui) === null || _a === void 0 ? void 0 : _a.theme) === null || _b === void 0 ? void 0 : _b.hues) || {};
-    const colors = ((_d = (_c = config === null || config === void 0 ? void 0 : config.ui) === null || _c === void 0 ? void 0 : _c.theme) === null || _d === void 0 ? void 0 : _d.colors) || {};
-    const lightColors = ((_g = (_f = (_e = config === null || config === void 0 ? void 0 : config.ui) === null || _e === void 0 ? void 0 : _e.theme) === null || _f === void 0 ? void 0 : _f.light) === null || _g === void 0 ? void 0 : _g.colors) || {};
-    const darkColors = ((_k = (_j = (_h = config === null || config === void 0 ? void 0 : config.ui) === null || _h === void 0 ? void 0 : _h.theme) === null || _j === void 0 ? void 0 : _j.dark) === null || _k === void 0 ? void 0 : _k.colors) || {};
+    const hues = config?.ui?.theme?.hues || {};
+    const colors = config?.ui?.theme?.colors || {};
+    const lightColors = config?.ui?.theme?.light?.colors || {};
+    const darkColors = config?.ui?.theme?.dark?.colors || {};
     const isStandard = color in hues;
     const isFixed = color in colors || color in lightColors || color in darkColors;
     if (type === 'sc' && !isStandard) {
@@ -40,33 +31,33 @@ function getColorVariables(context, color, type) {
     }
     throw new Error(`Color '${color}' not found in seyuna.json`);
 }
-function sc(context, name, alpha, lightness, chroma) {
+export function sc(context, name, alpha, lightness, chroma) {
     const vars = getColorVariables(context, name, 'sc');
     const a = alpha && alpha !== "null" ? alpha : "1";
     const l = lightness && lightness !== "null" ? lightness : vars.l;
     const c = chroma && chroma !== "null" ? chroma : vars.c;
     return `oklch(${l} ${c} ${vars.h} / ${a})`;
 }
-function fc(context, name, alpha, lightness, chroma) {
+export function fc(context, name, alpha, lightness, chroma) {
     const vars = getColorVariables(context, name, 'fc');
     const a = alpha && alpha !== "null" ? alpha : "1";
     const l = lightness && lightness !== "null" ? lightness : vars.l;
     const c = chroma && chroma !== "null" ? chroma : vars.c;
     return `oklch(${l} ${c} ${vars.h} / ${a})`;
 }
-function alpha(context, color, value) {
+export function alpha(context, color, value) {
     const { l, c, h } = getColorVariables(context, color);
     return `oklch(${l} ${c} ${h} / ${value})`;
 }
-function lighten(context, color, amount) {
+export function lighten(context, color, amount) {
     const { l, c, h } = getColorVariables(context, color);
     return `oklch(calc(${l} + ${amount}) ${c} ${h} / 1)`;
 }
-function darken(context, color, amount) {
+export function darken(context, color, amount) {
     const { l, c, h } = getColorVariables(context, color);
     return `oklch(calc(${l} - ${amount}) ${c} ${h} / 1)`;
 }
-function contrast(context, color) {
+export function contrast(context, color) {
     const { l } = getColorVariables(context, color);
     return `oklch(calc((${l} - 0.6) * -1000) 0 0)`;
 }

package/dist/functions/index.js

@@ -1,14 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.functions = void 0;
-const color_js_1 = require("./color.js");
-const theme_js_1 = require("./theme.js");
-exports.functions = {
-    sc: color_js_1.sc,
-    fc: color_js_1.fc,
-    alpha: color_js_1.alpha,
-    lighten: color_js_1.lighten,
-    darken: color_js_1.darken,
-    contrast: color_js_1.contrast,
-    theme: theme_js_1.theme,
+import { sc, fc, alpha, lighten, darken, contrast } from "./color.js";
+import { theme } from "./theme.js";
+export const functions = {
+    sc,
+    fc,
+    alpha,
+    lighten,
+    darken,
+    contrast,
+    theme,
 };

package/dist/functions/theme.js

@@ -1,11 +1,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.theme = theme;
 /**
  * Accesses values from the Seyuna configuration using dot notation
  * Example: theme(ui.theme.breakpoints.tablet)
  */
-function theme(context, path) {
+export function theme(context, path) {
     const parts = path.split('.');
     let current = context.config;
     for (const part of parts) {

package/dist/helpers.js

@@ -1,17 +1,10 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.cloneNodes = cloneNodes;
-exports.generateRules = generateRules;
-const postcss_1 = __importDefault(require("postcss"));
-const parser_js_1 = require("./parser.js");
+import postcss from "postcss";
+import { processFunctions } from "./parser.js";
 /**
  * Helper: clone nodes and replace {name} placeholders safely
  * Returns only valid Rules or Declarations (never raw AtRules)
  */
-function cloneNodes(nodes, name, context) {
+export function cloneNodes(nodes, name, context) {
     const { functions: fnMap } = context;
     return nodes.flatMap((node) => {
         const cloned = node.clone();
@@ -19,7 +12,7 @@ function cloneNodes(nodes, name, context) {
             const decl = cloned;
             let value = decl.value.replace(/\{name\}/g, name);
             // Process functions using the robust parser
-            decl.value = (0, parser_js_1.processFunctions)(value, fnMap, decl, context);
+            decl.value = processFunctions(value, fnMap, decl, context);
             return decl;
         }
         if (cloned.type === "rule") {
@@ -40,18 +33,16 @@ function cloneNodes(nodes, name, context) {
 /**
  * Generate CSS rules from a list of names
  */
-function generateRules(names, atRule, context) {
-    var _a;
-    const nodes = (_a = atRule.nodes) !== null && _a !== void 0 ? _a : [];
+export function generateRules(names, atRule, context) {
+    const nodes = atRule.nodes ?? [];
     const generatedRules = [];
     for (const name of names) {
-        const rule = new postcss_1.default.Rule({
+        const rule = new postcss.Rule({
             selector: `&.${name}`,
             source: atRule.source,
         });
         cloneNodes(nodes, name, context).forEach((n) => {
-            var _a;
-            if (n.type === "rule" && n.selector && ((_a = n.nodes) === null || _a === void 0 ? void 0 : _a.length))
+            if (n.type === "rule" && n.selector && n.nodes?.length)
                 rule.append(n);
             if (n.type === "decl")
                 rule.append(n);

package/dist/index.js

@@ -1,10 +1,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const plugin_js_1 = require("./plugin.js");
-const index_js_1 = require("./functions/index.js");
+import { dynamicFunctionsPlugin } from './plugin.js';
+import { functions } from './functions/index.js';
 // CommonJS-friendly export
-const plugin = Object.assign(plugin_js_1.dynamicFunctionsPlugin, {
+const plugin = Object.assign(dynamicFunctionsPlugin, {
     postcss: true,
-    functions: index_js_1.functions
+    functions
 });
-exports.default = plugin;
+export default plugin;

package/dist/parser.js

@@ -1,13 +1,7 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.processFunctions = processFunctions;
-const postcss_value_parser_1 = __importDefault(require("postcss-value-parser"));
-const errors_js_1 = require("./errors.js");
-function processFunctions(value, fnMap, node, context) {
-    const parsed = (0, postcss_value_parser_1.default)(value);
+import valueParser from 'postcss-value-parser';
+import { reportError } from './errors.js';
+export function processFunctions(value, fnMap, node, context) {
+    const parsed = valueParser(value);
     // Helper to process nodes recursively (inner-first)
     function processNode(parsedValue) {
         parsedValue.walk((nodeIter) => {
@@ -37,7 +31,7 @@ function processFunctions(value, fnMap, node, context) {
                                 currentArg = '';
                             }
                             else {
-                                currentArg += postcss_value_parser_1.default.stringify(argNode);
+                                currentArg += valueParser.stringify(argNode);
                             }
                         });
                         if (currentArg) {
@@ -52,7 +46,7 @@ function processFunctions(value, fnMap, node, context) {
                             nodeIter.nodes = []; // Clear children
                         }
                         catch (error) {
-                            (0, errors_js_1.reportError)(`Failed to process function "${nodeIter.value}": ${error instanceof Error ? error.message : String(error)}`, node, context);
+                            reportError(`Failed to process function "${nodeIter.value}": ${error instanceof Error ? error.message : String(error)}`, node, context);
                         }
                     }
                 }

package/dist/plugin.js

@@ -1,18 +1,15 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.dynamicFunctionsPlugin = void 0;
-const index_js_1 = require("./functions/index.js");
-const index_js_2 = require("./at-rules/index.js");
-const config_js_1 = require("./config.js");
-const parser_js_1 = require("./parser.js");
-const dynamicFunctionsPlugin = (opts = {}) => {
+import { functions } from "./functions/index.js";
+import { atRuleHandlers } from "./at-rules/index.js";
+import { loadConfigAsync } from "./config.js";
+import { processFunctions } from "./parser.js";
+export const dynamicFunctionsPlugin = (opts = {}) => {
     let context;
     let fnMap;
     return {
         postcssPlugin: "postcss-dynamic-functions",
-        Once() {
-            const { config, options } = (0, config_js_1.loadConfig)(opts);
-            fnMap = { ...index_js_1.functions, ...opts.functions };
+        async Once() {
+            const { config, options } = await loadConfigAsync(opts);
+            fnMap = { ...functions, ...opts.functions };
             context = {
                 config,
                 options,
@@ -22,14 +19,14 @@ const dynamicFunctionsPlugin = (opts = {}) => {
         Declaration(decl) {
             if (!context || !fnMap)
                 return;
-            decl.value = (0, parser_js_1.processFunctions)(decl.value, fnMap, decl, context);
+            decl.value = processFunctions(decl.value, fnMap, decl, context);
         },
         // Override AtRule handler to ensure ordered execution
         AtRule(atRule) {
             if (!context)
                 return;
             // Iterate over handlers in order (array) instead of object spread
-            for (const { name, handler } of index_js_2.atRuleHandlers) {
+            for (const { name, handler } of atRuleHandlers) {
                 if (atRule.name === name) {
                     handler(atRule, context);
                 }
@@ -37,5 +34,4 @@ const dynamicFunctionsPlugin = (opts = {}) => {
         },
     };
 };
-exports.dynamicFunctionsPlugin = dynamicFunctionsPlugin;
-exports.dynamicFunctionsPlugin.postcss = true;
+dynamicFunctionsPlugin.postcss = true;

package/dist/types.js

@@ -1,4 +1,3 @@
-"use strict";
 // Local type definitions to avoid @seyuna/cli runtime import
 // The @seyuna/cli package imports Deno polyfills that conflict with Vite/Astro
-Object.defineProperty(exports, "__esModule", { value: true });
+export {};

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "@seyuna/postcss",
-  "version": "1.0.0-canary.21",
+  "version": "1.0.0-canary.23",
   "description": "Seyuna UI's postcss plugin",
+  "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "scripts": {

package/src/config.ts

@@ -57,3 +57,48 @@ export function loadConfig(options: PluginOptions = {}): { config: SeyunaConfig,
     };
   }
 }
+
+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,
+    };
+  }
+}

package/src/plugin.ts

@@ -1,7 +1,7 @@
 import type { PluginCreator } from "postcss";
 import { functions } from "./functions/index.js";
 import { atRuleHandlers } from "./at-rules/index.js";
-import { loadConfig } from "./config.js";
+import { loadConfig, loadConfigAsync } from "./config.js";
 import { PluginOptions, PluginContext, FunctionMap } from "./types.js";
 import { processFunctions } from "./parser.js";
 
@@ -14,8 +14,8 @@ export const dynamicFunctionsPlugin: PluginCreator<PluginOptions> = (
   return {
     postcssPlugin: "postcss-dynamic-functions",
 
-    Once() {
-      const { config, options } = loadConfig(opts);
+    async Once() {
+      const { config, options } = await loadConfigAsync(opts);
       fnMap = { ...functions, ...opts.functions };
       context = {
         config,

package/tsconfig.json

@@ -1,12 +1,12 @@
 {
   "compilerOptions": {
-    "target": "ES2019",
-    "module": "CommonJS",
+    "target": "ES2020",
+    "module": "NodeNext",
     "lib": ["ES2020"],
     "declaration": true,
     "outDir": "dist",
     "strict": true,
-    "moduleResolution": "Node",
+    "moduleResolution": "NodeNext",
     "esModuleInterop": true,
     "skipLibCheck": true
   },