@prolibu-suite/cobalt-tokens 0.1.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.
Files changed (9) hide show
  1. package/build/css/tokens-dark.css +30 -0
  2. package/build/css/tokens.css +219 -0
  3. package/build/js/tokens.d.ts +217 -0
  4. package/build/js/tokens.js +75 -0
  5. package/build/js/tokens.mjs +220 -0
  6. package/build/json/tokens.json +70 -0
  7. package/build/scss/_tokens.scss +216 -0
  8. package/build/ts/tokens.d.ts +140 -0
  9. package/package.json +39 -0
package/build/css/tokens-dark.css ADDED
@@ -0,0 +1,30 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ [data-theme="dark"] {
6
+ --co-semantic-surface-primary: var(--co-color-base-blanco);
7
+ --co-semantic-surface-secondary: var(--co-color-gray-800);
8
+ --co-semantic-surface-page: var(--co-color-gray-800);
9
+ --co-semantic-surface-muted: var(--co-color-gray-600);
10
+ --co-semantic-surface-hover: var(--co-color-opacity-blanco-4);
11
+ --co-semantic-surface-disabled: var(--co-color-gray-700);
12
+ --co-semantic-on-primary: var(--co-color-base-negro);
13
+ --co-semantic-on-secondary: var(--co-color-base-blanco);
14
+ --co-semantic-text-default: var(--co-color-base-blanco);
15
+ --co-semantic-text-inverse: var(--co-color-base-negro);
16
+ --co-semantic-text-secondary: var(--co-color-gray-400);
17
+ --co-semantic-text-muted: var(--co-color-gray-500);
18
+ --co-semantic-text-disabled: var(--co-color-gray-600);
19
+ --co-semantic-border-default: var(--co-color-opacity-blanco-16);
20
+ --co-semantic-border-subtle: var(--co-color-opacity-blanco-8);
21
+ --co-semantic-border-strong: var(--co-color-opacity-blanco-80);
22
+ --co-semantic-border-focus: var(--co-color-opacity-blanco-16);
23
+ --co-semantic-border-focus-ring: var(--co-color-opacity-blanco-8);
24
+ --co-semantic-control-thumb: var(--co-color-base-negro);
25
+ --co-semantic-control-shadow: var(--co-color-opacity-blanco-16);
26
+ --co-semantic-status-success: var(--co-color-status-success);
27
+ --co-semantic-status-error: var(--co-color-status-error);
28
+ --co-semantic-status-warning: var(--co-color-primary-amarillo);
29
+ --co-semantic-status-info: var(--co-color-status-progress);
30
+ }
package/build/css/tokens.css ADDED
@@ -0,0 +1,219 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root {
6
+ --co-color-base-negro: #1f1c1b;
7
+ --co-color-base-blanco: #ffffff;
8
+ --co-color-base-off-white: #f7f6f0;
9
+ --co-color-primary-verde: #02a270;
10
+ --co-color-primary-amarillo: #fdbf00;
11
+ --co-color-primary-azul: #2563eb;
12
+ --co-color-primary-rosado: #f32a73;
13
+ --co-color-azul-100: #eff4ff;
14
+ --co-color-azul-200: #dbe6fe;
15
+ --co-color-azul-300: #bfd3fe;
16
+ --co-color-azul-400: #93b4fd;
17
+ --co-color-azul-500: #6090fa;
18
+ --co-color-azul-600: #3b76f6;
19
+ --co-color-azul-700: #2563eb;
20
+ --co-color-azul-800: #1d58d8;
21
+ --co-color-azul-900: #1e408a;
22
+ --co-color-rosado-100: #fef1f6;
23
+ --co-color-rosado-200: #fde6f0;
24
+ --co-color-rosado-300: #fdcde2;
25
+ --co-color-rosado-400: #fda4c8;
26
+ --co-color-rosado-500: #fb6ba3;
27
+ --co-color-rosado-600: #f32a73;
28
+ --co-color-rosado-700: #e41e5c;
29
+ --co-color-rosado-800: #c61044;
30
+ --co-color-rosado-900: #a41039;
31
+ --co-color-amarillo-100: #ffffea;
32
+ --co-color-amarillo-200: #fffbc5;
33
+ --co-color-amarillo-300: #fff885;
34
+ --co-color-amarillo-400: #ffe01b;
35
+ --co-color-amarillo-500: #fdbf00;
36
+ --co-color-amarillo-600: #e29500;
37
+ --co-color-amarillo-700: #bb6902;
38
+ --co-color-amarillo-800: #985108;
39
+ --co-color-amarillo-900: #7c420b;
40
+ --co-color-verde-100: #ecfdf5;
41
+ --co-color-verde-200: #d0fbe5;
42
+ --co-color-verde-300: #a5f5d0;
43
+ --co-color-verde-400: #6beab8;
44
+ --co-color-verde-500: #31d69a;
45
+ --co-color-verde-600: #0cbd82;
46
+ --co-color-verde-700: #02a270;
47
+ --co-color-verde-800: #027a58;
48
+ --co-color-verde-900: #046147;
49
+ --co-color-neutral-100: #e6e5df;
50
+ --co-color-neutral-200: #eeede7;
51
+ --co-color-neutral-300: #f3f2ec;
52
+ --co-color-gray-100: #f6f6f6;
53
+ --co-color-gray-200: #e3e3e3;
54
+ --co-color-gray-300: #c4c4c4;
55
+ --co-color-gray-400: #a0a0a0;
56
+ --co-color-gray-500: #888888;
57
+ --co-color-gray-600: #585858;
58
+ --co-color-gray-700: #1f1c1b;
59
+ --co-color-gray-800: #0a0a0a;
60
+ --co-color-secondary-rosado-100: #d74ba0;
61
+ --co-color-secondary-rosado-50: #ffc8eb;
62
+ --co-color-secondary-rosado-25: #ffe6f5;
63
+ --co-color-secondary-rojo-100: #eb1e1e;
64
+ --co-color-secondary-rojo-50: #ff878c;
65
+ --co-color-secondary-rojo-25: #ffd7dc;
66
+ --co-color-secondary-naranja-100: #f0821e;
67
+ --co-color-secondary-naranja-50: #ffbe82;
68
+ --co-color-secondary-naranja-25: #ffe6d2;
69
+ --co-color-secondary-amarillo-100: #fad223;
70
+ --co-color-secondary-amarillo-50: #ffe67d;
71
+ --co-color-secondary-amarillo-25: #fffac3;
72
+ --co-color-secondary-verde-100: #afe664;
73
+ --co-color-secondary-verde-50: #d7ffb4;
74
+ --co-color-secondary-verde-25: #ebffc8;
75
+ --co-color-secondary-oliva-100: #aab43c;
76
+ --co-color-secondary-oliva-50: #d2dc96;
77
+ --co-color-secondary-oliva-25: #f0f0d2;
78
+ --co-color-secondary-turquesa-100: #00afaf;
79
+ --co-color-secondary-turquesa-50: #3ce1c8;
80
+ --co-color-secondary-turquesa-25: #c8f0f0;
81
+ --co-color-secondary-azul-claro-100: #00bee6;
82
+ --co-color-secondary-azul-claro-50: #6ee6f0;
83
+ --co-color-secondary-azul-claro-25: #befaff;
84
+ --co-color-secondary-azul-electrico-100: #000aff;
85
+ --co-color-secondary-azul-electrico-50: #8095ff;
86
+ --co-color-secondary-azul-electrico-25: #cce0ff;
87
+ --co-color-secondary-violeta-100: #5f4bd7;
88
+ --co-color-secondary-violeta-50: #b9b4ff;
89
+ --co-color-secondary-violeta-25: #e1e1ff;
90
+ --co-color-secondary-marron-100: #af7355;
91
+ --co-color-secondary-marron-50: #d7b9a5;
92
+ --co-color-secondary-marron-25: #f0e1d7;
93
+ --co-color-secondary-guinda-100: #811137;
94
+ --co-color-secondary-guinda-50: #c0889c;
95
+ --co-color-secondary-guinda-25: #e6cfd7;
96
+ --co-color-status-success: #0a7724;
97
+ --co-color-status-bg-success: #ebf9ec;
98
+ --co-color-status-progress: #2d6cc5;
99
+ --co-color-status-bg-progress: #eef3fa;
100
+ --co-color-status-submitted: #7556ca;
101
+ --co-color-status-bg-submitted: #f4f1fb;
102
+ --co-color-status-review: #85571f;
103
+ --co-color-status-bg-review: #fcf5db;
104
+ --co-color-status-pending: #b45103;
105
+ --co-color-status-bg-pending: #f9f1eb;
106
+ --co-color-status-error: #aa2e1b;
107
+ --co-color-status-bg-error: #ffefef;
108
+ --co-color-opacity-negro-4: rgba(31, 28, 27, 0.04);
109
+ --co-color-opacity-negro-8: rgba(31, 28, 27, 0.08);
110
+ --co-color-opacity-negro-16: rgba(31, 28, 27, 0.16);
111
+ --co-color-opacity-negro-25: rgba(31, 28, 27, 0.25);
112
+ --co-color-opacity-negro-50: rgba(31, 28, 27, 0.50);
113
+ --co-color-opacity-negro-80: rgba(31, 28, 27, 0.80);
114
+ --co-color-opacity-blanco-4: rgba(255, 255, 255, 0.04);
115
+ --co-color-opacity-blanco-8: rgba(255, 255, 255, 0.08);
116
+ --co-color-opacity-blanco-16: rgba(255, 255, 255, 0.16);
117
+ --co-color-opacity-blanco-25: rgba(255, 255, 255, 0.25);
118
+ --co-color-opacity-blanco-50: rgba(255, 255, 255, 0.50);
119
+ --co-color-opacity-blanco-80: rgba(255, 255, 255, 0.80);
120
+ --co-border-radius-xxs: 4px;
121
+ --co-border-radius-xs: 8px;
122
+ --co-border-radius-sm: 12px;
123
+ --co-border-radius-lg: 16px;
124
+ --co-border-radius-xl: 24px;
125
+ --co-border-radius-2xl: 32px;
126
+ --co-border-radius-3xl: 40px;
127
+ --co-border-radius-4xl: 48px;
128
+ --co-border-radius-5xl: 56px;
129
+ --co-border-radius-6xl: 64px;
130
+ --co-border-radius-full: 9999px;
131
+ --co-shadow-lg: 0 10px 15px -3px rgba(26, 26, 26, 0.05), 0 4px 6px -4px rgba(26, 26, 26, 0.05);
132
+ --co-spacing-xxs: 2px;
133
+ --co-spacing-xs: 4px;
134
+ --co-spacing-sm: 6px;
135
+ --co-spacing-sm2: 8px;
136
+ --co-spacing-md: 12px;
137
+ --co-spacing-lg: 16px;
138
+ --co-spacing-xl: 20px;
139
+ --co-spacing-2xl: 24px;
140
+ --co-spacing-3xl: 32px;
141
+ --co-spacing-4xl: 40px;
142
+ --co-spacing-5xl: 48px;
143
+ --co-spacing-6xl: 56px;
144
+ --co-spacing-7xl: 64px;
145
+ --co-spacing-8xl: 72px;
146
+ --co-spacing-9xl: 80px;
147
+ --co-spacing-10xl: 88px;
148
+ --co-spacing-11xl: 96px;
149
+ --co-spacing-12xl: 104px;
150
+ --co-spacing-13xl: 112px;
151
+ --co-spacing-14xl: 120px;
152
+ --co-spacing-full: 9999px;
153
+ --co-font-family-primary: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
154
+ --co-font-family-mono: 'Geist Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
155
+ --co-font-size-10: 10px;
156
+ --co-font-size-12: 12px;
157
+ --co-font-size-14: 14px;
158
+ --co-font-size-16: 16px;
159
+ --co-font-size-18: 18px;
160
+ --co-font-size-20: 20px;
161
+ --co-font-size-22: 22px;
162
+ --co-font-size-24: 24px;
163
+ --co-font-size-26: 26px;
164
+ --co-font-size-30: 30px;
165
+ --co-font-size-32: 32px;
166
+ --co-font-size-36: 36px;
167
+ --co-font-size-40: 40px;
168
+ --co-font-size-44: 44px;
169
+ --co-font-size-48: 48px;
170
+ --co-font-size-50: 50px;
171
+ --co-font-size-56: 56px;
172
+ --co-font-size-64: 64px;
173
+ --co-font-size-72: 72px;
174
+ --co-font-size-80: 80px;
175
+ --co-font-size-96: 96px;
176
+ --co-font-size-104: 104px;
177
+ --co-font-size-112: 112px;
178
+ --co-font-size-128: 128px;
179
+ --co-font-size-144: 144px;
180
+ --co-font-size-160: 160px;
181
+ --co-font-size-180: 180px;
182
+ --co-font-size-200: 200px;
183
+ --co-font-size-220: 220px;
184
+ --co-font-weight-regular: 400;
185
+ --co-font-weight-medium: 500;
186
+ --co-font-weight-semibold: 600;
187
+ --co-font-weight-bold: 700;
188
+ --co-font-line-height-none: 1;
189
+ --co-font-line-height-tight: 1.2;
190
+ --co-font-line-height-snug: 1.3;
191
+ --co-font-line-height-normal: 1.5;
192
+ --co-font-line-height-relaxed: 1.6;
193
+ --co-font-letter-spacing-body: -0.03em;
194
+ --co-font-letter-spacing-overline: 0.08em;
195
+ --co-semantic-surface-primary: var(--co-color-base-negro);
196
+ --co-semantic-surface-secondary: var(--co-color-base-blanco);
197
+ --co-semantic-surface-page: var(--co-color-base-blanco);
198
+ --co-semantic-surface-muted: var(--co-color-gray-200);
199
+ --co-semantic-surface-hover: var(--co-color-opacity-negro-4);
200
+ --co-semantic-surface-disabled: var(--co-color-gray-100);
201
+ --co-semantic-on-primary: var(--co-color-base-blanco);
202
+ --co-semantic-on-secondary: var(--co-color-base-negro);
203
+ --co-semantic-text-default: var(--co-color-base-negro);
204
+ --co-semantic-text-inverse: var(--co-color-base-blanco);
205
+ --co-semantic-text-secondary: var(--co-color-gray-600);
206
+ --co-semantic-text-muted: var(--co-color-gray-500);
207
+ --co-semantic-text-disabled: var(--co-color-gray-400);
208
+ --co-semantic-border-default: var(--co-color-opacity-negro-16);
209
+ --co-semantic-border-subtle: var(--co-color-opacity-negro-8);
210
+ --co-semantic-border-strong: var(--co-color-opacity-negro-50);
211
+ --co-semantic-border-focus: var(--co-color-opacity-negro-25);
212
+ --co-semantic-border-focus-ring: var(--co-color-opacity-negro-8);
213
+ --co-semantic-control-thumb: var(--co-color-base-blanco);
214
+ --co-semantic-control-shadow: var(--co-color-opacity-negro-16);
215
+ --co-semantic-status-success: var(--co-color-status-success);
216
+ --co-semantic-status-error: var(--co-color-status-error);
217
+ --co-semantic-status-warning: var(--co-color-primary-amarillo);
218
+ --co-semantic-status-info: var(--co-color-status-progress);
219
+ }
package/build/js/tokens.d.ts ADDED
@@ -0,0 +1,217 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ export const ColorBaseNegro: string;
6
+ export const ColorBaseBlanco: string;
7
+ export const ColorBaseOffWhite: string;
8
+ export const ColorPrimaryVerde: string;
9
+ export const ColorPrimaryAmarillo: string;
10
+ export const ColorPrimaryAzul: string;
11
+ export const ColorPrimaryRosado: string;
12
+ export const ColorAzul100: string;
13
+ export const ColorAzul200: string;
14
+ export const ColorAzul300: string;
15
+ export const ColorAzul400: string;
16
+ export const ColorAzul500: string;
17
+ export const ColorAzul600: string;
18
+ export const ColorAzul700: string;
19
+ export const ColorAzul800: string;
20
+ export const ColorAzul900: string;
21
+ export const ColorRosado100: string;
22
+ export const ColorRosado200: string;
23
+ export const ColorRosado300: string;
24
+ export const ColorRosado400: string;
25
+ export const ColorRosado500: string;
26
+ export const ColorRosado600: string;
27
+ export const ColorRosado700: string;
28
+ export const ColorRosado800: string;
29
+ export const ColorRosado900: string;
30
+ export const ColorAmarillo100: string;
31
+ export const ColorAmarillo200: string;
32
+ export const ColorAmarillo300: string;
33
+ export const ColorAmarillo400: string;
34
+ export const ColorAmarillo500: string;
35
+ export const ColorAmarillo600: string;
36
+ export const ColorAmarillo700: string;
37
+ export const ColorAmarillo800: string;
38
+ export const ColorAmarillo900: string;
39
+ export const ColorVerde100: string;
40
+ export const ColorVerde200: string;
41
+ export const ColorVerde300: string;
42
+ export const ColorVerde400: string;
43
+ export const ColorVerde500: string;
44
+ export const ColorVerde600: string;
45
+ export const ColorVerde700: string;
46
+ export const ColorVerde800: string;
47
+ export const ColorVerde900: string;
48
+ export const ColorNeutral100: string;
49
+ export const ColorNeutral200: string;
50
+ export const ColorNeutral300: string;
51
+ export const ColorGray100: string;
52
+ export const ColorGray200: string;
53
+ export const ColorGray300: string;
54
+ export const ColorGray400: string;
55
+ export const ColorGray500: string;
56
+ export const ColorGray600: string;
57
+ export const ColorGray700: string;
58
+ export const ColorGray800: string;
59
+ export const ColorSecondaryRosado100: string;
60
+ export const ColorSecondaryRosado50: string;
61
+ export const ColorSecondaryRosado25: string;
62
+ export const ColorSecondaryRojo100: string;
63
+ export const ColorSecondaryRojo50: string;
64
+ export const ColorSecondaryRojo25: string;
65
+ export const ColorSecondaryNaranja100: string;
66
+ export const ColorSecondaryNaranja50: string;
67
+ export const ColorSecondaryNaranja25: string;
68
+ export const ColorSecondaryAmarillo100: string;
69
+ export const ColorSecondaryAmarillo50: string;
70
+ export const ColorSecondaryAmarillo25: string;
71
+ export const ColorSecondaryVerde100: string;
72
+ export const ColorSecondaryVerde50: string;
73
+ export const ColorSecondaryVerde25: string;
74
+ export const ColorSecondaryOliva100: string;
75
+ export const ColorSecondaryOliva50: string;
76
+ export const ColorSecondaryOliva25: string;
77
+ export const ColorSecondaryTurquesa100: string;
78
+ export const ColorSecondaryTurquesa50: string;
79
+ export const ColorSecondaryTurquesa25: string;
80
+ export const ColorSecondaryAzulClaro100: string;
81
+ export const ColorSecondaryAzulClaro50: string;
82
+ export const ColorSecondaryAzulClaro25: string;
83
+ export const ColorSecondaryAzulElectrico100: string;
84
+ export const ColorSecondaryAzulElectrico50: string;
85
+ export const ColorSecondaryAzulElectrico25: string;
86
+ export const ColorSecondaryVioleta100: string;
87
+ export const ColorSecondaryVioleta50: string;
88
+ export const ColorSecondaryVioleta25: string;
89
+ export const ColorSecondaryMarron100: string;
90
+ export const ColorSecondaryMarron50: string;
91
+ export const ColorSecondaryMarron25: string;
92
+ export const ColorSecondaryGuinda100: string;
93
+ export const ColorSecondaryGuinda50: string;
94
+ export const ColorSecondaryGuinda25: string;
95
+ export const ColorStatusSuccess: string;
96
+ export const ColorStatusBgSuccess: string;
97
+ export const ColorStatusProgress: string;
98
+ export const ColorStatusBgProgress: string;
99
+ export const ColorStatusSubmitted: string;
100
+ export const ColorStatusBgSubmitted: string;
101
+ export const ColorStatusReview: string;
102
+ export const ColorStatusBgReview: string;
103
+ export const ColorStatusPending: string;
104
+ export const ColorStatusBgPending: string;
105
+ export const ColorStatusError: string;
106
+ export const ColorStatusBgError: string;
107
+ export const ColorOpacityNegro4: string;
108
+ export const ColorOpacityNegro8: string;
109
+ export const ColorOpacityNegro16: string;
110
+ export const ColorOpacityNegro25: string;
111
+ export const ColorOpacityNegro50: string;
112
+ export const ColorOpacityNegro80: string;
113
+ export const ColorOpacityBlanco4: string;
114
+ export const ColorOpacityBlanco8: string;
115
+ export const ColorOpacityBlanco16: string;
116
+ export const ColorOpacityBlanco25: string;
117
+ export const ColorOpacityBlanco50: string;
118
+ export const ColorOpacityBlanco80: string;
119
+ export const BorderRadiusXxs: string;
120
+ export const BorderRadiusXs: string;
121
+ export const BorderRadiusSm: string;
122
+ export const BorderRadiusLg: string;
123
+ export const BorderRadiusXl: string;
124
+ export const BorderRadius2xl: string;
125
+ export const BorderRadius3xl: string;
126
+ export const BorderRadius4xl: string;
127
+ export const BorderRadius5xl: string;
128
+ export const BorderRadius6xl: string;
129
+ export const BorderRadiusFull: string;
130
+ export const SemanticSurfacePrimary: string;
131
+ export const SemanticSurfaceSecondary: string;
132
+ export const SemanticSurfacePage: string;
133
+ export const SemanticSurfaceMuted: string;
134
+ export const SemanticSurfaceHover: string;
135
+ export const SemanticSurfaceDisabled: string;
136
+ export const SemanticOnPrimary: string;
137
+ export const SemanticOnSecondary: string;
138
+ export const SemanticTextDefault: string;
139
+ export const SemanticTextInverse: string;
140
+ export const SemanticTextSecondary: string;
141
+ export const SemanticTextMuted: string;
142
+ export const SemanticTextDisabled: string;
143
+ export const SemanticBorderDefault: string;
144
+ export const SemanticBorderSubtle: string;
145
+ export const SemanticBorderStrong: string;
146
+ export const SemanticBorderFocus: string;
147
+ export const SemanticBorderFocusRing: string;
148
+ export const SemanticControlThumb: string;
149
+ export const SemanticControlShadow: string;
150
+ export const SemanticStatusSuccess: string;
151
+ export const SemanticStatusError: string;
152
+ export const SemanticStatusWarning: string;
153
+ export const SemanticStatusInfo: string;
154
+ export const ShadowLg: string;
155
+ export const SpacingXxs: string;
156
+ export const SpacingXs: string;
157
+ export const SpacingSm: string;
158
+ export const SpacingSm2: string;
159
+ export const SpacingMd: string;
160
+ export const SpacingLg: string;
161
+ export const SpacingXl: string;
162
+ export const Spacing2xl: string;
163
+ export const Spacing3xl: string;
164
+ export const Spacing4xl: string;
165
+ export const Spacing5xl: string;
166
+ export const Spacing6xl: string;
167
+ export const Spacing7xl: string;
168
+ export const Spacing8xl: string;
169
+ export const Spacing9xl: string;
170
+ export const Spacing10xl: string;
171
+ export const Spacing11xl: string;
172
+ export const Spacing12xl: string;
173
+ export const Spacing13xl: string;
174
+ export const Spacing14xl: string;
175
+ export const SpacingFull: string;
176
+ export const FontFamilyPrimary: string;
177
+ export const FontFamilyMono: string;
178
+ export const FontSize10: string;
179
+ export const FontSize12: string;
180
+ export const FontSize14: string;
181
+ export const FontSize16: string;
182
+ export const FontSize18: string;
183
+ export const FontSize20: string;
184
+ export const FontSize22: string;
185
+ export const FontSize24: string;
186
+ export const FontSize26: string;
187
+ export const FontSize30: string;
188
+ export const FontSize32: string;
189
+ export const FontSize36: string;
190
+ export const FontSize40: string;
191
+ export const FontSize44: string;
192
+ export const FontSize48: string;
193
+ export const FontSize50: string;
194
+ export const FontSize56: string;
195
+ export const FontSize64: string;
196
+ export const FontSize72: string;
197
+ export const FontSize80: string;
198
+ export const FontSize96: string;
199
+ export const FontSize104: string;
200
+ export const FontSize112: string;
201
+ export const FontSize128: string;
202
+ export const FontSize144: string;
203
+ export const FontSize160: string;
204
+ export const FontSize180: string;
205
+ export const FontSize200: string;
206
+ export const FontSize220: string;
207
+ export const FontWeightRegular: string;
208
+ export const FontWeightMedium: string;
209
+ export const FontWeightSemibold: string;
210
+ export const FontWeightBold: string;
211
+ export const FontLineHeightNone: string;
212
+ export const FontLineHeightTight: string;
213
+ export const FontLineHeightSnug: string;
214
+ export const FontLineHeightNormal: string;
215
+ export const FontLineHeightRelaxed: string;
216
+ export const FontLetterSpacingBody: string;
217
+ export const FontLetterSpacingOverline: string;
package/build/js/tokens.js ADDED
@@ -0,0 +1,75 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ module.exports = {
6
+ ColorBaseNegro: "#1f1c1b",
7
+ ColorBaseBlanco: "#ffffff",
8
+ ColorBaseOffWhite: "#f7f6f0",
9
+ ColorPrimaryVerde: "#02a270",
10
+ ColorPrimaryAmarillo: "#fdbf00",
11
+ ColorPrimaryAzul: "#2563eb",
12
+ ColorPrimaryRosado: "#f32a73",
13
+ ColorGray100: "#f6f6f6",
14
+ ColorGray200: "#e3e3e3",
15
+ ColorGray300: "#c4c4c4",
16
+ ColorGray400: "#a0a0a0",
17
+ ColorGray500: "#888888",
18
+ ColorGray600: "#585858",
19
+ ColorGray700: "#1f1c1b",
20
+ ColorGray800: "#0a0a0a",
21
+ ColorNeutral100: "#e6e5df",
22
+ ColorNeutralBeige: "#fffcfa",
23
+ ColorSecondaryRojo: "#eb1e1e",
24
+ ColorSecondaryNaranja: "#f0821e",
25
+ ColorSecondaryOliva: "#aab43c",
26
+ ColorSecondaryVioleta: "#5f4bd7",
27
+ ColorSecondaryMarron: "#af7355",
28
+ ColorVerde100: "#ecfdf5",
29
+ ColorVerde900: "#046147",
30
+ ColorStatusSuccess: "#0a7724",
31
+ ColorStatusSuccessBg: "#ebf9ec",
32
+ ColorStatusError: "#aa2e1b",
33
+ ColorStatusProgress: "#2d6cc5",
34
+ ColorStatusReview: "#85571f",
35
+ ColorStatusSubmitted: "#7556ca",
36
+ OpacityNegro4: "rgba(31, 28, 27, 0.04)",
37
+ OpacityNegro8: "rgba(31, 28, 27, 0.08)",
38
+ OpacityNegro16: "rgba(31, 28, 27, 0.16)",
39
+ OpacityNegro25: "rgba(31, 28, 27, 0.25)",
40
+ OpacityNegro50: "rgba(31, 28, 27, 0.5)",
41
+ OpacityNegro80: "rgba(31, 28, 27, 0.8)",
42
+ OpacityBlanco4: "rgba(255, 255, 255, 0.04)",
43
+ OpacityBlanco8: "rgba(255, 255, 255, 0.08)",
44
+ OpacityBlanco16: "rgba(255, 255, 255, 0.16)",
45
+ OpacityBlanco80: "rgba(255, 255, 255, 0.8)",
46
+ RadiusXxs: "4px",
47
+ RadiusXs: "8px",
48
+ RadiusSm: "12px",
49
+ RadiusLg: "16px",
50
+ RadiusXl: "24px",
51
+ RadiusFull: "9999px",
52
+ ShadowLg:
53
+ "0 10px 15px -3px rgba(26, 26, 26, 0.05), 0 4px 6px -4px rgba(26, 26, 26, 0.05)",
54
+ FocusRing: "0 0 0 2px rgba(31, 28, 27, 0.08)",
55
+ SpaceXxs: "2px",
56
+ SpaceXs: "4px",
57
+ SpaceSm: "6px",
58
+ SpaceSm2: "8px",
59
+ SpaceMd: "12px",
60
+ SpaceLg: "16px",
61
+ SpaceXl: "20px",
62
+ Space2xl: "24px",
63
+ Space3xl: "32px",
64
+ Space5xl: "48px",
65
+ FontFamilyPrimary: "'Geist', sans-serif",
66
+ FontFamilyMono: "'Geist Mono', monospace",
67
+ FontSize10: "10px",
68
+ FontSize12: "12px",
69
+ FontSize14: "14px",
70
+ FontSize16: "16px",
71
+ FontSize18: "18px",
72
+ FontSize20: "20px",
73
+ FontSize22: "22px",
74
+ FontSize24: "24px",
75
+ };
package/build/js/tokens.mjs ADDED
@@ -0,0 +1,220 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ export const ColorBaseNegro = "#1f1c1b";
6
+ export const ColorBaseBlanco = "#ffffff";
7
+ export const ColorBaseOffWhite = "#f7f6f0";
8
+ export const ColorPrimaryVerde = "#02a270";
9
+ export const ColorPrimaryAmarillo = "#fdbf00";
10
+ export const ColorPrimaryAzul = "#2563eb";
11
+ export const ColorPrimaryRosado = "#f32a73";
12
+ export const ColorAzul100 = "#eff4ff";
13
+ export const ColorAzul200 = "#dbe6fe";
14
+ export const ColorAzul300 = "#bfd3fe";
15
+ export const ColorAzul400 = "#93b4fd";
16
+ export const ColorAzul500 = "#6090fa";
17
+ export const ColorAzul600 = "#3b76f6";
18
+ export const ColorAzul700 = "#2563eb";
19
+ export const ColorAzul800 = "#1d58d8";
20
+ export const ColorAzul900 = "#1e408a";
21
+ export const ColorRosado100 = "#fef1f6";
22
+ export const ColorRosado200 = "#fde6f0";
23
+ export const ColorRosado300 = "#fdcde2";
24
+ export const ColorRosado400 = "#fda4c8";
25
+ export const ColorRosado500 = "#fb6ba3";
26
+ export const ColorRosado600 = "#f32a73";
27
+ export const ColorRosado700 = "#e41e5c";
28
+ export const ColorRosado800 = "#c61044";
29
+ export const ColorRosado900 = "#a41039";
30
+ export const ColorAmarillo100 = "#ffffea";
31
+ export const ColorAmarillo200 = "#fffbc5";
32
+ export const ColorAmarillo300 = "#fff885";
33
+ export const ColorAmarillo400 = "#ffe01b";
34
+ export const ColorAmarillo500 = "#fdbf00";
35
+ export const ColorAmarillo600 = "#e29500";
36
+ export const ColorAmarillo700 = "#bb6902";
37
+ export const ColorAmarillo800 = "#985108";
38
+ export const ColorAmarillo900 = "#7c420b";
39
+ export const ColorVerde100 = "#ecfdf5";
40
+ export const ColorVerde200 = "#d0fbe5";
41
+ export const ColorVerde300 = "#a5f5d0";
42
+ export const ColorVerde400 = "#6beab8";
43
+ export const ColorVerde500 = "#31d69a";
44
+ export const ColorVerde600 = "#0cbd82";
45
+ export const ColorVerde700 = "#02a270";
46
+ export const ColorVerde800 = "#027a58";
47
+ export const ColorVerde900 = "#046147";
48
+ export const ColorNeutral100 = "#e6e5df";
49
+ export const ColorNeutral200 = "#eeede7";
50
+ export const ColorNeutral300 = "#f3f2ec";
51
+ export const ColorGray100 = "#f6f6f6";
52
+ export const ColorGray200 = "#e3e3e3";
53
+ export const ColorGray300 = "#c4c4c4";
54
+ export const ColorGray400 = "#a0a0a0";
55
+ export const ColorGray500 = "#888888";
56
+ export const ColorGray600 = "#585858";
57
+ export const ColorGray700 = "#1f1c1b";
58
+ export const ColorGray800 = "#0a0a0a";
59
+ export const ColorSecondaryRosado100 = "#d74ba0";
60
+ export const ColorSecondaryRosado50 = "#ffc8eb";
61
+ export const ColorSecondaryRosado25 = "#ffe6f5";
62
+ export const ColorSecondaryRojo100 = "#eb1e1e";
63
+ export const ColorSecondaryRojo50 = "#ff878c";
64
+ export const ColorSecondaryRojo25 = "#ffd7dc";
65
+ export const ColorSecondaryNaranja100 = "#f0821e";
66
+ export const ColorSecondaryNaranja50 = "#ffbe82";
67
+ export const ColorSecondaryNaranja25 = "#ffe6d2";
68
+ export const ColorSecondaryAmarillo100 = "#fad223";
69
+ export const ColorSecondaryAmarillo50 = "#ffe67d";
70
+ export const ColorSecondaryAmarillo25 = "#fffac3";
71
+ export const ColorSecondaryVerde100 = "#afe664";
72
+ export const ColorSecondaryVerde50 = "#d7ffb4";
73
+ export const ColorSecondaryVerde25 = "#ebffc8";
74
+ export const ColorSecondaryOliva100 = "#aab43c";
75
+ export const ColorSecondaryOliva50 = "#d2dc96";
76
+ export const ColorSecondaryOliva25 = "#f0f0d2";
77
+ export const ColorSecondaryTurquesa100 = "#00afaf";
78
+ export const ColorSecondaryTurquesa50 = "#3ce1c8";
79
+ export const ColorSecondaryTurquesa25 = "#c8f0f0";
80
+ export const ColorSecondaryAzulClaro100 = "#00bee6";
81
+ export const ColorSecondaryAzulClaro50 = "#6ee6f0";
82
+ export const ColorSecondaryAzulClaro25 = "#befaff";
83
+ export const ColorSecondaryAzulElectrico100 = "#000aff";
84
+ export const ColorSecondaryAzulElectrico50 = "#8095ff";
85
+ export const ColorSecondaryAzulElectrico25 = "#cce0ff";
86
+ export const ColorSecondaryVioleta100 = "#5f4bd7";
87
+ export const ColorSecondaryVioleta50 = "#b9b4ff";
88
+ export const ColorSecondaryVioleta25 = "#e1e1ff";
89
+ export const ColorSecondaryMarron100 = "#af7355";
90
+ export const ColorSecondaryMarron50 = "#d7b9a5";
91
+ export const ColorSecondaryMarron25 = "#f0e1d7";
92
+ export const ColorSecondaryGuinda100 = "#811137";
93
+ export const ColorSecondaryGuinda50 = "#c0889c";
94
+ export const ColorSecondaryGuinda25 = "#e6cfd7";
95
+ export const ColorStatusSuccess = "#0a7724";
96
+ export const ColorStatusBgSuccess = "#ebf9ec";
97
+ export const ColorStatusProgress = "#2d6cc5";
98
+ export const ColorStatusBgProgress = "#eef3fa";
99
+ export const ColorStatusSubmitted = "#7556ca";
100
+ export const ColorStatusBgSubmitted = "#f4f1fb";
101
+ export const ColorStatusReview = "#85571f";
102
+ export const ColorStatusBgReview = "#fcf5db";
103
+ export const ColorStatusPending = "#b45103";
104
+ export const ColorStatusBgPending = "#f9f1eb";
105
+ export const ColorStatusError = "#aa2e1b";
106
+ export const ColorStatusBgError = "#ffefef";
107
+ export const ColorOpacityNegro4 = "rgba(31, 28, 27, 0.04)";
108
+ export const ColorOpacityNegro8 = "rgba(31, 28, 27, 0.08)";
109
+ export const ColorOpacityNegro16 = "rgba(31, 28, 27, 0.16)";
110
+ export const ColorOpacityNegro25 = "rgba(31, 28, 27, 0.25)";
111
+ export const ColorOpacityNegro50 = "rgba(31, 28, 27, 0.50)";
112
+ export const ColorOpacityNegro80 = "rgba(31, 28, 27, 0.80)";
113
+ export const ColorOpacityBlanco4 = "rgba(255, 255, 255, 0.04)";
114
+ export const ColorOpacityBlanco8 = "rgba(255, 255, 255, 0.08)";
115
+ export const ColorOpacityBlanco16 = "rgba(255, 255, 255, 0.16)";
116
+ export const ColorOpacityBlanco25 = "rgba(255, 255, 255, 0.25)";
117
+ export const ColorOpacityBlanco50 = "rgba(255, 255, 255, 0.50)";
118
+ export const ColorOpacityBlanco80 = "rgba(255, 255, 255, 0.80)";
119
+ export const BorderRadiusXxs = "4px";
120
+ export const BorderRadiusXs = "8px";
121
+ export const BorderRadiusSm = "12px";
122
+ export const BorderRadiusLg = "16px";
123
+ export const BorderRadiusXl = "24px";
124
+ export const BorderRadius2xl = "32px";
125
+ export const BorderRadius3xl = "40px";
126
+ export const BorderRadius4xl = "48px";
127
+ export const BorderRadius5xl = "56px";
128
+ export const BorderRadius6xl = "64px";
129
+ export const BorderRadiusFull = "9999px";
130
+ export const SemanticSurfacePrimary = "#1f1c1b";
131
+ export const SemanticSurfaceSecondary = "#ffffff";
132
+ export const SemanticSurfacePage = "#ffffff";
133
+ export const SemanticSurfaceMuted = "#e3e3e3";
134
+ export const SemanticSurfaceHover = "rgba(31, 28, 27, 0.04)";
135
+ export const SemanticSurfaceDisabled = "#f6f6f6";
136
+ export const SemanticOnPrimary = "#ffffff";
137
+ export const SemanticOnSecondary = "#1f1c1b";
138
+ export const SemanticTextDefault = "#1f1c1b";
139
+ export const SemanticTextInverse = "#ffffff";
140
+ export const SemanticTextSecondary = "#585858";
141
+ export const SemanticTextMuted = "#888888";
142
+ export const SemanticTextDisabled = "#a0a0a0";
143
+ export const SemanticBorderDefault = "rgba(31, 28, 27, 0.16)";
144
+ export const SemanticBorderSubtle = "rgba(31, 28, 27, 0.08)";
145
+ export const SemanticBorderStrong = "rgba(31, 28, 27, 0.50)";
146
+ export const SemanticBorderFocus = "rgba(31, 28, 27, 0.25)";
147
+ export const SemanticBorderFocusRing = "rgba(31, 28, 27, 0.08)";
148
+ export const SemanticControlThumb = "#ffffff";
149
+ export const SemanticControlShadow = "rgba(31, 28, 27, 0.16)";
150
+ export const SemanticStatusSuccess = "#0a7724";
151
+ export const SemanticStatusError = "#aa2e1b";
152
+ export const SemanticStatusWarning = "#fdbf00";
153
+ export const SemanticStatusInfo = "#2d6cc5";
154
+ export const ShadowLg =
155
+ "0 10px 15px -3px rgba(26, 26, 26, 0.05), 0 4px 6px -4px rgba(26, 26, 26, 0.05)";
156
+ export const SpacingXxs = "2px";
157
+ export const SpacingXs = "4px";
158
+ export const SpacingSm = "6px";
159
+ export const SpacingSm2 = "8px";
160
+ export const SpacingMd = "12px";
161
+ export const SpacingLg = "16px";
162
+ export const SpacingXl = "20px";
163
+ export const Spacing2xl = "24px";
164
+ export const Spacing3xl = "32px";
165
+ export const Spacing4xl = "40px";
166
+ export const Spacing5xl = "48px";
167
+ export const Spacing6xl = "56px";
168
+ export const Spacing7xl = "64px";
169
+ export const Spacing8xl = "72px";
170
+ export const Spacing9xl = "80px";
171
+ export const Spacing10xl = "88px";
172
+ export const Spacing11xl = "96px";
173
+ export const Spacing12xl = "104px";
174
+ export const Spacing13xl = "112px";
175
+ export const Spacing14xl = "120px";
176
+ export const SpacingFull = "9999px";
177
+ export const FontFamilyPrimary =
178
+ "'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif";
179
+ export const FontFamilyMono =
180
+ "'Geist Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace";
181
+ export const FontSize10 = "10px";
182
+ export const FontSize12 = "12px";
183
+ export const FontSize14 = "14px";
184
+ export const FontSize16 = "16px";
185
+ export const FontSize18 = "18px";
186
+ export const FontSize20 = "20px";
187
+ export const FontSize22 = "22px";
188
+ export const FontSize24 = "24px";
189
+ export const FontSize26 = "26px";
190
+ export const FontSize30 = "30px";
191
+ export const FontSize32 = "32px";
192
+ export const FontSize36 = "36px";
193
+ export const FontSize40 = "40px";
194
+ export const FontSize44 = "44px";
195
+ export const FontSize48 = "48px";
196
+ export const FontSize50 = "50px";
197
+ export const FontSize56 = "56px";
198
+ export const FontSize64 = "64px";
199
+ export const FontSize72 = "72px";
200
+ export const FontSize80 = "80px";
201
+ export const FontSize96 = "96px";
202
+ export const FontSize104 = "104px";
203
+ export const FontSize112 = "112px";
204
+ export const FontSize128 = "128px";
205
+ export const FontSize144 = "144px";
206
+ export const FontSize160 = "160px";
207
+ export const FontSize180 = "180px";
208
+ export const FontSize200 = "200px";
209
+ export const FontSize220 = "220px";
210
+ export const FontWeightRegular = "400";
211
+ export const FontWeightMedium = "500";
212
+ export const FontWeightSemibold = "600";
213
+ export const FontWeightBold = "700";
214
+ export const FontLineHeightNone = "1";
215
+ export const FontLineHeightTight = "1.2";
216
+ export const FontLineHeightSnug = "1.3";
217
+ export const FontLineHeightNormal = "1.5";
218
+ export const FontLineHeightRelaxed = "1.6";
219
+ export const FontLetterSpacingBody = "-0.03em";
220
+ export const FontLetterSpacingOverline = "0.08em";
package/build/json/tokens.json ADDED
@@ -0,0 +1,70 @@
1
+ {
2
+ "ColorBaseNegro": "#1f1c1b",
3
+ "ColorBaseBlanco": "#ffffff",
4
+ "ColorBaseOffWhite": "#f7f6f0",
5
+ "ColorPrimaryVerde": "#02a270",
6
+ "ColorPrimaryAmarillo": "#fdbf00",
7
+ "ColorPrimaryAzul": "#2563eb",
8
+ "ColorPrimaryRosado": "#f32a73",
9
+ "ColorGray100": "#f6f6f6",
10
+ "ColorGray200": "#e3e3e3",
11
+ "ColorGray300": "#c4c4c4",
12
+ "ColorGray400": "#a0a0a0",
13
+ "ColorGray500": "#888888",
14
+ "ColorGray600": "#585858",
15
+ "ColorGray700": "#1f1c1b",
16
+ "ColorGray800": "#0a0a0a",
17
+ "ColorNeutral100": "#e6e5df",
18
+ "ColorNeutralBeige": "#fffcfa",
19
+ "ColorSecondaryRojo": "#eb1e1e",
20
+ "ColorSecondaryNaranja": "#f0821e",
21
+ "ColorSecondaryOliva": "#aab43c",
22
+ "ColorSecondaryVioleta": "#5f4bd7",
23
+ "ColorSecondaryMarron": "#af7355",
24
+ "ColorVerde100": "#ecfdf5",
25
+ "ColorVerde900": "#046147",
26
+ "ColorStatusSuccess": "#0a7724",
27
+ "ColorStatusSuccessBg": "#ebf9ec",
28
+ "ColorStatusError": "#aa2e1b",
29
+ "ColorStatusProgress": "#2d6cc5",
30
+ "ColorStatusReview": "#85571f",
31
+ "ColorStatusSubmitted": "#7556ca",
32
+ "OpacityNegro4": "rgba(31, 28, 27, 0.04)",
33
+ "OpacityNegro8": "rgba(31, 28, 27, 0.08)",
34
+ "OpacityNegro16": "rgba(31, 28, 27, 0.16)",
35
+ "OpacityNegro25": "rgba(31, 28, 27, 0.25)",
36
+ "OpacityNegro50": "rgba(31, 28, 27, 0.5)",
37
+ "OpacityNegro80": "rgba(31, 28, 27, 0.8)",
38
+ "OpacityBlanco4": "rgba(255, 255, 255, 0.04)",
39
+ "OpacityBlanco8": "rgba(255, 255, 255, 0.08)",
40
+ "OpacityBlanco16": "rgba(255, 255, 255, 0.16)",
41
+ "OpacityBlanco80": "rgba(255, 255, 255, 0.8)",
42
+ "RadiusXxs": "4px",
43
+ "RadiusXs": "8px",
44
+ "RadiusSm": "12px",
45
+ "RadiusLg": "16px",
46
+ "RadiusXl": "24px",
47
+ "RadiusFull": "9999px",
48
+ "ShadowLg": "0 10px 15px -3px rgba(26, 26, 26, 0.05), 0 4px 6px -4px rgba(26, 26, 26, 0.05)",
49
+ "FocusRing": "0 0 0 2px rgba(31, 28, 27, 0.08)",
50
+ "SpaceXxs": "2px",
51
+ "SpaceXs": "4px",
52
+ "SpaceSm": "6px",
53
+ "SpaceSm2": "8px",
54
+ "SpaceMd": "12px",
55
+ "SpaceLg": "16px",
56
+ "SpaceXl": "20px",
57
+ "Space2xl": "24px",
58
+ "Space3xl": "32px",
59
+ "Space5xl": "48px",
60
+ "FontFamilyPrimary": "'Geist', sans-serif",
61
+ "FontFamilyMono": "'Geist Mono', monospace",
62
+ "FontSize10": "10px",
63
+ "FontSize12": "12px",
64
+ "FontSize14": "14px",
65
+ "FontSize16": "16px",
66
+ "FontSize18": "18px",
67
+ "FontSize20": "20px",
68
+ "FontSize22": "22px",
69
+ "FontSize24": "24px"
70
+ }
package/build/scss/_tokens.scss ADDED
@@ -0,0 +1,216 @@
1
+
2
+ // Do not edit directly, this file was auto-generated.
3
+
4
+ $co-color-base-negro: #1f1c1b;
5
+ $co-color-base-blanco: #ffffff;
6
+ $co-color-base-off-white: #f7f6f0;
7
+ $co-color-primary-verde: #02a270;
8
+ $co-color-primary-amarillo: #fdbf00;
9
+ $co-color-primary-azul: #2563eb;
10
+ $co-color-primary-rosado: #f32a73;
11
+ $co-color-azul-100: #eff4ff;
12
+ $co-color-azul-200: #dbe6fe;
13
+ $co-color-azul-300: #bfd3fe;
14
+ $co-color-azul-400: #93b4fd;
15
+ $co-color-azul-500: #6090fa;
16
+ $co-color-azul-600: #3b76f6;
17
+ $co-color-azul-700: #2563eb;
18
+ $co-color-azul-800: #1d58d8;
19
+ $co-color-azul-900: #1e408a;
20
+ $co-color-rosado-100: #fef1f6;
21
+ $co-color-rosado-200: #fde6f0;
22
+ $co-color-rosado-300: #fdcde2;
23
+ $co-color-rosado-400: #fda4c8;
24
+ $co-color-rosado-500: #fb6ba3;
25
+ $co-color-rosado-600: #f32a73;
26
+ $co-color-rosado-700: #e41e5c;
27
+ $co-color-rosado-800: #c61044;
28
+ $co-color-rosado-900: #a41039;
29
+ $co-color-amarillo-100: #ffffea;
30
+ $co-color-amarillo-200: #fffbc5;
31
+ $co-color-amarillo-300: #fff885;
32
+ $co-color-amarillo-400: #ffe01b;
33
+ $co-color-amarillo-500: #fdbf00;
34
+ $co-color-amarillo-600: #e29500;
35
+ $co-color-amarillo-700: #bb6902;
36
+ $co-color-amarillo-800: #985108;
37
+ $co-color-amarillo-900: #7c420b;
38
+ $co-color-verde-100: #ecfdf5;
39
+ $co-color-verde-200: #d0fbe5;
40
+ $co-color-verde-300: #a5f5d0;
41
+ $co-color-verde-400: #6beab8;
42
+ $co-color-verde-500: #31d69a;
43
+ $co-color-verde-600: #0cbd82;
44
+ $co-color-verde-700: #02a270;
45
+ $co-color-verde-800: #027a58;
46
+ $co-color-verde-900: #046147;
47
+ $co-color-neutral-100: #e6e5df;
48
+ $co-color-neutral-200: #eeede7;
49
+ $co-color-neutral-300: #f3f2ec;
50
+ $co-color-gray-100: #f6f6f6;
51
+ $co-color-gray-200: #e3e3e3;
52
+ $co-color-gray-300: #c4c4c4;
53
+ $co-color-gray-400: #a0a0a0;
54
+ $co-color-gray-500: #888888;
55
+ $co-color-gray-600: #585858;
56
+ $co-color-gray-700: #1f1c1b;
57
+ $co-color-gray-800: #0a0a0a;
58
+ $co-color-secondary-rosado-100: #d74ba0;
59
+ $co-color-secondary-rosado-50: #ffc8eb;
60
+ $co-color-secondary-rosado-25: #ffe6f5;
61
+ $co-color-secondary-rojo-100: #eb1e1e;
62
+ $co-color-secondary-rojo-50: #ff878c;
63
+ $co-color-secondary-rojo-25: #ffd7dc;
64
+ $co-color-secondary-naranja-100: #f0821e;
65
+ $co-color-secondary-naranja-50: #ffbe82;
66
+ $co-color-secondary-naranja-25: #ffe6d2;
67
+ $co-color-secondary-amarillo-100: #fad223;
68
+ $co-color-secondary-amarillo-50: #ffe67d;
69
+ $co-color-secondary-amarillo-25: #fffac3;
70
+ $co-color-secondary-verde-100: #afe664;
71
+ $co-color-secondary-verde-50: #d7ffb4;
72
+ $co-color-secondary-verde-25: #ebffc8;
73
+ $co-color-secondary-oliva-100: #aab43c;
74
+ $co-color-secondary-oliva-50: #d2dc96;
75
+ $co-color-secondary-oliva-25: #f0f0d2;
76
+ $co-color-secondary-turquesa-100: #00afaf;
77
+ $co-color-secondary-turquesa-50: #3ce1c8;
78
+ $co-color-secondary-turquesa-25: #c8f0f0;
79
+ $co-color-secondary-azul-claro-100: #00bee6;
80
+ $co-color-secondary-azul-claro-50: #6ee6f0;
81
+ $co-color-secondary-azul-claro-25: #befaff;
82
+ $co-color-secondary-azul-electrico-100: #000aff;
83
+ $co-color-secondary-azul-electrico-50: #8095ff;
84
+ $co-color-secondary-azul-electrico-25: #cce0ff;
85
+ $co-color-secondary-violeta-100: #5f4bd7;
86
+ $co-color-secondary-violeta-50: #b9b4ff;
87
+ $co-color-secondary-violeta-25: #e1e1ff;
88
+ $co-color-secondary-marron-100: #af7355;
89
+ $co-color-secondary-marron-50: #d7b9a5;
90
+ $co-color-secondary-marron-25: #f0e1d7;
91
+ $co-color-secondary-guinda-100: #811137;
92
+ $co-color-secondary-guinda-50: #c0889c;
93
+ $co-color-secondary-guinda-25: #e6cfd7;
94
+ $co-color-status-success: #0a7724;
95
+ $co-color-status-bg-success: #ebf9ec;
96
+ $co-color-status-progress: #2d6cc5;
97
+ $co-color-status-bg-progress: #eef3fa;
98
+ $co-color-status-submitted: #7556ca;
99
+ $co-color-status-bg-submitted: #f4f1fb;
100
+ $co-color-status-review: #85571f;
101
+ $co-color-status-bg-review: #fcf5db;
102
+ $co-color-status-pending: #b45103;
103
+ $co-color-status-bg-pending: #f9f1eb;
104
+ $co-color-status-error: #aa2e1b;
105
+ $co-color-status-bg-error: #ffefef;
106
+ $co-color-opacity-negro-4: rgba(31, 28, 27, 0.04);
107
+ $co-color-opacity-negro-8: rgba(31, 28, 27, 0.08);
108
+ $co-color-opacity-negro-16: rgba(31, 28, 27, 0.16);
109
+ $co-color-opacity-negro-25: rgba(31, 28, 27, 0.25);
110
+ $co-color-opacity-negro-50: rgba(31, 28, 27, 0.50);
111
+ $co-color-opacity-negro-80: rgba(31, 28, 27, 0.80);
112
+ $co-color-opacity-blanco-4: rgba(255, 255, 255, 0.04);
113
+ $co-color-opacity-blanco-8: rgba(255, 255, 255, 0.08);
114
+ $co-color-opacity-blanco-16: rgba(255, 255, 255, 0.16);
115
+ $co-color-opacity-blanco-25: rgba(255, 255, 255, 0.25);
116
+ $co-color-opacity-blanco-50: rgba(255, 255, 255, 0.50);
117
+ $co-color-opacity-blanco-80: rgba(255, 255, 255, 0.80);
118
+ $co-border-radius-xxs: 4px;
119
+ $co-border-radius-xs: 8px;
120
+ $co-border-radius-sm: 12px;
121
+ $co-border-radius-lg: 16px;
122
+ $co-border-radius-xl: 24px;
123
+ $co-border-radius-2xl: 32px;
124
+ $co-border-radius-3xl: 40px;
125
+ $co-border-radius-4xl: 48px;
126
+ $co-border-radius-5xl: 56px;
127
+ $co-border-radius-6xl: 64px;
128
+ $co-border-radius-full: 9999px;
129
+ $co-semantic-surface-primary: #1f1c1b;
130
+ $co-semantic-surface-secondary: #ffffff;
131
+ $co-semantic-surface-page: #ffffff;
132
+ $co-semantic-surface-muted: #e3e3e3;
133
+ $co-semantic-surface-hover: rgba(31, 28, 27, 0.04);
134
+ $co-semantic-surface-disabled: #f6f6f6;
135
+ $co-semantic-on-primary: #ffffff;
136
+ $co-semantic-on-secondary: #1f1c1b;
137
+ $co-semantic-text-default: #1f1c1b;
138
+ $co-semantic-text-inverse: #ffffff;
139
+ $co-semantic-text-secondary: #585858;
140
+ $co-semantic-text-muted: #888888;
141
+ $co-semantic-text-disabled: #a0a0a0;
142
+ $co-semantic-border-default: rgba(31, 28, 27, 0.16);
143
+ $co-semantic-border-subtle: rgba(31, 28, 27, 0.08);
144
+ $co-semantic-border-strong: rgba(31, 28, 27, 0.50);
145
+ $co-semantic-border-focus: rgba(31, 28, 27, 0.25);
146
+ $co-semantic-border-focus-ring: rgba(31, 28, 27, 0.08);
147
+ $co-semantic-control-thumb: #ffffff;
148
+ $co-semantic-control-shadow: rgba(31, 28, 27, 0.16);
149
+ $co-semantic-status-success: #0a7724;
150
+ $co-semantic-status-error: #aa2e1b;
151
+ $co-semantic-status-warning: #fdbf00;
152
+ $co-semantic-status-info: #2d6cc5;
153
+ $co-shadow-lg: 0 10px 15px -3px rgba(26, 26, 26, 0.05), 0 4px 6px -4px rgba(26, 26, 26, 0.05);
154
+ $co-spacing-xxs: 2px;
155
+ $co-spacing-xs: 4px;
156
+ $co-spacing-sm: 6px;
157
+ $co-spacing-sm2: 8px;
158
+ $co-spacing-md: 12px;
159
+ $co-spacing-lg: 16px;
160
+ $co-spacing-xl: 20px;
161
+ $co-spacing-2xl: 24px;
162
+ $co-spacing-3xl: 32px;
163
+ $co-spacing-4xl: 40px;
164
+ $co-spacing-5xl: 48px;
165
+ $co-spacing-6xl: 56px;
166
+ $co-spacing-7xl: 64px;
167
+ $co-spacing-8xl: 72px;
168
+ $co-spacing-9xl: 80px;
169
+ $co-spacing-10xl: 88px;
170
+ $co-spacing-11xl: 96px;
171
+ $co-spacing-12xl: 104px;
172
+ $co-spacing-13xl: 112px;
173
+ $co-spacing-14xl: 120px;
174
+ $co-spacing-full: 9999px;
175
+ $co-font-family-primary: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
176
+ $co-font-family-mono: 'Geist Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
177
+ $co-font-size-10: 10px;
178
+ $co-font-size-12: 12px;
179
+ $co-font-size-14: 14px;
180
+ $co-font-size-16: 16px;
181
+ $co-font-size-18: 18px;
182
+ $co-font-size-20: 20px;
183
+ $co-font-size-22: 22px;
184
+ $co-font-size-24: 24px;
185
+ $co-font-size-26: 26px;
186
+ $co-font-size-30: 30px;
187
+ $co-font-size-32: 32px;
188
+ $co-font-size-36: 36px;
189
+ $co-font-size-40: 40px;
190
+ $co-font-size-44: 44px;
191
+ $co-font-size-48: 48px;
192
+ $co-font-size-50: 50px;
193
+ $co-font-size-56: 56px;
194
+ $co-font-size-64: 64px;
195
+ $co-font-size-72: 72px;
196
+ $co-font-size-80: 80px;
197
+ $co-font-size-96: 96px;
198
+ $co-font-size-104: 104px;
199
+ $co-font-size-112: 112px;
200
+ $co-font-size-128: 128px;
201
+ $co-font-size-144: 144px;
202
+ $co-font-size-160: 160px;
203
+ $co-font-size-180: 180px;
204
+ $co-font-size-200: 200px;
205
+ $co-font-size-220: 220px;
206
+ $co-font-weight-regular: 400;
207
+ $co-font-weight-medium: 500;
208
+ $co-font-weight-semibold: 600;
209
+ $co-font-weight-bold: 700;
210
+ $co-font-line-height-none: 1;
211
+ $co-font-line-height-tight: 1.2;
212
+ $co-font-line-height-snug: 1.3;
213
+ $co-font-line-height-normal: 1.5;
214
+ $co-font-line-height-relaxed: 1.6;
215
+ $co-font-letter-spacing-body: -0.03em;
216
+ $co-font-letter-spacing-overline: 0.08em;
package/build/ts/tokens.d.ts ADDED
@@ -0,0 +1,140 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ /** Figma: Base/Negro */
6
+ export const ColorBaseNegro: string;
7
+ /** Figma: Base/Blanco */
8
+ export const ColorBaseBlanco: string;
9
+ /** Figma: Base/Off-White */
10
+ export const ColorBaseOffWhite: string;
11
+ /** Figma: Primarios/Verde */
12
+ export const ColorPrimaryVerde: string;
13
+ /** Figma: Primarios/Amarillo */
14
+ export const ColorPrimaryAmarillo: string;
15
+ /** Figma: Primarios/Azul */
16
+ export const ColorPrimaryAzul: string;
17
+ /** Figma: Primarios/Rosado */
18
+ export const ColorPrimaryRosado: string;
19
+ /** Figma: Escala de grises/Gris-100 */
20
+ export const ColorGray100: string;
21
+ /** Figma: Escala de grises/Gris-200 */
22
+ export const ColorGray200: string;
23
+ /** Figma: Escala de grises/Gris-300 */
24
+ export const ColorGray300: string;
25
+ /** Figma: Escala de grises/Gris-400 */
26
+ export const ColorGray400: string;
27
+ /** Figma: Escala de grises/Gris-500 */
28
+ export const ColorGray500: string;
29
+ /** Figma: Escala de grises/Gris-600 */
30
+ export const ColorGray600: string;
31
+ /** Figma: Escala de grises/Gris-700 */
32
+ export const ColorGray700: string;
33
+ /** Figma: Escala de grises/Gris-800 */
34
+ export const ColorGray800: string;
35
+ /** Figma: Neutrales/Neutral-100 */
36
+ export const ColorNeutral100: string;
37
+ /** Figma: Neutrals/Beige */
38
+ export const ColorNeutralBeige: string;
39
+ /** Figma: Secundario/Rojo/Rojo 100% */
40
+ export const ColorSecondaryRojo: string;
41
+ /** Figma: Secundario/Naranja/Naranja 100% */
42
+ export const ColorSecondaryNaranja: string;
43
+ /** Figma: Secundario/Oliva/Oliva 100% */
44
+ export const ColorSecondaryOliva: string;
45
+ /** Figma: Secundario/Violeta/Violeta 100% */
46
+ export const ColorSecondaryVioleta: string;
47
+ /** Figma: Secundario/Marrón/Marrón 100% */
48
+ export const ColorSecondaryMarron: string;
49
+ /** Figma: Verde/Verde-100 */
50
+ export const ColorVerde100: string;
51
+ /** Figma: Verde/Verde-900 */
52
+ export const ColorVerde900: string;
53
+ /** Figma: Estatus/Éxito/Success */
54
+ export const ColorStatusSuccess: string;
55
+ /** Figma: Estatus/Éxito/Bg_Success */
56
+ export const ColorStatusSuccessBg: string;
57
+ /** Figma: Estatus/Error/Error */
58
+ export const ColorStatusError: string;
59
+ /** Figma: Estatus/En progreso/In progress */
60
+ export const ColorStatusProgress: string;
61
+ /** Figma: Estatus/En revisión/In review */
62
+ export const ColorStatusReview: string;
63
+ /** Figma: Estatus/Enviado/Submitted */
64
+ export const ColorStatusSubmitted: string;
65
+ /** Figma: Opacidad/Negro/Negro 4% */
66
+ export const OpacityNegro4: string;
67
+ /** Figma: Opacidad/Negro/Negro 8% */
68
+ export const OpacityNegro8: string;
69
+ /** Figma: Opacidad/Negro/Negro 16% */
70
+ export const OpacityNegro16: string;
71
+ /** Figma: Opacidad/Negro/Negro 25% */
72
+ export const OpacityNegro25: string;
73
+ /** Figma: Opacidad/Negro/Negro 50% */
74
+ export const OpacityNegro50: string;
75
+ /** Figma: Opacidad/Negro/Negro 80% */
76
+ export const OpacityNegro80: string;
77
+ /** Figma: Opacidad/Blanco/Blanco 4% */
78
+ export const OpacityBlanco4: string;
79
+ /** Figma: Opacidad/Blanco/Blanco 8% */
80
+ export const OpacityBlanco8: string;
81
+ /** Figma: Opacidad/Blanco/Blanco 16% */
82
+ export const OpacityBlanco16: string;
83
+ /** Figma: Opacidad/Blanco/Blanco 80% */
84
+ export const OpacityBlanco80: string;
85
+ /** Figma: Border Radius/radius-xxs */
86
+ export const RadiusXxs: string;
87
+ /** Figma: Border Radius/radius-xs */
88
+ export const RadiusXs: string;
89
+ /** Figma: Border Radius/radius-sm */
90
+ export const RadiusSm: string;
91
+ /** Figma: Border Radius/radius-lg */
92
+ export const RadiusLg: string;
93
+ /** Figma: Border Radius/radius-xl */
94
+ export const RadiusXl: string;
95
+ /** Figma: Border Radius/radius-full */
96
+ export const RadiusFull: string;
97
+ /** Figma: Shadows/lg — 2 layer composite */
98
+ export const ShadowLg: string;
99
+ /** Figma: Focus effect */
100
+ export const FocusRing: string;
101
+ /** Figma: Espacio/space-xxs */
102
+ export const SpaceXxs: string;
103
+ /** Figma: Espacio/space-xs */
104
+ export const SpaceXs: string;
105
+ /** Figma: Espacio/space-sm */
106
+ export const SpaceSm: string;
107
+ /** Figma: Espacio/space-sm2 */
108
+ export const SpaceSm2: string;
109
+ /** Figma: Espacio/space-md */
110
+ export const SpaceMd: string;
111
+ /** Figma: Espacio/space-lg */
112
+ export const SpaceLg: string;
113
+ /** Figma: Espacio/space-xl */
114
+ export const SpaceXl: string;
115
+ /** Figma: Espacio/space-2xl */
116
+ export const Space2xl: string;
117
+ /** Figma: Espacio/space-3xl */
118
+ export const Space3xl: string;
119
+ /** Figma: Espacio/space-5xl */
120
+ export const Space5xl: string;
121
+ /** Figma: Font Families/font-family-geist */
122
+ export const FontFamilyPrimary: string;
123
+ /** Figma: Font Families/font-family-geist-mono */
124
+ export const FontFamilyMono: string;
125
+ /** Figma: Font Size/font-size-10 */
126
+ export const FontSize10: string;
127
+ /** Figma: Font Size/font-size-12 */
128
+ export const FontSize12: string;
129
+ /** Figma: Font Size/font-size-14 */
130
+ export const FontSize14: string;
131
+ /** Figma: Font Size/font-size-16 */
132
+ export const FontSize16: string;
133
+ /** Figma: Font Size/font-size-18 */
134
+ export const FontSize18: string;
135
+ /** Figma: Font Size/font-size-20 */
136
+ export const FontSize20: string;
137
+ /** Figma: Font Size/font-size-22 */
138
+ export const FontSize22: string;
139
+ /** Figma: Font Size/font-size-24 */
140
+ export const FontSize24: string;
package/package.json ADDED
@@ -0,0 +1,39 @@
1
+ {
2
+ "name": "@prolibu-suite/cobalt-tokens",
3
+ "version": "0.1.0",
4
+ "description": "Cobalt Design System Tokens — CSS, SCSS, JS/TS",
5
+ "type": "module",
6
+ "exports": {
7
+ ".": {
8
+ "import": "./build/js/tokens.mjs",
9
+ "types": "./build/js/tokens.d.ts"
10
+ },
11
+ "./css": "./build/css/tokens.css",
12
+ "./css/dark": "./build/css/tokens-dark.css",
13
+ "./scss": "./build/scss/_tokens.scss"
14
+ },
15
+ "main": "build/js/tokens.mjs",
16
+ "module": "build/js/tokens.mjs",
17
+ "types": "build/js/tokens.d.ts",
18
+ "files": [
19
+ "build"
20
+ ],
21
+ "devDependencies": {
22
+ "style-dictionary": "^5.4.0"
23
+ },
24
+ "keywords": [
25
+ "design-tokens",
26
+ "cobalt",
27
+ "prolibu"
28
+ ],
29
+ "author": "Prolibu <contact@prolibu.com>",
30
+ "license": "MIT",
31
+ "publishConfig": {
32
+ "access": "public"
33
+ },
34
+ "scripts": {
35
+ "build": "style-dictionary build --config config.js && node config.dark.js",
36
+ "dev": "style-dictionary build --config config.js --watch",
37
+ "clean": "rm -rf build"
38
+ }
39
+ }