@shohojdhara/atomix 0.3.10 → 0.3.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/CHANGELOG.md +9 -1
  2. package/dist/atomix.css +9 -6
  3. package/dist/atomix.css.map +1 -1
  4. package/dist/atomix.min.css +9 -6
  5. package/dist/atomix.min.css.map +1 -1
  6. package/dist/charts.js +82 -60
  7. package/dist/charts.js.map +1 -1
  8. package/dist/core.js +82 -60
  9. package/dist/core.js.map +1 -1
  10. package/dist/forms.js +82 -60
  11. package/dist/forms.js.map +1 -1
  12. package/dist/heavy.js +82 -60
  13. package/dist/heavy.js.map +1 -1
  14. package/dist/index.d.ts +11 -107
  15. package/dist/index.esm.js +165 -407
  16. package/dist/index.esm.js.map +1 -1
  17. package/dist/index.js +169 -412
  18. package/dist/index.js.map +1 -1
  19. package/dist/index.min.js +1 -1
  20. package/dist/index.min.js.map +1 -1
  21. package/dist/theme.d.ts +1 -32
  22. package/dist/theme.js +12 -207
  23. package/dist/theme.js.map +1 -1
  24. package/package.json +1 -1
  25. package/src/components/AtomixGlass/AtomixGlass.tsx +124 -127
  26. package/src/components/AtomixGlass/AtomixGlassContainer.tsx +28 -32
  27. package/src/components/AtomixGlass/GlassFilter.tsx +15 -4
  28. package/src/components/EdgePanel/EdgePanel.stories.tsx +2 -7
  29. package/src/components/EdgePanel/EdgePanel.tsx +0 -10
  30. package/src/components/Form/Radio.stories.tsx +235 -103
  31. package/src/components/Navigation/Nav/NavDropdown.tsx +8 -4
  32. package/src/components/Navigation/SideMenu/SideMenu.tsx +2 -22
  33. package/src/components/Navigation/SideMenu/SideMenuItem.tsx +11 -15
  34. package/src/lib/config/index.ts +5 -5
  35. package/src/lib/theme/config/index.ts +1 -1
  36. package/src/lib/theme/core/createTheme.ts +11 -40
  37. package/src/lib/theme/generators/index.ts +1 -4
  38. package/src/lib/theme/index.ts +4 -16
  39. package/src/lib/theme/runtime/ThemeProvider.tsx +1 -16
  40. package/src/lib/types/components.ts +2 -26
  41. package/src/styles/06-components/_components.edge-panel.scss +4 -4
  42. package/src/styles/06-components/_components.nav.scss +3 -0
  43. package/src/lib/config/loader.ts +0 -147
  44. package/src/lib/theme/config/__tests__/configLoader.test.ts +0 -207
  45. package/src/lib/theme/config/configLoader.ts +0 -113
  46. package/src/lib/theme/config/loader.ts +0 -293
  47. package/src/lib/theme/generators/cssFile.ts +0 -79
