tenara-ui-components 0.2.1 → 0.2.3
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/README.md +1 -1
- package/dist/components/atoms/Button/Button.d.ts +7 -2
- package/dist/components/atoms/Button/Button.d.ts.map +1 -1
- package/dist/components/atoms/ButtonLink/ButtonLink.d.ts +3 -1
- package/dist/components/atoms/ButtonLink/ButtonLink.d.ts.map +1 -1
- package/dist/components/atoms/ColorTable/ColorTable.d.ts +12 -0
- package/dist/components/atoms/ColorTable/ColorTable.d.ts.map +1 -0
- package/dist/components/atoms/ColorTable/index.d.ts +3 -0
- package/dist/components/atoms/ColorTable/index.d.ts.map +1 -0
- package/dist/components/atoms/Grid/Grid.d.ts +79 -0
- package/dist/components/atoms/Grid/Grid.d.ts.map +1 -0
- package/dist/components/atoms/Grid/index.d.ts +3 -0
- package/dist/components/atoms/Grid/index.d.ts.map +1 -0
- package/dist/components/atoms/Heading/Heading.d.ts +15 -2
- package/dist/components/atoms/Heading/Heading.d.ts.map +1 -1
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.esm.css +1 -1
- package/dist/index.esm.js +6 -7
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +5 -6
- package/dist/index.js.map +1 -1
- package/dist/themes/core/client-provider.d.ts.map +1 -1
- package/dist/themes/core/color-system.d.ts +71 -0
- package/dist/themes/core/color-system.d.ts.map +1 -0
- package/dist/themes/core/context.d.ts.map +1 -1
- package/dist/themes/core/types.d.ts +56 -20
- package/dist/themes/core/types.d.ts.map +1 -1
- package/dist/themes/hooks/useColorTokens.d.ts +22 -0
- package/dist/themes/hooks/useColorTokens.d.ts.map +1 -0
- package/dist/themes/index.d.ts +7 -1
- package/dist/themes/index.d.ts.map +1 -1
- package/dist/themes/presets/advisors-plus.d.ts +1 -1
- package/dist/themes/presets/advisors-plus.d.ts.map +1 -1
- package/dist/themes/presets/color-systems/advisors-plus-colors.d.ts +7 -0
- package/dist/themes/presets/color-systems/advisors-plus-colors.d.ts.map +1 -0
- package/dist/themes/presets/color-systems/default-colors.d.ts +7 -0
- package/dist/themes/presets/color-systems/default-colors.d.ts.map +1 -0
- package/dist/themes/presets/color-systems/primax-colors.d.ts +7 -0
- package/dist/themes/presets/color-systems/primax-colors.d.ts.map +1 -0
- package/dist/themes/presets/default.d.ts +1 -1
- package/dist/themes/presets/default.d.ts.map +1 -1
- package/dist/themes/presets/primax.d.ts +2 -2
- package/dist/themes/presets/primax.d.ts.map +1 -1
- package/dist/themes/utils/generator.d.ts +1 -0
- package/dist/themes/utils/generator.d.ts.map +1 -1
- package/dist/themes/utils/helpers.d.ts +12 -0
- package/dist/themes/utils/helpers.d.ts.map +1 -0
- package/dist/themes/utils/index.d.ts +6 -0
- package/dist/themes/utils/index.d.ts.map +1 -0
- package/package.json +3 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"client-provider.d.ts","sourceRoot":"","sources":["../../../src/themes/core/client-provider.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"client-provider.d.ts","sourceRoot":"","sources":["../../../src/themes/core/client-provider.tsx"],"names":[],"mappings":"AAEA;;;GAGG;AAEH,OAAO,EAAE,aAAa,IAAI,iBAAiB,EAAE,MAAM,WAAW,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAGrC,eAAO,MAAM,aAAa,0BAAoB,CAAC"}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Multi-level color management system (Figma-style)
|
|
3
|
+
*
|
|
4
|
+
* Level 1: Primitive Colors - Raw color values (palette)
|
|
5
|
+
* Level 2: Semantic Tokens - Purpose-based colors referencing primitives
|
|
6
|
+
*
|
|
7
|
+
*/
|
|
8
|
+
export interface ColorPrimitives {
|
|
9
|
+
white: string;
|
|
10
|
+
black: string;
|
|
11
|
+
[key: string]: string;
|
|
12
|
+
}
|
|
13
|
+
export interface SemanticColorTokens {
|
|
14
|
+
primary: string;
|
|
15
|
+
primaryHover: string;
|
|
16
|
+
primaryActive: string;
|
|
17
|
+
primaryText: string;
|
|
18
|
+
secondary: string;
|
|
19
|
+
secondaryHover: string;
|
|
20
|
+
secondaryActive: string;
|
|
21
|
+
secondaryText: string;
|
|
22
|
+
accent: string;
|
|
23
|
+
accentHover: string;
|
|
24
|
+
accentActive: string;
|
|
25
|
+
accentText: string;
|
|
26
|
+
tertiary: string;
|
|
27
|
+
tertiaryHover: string;
|
|
28
|
+
tertiaryActive: string;
|
|
29
|
+
tertiaryText: string;
|
|
30
|
+
textPrimary: string;
|
|
31
|
+
textSecondary: string;
|
|
32
|
+
textTertiary: string;
|
|
33
|
+
textInverse: string;
|
|
34
|
+
textDisabled: string;
|
|
35
|
+
textLink: string;
|
|
36
|
+
textLinkHover: string;
|
|
37
|
+
bgPrimary: string;
|
|
38
|
+
bgSecondary: string;
|
|
39
|
+
bgTertiary: string;
|
|
40
|
+
bgInverse: string;
|
|
41
|
+
bgOverlay: string;
|
|
42
|
+
borderDefault: string;
|
|
43
|
+
borderSubtle: string;
|
|
44
|
+
borderStrong: string;
|
|
45
|
+
borderFocus: string;
|
|
46
|
+
stateSuccess: string;
|
|
47
|
+
stateSuccessHover: string;
|
|
48
|
+
stateSuccessBg: string;
|
|
49
|
+
stateWarning: string;
|
|
50
|
+
stateWarningHover: string;
|
|
51
|
+
stateWarningBg: string;
|
|
52
|
+
stateError: string;
|
|
53
|
+
stateErrorHover: string;
|
|
54
|
+
stateErrorBg: string;
|
|
55
|
+
stateInfo: string;
|
|
56
|
+
stateInfoHover: string;
|
|
57
|
+
stateInfoBg: string;
|
|
58
|
+
interactivePrimary: string;
|
|
59
|
+
interactivePrimaryHover: string;
|
|
60
|
+
interactivePrimaryActive: string;
|
|
61
|
+
interactiveSecondary: string;
|
|
62
|
+
interactiveSecondaryHover: string;
|
|
63
|
+
interactiveSecondaryActive: string;
|
|
64
|
+
interactiveDisabled: string;
|
|
65
|
+
[key: string]: string;
|
|
66
|
+
}
|
|
67
|
+
export interface ColorSystem {
|
|
68
|
+
primitives: ColorPrimitives;
|
|
69
|
+
semantic: SemanticColorTokens;
|
|
70
|
+
}
|
|
71
|
+
//# sourceMappingURL=color-system.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"color-system.d.ts","sourceRoot":"","sources":["../../../src/themes/core/color-system.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAQH,MAAM,WAAW,eAAe;IAE9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IAGd,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB;AAQD,MAAM,WAAW,mBAAmB;IAElC,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;IAGrB,WAAW,EAAE,MAAM,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,aAAa,EAAE,MAAM,CAAC;IAGtB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAGlB,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IAGpB,YAAY,EAAE,MAAM,CAAC;IACrB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;IACrB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,cAAc,EAAE,MAAM,CAAC;IACvB,WAAW,EAAE,MAAM,CAAC;IAGpB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,uBAAuB,EAAE,MAAM,CAAC;IAChC,wBAAwB,EAAE,MAAM,CAAC;IACjC,oBAAoB,EAAE,MAAM,CAAC;IAC7B,yBAAyB,EAAE,MAAM,CAAC;IAClC,0BAA0B,EAAE,MAAM,CAAC;IACnC,mBAAmB,EAAE,MAAM,CAAC;IAE5B,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB;AAMD,MAAM,WAAW,WAAW;IAC1B,UAAU,EAAE,eAAe,CAAC;IAC5B,QAAQ,EAAE,mBAAmB,CAAC;CAC/B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/themes/core/context.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/themes/core/context.tsx"],"names":[],"mappings":"AAEA;;;GAGG;AAEH,OAAc,EAAwC,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/E,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AA+BpD,UAAU,iBAAiB;IACzB,YAAY,EAAE,WAAW,CAAC;IAC1B,SAAS,EAAE,YAAY,CAAC;CACzB;AAID,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,SAAS,CAAC;IACpB,YAAY,CAAC,EAAE,WAAW,CAAC;IAC3B,gBAAgB,CAAC,EAAE,YAAY,CAAC;CACjC;AAED;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,YAA2B,EAC3B,gBAA4B,EAC7B,EAAE,kBAAkB,2CAiBpB;AAED;;GAEG;AACH,wBAAgB,QAAQ,IAAI,iBAAiB,CAM5C"}
|
|
@@ -2,20 +2,17 @@
|
|
|
2
2
|
* Core TypeScript interfaces for theme configuration schema
|
|
3
3
|
* Defines the structure and types for all theme properties
|
|
4
4
|
*/
|
|
5
|
+
import { ColorPrimitives, SemanticColorTokens } from './color-system';
|
|
6
|
+
/**
|
|
7
|
+
* Two-level color system integrated into theme
|
|
8
|
+
* Level 1: Primitives (raw colors - the palette)
|
|
9
|
+
* Level 2: Semantic tokens (purpose-based colors)
|
|
10
|
+
*
|
|
11
|
+
* Components use semantic tokens directly in their CSS
|
|
12
|
+
*/
|
|
5
13
|
export interface ThemeColors {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
primaryActive: string;
|
|
9
|
-
secondary: string;
|
|
10
|
-
secondaryHover: string;
|
|
11
|
-
secondaryActive: string;
|
|
12
|
-
text: string;
|
|
13
|
-
textInverse: string;
|
|
14
|
-
background: string;
|
|
15
|
-
border: string;
|
|
16
|
-
success: string;
|
|
17
|
-
warning: string;
|
|
18
|
-
error: string;
|
|
14
|
+
primitives: ColorPrimitives;
|
|
15
|
+
semantic: SemanticColorTokens;
|
|
19
16
|
}
|
|
20
17
|
export interface ThemeSpacing {
|
|
21
18
|
xs: string;
|
|
@@ -37,6 +34,27 @@ export interface ThemeShadows {
|
|
|
37
34
|
lg: string;
|
|
38
35
|
xl: string;
|
|
39
36
|
}
|
|
37
|
+
export interface ThemeBreakpoints {
|
|
38
|
+
xs: string;
|
|
39
|
+
sm: string;
|
|
40
|
+
md: string;
|
|
41
|
+
lg: string;
|
|
42
|
+
xl: string;
|
|
43
|
+
xxl: string;
|
|
44
|
+
}
|
|
45
|
+
export interface TypographyVariantDefault {
|
|
46
|
+
fontSize?: string;
|
|
47
|
+
fontWeight?: string;
|
|
48
|
+
lineHeight?: string;
|
|
49
|
+
letterSpacing?: string;
|
|
50
|
+
textDecoration?: string;
|
|
51
|
+
textTransform?: string;
|
|
52
|
+
fontFamily?: string;
|
|
53
|
+
}
|
|
54
|
+
export interface TypographyVariant extends TypographyVariantDefault {
|
|
55
|
+
mobile?: TypographyVariantDefault;
|
|
56
|
+
tablet?: TypographyVariantDefault;
|
|
57
|
+
}
|
|
40
58
|
export interface ThemeTypography {
|
|
41
59
|
fontFamily: string;
|
|
42
60
|
fontFamilyHeading: string;
|
|
@@ -51,27 +69,38 @@ export interface ThemeTypography {
|
|
|
51
69
|
lineHeightTight: string;
|
|
52
70
|
lineHeightNormal: string;
|
|
53
71
|
lineHeightRelaxed: string;
|
|
72
|
+
variants?: Record<string, TypographyVariant>;
|
|
54
73
|
}
|
|
55
74
|
export interface ButtonVariant {
|
|
56
75
|
background: string;
|
|
57
|
-
backgroundHover
|
|
58
|
-
backgroundActive
|
|
76
|
+
backgroundHover?: string;
|
|
77
|
+
backgroundActive?: string;
|
|
59
78
|
color: string;
|
|
60
|
-
colorHover
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
79
|
+
colorHover?: string;
|
|
80
|
+
colorActive?: string;
|
|
81
|
+
border?: string;
|
|
82
|
+
borderHover?: string;
|
|
83
|
+
borderActive?: string;
|
|
84
|
+
focusOutline?: string;
|
|
85
|
+
shadow?: string;
|
|
64
86
|
}
|
|
65
87
|
export interface ThemeButtons {
|
|
66
88
|
borderRadius: string;
|
|
67
89
|
padding: string;
|
|
68
90
|
fontSize: string;
|
|
69
91
|
fontWeight: string;
|
|
92
|
+
lineHeight: string;
|
|
70
93
|
general: ButtonVariant;
|
|
71
94
|
cta: ButtonVariant;
|
|
72
95
|
secondary: ButtonVariant;
|
|
73
96
|
outline: ButtonVariant;
|
|
74
97
|
ghost: ButtonVariant;
|
|
98
|
+
video?: ButtonVariant;
|
|
99
|
+
subscribe?: ButtonVariant;
|
|
100
|
+
twitter?: ButtonVariant;
|
|
101
|
+
linkedIn?: ButtonVariant;
|
|
102
|
+
facebook?: ButtonVariant;
|
|
103
|
+
secondaryDarkMode?: ButtonVariant;
|
|
75
104
|
}
|
|
76
105
|
export interface ThemeComponents {
|
|
77
106
|
card: {
|
|
@@ -101,13 +130,20 @@ export interface ThemeComponents {
|
|
|
101
130
|
descriptionLineHeight?: string;
|
|
102
131
|
};
|
|
103
132
|
}
|
|
133
|
+
export interface ColorPalette {
|
|
134
|
+
name: string;
|
|
135
|
+
bg: string;
|
|
136
|
+
text: string;
|
|
137
|
+
}
|
|
104
138
|
export interface ThemeConfig {
|
|
105
139
|
name: string;
|
|
106
|
-
fontImportUrl?: string;
|
|
140
|
+
fontImportUrl?: string | string[];
|
|
107
141
|
colors: ThemeColors;
|
|
142
|
+
colorPalettes?: ColorPalette[];
|
|
108
143
|
spacing: ThemeSpacing;
|
|
109
144
|
borderRadius: ThemeBorderRadius;
|
|
110
145
|
shadows: ThemeShadows;
|
|
146
|
+
breakpoints: ThemeBreakpoints;
|
|
111
147
|
typography: ThemeTypography;
|
|
112
148
|
buttons: ThemeButtons;
|
|
113
149
|
components: ThemeComponents;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/themes/core/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,WAAW,WAAW;IAC1B,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/themes/core/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
export interface ColorTokens {
|
|
2
|
+
primitives: Record<string, string>;
|
|
3
|
+
semantic: Record<string, string>;
|
|
4
|
+
}
|
|
5
|
+
/**
|
|
6
|
+
* Hook to access color tokens from the current theme
|
|
7
|
+
* Returns resolved CSS variable values
|
|
8
|
+
*/
|
|
9
|
+
export declare function useColorTokens(): ColorTokens;
|
|
10
|
+
/**
|
|
11
|
+
* Hook to get a specific color token value
|
|
12
|
+
* @param level - The color system level ('primitives' or 'semantic')
|
|
13
|
+
* @param tokenName - The name of the token
|
|
14
|
+
* @returns The resolved color value
|
|
15
|
+
*/
|
|
16
|
+
export declare function useColorToken(level: 'primitives' | 'semantic', tokenName: string): string;
|
|
17
|
+
/**
|
|
18
|
+
* Hook to get CSS variable name for a color token
|
|
19
|
+
* Useful for inline styles
|
|
20
|
+
*/
|
|
21
|
+
export declare function useColorVar(level: 'primitives' | 'semantic', tokenName: string): string;
|
|
22
|
+
//# sourceMappingURL=useColorTokens.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useColorTokens.d.ts","sourceRoot":"","sources":["../../../src/themes/hooks/useColorTokens.ts"],"names":[],"mappings":"AAUA,MAAM,WAAW,WAAW;IAE1B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAEnC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAClC;AAED;;;GAGG;AACH,wBAAgB,cAAc,IAAI,WAAW,CA4B5C;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAC3B,KAAK,EAAE,YAAY,GAAG,UAAU,EAChC,SAAS,EAAE,MAAM,GAChB,MAAM,CAGR;AAED;;;GAGG;AACH,wBAAgB,WAAW,CACzB,KAAK,EAAE,YAAY,GAAG,UAAU,EAChC,SAAS,EAAE,MAAM,GAChB,MAAM,CAOR"}
|
package/dist/themes/index.d.ts
CHANGED
|
@@ -2,9 +2,15 @@
|
|
|
2
2
|
* Main theme system exports
|
|
3
3
|
* Central entry point for all theming functionality
|
|
4
4
|
*/
|
|
5
|
-
export type { ThemeConfig, ThemeColors, ThemeSpacing, ThemeBorderRadius, ThemeShadows, ThemeTypography, ThemeButtons, ThemeComponents, ThemeVariant, ButtonVariant } from './core/types';
|
|
5
|
+
export type { ThemeConfig, ThemeColors, ThemeSpacing, ThemeBorderRadius, ThemeShadows, ThemeBreakpoints, ThemeTypography, ThemeButtons, ThemeComponents, ThemeVariant, ButtonVariant } from './core/types';
|
|
6
|
+
export type { ColorPrimitives, SemanticColorTokens, } from './core/color-system';
|
|
6
7
|
export { defaultTheme } from './presets/default';
|
|
7
8
|
export { advisorsPlusTheme } from './presets/advisors-plus';
|
|
8
9
|
export { primaxTheme } from './presets/primax';
|
|
10
|
+
export { defaultColorSystem } from './presets/color-systems/default-colors';
|
|
11
|
+
export { advisorsPlusColorSystem } from './presets/color-systems/advisors-plus-colors';
|
|
12
|
+
export { primaxColorSystem } from './presets/color-systems/primax-colors';
|
|
9
13
|
export { ThemeProvider, useTheme } from './core/client-provider';
|
|
14
|
+
export { useColorTokens, useColorToken, useColorVar } from './hooks/useColorTokens';
|
|
15
|
+
export { generateThemeCSS, applyTheme, setThemeAttribute } from './utils/generator';
|
|
10
16
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/themes/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,YAAY,EACV,WAAW,EACX,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,YAAY,EACZ,eAAe,EACf,YAAY,EACZ,eAAe,EACf,YAAY,EACZ,aAAa,EACd,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/themes/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,YAAY,EACV,WAAW,EACX,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,YAAY,EACZ,gBAAgB,EAChB,eAAe,EACf,YAAY,EACZ,eAAe,EACf,YAAY,EACZ,aAAa,EACd,MAAM,cAAc,CAAC;AAGtB,YAAY,EACV,eAAe,EACf,mBAAmB,GACpB,MAAM,qBAAqB,CAAC;AAG7B,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAC5E,OAAO,EAAE,uBAAuB,EAAE,MAAM,8CAA8C,CAAC;AACvF,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AAG1E,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAGpF,OAAO,EAAE,gBAAgB,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Advisors Plus theme configuration
|
|
3
|
-
*
|
|
3
|
+
* Midnight blue and violet color scheme for financial advisory brand
|
|
4
4
|
*/
|
|
5
5
|
import { ThemeConfig } from '../core/types';
|
|
6
6
|
export declare const advisorsPlusTheme: ThemeConfig;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"advisors-plus.d.ts","sourceRoot":"","sources":["../../../src/themes/presets/advisors-plus.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"advisors-plus.d.ts","sourceRoot":"","sources":["../../../src/themes/presets/advisors-plus.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5C,eAAO,MAAM,iBAAiB,EAAE,WAgD/B,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Advisors Plus color system
|
|
3
|
+
* Carnation (primary), Medium Purple (secondary), and Royal Blue (tertiary) color scheme
|
|
4
|
+
*/
|
|
5
|
+
import { ColorSystem } from '../../core/color-system';
|
|
6
|
+
export declare const advisorsPlusColorSystem: ColorSystem;
|
|
7
|
+
//# sourceMappingURL=advisors-plus-colors.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"advisors-plus-colors.d.ts","sourceRoot":"","sources":["../../../../src/themes/presets/color-systems/advisors-plus-colors.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEtD,eAAO,MAAM,uBAAuB,EAAE,WAsLrC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"default-colors.d.ts","sourceRoot":"","sources":["../../../../src/themes/presets/color-systems/default-colors.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEtD,eAAO,MAAM,kBAAkB,EAAE,WAyIhC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"primax-colors.d.ts","sourceRoot":"","sources":["../../../../src/themes/presets/color-systems/primax-colors.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEtD,eAAO,MAAM,iBAAiB,EAAE,WAyI/B,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Default theme configuration
|
|
3
|
-
* Base theme with
|
|
3
|
+
* Base theme with multi-level color system and standard design tokens
|
|
4
4
|
*/
|
|
5
5
|
import { ThemeConfig } from '../core/types';
|
|
6
6
|
export declare const defaultTheme: ThemeConfig;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"default.d.ts","sourceRoot":"","sources":["../../../src/themes/presets/default.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"default.d.ts","sourceRoot":"","sources":["../../../src/themes/presets/default.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG5C,eAAO,MAAM,YAAY,EAAE,WAwU1B,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Primax theme configuration
|
|
3
|
-
* Blue and orange color scheme
|
|
3
|
+
* Blue and orange color scheme for Primax brand
|
|
4
4
|
*/
|
|
5
|
-
import { ThemeConfig } from
|
|
5
|
+
import { ThemeConfig } from "../core/types";
|
|
6
6
|
export declare const primaxTheme: ThemeConfig;
|
|
7
7
|
//# sourceMappingURL=primax.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"primax.d.ts","sourceRoot":"","sources":["../../../src/themes/presets/primax.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"primax.d.ts","sourceRoot":"","sources":["../../../src/themes/presets/primax.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5C,eAAO,MAAM,WAAW,EAAE,WAgDzB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"generator.d.ts","sourceRoot":"","sources":["../../../src/themes/utils/generator.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"generator.d.ts","sourceRoot":"","sources":["../../../src/themes/utils/generator.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAiC5C;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,WAAW,EAAE,QAAQ,GAAE,MAAgB,GAAG,MAAM,CA+EvF;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,WAAW,EAAE,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAevE;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAEzD"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Theme utility helper functions
|
|
3
|
+
*/
|
|
4
|
+
/**
|
|
5
|
+
* Converts camelCase to kebab-case, handling numbers properly
|
|
6
|
+
* Examples:
|
|
7
|
+
* - textPrimary -> text-primary
|
|
8
|
+
* - blue500 -> blue-500
|
|
9
|
+
* - brandPrimary -> brand-primary
|
|
10
|
+
*/
|
|
11
|
+
export declare function toKebabCase(str: string): string;
|
|
12
|
+
//# sourceMappingURL=helpers.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/themes/utils/helpers.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAK/C"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/themes/utils/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,gBAAgB,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAC9E,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "tenara-ui-components",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.3",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"private": false,
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -17,7 +17,8 @@
|
|
|
17
17
|
"storybook": "storybook dev -p 6006",
|
|
18
18
|
"build-storybook": "storybook build",
|
|
19
19
|
"build:lib": "rollup -c",
|
|
20
|
-
"prepublishOnly": "npm run build:lib"
|
|
20
|
+
"prepublishOnly": "npm run build:lib",
|
|
21
|
+
"chromatic": "npx chromatic"
|
|
21
22
|
},
|
|
22
23
|
"dependencies": {
|
|
23
24
|
"@fortawesome/fontawesome-svg-core": "^7.0.0",
|