@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.
- package/CHANGELOG.md +9 -1
- package/dist/atomix.css +9 -6
- package/dist/atomix.css.map +1 -1
- package/dist/atomix.min.css +9 -6
- package/dist/atomix.min.css.map +1 -1
- package/dist/charts.js +82 -60
- package/dist/charts.js.map +1 -1
- package/dist/core.js +82 -60
- package/dist/core.js.map +1 -1
- package/dist/forms.js +82 -60
- package/dist/forms.js.map +1 -1
- package/dist/heavy.js +82 -60
- package/dist/heavy.js.map +1 -1
- package/dist/index.d.ts +11 -107
- package/dist/index.esm.js +165 -407
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +169 -412
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/dist/theme.d.ts +1 -32
- package/dist/theme.js +12 -207
- package/dist/theme.js.map +1 -1
- package/package.json +1 -1
- package/src/components/AtomixGlass/AtomixGlass.tsx +124 -127
- package/src/components/AtomixGlass/AtomixGlassContainer.tsx +28 -32
- package/src/components/AtomixGlass/GlassFilter.tsx +15 -4
- package/src/components/EdgePanel/EdgePanel.stories.tsx +2 -7
- package/src/components/EdgePanel/EdgePanel.tsx +0 -10
- package/src/components/Form/Radio.stories.tsx +235 -103
- package/src/components/Navigation/Nav/NavDropdown.tsx +8 -4
- package/src/components/Navigation/SideMenu/SideMenu.tsx +2 -22
- package/src/components/Navigation/SideMenu/SideMenuItem.tsx +11 -15
- package/src/lib/config/index.ts +5 -5
- package/src/lib/theme/config/index.ts +1 -1
- package/src/lib/theme/core/createTheme.ts +11 -40
- package/src/lib/theme/generators/index.ts +1 -4
- package/src/lib/theme/index.ts +4 -16
- package/src/lib/theme/runtime/ThemeProvider.tsx +1 -16
- package/src/lib/types/components.ts +2 -26
- package/src/styles/06-components/_components.edge-panel.scss +4 -4
- package/src/styles/06-components/_components.nav.scss +3 -0
- package/src/lib/config/loader.ts +0 -147
- package/src/lib/theme/config/__tests__/configLoader.test.ts +0 -207
- package/src/lib/theme/config/configLoader.ts +0 -113
- package/src/lib/theme/config/loader.ts +0 -293
- 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
|
-
|