@@ -1,293 +0,0 @@
1
- /**
2
- * Theme Configuration Loader
3
- *
4
- * Loads and validates the theme configuration from atomix.config.ts
5
- */
6
-
7
- import type {
8
- ConfigLoaderOptions,
9
- LoadedThemeConfig,
10
- ConfigValidationResult,
11
- } from './types';
12
- import { validateConfig } from './validator';
13
- import { ThemeError, ThemeErrorCode, getLogger } from '../errors/errors';
14
- import {
15
- DEFAULT_ATOMIX_CONFIG_PATH,
16
- DEFAULT_BASE_PATH,
17
- DEFAULT_STORAGE_KEY,
18
- DEFAULT_DATA_ATTRIBUTE,
19
- DEFAULT_INTEGRATION_CLASS_NAMES,
20
- DEFAULT_INTEGRATION_CSS_VARIABLES,
21
- DEFAULT_BUILD_OUTPUT_DIR,
22
- DEFAULT_SASS_CONFIG,
23
- ENV_DEFAULTS,
24
- } from '../constants/constants';
25
-
26
- /**
27
- * Cache for loaded configuration
28
- */
29
- let cachedConfig: LoadedThemeConfig | null = null;
30
-
31
- /**
32
- * Logger instance
33
- */
34
- const logger = getLogger();
35
-
36
- /**
37
- * Load theme configuration from atomix.config.ts
38
- *
39
- * @param options - Loader options
40
- * @returns Loaded and validated theme configuration
41
- *
42
- * @example
43
- * ```typescript
44
- * import { loadThemeConfig } from '@shohojdhara/atomix/theme/config';
45
- * const config = loadThemeConfig();
46
- * ```
47
- */
48
- export function loadThemeConfig(
49
- options: ConfigLoaderOptions = {}
50
- ): LoadedThemeConfig {
51
- const {
52
- configPath = DEFAULT_ATOMIX_CONFIG_PATH,
53
- validate = true,
54
- env = typeof process !== 'undefined' && process.env ? (process.env.NODE_ENV === 'production' ? 'production' : 'development') : 'development',
55
- } = options;
56
-
57
- // Return cached config if available
58
- if (cachedConfig) {
59
- return cachedConfig;
60
- }
61
-
62
- // Try to load config dynamically
63
- let config: LoadedThemeConfig;
64
-
65
- try {
66
- // In browser/Vite environment, we can't load config dynamically
67
- if (typeof window !== 'undefined') {
68
- throw new Error('Theme config loading not supported in browser environment');
69
- }
70
-
71
- // In ESM environments, require might be undefined.
72
- let nodeRequire: any;
73
- try {
74
- nodeRequire = require;
75
- } catch {
76
- // require is not defined
77
- }
78
-
79
- if (!nodeRequire) {
80
- throw new Error('Theme config loading not supported in this environment (require is undefined)');
81
- }
82
-
83
- // Type for config module
84
- interface ConfigModule {
85
- default?: any;
86
- [key: string]: unknown;
87
- }
88
-
89
- let configModule: ConfigModule;
90
-
91
- // Try require (Node.js/CommonJS)
92
- // Use process.cwd() to resolve config path - avoids bundling issues with relative paths
93
- try {
94
- const path = nodeRequire('path') as typeof import('path');
95
- const fs = nodeRequire('fs') as typeof import('fs');
96
-
97
- let configFilePath = path.resolve(process.cwd(), configPath);
98
-
99
- // If atomix.config.ts not found at the root, use the default path
100
- if (!fs.existsSync(configFilePath) && configPath === DEFAULT_ATOMIX_CONFIG_PATH) {
101
- configFilePath = path.resolve(process.cwd(), DEFAULT_ATOMIX_CONFIG_PATH);
102
- }
103
-
104
- if (fs.existsSync(configFilePath)) {
105
- const resolvedPath = nodeRequire.resolve(configFilePath);
106
- if (nodeRequire.cache && nodeRequire.cache[resolvedPath]) {
107
- delete nodeRequire.cache[resolvedPath];
108
- }
109
- configModule = nodeRequire(configFilePath) as ConfigModule;
110
- } else {
111
- throw new Error(`Config file not found: ${configFilePath}`);
112
- }
113
- } catch (requireError) {
114
- const errorMessage = requireError instanceof Error
115
- ? requireError.message
116
- : String(requireError);
117
- throw new ThemeError(
118
- `Cannot load config: ${errorMessage}`,
119
- ThemeErrorCode.CONFIG_LOAD_FAILED,
120
- { configPath, error: errorMessage }
121
- );
122
- }
123
-
124
- const rawConfig = configModule.default || configModule;
125
-
126
- // Process the AtomixConfig structure
127
- const processedConfig: LoadedThemeConfig = {
128
- themes: rawConfig.theme?.themes || {},
129
- build: rawConfig.build || {},
130
- runtime: rawConfig.runtime || {},
131
- integration: rawConfig.integration || {},
132
- dependencies: rawConfig.dependencies || {},
133
- validated: false, // Will be set after validation
134
- // Store tokens for generator
135
- __tokens: rawConfig.theme?.tokens,
136
- __extend: rawConfig.theme?.extend,
137
- };
138
-
139
- // Apply environment-specific overrides
140
- const finalConfig = applyEnvOverrides(processedConfig, env);
141
-
142
- // Validate if requested
143
- let validationResult: ConfigValidationResult | null = null;
144
- if (validate) {
145
- validationResult = validateConfig(finalConfig);
146
- }
147
-
148
- config = {
149
- ...finalConfig,
150
- validated: validate,
151
- errors: validationResult?.errors,
152
- warnings: validationResult?.warnings,
153
- };
154
- } catch (error) {
155
- // Fallback: return default config structure
156
- const errorMessage = error instanceof Error ? error.message : String(error);
157
- logger.warn(`Failed to load theme config from ${configPath}`, {
158
- configPath,
159
- error: errorMessage,
160
- });
161
-
162
- config = {
163
- themes: {},
164
- build: {
165
- output: {
166
- directory: DEFAULT_BUILD_OUTPUT_DIR,
167
- formats: {
168
- expanded: '.css',
169
- compressed: '.min.css',
170
- },
171
- },
172
- sass: {
173
- ...DEFAULT_SASS_CONFIG,
174
- loadPaths: [...DEFAULT_SASS_CONFIG.loadPaths],
175
- },
176
- },
177
- runtime: {
178
- basePath: DEFAULT_BASE_PATH,
179
- cdnPath: null,
180
- preload: [],
181
- lazy: true,
182
- defaultTheme: '', // No default - use built-in styles (empty string instead of undefined)
183
- storageKey: DEFAULT_STORAGE_KEY,
184
- dataAttribute: DEFAULT_DATA_ATTRIBUTE,
185
- enablePersistence: true,
186
- useMinified: env === 'production',
187
- },
188
- integration: {
189
- cssVariables: DEFAULT_INTEGRATION_CSS_VARIABLES,
190
- classNames: DEFAULT_INTEGRATION_CLASS_NAMES,
191
- },
192
- dependencies: {},
193
- validated: false,
194
- errors: [`Failed to load config: ${error instanceof Error ? error.message : String(error)}`],
195
- warnings: [],
196
- __tokens: {},
197
- __extend: {},
198
- };
199
- }
200
-
201
- // Cache the loaded config
202
- cachedConfig = config;
203
-
204
- return config;
205
- }
206
-
207
- /**
208
- * Apply environment-specific overrides to configuration
209
- *
210
- * @param config - Base configuration
211
- * @param env - Environment name
212
- * @returns Configuration with environment overrides applied
213
- */
214
- function applyEnvOverrides(
215
- config: LoadedThemeConfig,
216
- env: 'development' | 'production' | 'test'
217
- ): LoadedThemeConfig {
218
- const overridden = { ...config };
219
-
220
- // Production overrides
221
- if (env === 'production') {
222
- if (overridden.runtime) {
223
- overridden.runtime = {
224
- ...overridden.runtime,
225
- useMinified: true,
226
- lazy: true,
227
- };
228
- }
229
- }
230
-
231
- // Development overrides
232
- if (env === 'development') {
233
- if (overridden.runtime) {
234
- overridden.runtime = {
235
- ...overridden.runtime,
236
- useMinified: false,
237
- lazy: false,
238
- };
239
- }
240
- if (overridden.build) {
241
- overridden.build = {
242
- ...overridden.build,
243
- sass: {
244
- ...overridden.build.sass,
245
- sourceMap: true,
246
- },
247
- };
248
- }
249
- }
250
-
251
- // Test overrides
252
- if (env === 'test') {
253
- if (overridden.runtime) {
254
- overridden.runtime = {
255
- ...overridden.runtime,
256
- enablePersistence: false,
257
- preload: [],
258
- };
259
- }
260
- }
261
-
262
- return overridden;
263
- }
264
-
265
- /**
266
- * Clear the cached configuration
267
- * Useful for testing or hot reloading
268
- */
269
- export function clearConfigCache(): void {
270
- cachedConfig = null;
271
- }
272
-
273
- /**
274
- * Get cached configuration without loading
275
- *
276
- * @returns Cached configuration or null
277
- */
278
- export function getCachedConfig(): LoadedThemeConfig | null {
279
- return cachedConfig;
280
- }
281
-
282
- /**
283
- * Reload configuration (clears cache and loads fresh)
284
- *
285
- * @param options - Loader options
286
- * @returns Freshly loaded configuration
287
- */
288
- export function reloadThemeConfig(
289
- options: ConfigLoaderOptions = {}
290
- ): LoadedThemeConfig {
291
- clearConfigCache();
292
- return loadThemeConfig(options);
293
- }
@@ -1,79 +0,0 @@
1
- /**
2
- * CSS File Utilities
3
- *
4
- * Save CSS to file system (Node.js only).
5
- */
6
-
7
- /**
8
- * Save CSS to file
9
- *
10
- * Writes CSS string to a file. Only works in Node.js environment.
11
- *
12
- * @param css - CSS string to save
13
- * @param filePath - Output file path
14
- * @throws Error if called in browser environment
15
- *
16
- * @example
17
- * ```typescript
18
- * const css = ':root { --atomix-color-primary: #7AFFD7; }';
19
- * await saveCSSFile(css, './themes/custom.css');
20
- * ```
21
- */
22
- export async function saveCSSFile(
23
- css: string,
24
- filePath: string
25
- ): Promise<void> {
26
- // Check if in browser environment
27
- if (typeof window !== 'undefined') {
28
- throw new Error(
29
- 'saveCSSFile can only be used in Node.js environment. ' +
30
- 'Use injectCSS() for browser environments.'
31
- );
32
- }
33
-
34
- // Dynamic import to avoid bundling Node.js modules in browser builds
35
- const fs = await import('fs/promises');
36
- const path = await import('path');
37
-
38
- // Ensure directory exists
39
- const dir = path.dirname(filePath);
40
- await fs.mkdir(dir, { recursive: true });
41
-
42
- // Write file
43
- await fs.writeFile(filePath, css, 'utf8');
44
- }
45
-
46
- /**
47
- * Save CSS to file (synchronous version)
48
- *
49
- * Synchronous version of saveCSSFile. Only works in Node.js environment.
50
- *
51
- * @param css - CSS string to save
52
- * @param filePath - Output file path
53
- * @throws Error if called in browser environment
54
- */
55
- export function saveCSSFileSync(css: string, filePath: string): void {
56
- // Check if in browser environment
57
- if (typeof window !== 'undefined') {
58
- throw new Error(
59
- 'saveCSSFileSync can only be used in Node.js environment. ' +
60
- 'Use injectCSS() for browser environments.'
61
- );
62
- }
63
-
64
- // Use require for synchronous file operations
65
- // eslint-disable-next-line @typescript-eslint/no-require-imports
66
- const fs = require('fs');
67
- // eslint-disable-next-line @typescript-eslint/no-require-imports
68
- const path = require('path');
69
-
70
- // Ensure directory exists
71
- const dir = path.dirname(filePath);
72
- if (!fs.existsSync(dir)) {
73
- fs.mkdirSync(dir, { recursive: true });
74
- }
75
-
76
- // Write file
77
- fs.writeFileSync(filePath, css, 'utf8');
78
- }
79
-