@shohojdhara/atomix 0.3.9 → 0.3.11

package/dist/index.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 });
 
-var jsxRuntime = require("react/jsx-runtime"), React = require("react"), PhosphorIcons = require("@phosphor-icons/react"), reactDom = require("react-dom"), loader = require("./lib/config/loader");
+var jsxRuntime = require("react/jsx-runtime"), React = require("react"), PhosphorIcons = require("@phosphor-icons/react"), reactDom = require("react-dom");
 
 function _interopDefaultCompat(e) {
     return e && "object" == typeof e && "default" in e ? e : {
@@ -19337,39 +19337,13 @@ class ThemeLogger {
                 tokens = input;
     }
     // Merge with defaults and generate CSS
-     else {
-        // Check if we're in a browser environment
-        if ("undefined" != typeof window) throw new ThemeError("No input provided and config loading is not available in browser environment. Please provide tokens explicitly or use Node.js/SSR environment.", ThemeErrorCode.CONFIG_LOAD_FAILED, {
-            environment: "browser"
-        });
-        // Load from config when no input provided
-                let loadThemeFromConfigSync, loadAtomixConfig;
-        try {
-            const configLoaderModule = require("../config/configLoader"), loaderModule = require("../../config/loader");
-            // Get prefix from config if needed
-            if (loadThemeFromConfigSync = configLoaderModule.loadThemeFromConfigSync, loadAtomixConfig = loaderModule.loadAtomixConfig, 
-            tokens = loadThemeFromConfigSync(), !options?.prefix) try {
-                const config = loadAtomixConfig({
-                    configPath: "atomix.config.ts",
-                    required: !1
-                });
-                options = {
-                    ...options,
-                    prefix: config?.prefix || "atomix"
-                };
-            } catch (error) {
-                // If config loading fails, use default prefix
-                options = {
-                    ...options,
-                    prefix: "atomix"
-                };
-            }
-        } catch (error) {
-            throw new ThemeError("No input provided and config loading is not available in this environment. Please provide tokens explicitly.", ThemeErrorCode.CONFIG_LOAD_FAILED, {
-                error: error instanceof Error ? error.message : String(error)
-            });
-        }
-    }
+     else 
+    // Auto-loading config from file system is removed for browser compatibility.
+    // If no input is provided, we return an empty theme (using defaults only) or user must provide tokens.
+    // This allows createTheme to be isomorphic.
+    // Warn in development if no input provided
+    "production" !== process.env.NODE_ENV && "undefined" != typeof window && console.warn("Atomix: createTheme() called without tokens. Using default tokens only."), 
+    tokens = {};
     const allTokens = createTokens(tokens), prefix = options?.prefix ?? "atomix";
     // Get prefix from options or use default
         return generateCSSVariables$1(allTokens, {
@@ -19600,24 +19574,12 @@ class ThemeLogger {
 }
 
 /**
- * CSS File Utilities
+ * Theme System Constants
  *
- * Save CSS to file system (Node.js only).
+ * Centralized constants for the theme system to avoid magic numbers and strings.
  */
 /**
- * Save CSS to file
- *
- * Writes CSS string to a file. Only works in Node.js environment.
- *
- * @param css - CSS string to save
- * @param filePath - Output file path
- * @throws Error if called in browser environment
- *
- * @example
- * ```typescript
- * const css = ':root { --atomix-color-primary: #7AFFD7; }';
- * await saveCSSFile(css, './themes/custom.css');
- * ```
+ * Default storage key for theme persistence
  */ "undefined" != typeof process && process.env;
 
 /**
@@ -20392,79 +20354,6 @@ function generateClassName(block, element, modifiers) {
     return property => getComponentThemeValue(component, property, variant, size);
 }
 
-/**
- * Theme Configuration Loader
- *
- * Provides functions to load theme configurations from atomix.config.ts
- * Includes both sync and async versions, with automatic fallbacks
- */
-/**
- * Load theme from config file (synchronous, Node.js only)
- * @param configPath - Path to config file (default: atomix.config.ts)
- * @returns DesignTokens from theme configuration
- * @throws Error if config loading is not available in browser environment
- */ function loadThemeFromConfigSync(options) {
-    // Check if we're in a browser environment
-    if ("undefined" != typeof window) throw new Error("loadThemeFromConfigSync: Not available in browser environment. Config loading requires Node.js/SSR environment.");
-    // Use static import - the function handles browser environment checks internally
-        let config;
-    try {
-        config = loader.loadAtomixConfig({
-            configPath: options?.configPath || "atomix.config.ts",
-            required: !1 !== options?.required
-        });
-    } catch (error) {
-        if (!1 !== options?.required) throw new Error("Config loader module not available");
-        // Return empty tokens if config is not required
-                return createTokens({});
-    }
-    if (!config?.theme) return createTokens({});
-    // Extract tokens from config.theme structure
-    // config.theme can have: { extend?: ThemeTokens, tokens?: ThemeTokens, themes?: ... }
-    // We need to extract the actual DesignTokens (flat structure)
-        const themeConfig = config.theme;
-    // Check if theme is directly a flat object (DesignTokens format)
-    // This handles the case where config.theme might be passed as DesignTokens directly
-        return createTokens(!themeConfig || "object" != typeof themeConfig || "extend" in themeConfig || "tokens" in themeConfig || "themes" in themeConfig ? {} : themeConfig);
-    // If theme has nested structure (extend/tokens/themes), we can't directly use it
-    // Return empty tokens - the theme system will use defaults
-    // TODO: Add proper conversion from ThemeTokens to DesignTokens if needed
-}
-
-/**
- * Load theme from config file (asynchronous)
- * @param configPath - Path to config file (default: atomix.config.ts)
- * @returns Promise resolving to DesignTokens from theme configuration
- */ async function loadThemeFromConfig(options) {
-    // Check if we're in a browser environment
-    if ("undefined" != typeof window) throw new Error("loadThemeFromConfig: Not available in browser environment. Config loading requires Node.js/SSR environment.");
-    // Use static import with runtime check
-    // The function will handle browser environment checks internally
-        let config;
-    try {
-        // loadAtomixConfig is synchronous, not async
-        config = loader.loadAtomixConfig({
-            configPath: options?.configPath || "atomix.config.ts",
-            required: !1 !== options?.required
-        });
-    } catch (error) {
-        if (!1 !== options?.required) throw new Error("Config loader module not available");
-        // Return empty tokens if config is not required
-                return createTokens({});
-    }
-    if (!config?.theme) return createTokens({});
-    // Extract tokens from config.theme structure
-    // config.theme can have: { extend?: ThemeTokens, tokens?: ThemeTokens, themes?: ... }
-    // We need to extract the actual DesignTokens (flat structure)
-        const themeConfig = config.theme;
-    // Check if theme is directly a flat object (DesignTokens format)
-    // This handles the case where config.theme might be passed as DesignTokens directly
-        return createTokens(!themeConfig || "object" != typeof themeConfig || "extend" in themeConfig || "tokens" in themeConfig || "themes" in themeConfig ? {} : themeConfig);
-    // If theme has nested structure (extend/tokens/themes), we can't directly use it
-    // Return empty tokens - the theme system will use defaults
-    // TODO: Add proper conversion from ThemeTokens to DesignTokens if needed
-}
-
 /**
  * Theme Context
  *
@@ -20506,21 +20395,9 @@ const ThemeProvider = ({children: children, defaultTheme: defaultTheme, themes:
             if (stored) return stored;
         }
         // If defaultTheme is provided, use it
-                if (null != defaultTheme) return defaultTheme;
-        // Try to load from atomix.config.ts as fallback, but only in Node.js/SSR environments
-                if ("undefined" == typeof window) try {
-            // Dynamically import the config loader to avoid bundling issues in browser
-            // eslint-disable-next-line @typescript-eslint/no-var-requires
-            const {loadThemeFromConfigSync: loadThemeFromConfigSync} = require("../config/configLoader"), configTokens = loadThemeFromConfigSync();
-            if (configTokens && Object.keys(configTokens).length > 0) 
-            // For simplicity, we'll treat config tokens as a special theme name
-            return "config-theme";
-        } catch (error) {
-            // Failed to load theme from config, using default
-        }
+                return null != defaultTheme ? defaultTheme : "default";
         // Default fallback
-                return "default";
-    }), [ defaultTheme, enablePersistence, storageKey ]), [currentTheme, setCurrentTheme] = React.useState((() => "string" == typeof initialDefaultTheme ? initialDefaultTheme : "tokens-theme")), [activeTokens, setActiveTokens] = React.useState((() => 
+        }), [ defaultTheme, enablePersistence, storageKey ]), [currentTheme, setCurrentTheme] = React.useState((() => "string" == typeof initialDefaultTheme ? initialDefaultTheme : "tokens-theme")), [activeTokens, setActiveTokens] = React.useState((() => 
     // If defaultTheme is DesignTokens, store them
     defaultTheme && "string" != typeof defaultTheme ? createTokens(defaultTheme) : null)), [isLoading, setIsLoading] = React.useState(!1), [error, setError] = React.useState(null), loadedThemesRef = React.useRef(new Set), themePromisesRef = React.useRef({}), abortControllerRef = React.useRef(null);
     // Handle initial DesignTokens defaultTheme
@@ -23515,6 +23392,7 @@ class RTLManager {
 // Core Theme Functions
 // ============================================================================
 // Create theme CSS from DesignTokens
+// File saving utilities removed to prevent bundling Node.js modules in browser
 /**
  * Inject theme CSS into DOM
  */ function injectTheme(css, id = "atomix-theme") {
@@ -23527,30 +23405,6 @@ class RTLManager {
     removeCSS(id);
 }
 
-/**
- * Save theme to CSS file
- */ async function saveTheme(css, filePath) {
-    await async function(css, filePath) {
-        // Check if in browser environment
-        if ("undefined" != typeof window) throw new Error("saveCSSFile can only be used in Node.js environment. Use injectCSS() for browser environments.");
-        // Dynamic import to avoid bundling Node.js modules in browser builds
-                const fs = await import("fs/promises"), dir = (await import("path")).dirname(filePath);
-        await fs.mkdir(dir, {
-            recursive: !0
-        }), 
-        // Write file
-        await fs.writeFile(filePath, css, "utf8");
-    }
-    /**
- * Theme System Constants
- *
- * Centralized constants for the theme system to avoid magic numbers and strings.
- */
-    /**
- * Default storage key for theme persistence
- */ (css, filePath);
-}
-
 /**
  * CSS Variables Constants
  *
@@ -23927,8 +23781,6 @@ const composables = composablesImport, utils = utilsImport, types = typesImport,
     isCSSInjected: isCSSInjected,
     isDesignTokens: isDesignTokens,
     isValidCSSVariableName: isValidCSSVariableName,
-    loadThemeFromConfig: loadThemeFromConfig,
-    loadThemeFromConfigSync: loadThemeFromConfigSync,
     mapSCSSTokensToCSSVars: mapSCSSTokensToCSSVars,
     mergeCSSVars: mergeCSSVars,
     mergeTheme: mergeTheme,
@@ -23937,7 +23789,6 @@ const composables = composablesImport, utils = utilsImport, types = typesImport,
     removeCSS: removeCSS,
     removeCSSVariables: removeCSSVariables,
     removeTheme: removeTheme,
-    saveTheme: saveTheme,
     themePropertyToCSSVar: themePropertyToCSSVar,
     unregisterTheme: unregisterTheme,
     useComponentTheme: useComponentTheme,
@@ -24024,27 +23875,56 @@ function(cssVars, baseStyle) {
     };
 }
 /**
- * Atomix Config Loader
+ * Atomix Configuration System
+ *
+ * Tailwind-like configuration for customizing the Atomix Design System.
+ *
+ * External developers can create `atomix.config.ts` in their project root
+ * to customize design tokens, similar to Tailwind's tailwind.config.js
+ *
+ * @example
+ * ```typescript
+ * // atomix.config.ts (in your project)
+ * import { defineConfig } from '@shohojdhara/atomix/config';
+ *
+ * export default defineConfig({
+ *   theme: {
+ *     extend: {
+ *       colors: {
+ *         primary: { main: '#7AFFD7' },
+ *       },
+ *     },
+ *   },
+ * });
+ * ```
+ */
+/**
+ * Helper function to define Atomix configuration with type safety
  *
- * Helper functions to load atomix.config.ts from external projects.
- * Similar to how Tailwind loads tailwind.config.js
+ * @param config - Atomix configuration object
+ * @returns The configuration object
  */
 /**
- * Load Atomix configuration from project root
+ * Helper function to define Atomix configuration with type safety
  *
- * Attempts to load atomix.config.ts from the current working directory.
- * Falls back to default config if file doesn't exist.
+ * Similar to Tailwind's defineConfig, provides autocomplete and type checking.
  *
- * @param options - Loader options
- * @returns Loaded configuration or default
+ * @param config - Atomix configuration object
+ * @returns The configuration object
  *
  * @example
  * ```typescript
- * import { loadAtomixConfig } from '@shohojdhara/atomix/config';
- * import { createTheme } from '@shohojdhara/atomix/theme';
+ * import { defineConfig } from '@shohojdhara/atomix/config';
  *
- * const config = loadAtomixConfig();
- * const theme = createTheme(config.theme?.tokens || {});
+ * export default defineConfig({
+ *   theme: {
+ *     extend: {
+ *       colors: {
+ *         primary: { main: '#7AFFD7' },
+ *       },
+ *     },
+ *   },
+ * });
  * ```
  */ , exports.applyComponentTheme = applyComponentTheme, exports.applyPartStyles = applyPartStyles, 
 exports.applyTheme = applyTheme, exports.camelToKebab = camelToKebab, exports.clearThemes = clearThemes, 
@@ -24112,61 +23992,7 @@ function(defaultElement = "div") {
  * Hook to manage slot rendering
  */ , exports.createTheme = createTheme, exports.createThemeRegistry = createThemeRegistry, 
 exports.createTokens = createTokens, exports.cssVarsToStyle = cssVarsToStyle, exports.deepMerge = deepMerge, 
-exports.default = atomix, exports.defaultTokens = defaultTokens, exports.defineConfig = 
-/**
- * Atomix Configuration System
- *
- * Tailwind-like configuration for customizing the Atomix Design System.
- *
- * External developers can create `atomix.config.ts` in their project root
- * to customize design tokens, similar to Tailwind's tailwind.config.js
- *
- * @example
- * ```typescript
- * // atomix.config.ts (in your project)
- * import { defineConfig } from '@shohojdhara/atomix/config';
- *
- * export default defineConfig({
- *   theme: {
- *     extend: {
- *       colors: {
- *         primary: { main: '#7AFFD7' },
- *       },
- *     },
- *   },
- * });
- * ```
- */
-/**
- * Helper function to define Atomix configuration with type safety
- *
- * @param config - Atomix configuration object
- * @returns The configuration object
- */
-/**
- * Helper function to define Atomix configuration with type safety
- *
- * Similar to Tailwind's defineConfig, provides autocomplete and type checking.
- *
- * @param config - Atomix configuration object
- * @returns The configuration object
- *
- * @example
- * ```typescript
- * import { defineConfig } from '@shohojdhara/atomix/config';
- *
- * export default defineConfig({
- *   theme: {
- *     extend: {
- *       colors: {
- *         primary: { main: '#7AFFD7' },
- *       },
- *     },
- *   },
- * });
- * ```
- */
-function(config) {
+exports.default = atomix, exports.defaultTokens = defaultTokens, exports.defineConfig = function(config) {
     return config;
 }, exports.designTokensToCSSVars = designTokensToCSSVars, exports.exportTheme = 
 /**
@@ -24228,43 +24054,6 @@ exports.isDesignTokens = isDesignTokens, exports.isSlot = function(value) {
  * Merge multiple slot configurations
  * Later slots override earlier ones
  */ , exports.isValidCSSVariableName = isValidCSSVariableName, exports.isYouTubeUrl = isYouTubeUrl, 
-exports.loadAtomixConfig = function(options = {}) {
-    const {configPath: configPath = "atomix.config.ts", required: required = !1} = options, defaultConfig = {
-        prefix: "atomix",
-        theme: {
-            extend: {}
-        }
-    };
-    // Default config
-        // In browser environments, config loading is not supported
-    if ("undefined" != typeof window) {
-        if (required) throw new Error("loadAtomixConfig: Not available in browser environment. Config loading requires Node.js/SSR environment.");
-        return defaultConfig;
-    }
-    // Try to load config file
-        try {
-        // Use dynamic import for ESM compatibility
-        const configModule = require(configPath), config = configModule.default || configModule;
-        // Validate it's an AtomixConfig
-        if (config && "object" == typeof config) return config;
-        throw new Error("Invalid config format");
-    } catch (error) {
-        if (required) throw new Error(`Failed to load config from ${configPath}: ${error.message}`);
-        // Return default config if not required
-                return defaultConfig;
-    }
-}
-/**
- * Resolve config path
- *
- * Finds atomix.config.ts in the project, checking common locations.
- * Returns null in browser environments where file system access is not available.
- *
- * This function is designed to work in Node.js environments only.
- * In browser builds, it will always return null without attempting to access Node.js modules.
- *
- * @internal This function uses Node.js modules and should not be called in browser environments.
- */ , exports.loadThemeFromConfig = loadThemeFromConfig, exports.loadThemeFromConfigSync = loadThemeFromConfigSync, 
 exports.mapSCSSTokensToCSSVars = mapSCSSTokensToCSSVars, exports.mergeCSSVars = mergeCSSVars, 
 exports.mergeClassNames = mergeClassNames, exports.mergeComponentProps = mergeComponentProps, 
 exports.mergePartStyles = mergePartStyles, exports.mergeSlots = function(...slots) {
@@ -24291,42 +24080,8 @@ function(name, primaryColor, secondaryColor) {
         }
     });
 }, exports.registerTheme = registerTheme, exports.removeCSS = removeCSS, exports.removeCSSVariables = removeCSSVariables, 
-exports.removeTheme = removeTheme, exports.renderSlot = renderSlot, exports.resolveConfigPath = function() {
-    // Early return for browser environments - prevents any Node.js module access
-    // This check happens before any require() calls, preventing bundlers from analyzing them
-    if ("undefined" != typeof window || "undefined" == typeof process || !process.cwd) return null;
-    // Only attempt to load Node.js modules in Node.js runtime
-    // Use a lazy-loading pattern that prevents static analysis by bundlers
-        try {
-        // Create a function that only executes in Node.js runtime
-        // Use string-based module names to prevent static analysis by bundlers
-        const modules = (() => {
-            // These requires are only executed at runtime in Node.js environments
-            // They are marked as external in Rollup config and should not be bundled
-            // Using string concatenation and computed property access to prevent static analysis
-            if ("undefined" == typeof require) return null;
-            // Use a try-catch wrapper to safely access require
-                        try {
-                // Build module names dynamically to prevent static analysis
-                const moduleNames = [ "fs", "path" ];
-                // eslint-disable-next-line @typescript-eslint/no-require-imports, @typescript-eslint/no-var-requires
-                                return {
-                    fs: require(moduleNames[0]),
-                    path: require(moduleNames[1])
-                };
-            } catch {
-                return null;
-            }
-        })();
-        if (!modules) return null;
-        const {fs: fs, path: path} = modules, cwd = process.cwd(), possiblePaths = [ path.join(cwd, "atomix.config.ts"), path.join(cwd, "atomix.config.js"), path.join(cwd, "atomix.config.mjs") ];
-        for (const configPath of possiblePaths) if (fs.existsSync(configPath)) return configPath;
-    } catch (error) {
-        // Silently fail in browser environments or when modules are unavailable
-        return null;
-    }
-    return null;
-}, exports.saveTheme = saveTheme, exports.sliderConstants = sliderConstants, exports.supportsDarkMode = function(theme) {
+exports.removeTheme = removeTheme, exports.renderSlot = renderSlot, exports.sliderConstants = sliderConstants, 
+exports.supportsDarkMode = function(theme) {
     var _context;
     return "dark" === theme.palette?.mode || !0 === theme.supportsDarkMode || Boolean((null == (_context = theme.a11y?.modes) ? void 0 : Function.call.bind(_includesInstanceProperty(_context), _context))?.("dark"));
 }, exports.theme = theme, exports.themePropertyToCSSVar = themePropertyToCSSVar,