@rakeyshgidwani/roger-ui-bank-theme-stan-design 0.2.46 → 0.2.47
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 +1 -1
- package/dist/plugins/theme-css-generator.d.ts.map +1 -1
- package/dist/plugins/theme-css-generator.esm.js +16 -3
- package/dist/plugins/theme-css-generator.js +16 -3
- package/dist/styles.css +2 -4
- package/dist/themes/base-themes.d.ts +13 -8
- package/dist/themes/base-themes.d.ts.map +1 -1
- package/dist/themes/base-themes.esm.js +20 -13
- package/dist/themes/base-themes.js +20 -13
- package/dist/themes/examples/dark-theme.d.ts +4 -4
- package/dist/themes/examples/dark-theme.d.ts.map +1 -1
- package/dist/themes/examples/dark-theme.esm.js +4 -4
- package/dist/themes/examples/dark-theme.js +4 -4
- package/dist/themes/examples/minimal-theme.d.ts +1 -1
- package/dist/themes/examples/minimal-theme.d.ts.map +1 -1
- package/dist/themes/examples/minimal-theme.esm.js +2 -2
- package/dist/themes/examples/minimal-theme.js +2 -2
- package/dist/themes/index.d.ts +2 -1
- package/dist/themes/index.d.ts.map +1 -1
- package/dist/themes/index.esm.js +5 -3
- package/dist/themes/index.js +5 -3
- package/package.json +1 -1
- package/src/plugins/theme-css-generator.ts +22 -7
- package/src/themes/base-themes.ts +22 -13
- package/src/themes/examples/dark-theme.ts +4 -4
- package/src/themes/examples/minimal-theme.ts +2 -2
- package/src/themes/index.ts +8 -7
- package/dist/themes/themes/harvey.d.ts +0 -7
- package/dist/themes/themes/harvey.d.ts.map +0 -1
- package/dist/themes/themes/harvey.esm.js +0 -676
- package/dist/themes/themes/harvey.js +0 -676
- package/src/themes/themes/harvey.ts +0 -679
|
@@ -1,31 +1,36 @@
|
|
|
1
1
|
import { MultiThemeConfig } from './types';
|
|
2
2
|
import { defaultTheme } from './themes/default';
|
|
3
3
|
export declare const stanDesignTheme: MultiThemeConfig;
|
|
4
|
-
export declare const harveyTheme: MultiThemeConfig;
|
|
5
4
|
export { defaultTheme };
|
|
6
5
|
/**
|
|
7
|
-
*
|
|
6
|
+
* Available themes in this package
|
|
8
7
|
*/
|
|
9
8
|
export declare const defaultThemes: Record<string, MultiThemeConfig>;
|
|
10
9
|
/**
|
|
11
|
-
* Theme categories for
|
|
10
|
+
* Theme categories for this package
|
|
12
11
|
*/
|
|
13
12
|
export declare const themeCategories: {
|
|
14
13
|
readonly brand: readonly ["stan-design"];
|
|
15
|
-
readonly
|
|
16
|
-
readonly custom: readonly [];
|
|
17
|
-
readonly accessibility: readonly [];
|
|
14
|
+
readonly base: readonly ["default"];
|
|
18
15
|
};
|
|
19
16
|
/**
|
|
20
17
|
* Get theme by name
|
|
21
18
|
*/
|
|
22
19
|
export declare function getTheme(name: string): MultiThemeConfig | undefined;
|
|
23
20
|
/**
|
|
24
|
-
* Get all available theme names
|
|
21
|
+
* Get all available theme names in this package
|
|
25
22
|
*/
|
|
26
23
|
export declare function getAvailableThemes(): string[];
|
|
27
24
|
/**
|
|
28
|
-
* Check if theme exists
|
|
25
|
+
* Check if theme exists in this package
|
|
29
26
|
*/
|
|
30
27
|
export declare function themeExists(name: string): boolean;
|
|
28
|
+
/**
|
|
29
|
+
* Get the primary theme for this package
|
|
30
|
+
*/
|
|
31
|
+
export declare function getPrimaryTheme(): MultiThemeConfig;
|
|
32
|
+
/**
|
|
33
|
+
* Get primary theme name
|
|
34
|
+
*/
|
|
35
|
+
export declare function getPrimaryThemeName(): string;
|
|
31
36
|
//# sourceMappingURL=base-themes.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-themes.d.ts","sourceRoot":"","sources":["../../src/themes/base-themes.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"base-themes.d.ts","sourceRoot":"","sources":["../../src/themes/base-themes.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAG3C,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAGhD,eAAO,MAAM,eAAe,kBAA4C,CAAC;AAGzE,OAAO,EAAE,YAAY,EAAE,CAAC;AAExB;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAG1D,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe;;;CAGlB,CAAC;AAEX;;GAEG;AACH,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,gBAAgB,GAAG,SAAS,CAEnE;AAED;;GAEG;AACH,wBAAgB,kBAAkB,IAAI,MAAM,EAAE,CAE7C;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAEjD;AAED;;GAEG;AACH,wBAAgB,eAAe,IAAI,gBAAgB,CAElD;AAED;;GAEG;AACH,wBAAgB,mBAAmB,IAAI,MAAM,CAE5C"}
|
|
@@ -1,30 +1,25 @@
|
|
|
1
|
-
// Base Theme Definitions
|
|
2
|
-
// This file imports and exports
|
|
1
|
+
// Base Theme Definitions - stan-design Package
|
|
2
|
+
// This file imports and exports theme configurations for the stan-design theme package
|
|
3
3
|
import { applyThemeInheritance } from './inheritance';
|
|
4
4
|
import { stanDesignTheme as stanDesignThemeRaw } from './themes/stan-design';
|
|
5
|
-
import { harveyTheme as harveyThemeRaw } from './themes/harvey';
|
|
6
5
|
import { defaultTheme } from './themes/default';
|
|
7
6
|
// Apply inheritance to ensure all themes have complete configurations
|
|
8
7
|
export const stanDesignTheme = applyThemeInheritance(stanDesignThemeRaw);
|
|
9
|
-
export const harveyTheme = applyThemeInheritance(harveyThemeRaw);
|
|
10
8
|
// Export the default theme for reference
|
|
11
9
|
export { defaultTheme };
|
|
12
10
|
/**
|
|
13
|
-
*
|
|
11
|
+
* Available themes in this package
|
|
14
12
|
*/
|
|
15
13
|
export const defaultThemes = {
|
|
16
|
-
'default': defaultTheme,
|
|
17
14
|
'stan-design': stanDesignTheme,
|
|
18
|
-
'
|
|
15
|
+
'default': defaultTheme
|
|
19
16
|
};
|
|
20
17
|
/**
|
|
21
|
-
* Theme categories for
|
|
18
|
+
* Theme categories for this package
|
|
22
19
|
*/
|
|
23
20
|
export const themeCategories = {
|
|
24
21
|
brand: ['stan-design'],
|
|
25
|
-
|
|
26
|
-
custom: [],
|
|
27
|
-
accessibility: []
|
|
22
|
+
base: ['default']
|
|
28
23
|
};
|
|
29
24
|
/**
|
|
30
25
|
* Get theme by name
|
|
@@ -33,14 +28,26 @@ export function getTheme(name) {
|
|
|
33
28
|
return defaultThemes[name];
|
|
34
29
|
}
|
|
35
30
|
/**
|
|
36
|
-
* Get all available theme names
|
|
31
|
+
* Get all available theme names in this package
|
|
37
32
|
*/
|
|
38
33
|
export function getAvailableThemes() {
|
|
39
34
|
return Object.keys(defaultThemes);
|
|
40
35
|
}
|
|
41
36
|
/**
|
|
42
|
-
* Check if theme exists
|
|
37
|
+
* Check if theme exists in this package
|
|
43
38
|
*/
|
|
44
39
|
export function themeExists(name) {
|
|
45
40
|
return name in defaultThemes;
|
|
46
41
|
}
|
|
42
|
+
/**
|
|
43
|
+
* Get the primary theme for this package
|
|
44
|
+
*/
|
|
45
|
+
export function getPrimaryTheme() {
|
|
46
|
+
return defaultThemes['stan-design'];
|
|
47
|
+
}
|
|
48
|
+
/**
|
|
49
|
+
* Get primary theme name
|
|
50
|
+
*/
|
|
51
|
+
export function getPrimaryThemeName() {
|
|
52
|
+
return 'stan-design';
|
|
53
|
+
}
|
|
@@ -1,30 +1,25 @@
|
|
|
1
|
-
// Base Theme Definitions
|
|
2
|
-
// This file imports and exports
|
|
1
|
+
// Base Theme Definitions - stan-design Package
|
|
2
|
+
// This file imports and exports theme configurations for the stan-design theme package
|
|
3
3
|
import { applyThemeInheritance } from './inheritance';
|
|
4
4
|
import { stanDesignTheme as stanDesignThemeRaw } from './themes/stan-design';
|
|
5
|
-
import { harveyTheme as harveyThemeRaw } from './themes/harvey';
|
|
6
5
|
import { defaultTheme } from './themes/default';
|
|
7
6
|
// Apply inheritance to ensure all themes have complete configurations
|
|
8
7
|
export const stanDesignTheme = applyThemeInheritance(stanDesignThemeRaw);
|
|
9
|
-
export const harveyTheme = applyThemeInheritance(harveyThemeRaw);
|
|
10
8
|
// Export the default theme for reference
|
|
11
9
|
export { defaultTheme };
|
|
12
10
|
/**
|
|
13
|
-
*
|
|
11
|
+
* Available themes in this package
|
|
14
12
|
*/
|
|
15
13
|
export const defaultThemes = {
|
|
16
|
-
'default': defaultTheme,
|
|
17
14
|
'stan-design': stanDesignTheme,
|
|
18
|
-
'
|
|
15
|
+
'default': defaultTheme
|
|
19
16
|
};
|
|
20
17
|
/**
|
|
21
|
-
* Theme categories for
|
|
18
|
+
* Theme categories for this package
|
|
22
19
|
*/
|
|
23
20
|
export const themeCategories = {
|
|
24
21
|
brand: ['stan-design'],
|
|
25
|
-
|
|
26
|
-
custom: [],
|
|
27
|
-
accessibility: []
|
|
22
|
+
base: ['default']
|
|
28
23
|
};
|
|
29
24
|
/**
|
|
30
25
|
* Get theme by name
|
|
@@ -33,14 +28,26 @@ export function getTheme(name) {
|
|
|
33
28
|
return defaultThemes[name];
|
|
34
29
|
}
|
|
35
30
|
/**
|
|
36
|
-
* Get all available theme names
|
|
31
|
+
* Get all available theme names in this package
|
|
37
32
|
*/
|
|
38
33
|
export function getAvailableThemes() {
|
|
39
34
|
return Object.keys(defaultThemes);
|
|
40
35
|
}
|
|
41
36
|
/**
|
|
42
|
-
* Check if theme exists
|
|
37
|
+
* Check if theme exists in this package
|
|
43
38
|
*/
|
|
44
39
|
export function themeExists(name) {
|
|
45
40
|
return name in defaultThemes;
|
|
46
41
|
}
|
|
42
|
+
/**
|
|
43
|
+
* Get the primary theme for this package
|
|
44
|
+
*/
|
|
45
|
+
export function getPrimaryTheme() {
|
|
46
|
+
return defaultThemes['stan-design'];
|
|
47
|
+
}
|
|
48
|
+
/**
|
|
49
|
+
* Get primary theme name
|
|
50
|
+
*/
|
|
51
|
+
export function getPrimaryThemeName() {
|
|
52
|
+
return 'stan-design';
|
|
53
|
+
}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Create dark theme with full inheritance
|
|
3
3
|
*/
|
|
4
|
-
export declare const darkTheme: import("
|
|
4
|
+
export declare const darkTheme: import("..").MultiThemeConfig;
|
|
5
5
|
/**
|
|
6
|
-
* Example: Override an existing theme (
|
|
6
|
+
* Example: Override an existing theme (StanDesign) to create a dark variant
|
|
7
7
|
*/
|
|
8
|
-
export declare const stanDesignDarkTheme: import("
|
|
8
|
+
export declare const stanDesignDarkTheme: import("..").MultiThemeConfig;
|
|
9
9
|
/**
|
|
10
10
|
* Example: Partial override for quick customizations
|
|
11
11
|
*/
|
|
12
|
-
export declare const quickDarkVariant: import("
|
|
12
|
+
export declare const quickDarkVariant: import("..").MultiThemeConfig;
|
|
13
13
|
//# sourceMappingURL=dark-theme.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dark-theme.d.ts","sourceRoot":"","sources":["../../../src/themes/examples/dark-theme.ts"],"names":[],"mappings":"AAwGA;;GAEG;AACH,eAAO,MAAM,SAAS
|
|
1
|
+
{"version":3,"file":"dark-theme.d.ts","sourceRoot":"","sources":["../../../src/themes/examples/dark-theme.ts"],"names":[],"mappings":"AAwGA;;GAEG;AACH,eAAO,MAAM,SAAS,+BAA+B,CAAC;AAEtD;;GAEG;AACH,eAAO,MAAM,mBAAmB,+BAa9B,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,gBAAgB,+BAuB3B,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createTheme, overrideTheme } from '../inheritance
|
|
1
|
+
import { createTheme, overrideTheme } from '../inheritance';
|
|
2
2
|
import { stanDesignTheme } from '../base-themes';
|
|
3
3
|
/**
|
|
4
4
|
* Example: Dark Theme using inheritance
|
|
@@ -105,12 +105,12 @@ const darkThemeConfig = {
|
|
|
105
105
|
*/
|
|
106
106
|
export const darkTheme = createTheme(darkThemeConfig);
|
|
107
107
|
/**
|
|
108
|
-
* Example: Override an existing theme (
|
|
108
|
+
* Example: Override an existing theme (StanDesign) to create a dark variant
|
|
109
109
|
*/
|
|
110
110
|
export const stanDesignDarkTheme = overrideTheme(stanDesignTheme, {
|
|
111
111
|
meta: {
|
|
112
|
-
name: '
|
|
113
|
-
description: 'Dark variant of
|
|
112
|
+
name: 'StanDesign Dark',
|
|
113
|
+
description: 'Dark variant of StanDesign theme',
|
|
114
114
|
author: 'Theme Examples',
|
|
115
115
|
version: '1.0.0',
|
|
116
116
|
category: 'custom',
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createTheme, overrideTheme } from '../inheritance
|
|
1
|
+
import { createTheme, overrideTheme } from '../inheritance';
|
|
2
2
|
import { stanDesignTheme } from '../base-themes';
|
|
3
3
|
/**
|
|
4
4
|
* Example: Dark Theme using inheritance
|
|
@@ -105,12 +105,12 @@ const darkThemeConfig = {
|
|
|
105
105
|
*/
|
|
106
106
|
export const darkTheme = createTheme(darkThemeConfig);
|
|
107
107
|
/**
|
|
108
|
-
* Example: Override an existing theme (
|
|
108
|
+
* Example: Override an existing theme (StanDesign) to create a dark variant
|
|
109
109
|
*/
|
|
110
110
|
export const stanDesignDarkTheme = overrideTheme(stanDesignTheme, {
|
|
111
111
|
meta: {
|
|
112
|
-
name: '
|
|
113
|
-
description: 'Dark variant of
|
|
112
|
+
name: 'StanDesign Dark',
|
|
113
|
+
description: 'Dark variant of StanDesign theme',
|
|
114
114
|
author: 'Theme Examples',
|
|
115
115
|
version: '1.0.0',
|
|
116
116
|
category: 'custom',
|
|
@@ -2,5 +2,5 @@
|
|
|
2
2
|
* Create the theme with inheritance applied
|
|
3
3
|
* This will have ALL properties filled in, using defaults where not specified
|
|
4
4
|
*/
|
|
5
|
-
export declare const minimalTheme: import("
|
|
5
|
+
export declare const minimalTheme: import("..").MultiThemeConfig;
|
|
6
6
|
//# sourceMappingURL=minimal-theme.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"minimal-theme.d.ts","sourceRoot":"","sources":["../../../src/themes/examples/minimal-theme.ts"],"names":[],"mappings":"AA0FA;;;GAGG;AACH,eAAO,MAAM,YAAY,
|
|
1
|
+
{"version":3,"file":"minimal-theme.d.ts","sourceRoot":"","sources":["../../../src/themes/examples/minimal-theme.ts"],"names":[],"mappings":"AA0FA;;;GAGG;AACH,eAAO,MAAM,YAAY,+BAAkC,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createTheme } from '../inheritance
|
|
1
|
+
import { createTheme } from '../inheritance';
|
|
2
2
|
/**
|
|
3
3
|
* Example: Minimal Theme using inheritance
|
|
4
4
|
* This theme only defines the properties it wants to override.
|
|
@@ -94,7 +94,7 @@ export const minimalTheme = createTheme(minimalThemeConfig);
|
|
|
94
94
|
/**
|
|
95
95
|
* Example of checking theme completeness
|
|
96
96
|
*/
|
|
97
|
-
import { themeInheritanceManager } from '../inheritance
|
|
97
|
+
import { themeInheritanceManager } from '../inheritance';
|
|
98
98
|
// This will return an empty array since inheritance fills in all missing values
|
|
99
99
|
const missingProperties = themeInheritanceManager.validateCompleteness(minimalTheme);
|
|
100
100
|
console.log('Missing properties:', missingProperties); // Should be []
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createTheme } from '../inheritance
|
|
1
|
+
import { createTheme } from '../inheritance';
|
|
2
2
|
/**
|
|
3
3
|
* Example: Minimal Theme using inheritance
|
|
4
4
|
* This theme only defines the properties it wants to override.
|
|
@@ -94,7 +94,7 @@ export const minimalTheme = createTheme(minimalThemeConfig);
|
|
|
94
94
|
/**
|
|
95
95
|
* Example of checking theme completeness
|
|
96
96
|
*/
|
|
97
|
-
import { themeInheritanceManager } from '../inheritance
|
|
97
|
+
import { themeInheritanceManager } from '../inheritance';
|
|
98
98
|
// This will return an empty array since inheritance fills in all missing values
|
|
99
99
|
const missingProperties = themeInheritanceManager.validateCompleteness(minimalTheme);
|
|
100
100
|
console.log('Missing properties:', missingProperties); // Should be []
|
package/dist/themes/index.d.ts
CHANGED
|
@@ -4,5 +4,6 @@ export * from './inheritance';
|
|
|
4
4
|
export * from './useTheme';
|
|
5
5
|
export * from './ThemeProvider';
|
|
6
6
|
export { defaultTheme } from './themes/default';
|
|
7
|
-
export { stanDesignTheme,
|
|
7
|
+
export { stanDesignTheme, defaultTheme as baseDefaultTheme } from './base-themes';
|
|
8
|
+
export { getPrimaryTheme, getPrimaryThemeName } from './base-themes';
|
|
8
9
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/themes/index.ts"],"names":[],"mappings":"AAGA,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAGhC,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAGhD,OAAO,EACL,eAAe,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/themes/index.ts"],"names":[],"mappings":"AAGA,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAGhC,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAGhD,OAAO,EACL,eAAe,EACf,YAAY,IAAI,gBAAgB,EACjC,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC"}
|
package/dist/themes/index.esm.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
// Main theme exports
|
|
2
|
-
// This file provides a clean interface for importing themes
|
|
1
|
+
// Main theme exports - stan-design Package
|
|
2
|
+
// This file provides a clean interface for importing themes in the stan-design package
|
|
3
3
|
export * from './base-themes';
|
|
4
4
|
export * from './types';
|
|
5
5
|
export * from './inheritance';
|
|
@@ -8,4 +8,6 @@ export * from './ThemeProvider';
|
|
|
8
8
|
// Export default theme for reference
|
|
9
9
|
export { defaultTheme } from './themes/default';
|
|
10
10
|
// Direct theme imports for convenience (with inheritance applied)
|
|
11
|
-
export { stanDesignTheme,
|
|
11
|
+
export { stanDesignTheme, defaultTheme as baseDefaultTheme } from './base-themes';
|
|
12
|
+
// Additional convenience exports
|
|
13
|
+
export { getPrimaryTheme, getPrimaryThemeName } from './base-themes';
|
package/dist/themes/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
// Main theme exports
|
|
2
|
-
// This file provides a clean interface for importing themes
|
|
1
|
+
// Main theme exports - stan-design Package
|
|
2
|
+
// This file provides a clean interface for importing themes in the stan-design package
|
|
3
3
|
export * from './base-themes';
|
|
4
4
|
export * from './types';
|
|
5
5
|
export * from './inheritance';
|
|
@@ -8,4 +8,6 @@ export * from './ThemeProvider';
|
|
|
8
8
|
// Export default theme for reference
|
|
9
9
|
export { defaultTheme } from './themes/default';
|
|
10
10
|
// Direct theme imports for convenience (with inheritance applied)
|
|
11
|
-
export { stanDesignTheme,
|
|
11
|
+
export { stanDesignTheme, defaultTheme as baseDefaultTheme } from './base-themes';
|
|
12
|
+
// Additional convenience exports
|
|
13
|
+
export { getPrimaryTheme, getPrimaryThemeName } from './base-themes';
|
package/package.json
CHANGED
|
@@ -99,17 +99,32 @@ export default function themeCSSGenerator(): Plugin {
|
|
|
99
99
|
return css
|
|
100
100
|
}
|
|
101
101
|
|
|
102
|
+
// Helper function to check if font is Google font
|
|
103
|
+
const isFontGoogleFont = (themeObj: MultiThemeConfig, fontKey: string): boolean => {
|
|
104
|
+
const fonts = themeObj.fonts as any
|
|
105
|
+
return fonts?.[fontKey]?.source?.type === 'google'
|
|
106
|
+
}
|
|
107
|
+
|
|
102
108
|
// Recursively generate CSS variables from theme object
|
|
103
|
-
const generateCSSVariables = (obj: any, path: string[] = []): string => {
|
|
109
|
+
const generateCSSVariables = (obj: any, path: string[] = [], rootTheme?: MultiThemeConfig): string => {
|
|
104
110
|
let css = ''
|
|
105
|
-
|
|
111
|
+
|
|
106
112
|
if (typeof obj !== 'object' || obj === null) {
|
|
107
113
|
return css
|
|
108
114
|
}
|
|
109
|
-
|
|
115
|
+
|
|
110
116
|
Object.entries(obj).forEach(([key, value]) => {
|
|
111
117
|
const currentPath = [...path, key]
|
|
112
|
-
|
|
118
|
+
|
|
119
|
+
// Skip font file paths for Google fonts
|
|
120
|
+
if (path.length >= 3 && path[0] === 'fonts' && path[2] === 'source' && key === 'files') {
|
|
121
|
+
const fontKey = path[1]
|
|
122
|
+
if (rootTheme && isFontGoogleFont(rootTheme, fontKey)) {
|
|
123
|
+
// Skip generating CSS variables for Google font files
|
|
124
|
+
return
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
|
|
113
128
|
if (typeof value === 'string' || typeof value === 'number') {
|
|
114
129
|
// Generate CSS variable for primitive values
|
|
115
130
|
const cssVarName = createCSSVarName(currentPath)
|
|
@@ -120,10 +135,10 @@ export default function themeCSSGenerator(): Plugin {
|
|
|
120
135
|
css += ` ${cssVarName}: ${valueToString(value)};\n`
|
|
121
136
|
} else if (typeof value === 'object' && value !== null) {
|
|
122
137
|
// Recursively process nested objects
|
|
123
|
-
css += generateCSSVariables(value, currentPath)
|
|
138
|
+
css += generateCSSVariables(value, currentPath, rootTheme)
|
|
124
139
|
}
|
|
125
140
|
})
|
|
126
|
-
|
|
141
|
+
|
|
127
142
|
return css
|
|
128
143
|
}
|
|
129
144
|
|
|
@@ -151,7 +166,7 @@ export default function themeCSSGenerator(): Plugin {
|
|
|
151
166
|
css += generateBreakpointVariables(breakpoints)
|
|
152
167
|
|
|
153
168
|
// Generate all other CSS variables
|
|
154
|
-
css += generateCSSVariables(themeObj)
|
|
169
|
+
css += generateCSSVariables(themeObj, [], themeObj)
|
|
155
170
|
css += '}\n\n'
|
|
156
171
|
|
|
157
172
|
// Generate dark mode variables
|
|
@@ -1,36 +1,31 @@
|
|
|
1
|
-
// Base Theme Definitions
|
|
2
|
-
// This file imports and exports
|
|
1
|
+
// Base Theme Definitions - stan-design Package
|
|
2
|
+
// This file imports and exports theme configurations for the stan-design theme package
|
|
3
3
|
|
|
4
4
|
import { MultiThemeConfig } from './types';
|
|
5
5
|
import { applyThemeInheritance } from './inheritance';
|
|
6
6
|
import { stanDesignTheme as stanDesignThemeRaw } from './themes/stan-design';
|
|
7
|
-
import { harveyTheme as harveyThemeRaw } from './themes/harvey';
|
|
8
7
|
import { defaultTheme } from './themes/default';
|
|
9
8
|
|
|
10
9
|
// Apply inheritance to ensure all themes have complete configurations
|
|
11
10
|
export const stanDesignTheme = applyThemeInheritance(stanDesignThemeRaw);
|
|
12
|
-
export const harveyTheme = applyThemeInheritance(harveyThemeRaw);
|
|
13
11
|
|
|
14
12
|
// Export the default theme for reference
|
|
15
13
|
export { defaultTheme };
|
|
16
14
|
|
|
17
15
|
/**
|
|
18
|
-
*
|
|
16
|
+
* Available themes in this package
|
|
19
17
|
*/
|
|
20
18
|
export const defaultThemes: Record<string, MultiThemeConfig> = {
|
|
21
|
-
'default': defaultTheme,
|
|
22
19
|
'stan-design': stanDesignTheme,
|
|
23
|
-
'
|
|
20
|
+
'default': defaultTheme
|
|
24
21
|
};
|
|
25
22
|
|
|
26
23
|
/**
|
|
27
|
-
* Theme categories for
|
|
24
|
+
* Theme categories for this package
|
|
28
25
|
*/
|
|
29
26
|
export const themeCategories = {
|
|
30
27
|
brand: ['stan-design'],
|
|
31
|
-
|
|
32
|
-
custom: [],
|
|
33
|
-
accessibility: []
|
|
28
|
+
base: ['default']
|
|
34
29
|
} as const;
|
|
35
30
|
|
|
36
31
|
/**
|
|
@@ -41,15 +36,29 @@ export function getTheme(name: string): MultiThemeConfig | undefined {
|
|
|
41
36
|
}
|
|
42
37
|
|
|
43
38
|
/**
|
|
44
|
-
* Get all available theme names
|
|
39
|
+
* Get all available theme names in this package
|
|
45
40
|
*/
|
|
46
41
|
export function getAvailableThemes(): string[] {
|
|
47
42
|
return Object.keys(defaultThemes);
|
|
48
43
|
}
|
|
49
44
|
|
|
50
45
|
/**
|
|
51
|
-
* Check if theme exists
|
|
46
|
+
* Check if theme exists in this package
|
|
52
47
|
*/
|
|
53
48
|
export function themeExists(name: string): boolean {
|
|
54
49
|
return name in defaultThemes;
|
|
55
50
|
}
|
|
51
|
+
|
|
52
|
+
/**
|
|
53
|
+
* Get the primary theme for this package
|
|
54
|
+
*/
|
|
55
|
+
export function getPrimaryTheme(): MultiThemeConfig {
|
|
56
|
+
return defaultThemes['stan-design'];
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
/**
|
|
60
|
+
* Get primary theme name
|
|
61
|
+
*/
|
|
62
|
+
export function getPrimaryThemeName(): string {
|
|
63
|
+
return 'stan-design';
|
|
64
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createTheme, overrideTheme, PartialThemeConfig } from '../inheritance
|
|
1
|
+
import { createTheme, overrideTheme, PartialThemeConfig } from '../inheritance';
|
|
2
2
|
import { stanDesignTheme } from '../base-themes';
|
|
3
3
|
|
|
4
4
|
/**
|
|
@@ -108,12 +108,12 @@ const darkThemeConfig: PartialThemeConfig = {
|
|
|
108
108
|
export const darkTheme = createTheme(darkThemeConfig);
|
|
109
109
|
|
|
110
110
|
/**
|
|
111
|
-
* Example: Override an existing theme (
|
|
111
|
+
* Example: Override an existing theme (StanDesign) to create a dark variant
|
|
112
112
|
*/
|
|
113
113
|
export const stanDesignDarkTheme = overrideTheme(stanDesignTheme, {
|
|
114
114
|
meta: {
|
|
115
|
-
name: '
|
|
116
|
-
description: 'Dark variant of
|
|
115
|
+
name: 'StanDesign Dark',
|
|
116
|
+
description: 'Dark variant of StanDesign theme',
|
|
117
117
|
author: 'Theme Examples',
|
|
118
118
|
version: '1.0.0',
|
|
119
119
|
category: 'custom',
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createTheme, PartialThemeConfig } from '../inheritance
|
|
1
|
+
import { createTheme, PartialThemeConfig } from '../inheritance';
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
4
|
* Example: Minimal Theme using inheritance
|
|
@@ -97,7 +97,7 @@ export const minimalTheme = createTheme(minimalThemeConfig);
|
|
|
97
97
|
/**
|
|
98
98
|
* Example of checking theme completeness
|
|
99
99
|
*/
|
|
100
|
-
import { themeInheritanceManager } from '../inheritance
|
|
100
|
+
import { themeInheritanceManager } from '../inheritance';
|
|
101
101
|
|
|
102
102
|
// This will return an empty array since inheritance fills in all missing values
|
|
103
103
|
const missingProperties = themeInheritanceManager.validateCompleteness(minimalTheme);
|
package/src/themes/index.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
// Main theme exports
|
|
2
|
-
// This file provides a clean interface for importing themes
|
|
1
|
+
// Main theme exports - stan-design Package
|
|
2
|
+
// This file provides a clean interface for importing themes in the stan-design package
|
|
3
3
|
|
|
4
4
|
export * from './base-themes';
|
|
5
5
|
export * from './types';
|
|
@@ -11,9 +11,10 @@ export * from './ThemeProvider';
|
|
|
11
11
|
export { defaultTheme } from './themes/default';
|
|
12
12
|
|
|
13
13
|
// Direct theme imports for convenience (with inheritance applied)
|
|
14
|
-
export {
|
|
15
|
-
stanDesignTheme,
|
|
16
|
-
|
|
17
|
-
harveyTheme,
|
|
18
|
-
defaultTheme as baseDefaultTheme
|
|
14
|
+
export {
|
|
15
|
+
stanDesignTheme,
|
|
16
|
+
defaultTheme as baseDefaultTheme
|
|
19
17
|
} from './base-themes';
|
|
18
|
+
|
|
19
|
+
// Additional convenience exports
|
|
20
|
+
export { getPrimaryTheme, getPrimaryThemeName } from './base-themes';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"harvey.d.ts","sourceRoot":"","sources":["../../../src/themes/themes/harvey.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAE5C;;;GAGG;AACH,eAAO,MAAM,WAAW,EAAE,gBAgqBzB,CAAC"}
|