@webmate-studio/builder 0.2.68 → 0.2.71
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/package.json +1 -1
- package/src/design-tokens.js +20 -0
package/package.json
CHANGED
package/src/design-tokens.js
CHANGED
|
@@ -21,12 +21,16 @@ function generateSemanticColorUtilities(tokens) {
|
|
|
21
21
|
// Semantic state colors
|
|
22
22
|
'success': 'success',
|
|
23
23
|
'successDark': 'success-dark',
|
|
24
|
+
'successLight': 'success-light',
|
|
24
25
|
'warning': 'warning',
|
|
25
26
|
'warningDark': 'warning-dark',
|
|
27
|
+
'warningLight': 'warning-light',
|
|
26
28
|
'error': 'error',
|
|
27
29
|
'errorDark': 'error-dark',
|
|
30
|
+
'errorLight': 'error-light',
|
|
28
31
|
'info': 'info',
|
|
29
32
|
'infoDark': 'info-dark',
|
|
33
|
+
'infoLight': 'info-light',
|
|
30
34
|
|
|
31
35
|
// Base semantic colors
|
|
32
36
|
'bgBase': 'default',
|
|
@@ -105,12 +109,16 @@ export const defaultDesignTokens = {
|
|
|
105
109
|
// Semantic Colors
|
|
106
110
|
success: '#10b981',
|
|
107
111
|
successDark: '#059669',
|
|
112
|
+
successLight: '#d1fae5',
|
|
108
113
|
warning: '#f59e0b',
|
|
109
114
|
warningDark: '#d97706',
|
|
115
|
+
warningLight: '#fef3c7',
|
|
110
116
|
error: '#ef4444',
|
|
111
117
|
errorDark: '#dc2626',
|
|
118
|
+
errorLight: '#fee2e2',
|
|
112
119
|
info: '#3b82f6',
|
|
113
120
|
infoDark: '#2563eb',
|
|
121
|
+
infoLight: '#dbeafe',
|
|
114
122
|
|
|
115
123
|
// Background Colors (Semantic)
|
|
116
124
|
bgBase: '#ffffff',
|
|
@@ -522,12 +530,16 @@ export function generateTailwindV4Theme(tokens) {
|
|
|
522
530
|
// Semantic colors
|
|
523
531
|
if (tokens.colors.success) lines.push(` --color-success: ${tokens.colors.success};`);
|
|
524
532
|
if (tokens.colors.successDark) lines.push(` --color-success-dark: ${tokens.colors.successDark};`);
|
|
533
|
+
if (tokens.colors.successLight) lines.push(` --color-success-light: ${tokens.colors.successLight};`);
|
|
525
534
|
if (tokens.colors.warning) lines.push(` --color-warning: ${tokens.colors.warning};`);
|
|
526
535
|
if (tokens.colors.warningDark) lines.push(` --color-warning-dark: ${tokens.colors.warningDark};`);
|
|
536
|
+
if (tokens.colors.warningLight) lines.push(` --color-warning-light: ${tokens.colors.warningLight};`);
|
|
527
537
|
if (tokens.colors.error) lines.push(` --color-error: ${tokens.colors.error};`);
|
|
528
538
|
if (tokens.colors.errorDark) lines.push(` --color-error-dark: ${tokens.colors.errorDark};`);
|
|
539
|
+
if (tokens.colors.errorLight) lines.push(` --color-error-light: ${tokens.colors.errorLight};`);
|
|
529
540
|
if (tokens.colors.info) lines.push(` --color-info: ${tokens.colors.info};`);
|
|
530
541
|
if (tokens.colors.infoDark) lines.push(` --color-info-dark: ${tokens.colors.infoDark};`);
|
|
542
|
+
if (tokens.colors.infoLight) lines.push(` --color-info-light: ${tokens.colors.infoLight};`);
|
|
531
543
|
|
|
532
544
|
// Background colors (Semantic)
|
|
533
545
|
if (tokens.colors.bgBase) lines.push(` --color-bg-base: ${tokens.colors.bgBase};`);
|
|
@@ -639,6 +651,11 @@ export function generateTailwindV4Theme(tokens) {
|
|
|
639
651
|
lines.push(` --text-${kebabName}-letter-spacing: ${style.letterSpacing};`);
|
|
640
652
|
}
|
|
641
653
|
}
|
|
654
|
+
|
|
655
|
+
// Text color (not responsive)
|
|
656
|
+
if (style.textColor) {
|
|
657
|
+
lines.push(` --text-${kebabName}-color: var(--color-${style.textColor});`);
|
|
658
|
+
}
|
|
642
659
|
}
|
|
643
660
|
}
|
|
644
661
|
|
|
@@ -754,6 +771,9 @@ body {
|
|
|
754
771
|
if (style.textTransform) {
|
|
755
772
|
globalStyles += `\n text-transform: var(--text-${kebabName}-text-transform);`;
|
|
756
773
|
}
|
|
774
|
+
if (style.textColor) {
|
|
775
|
+
globalStyles += `\n color: var(--text-${kebabName}-color);`;
|
|
776
|
+
}
|
|
757
777
|
globalStyles += `\n}`;
|
|
758
778
|
}
|
|
759
779
|
}
|