beathers 5.1.1 → 5.2.0
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/dist/css/beathers.min.css +1 -1
- package/dist/css/beathers.min.css.map +1 -1
- package/dist/scripts/BuildTheme.js +46 -1
- package/dist/scripts/LoadUserConfigs.js +2 -2
- package/dist/scripts/ReadDefaultValues.js +1 -1
- package/dist/scripts/cli.js +1 -1
- package/dist/scripts/types.d.ts +18 -21
- package/package.json +1 -1
- package/src/scss/beathers.min.scss +1 -1
|
@@ -6,14 +6,59 @@ import { BuildScssVariables } from './BuildScssVariables.js';
|
|
|
6
6
|
import { CallNewVariables } from './CallNewVariables.js';
|
|
7
7
|
import { LoadUserConfigs } from './LoadUserConfigs.js';
|
|
8
8
|
import { DeepMerge } from './Merge.js';
|
|
9
|
+
import { ReadDefaultValues } from './ReadDefaultValues.js';
|
|
9
10
|
const __filename = fileURLToPath(import.meta.url);
|
|
10
11
|
const __dirname = path.dirname(__filename);
|
|
11
12
|
const projectRoot = path.resolve(__dirname, '../..');
|
|
12
13
|
const variablesPath = path.join(projectRoot, 'src', 'scss', '_variables.scss');
|
|
14
|
+
async function defaultTheme() {
|
|
15
|
+
let values = null;
|
|
16
|
+
try {
|
|
17
|
+
values = await ReadDefaultValues([path.join(projectRoot, 'src', 'scss', 'settings', '_index.scss')], [
|
|
18
|
+
'useMediaQueries',
|
|
19
|
+
'useIcons',
|
|
20
|
+
'useFontFamilies',
|
|
21
|
+
'useFontSizes',
|
|
22
|
+
'useFontShapes',
|
|
23
|
+
'useTextAligns',
|
|
24
|
+
'useTextTruncate',
|
|
25
|
+
'useColors',
|
|
26
|
+
'useColorsOpacities',
|
|
27
|
+
'useColorsLightMode',
|
|
28
|
+
'useColorsDarkMode',
|
|
29
|
+
'useCurrentColors',
|
|
30
|
+
'useRootColors',
|
|
31
|
+
'useGrid',
|
|
32
|
+
'useFlex',
|
|
33
|
+
'useTransitions',
|
|
34
|
+
'useWrappers',
|
|
35
|
+
'useShadows',
|
|
36
|
+
'useDisplays',
|
|
37
|
+
'useOverflows',
|
|
38
|
+
'useOpacities',
|
|
39
|
+
'useBlur',
|
|
40
|
+
'useObjectFits',
|
|
41
|
+
'usePositions',
|
|
42
|
+
'useInsets',
|
|
43
|
+
'useSizes',
|
|
44
|
+
'useGutters',
|
|
45
|
+
'useBorders',
|
|
46
|
+
'useTextBorders',
|
|
47
|
+
'useRadius',
|
|
48
|
+
]);
|
|
49
|
+
}
|
|
50
|
+
catch (error) {
|
|
51
|
+
// eslint-disable-next-line no-console
|
|
52
|
+
console.error('❌ buildCustomTheme failed:', error instanceof Error ? error.message : error);
|
|
53
|
+
process.exit(1);
|
|
54
|
+
}
|
|
55
|
+
return values;
|
|
56
|
+
}
|
|
13
57
|
export async function BuildTheme() {
|
|
14
58
|
try {
|
|
59
|
+
const defaults = await defaultTheme();
|
|
15
60
|
const userConfigs = await LoadUserConfigs();
|
|
16
|
-
const theme = DeepMerge(
|
|
61
|
+
const theme = DeepMerge(defaults, userConfigs);
|
|
17
62
|
const variablesString = BuildScssVariables(theme);
|
|
18
63
|
await fs.writeFile(variablesPath, variablesString, { flag: 'w' });
|
|
19
64
|
await CallNewVariables(projectRoot);
|
|
@@ -13,7 +13,7 @@ async function loadJsOrTsConfig(filePath) {
|
|
|
13
13
|
try {
|
|
14
14
|
const absolutePath = path.resolve(filePath);
|
|
15
15
|
const module = await import(absolutePath);
|
|
16
|
-
return module.default
|
|
16
|
+
return module.default ?? module;
|
|
17
17
|
}
|
|
18
18
|
catch (error) {
|
|
19
19
|
throw new Error(`Failed to load config from ${filePath}: ${error}`);
|
|
@@ -29,7 +29,7 @@ function loadJsonConfig(filePath) {
|
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
export async function LoadUserConfigs(projectPath) {
|
|
32
|
-
const basePath = projectPath
|
|
32
|
+
const basePath = projectPath ?? process.cwd();
|
|
33
33
|
const configFilePath = findConfigFile(basePath);
|
|
34
34
|
if (!configFilePath)
|
|
35
35
|
return null;
|
|
@@ -62,7 +62,7 @@ function buildWrappers(value) {
|
|
|
62
62
|
const raw = value
|
|
63
63
|
.replace(/\(/g, '{')
|
|
64
64
|
.replace(/\)/g, '}')
|
|
65
|
-
.replace(/([a-zA-Z0-9_]+):\s*([0-9%px]+)\s+([0-9.]+rem)/g, '"$1": {"
|
|
65
|
+
.replace(/([a-zA-Z0-9_]+):\s*([0-9%px]+)\s+([0-9.]+rem)/g, '"$1": {"width": "$2", "padding": "$3"}')
|
|
66
66
|
.replace(/,\s*}/g, '}');
|
|
67
67
|
const parsed = JSON.parse(raw);
|
|
68
68
|
return parsed;
|
package/dist/scripts/cli.js
CHANGED
|
@@ -134,7 +134,7 @@ async function initCommand() {
|
|
|
134
134
|
const fileName = formatMap[format];
|
|
135
135
|
const filePath = path.join(process.cwd(), fileName);
|
|
136
136
|
if (await fs.pathExists(filePath)) {
|
|
137
|
-
const shouldOverride = await promptUser(`⚠️
|
|
137
|
+
const shouldOverride = await promptUser(`⚠️ ${fileName} already exists. Do you want to override it? (y/n): `);
|
|
138
138
|
if (!shouldOverride) {
|
|
139
139
|
console.log('❌ Operation aborted.');
|
|
140
140
|
return;
|
package/dist/scripts/types.d.ts
CHANGED
|
@@ -1,55 +1,52 @@
|
|
|
1
|
-
|
|
1
|
+
type SizeUnit = `${number}px` | `${number}rem` | `${number}em` | `${number}vw` | `${number}vh` | `${number}%`;
|
|
2
|
+
type ColorType = Record<string, {
|
|
2
3
|
light: `#${string}`;
|
|
3
4
|
dark: `#${string}`;
|
|
4
5
|
}>;
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
export interface FontVariant {
|
|
6
|
+
type FontWeight = 'thin' | 'extra-light' | 'light' | 'regular' | 'medium' | 'semibold' | 'bold' | 'extra-bold' | 'black';
|
|
7
|
+
type FontStyle = 'normal' | 'italic' | 'oblique';
|
|
8
|
+
interface FontVariant {
|
|
9
9
|
title: string;
|
|
10
10
|
unicode?: string;
|
|
11
11
|
format?: 'woff' | 'woff2';
|
|
12
12
|
isLocal?: boolean;
|
|
13
13
|
url?: `https://${string}` | `http://${string}`;
|
|
14
14
|
}
|
|
15
|
-
|
|
15
|
+
type FontType = {
|
|
16
16
|
weights?: FontWeight[];
|
|
17
17
|
styles?: FontStyle[];
|
|
18
18
|
variants?: Record<string, FontVariant>;
|
|
19
19
|
};
|
|
20
|
-
|
|
20
|
+
interface Typography {
|
|
21
21
|
defaultFontFamilies?: string[];
|
|
22
22
|
fontMainPath?: string;
|
|
23
23
|
fontFormat?: 'woff' | 'woff2';
|
|
24
24
|
fontWeights?: FontWeight[];
|
|
25
25
|
fontStyles?: FontStyle[];
|
|
26
|
-
fontSizes?: Record<string,
|
|
26
|
+
fontSizes?: Record<string, SizeUnit>;
|
|
27
27
|
textTruncate?: number;
|
|
28
28
|
fonts?: Record<string, FontType>;
|
|
29
29
|
}
|
|
30
|
-
|
|
31
|
-
export type Wrappers = Record<'sm' | 'md' | 'lg' | 'xl' | 'xxl', {
|
|
32
|
-
width: `${number}px` | `${number}rem` | `${number}em`;
|
|
33
|
-
padding?: `${number}px` | `${number}rem` | `${number}em`;
|
|
34
|
-
}>;
|
|
35
|
-
export type GutterValues = Record<'auto' | number, `${number}px` | `${number}rem` | `${number}em`>;
|
|
36
|
-
export interface Settings {
|
|
30
|
+
interface Settings {
|
|
37
31
|
axisDivisions?: number;
|
|
38
32
|
opacities?: number[];
|
|
39
33
|
blurValues?: number[];
|
|
40
34
|
insetValues?: number[];
|
|
41
35
|
bordersValue?: number;
|
|
42
36
|
radiuses?: number[];
|
|
43
|
-
breakpoints?:
|
|
44
|
-
wrappers?:
|
|
45
|
-
|
|
37
|
+
breakpoints?: Record<'null' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl', 0 | SizeUnit>;
|
|
38
|
+
wrappers?: Record<'null' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl', {
|
|
39
|
+
width: SizeUnit;
|
|
40
|
+
padding?: SizeUnit;
|
|
41
|
+
}>;
|
|
42
|
+
guttersValues?: Record<'auto' | number, 'auto' | SizeUnit>;
|
|
46
43
|
}
|
|
47
44
|
type RoleKeys = 'useMediaQueries' | 'useIcons' | 'useFontFamilies' | 'useFontSizes' | 'useFontShapes' | 'useTextAligns' | 'useTextTruncate' | 'useColors' | 'useColorsOpacities' | 'useColorsLightMode' | 'useColorsDarkMode' | 'useCurrentColors' | 'useRootColors' | 'useGrid' | 'useFlex' | 'useTransitions' | 'useWrappers' | 'useShadows' | 'useDisplays' | 'useOverflows' | 'useOpacities' | 'useBlur' | 'useObjectFits' | 'usePositions' | 'useInsets' | 'useSizes' | 'useGutters' | 'useBorders' | 'useTextBorders' | 'useRadius';
|
|
48
|
-
|
|
49
|
-
|
|
45
|
+
type Roles = Partial<Record<RoleKeys, boolean>>;
|
|
46
|
+
interface Theme {
|
|
50
47
|
colors?: ColorType;
|
|
51
48
|
typography?: Typography;
|
|
52
49
|
settings?: Settings;
|
|
53
50
|
roles?: Roles;
|
|
54
51
|
}
|
|
55
|
-
export {};
|
|
52
|
+
export type { SizeUnit, ColorType, FontWeight, FontStyle, FontVariant, FontType, Typography, Settings, RoleKeys, Roles, Theme, };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "beathers",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.2.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Beather is a lightweight SCSS library that serves as a comprehensive design system for your projects. It offers a structured and consistent approach to manage colors, fonts, and other design related variables, making it easier to maintain a cohesive visual identity across your application.",
|
|
6
6
|
"main": "dist/index.js",
|