@takeoff-design/tokens 0.1.1 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/dist/assets/fonts/tk-font/tk-display/tk-display.ttf +0 -0
  2. package/dist/assets/fonts/tk-font/tk-display/tk-display.woff2 +0 -0
  3. package/dist/assets/fonts/tk-font/tk-text/tk-text.ttf +0 -0
  4. package/dist/assets/fonts/tk-font/tk-text/tk-text.woff2 +0 -0
  5. package/dist/css/ajet/theme.css +4565 -2261
  6. package/dist/css/ajet/variables.css +32 -32
  7. package/dist/css/assets/fonts/tk-font/tk-display/tk-display.ttf +0 -0
  8. package/dist/css/assets/fonts/tk-font/tk-display/tk-display.woff2 +0 -0
  9. package/dist/css/assets/fonts/tk-font/tk-text/tk-text.ttf +0 -0
  10. package/dist/css/assets/fonts/tk-font/tk-text/tk-text.woff2 +0 -0
  11. package/dist/css/aviation/theme.css +4565 -2261
  12. package/dist/css/aviation/variables.css +32 -32
  13. package/dist/css/default/theme.css +4569 -2265
  14. package/dist/css/default/variables.css +36 -36
  15. package/dist/css/fonts.css +30 -1
  16. package/dist/css/sarp/theme.css +4565 -2261
  17. package/dist/css/sarp/variables.css +32 -32
  18. package/dist/css/technology/theme.css +4565 -2261
  19. package/dist/css/technology/variables.css +32 -32
  20. package/dist/js/ajet/tokens.mjs +52 -52
  21. package/dist/js/aviation/tokens.mjs +52 -52
  22. package/dist/js/default/tokens.mjs +210 -210
  23. package/dist/js/sarp/tokens.mjs +52 -52
  24. package/dist/js/technology/tokens.mjs +52 -52
  25. package/dist/scss/_components.scss +4525 -2220
  26. package/dist/scss/_variables.scss +36 -36
  27. package/dist/tailwind/_theme-vars.css +16 -16
  28. package/dist/tailwind/colors.js +10 -10
  29. package/dist/tailwind/theme.css +16 -16
  30. package/package.json +2 -2
package/dist/scss/_variables.scss CHANGED
@@ -167,22 +167,22 @@
167
167
  --alpha-neutral-neutral-500-8: #52586614;
168
168
  --alpha-neutral-neutral-500-4: #5258660A;
169
169
  --alpha-neutral-neutral-500-2: #52586605;
170
- --aviation-amber-50: #FFF2E5;
171
- --aviation-amber-100: #FFD9B2;
172
- --aviation-amber-200: #FFCC99;
173
- --aviation-amber-300: #FFB366;
174
- --aviation-amber-400: #FF9933;
175
- --aviation-amber-500: #FF8000;
176
- --aviation-amber-600: #CC6600;
177
- --aviation-amber-700: #994D00;
178
- --aviation-amber-800: #663300;
179
- --aviation-amber-900: #4D2600;
170
+ --aviation-amber-amber-50: #FFF2E5;
171
+ --aviation-amber-amber-100: #FFD9B2;
172
+ --aviation-amber-amber-200: #FFCC99;
173
+ --aviation-amber-amber-300: #FFB366;
174
+ --aviation-amber-amber-400: #FF9933;
175
+ --aviation-amber-amber-500: #FF8000;
176
+ --aviation-amber-amber-600: #CC6600;
177
+ --aviation-amber-amber-700: #994D00;
178
+ --aviation-amber-amber-800: #663300;
179
+ --aviation-amber-amber-900: #4D2600;
180
180
 
181
181
  /* typography */
182
- --family-title: 'Geologica';
183
- --family-subheading: 'Geologica';
184
- --family-label: 'Geologica';
185
- --family-body: 'Geologica';
182
+ --family-title: 'TK DISPLAY';
183
+ --family-subheading: 'TK Text';
184
+ --family-label: 'TK Text';
185
+ --family-body: 'TK Text';
186
186
  --size-xxs: 11px;
187
187
  --size-sm: 14px;
188
188
  --size-base: 16px;
@@ -764,12 +764,6 @@
764
764
  --overlay-black-xxlightest: var(--alpha-base-black-2);
765
765
  --overlay-black-xlightest: var(--alpha-base-black-8);
766
766
  --overlay-black-none: var(--alpha-base-black-none);
767
- --overlay-white-lightest: var(--alpha-base-white-16);
768
- --overlay-white-light: var(--alpha-base-white-32);
769
- --overlay-white-base: var(--alpha-base-white-48);
770
- --overlay-white-dark: var(--alpha-base-white-64);
771
- --overlay-white-darkest: var(--alpha-base-white-72);
772
- --overlay-white-none: var(--alpha-base-white-none);
773
767
  --states-lightest: var(--neutral-50);
774
768
  --states-light: var(--neutral-300);
775
769
  --states-base: var(--secondary-500);
@@ -805,6 +799,12 @@
805
799
  --states-verified-dark: var(--blue-700);
806
800
  --states-verified-darkest: var(--blue-800);
807
801
  --states-verified-lightest: var(--blue-50);
802
+ --overlay-white-lightest: var(--alpha-base-white-16);
803
+ --overlay-white-light: var(--alpha-base-white-32);
804
+ --overlay-white-base: var(--alpha-base-white-48);
805
+ --overlay-white-dark: var(--alpha-base-white-64);
806
+ --overlay-white-darkest: var(--alpha-base-white-72);
807
+ --overlay-white-none: var(--alpha-base-white-none);
808
808
  --static-dark: var(--static-black);
809
809
  --static-light: var(--static-white);
810
810
  --shadow-black-alpha-lightest: var(--alpha-neutral-neutral-500-2);
@@ -1367,12 +1367,12 @@
1367
1367
  --pagination-base-arrow-gap: var(--spacing-xs);
1368
1368
  --pagination-base-gap: var(--spacing-s);
1369
1369
  --pagination-base-container-v-padding: var(--spacing-xxs);
1370
- --pagination-cell-large-cell-size: var(--spacing-10xl);
1371
- --pagination-cell-large-cell-radius: var(--radius-m-base);
1372
- --pagination-cell-base-cell-size: var(--spacing-8xl);
1373
- --pagination-cell-base-cell-radius: var(--radius-m-base);
1374
- --pagination-cell-small-cell-size: var(--spacing-6xl);
1375
- --pagination-cell-small-cell-radius: var(--radius-m-base);
1370
+ --pagination-cell-large-size: var(--spacing-10xl);
1371
+ --pagination-cell-large-radius: var(--radius-m-base);
1372
+ --pagination-cell-base-size: var(--spacing-8xl);
1373
+ --pagination-cell-base-radius: var(--radius-m-base);
1374
+ --pagination-cell-small-size: var(--spacing-6xl);
1375
+ --pagination-cell-small-radius: var(--radius-m-base);
1376
1376
 
1377
1377
  /* ------ persona variables ------ */
1378
1378
  --persona-base-h-padding: var(--spacing-m-base);
@@ -1698,10 +1698,10 @@
1698
1698
  --timepicker-timer-body-clock-input-gap: var(--spacing-none);
1699
1699
 
1700
1700
  /* ------ timestamp variables ------ */
1701
- --timestamp-base-gap: var(--spacing-xxs);
1702
- --timestamp-base-content-gap: var(--spacing-xs);
1703
- --timestamp-small-gap: var(--spacing-none);
1704
- --timestamp-small-content-gap: var(--spacing-xxs);
1701
+ --timestamp-timestampt-base-gap: var(--spacing-xxs);
1702
+ --timestamp-timestampt-base-content-gap: var(--spacing-xs);
1703
+ --timestamp-timestampt-small-gap: var(--spacing-none);
1704
+ --timestamp-timestampt-small-content-gap: var(--spacing-xxs);
1705
1705
 
1706
1706
  /* ------ toast variables ------ */
1707
1707
  --toast-base-radius: var(--radius-m-base);
@@ -1815,12 +1815,6 @@
1815
1815
  --overlay-black-xxlightest: var(--alpha-base-white-8);
1816
1816
  --overlay-black-xlightest: var(--alpha-base-white-12);
1817
1817
  --overlay-black-none: var(--alpha-base-white-none);
1818
- --overlay-white-lightest: var(--alpha-base-black-16);
1819
- --overlay-white-light: var(--alpha-base-black-32);
1820
- --overlay-white-base: var(--alpha-base-black-48);
1821
- --overlay-white-dark: var(--alpha-base-black-64);
1822
- --overlay-white-darkest: var(--alpha-base-black-72);
1823
- --overlay-white-none: var(--alpha-base-black-none);
1824
1818
  --states-lightest: var(--neutral-50);
1825
1819
  --states-light: var(--neutral-300);
1826
1820
  --states-base: var(--secondary-500);
@@ -1856,6 +1850,12 @@
1856
1850
  --states-verified-dark: var(--blue-300);
1857
1851
  --states-verified-darkest: var(--blue-100);
1858
1852
  --states-verified-lightest: var(--blue-900);
1853
+ --overlay-white-lightest: var(--alpha-base-black-16);
1854
+ --overlay-white-light: var(--alpha-base-black-32);
1855
+ --overlay-white-base: var(--alpha-base-black-48);
1856
+ --overlay-white-dark: var(--alpha-base-black-64);
1857
+ --overlay-white-darkest: var(--alpha-base-black-72);
1858
+ --overlay-white-none: var(--alpha-base-black-none);
1859
1859
  --static-dark: var(--static-white);
1860
1860
  --static-light: var(--static-black);
1861
1861
  --shadow-black-alpha-lightest: var(--alpha-neutral-neutral-500-2);
package/dist/tailwind/_theme-vars.css CHANGED
@@ -166,16 +166,16 @@
166
166
  --color-alpha-neutral-neutral-500-8: var(--alpha-neutral-neutral-500-8);
167
167
  --color-alpha-neutral-neutral-500-4: var(--alpha-neutral-neutral-500-4);
168
168
  --color-alpha-neutral-neutral-500-2: var(--alpha-neutral-neutral-500-2);
169
- --color-aviation-amber-50: var(--aviation-amber-50);
170
- --color-aviation-amber-100: var(--aviation-amber-100);
171
- --color-aviation-amber-200: var(--aviation-amber-200);
172
- --color-aviation-amber-300: var(--aviation-amber-300);
173
- --color-aviation-amber-400: var(--aviation-amber-400);
174
- --color-aviation-amber-500: var(--aviation-amber-500);
175
- --color-aviation-amber-600: var(--aviation-amber-600);
176
- --color-aviation-amber-700: var(--aviation-amber-700);
177
- --color-aviation-amber-800: var(--aviation-amber-800);
178
- --color-aviation-amber-900: var(--aviation-amber-900);
169
+ --color-aviation-amber-amber-50: var(--aviation-amber-amber-50);
170
+ --color-aviation-amber-amber-100: var(--aviation-amber-amber-100);
171
+ --color-aviation-amber-amber-200: var(--aviation-amber-amber-200);
172
+ --color-aviation-amber-amber-300: var(--aviation-amber-amber-300);
173
+ --color-aviation-amber-amber-400: var(--aviation-amber-amber-400);
174
+ --color-aviation-amber-amber-500: var(--aviation-amber-amber-500);
175
+ --color-aviation-amber-amber-600: var(--aviation-amber-amber-600);
176
+ --color-aviation-amber-amber-700: var(--aviation-amber-amber-700);
177
+ --color-aviation-amber-amber-800: var(--aviation-amber-amber-800);
178
+ --color-aviation-amber-amber-900: var(--aviation-amber-amber-900);
179
179
 
180
180
  /* Semantic Colors */
181
181
  --color-primary-light: var(--primary-light);
@@ -222,12 +222,6 @@
222
222
  --color-overlay-black-xxlightest: var(--overlay-black-xxlightest);
223
223
  --color-overlay-black-xlightest: var(--overlay-black-xlightest);
224
224
  --color-overlay-black-none: var(--overlay-black-none);
225
- --color-overlay-white-lightest: var(--overlay-white-lightest);
226
- --color-overlay-white-light: var(--overlay-white-light);
227
- --color-overlay-white-base: var(--overlay-white-base);
228
- --color-overlay-white-dark: var(--overlay-white-dark);
229
- --color-overlay-white-darkest: var(--overlay-white-darkest);
230
- --color-overlay-white-none: var(--overlay-white-none);
231
225
  --color-states-lightest: var(--states-lightest);
232
226
  --color-states-light: var(--states-light);
233
227
  --color-states-base: var(--states-base);
@@ -263,6 +257,12 @@
263
257
  --color-states-verified-dark: var(--states-verified-dark);
264
258
  --color-states-verified-darkest: var(--states-verified-darkest);
265
259
  --color-states-verified-lightest: var(--states-verified-lightest);
260
+ --color-overlay-white-lightest: var(--overlay-white-lightest);
261
+ --color-overlay-white-light: var(--overlay-white-light);
262
+ --color-overlay-white-base: var(--overlay-white-base);
263
+ --color-overlay-white-dark: var(--overlay-white-dark);
264
+ --color-overlay-white-darkest: var(--overlay-white-darkest);
265
+ --color-overlay-white-none: var(--overlay-white-none);
266
266
  --color-static-dark: var(--static-dark);
267
267
  --color-static-light: var(--static-light);
268
268
  --color-shadow-black-alpha-lightest: var(--shadow-black-alpha-lightest);
package/dist/tailwind/colors.js CHANGED
@@ -165,14 +165,14 @@ module.exports = {
165
165
  'alpha-neutral-neutral-500-8': 'var(--alpha-neutral-neutral-500-8)',
166
166
  'alpha-neutral-neutral-500-4': 'var(--alpha-neutral-neutral-500-4)',
167
167
  'alpha-neutral-neutral-500-2': 'var(--alpha-neutral-neutral-500-2)',
168
- 'aviation-amber-50': 'var(--aviation-amber-50)',
169
- 'aviation-amber-100': 'var(--aviation-amber-100)',
170
- 'aviation-amber-200': 'var(--aviation-amber-200)',
171
- 'aviation-amber-300': 'var(--aviation-amber-300)',
172
- 'aviation-amber-400': 'var(--aviation-amber-400)',
173
- 'aviation-amber-500': 'var(--aviation-amber-500)',
174
- 'aviation-amber-600': 'var(--aviation-amber-600)',
175
- 'aviation-amber-700': 'var(--aviation-amber-700)',
176
- 'aviation-amber-800': 'var(--aviation-amber-800)',
177
- 'aviation-amber-900': 'var(--aviation-amber-900)',
168
+ 'aviation-amber-amber-50': 'var(--aviation-amber-amber-50)',
169
+ 'aviation-amber-amber-100': 'var(--aviation-amber-amber-100)',
170
+ 'aviation-amber-amber-200': 'var(--aviation-amber-amber-200)',
171
+ 'aviation-amber-amber-300': 'var(--aviation-amber-amber-300)',
172
+ 'aviation-amber-amber-400': 'var(--aviation-amber-amber-400)',
173
+ 'aviation-amber-amber-500': 'var(--aviation-amber-amber-500)',
174
+ 'aviation-amber-amber-600': 'var(--aviation-amber-amber-600)',
175
+ 'aviation-amber-amber-700': 'var(--aviation-amber-amber-700)',
176
+ 'aviation-amber-amber-800': 'var(--aviation-amber-amber-800)',
177
+ 'aviation-amber-amber-900': 'var(--aviation-amber-amber-900)',
178
178
  };
package/dist/tailwind/theme.css CHANGED
@@ -166,16 +166,16 @@
166
166
  --color-alpha-neutral-neutral-500-8: var(--alpha-neutral-neutral-500-8);
167
167
  --color-alpha-neutral-neutral-500-4: var(--alpha-neutral-neutral-500-4);
168
168
  --color-alpha-neutral-neutral-500-2: var(--alpha-neutral-neutral-500-2);
169
- --color-aviation-amber-50: var(--aviation-amber-50);
170
- --color-aviation-amber-100: var(--aviation-amber-100);
171
- --color-aviation-amber-200: var(--aviation-amber-200);
172
- --color-aviation-amber-300: var(--aviation-amber-300);
173
- --color-aviation-amber-400: var(--aviation-amber-400);
174
- --color-aviation-amber-500: var(--aviation-amber-500);
175
- --color-aviation-amber-600: var(--aviation-amber-600);
176
- --color-aviation-amber-700: var(--aviation-amber-700);
177
- --color-aviation-amber-800: var(--aviation-amber-800);
178
- --color-aviation-amber-900: var(--aviation-amber-900);
169
+ --color-aviation-amber-amber-50: var(--aviation-amber-amber-50);
170
+ --color-aviation-amber-amber-100: var(--aviation-amber-amber-100);
171
+ --color-aviation-amber-amber-200: var(--aviation-amber-amber-200);
172
+ --color-aviation-amber-amber-300: var(--aviation-amber-amber-300);
173
+ --color-aviation-amber-amber-400: var(--aviation-amber-amber-400);
174
+ --color-aviation-amber-amber-500: var(--aviation-amber-amber-500);
175
+ --color-aviation-amber-amber-600: var(--aviation-amber-amber-600);
176
+ --color-aviation-amber-amber-700: var(--aviation-amber-amber-700);
177
+ --color-aviation-amber-amber-800: var(--aviation-amber-amber-800);
178
+ --color-aviation-amber-amber-900: var(--aviation-amber-amber-900);
179
179
 
180
180
  /* Semantic Colors */
181
181
  --color-primary-light: var(--primary-light);
@@ -222,12 +222,6 @@
222
222
  --color-overlay-black-xxlightest: var(--overlay-black-xxlightest);
223
223
  --color-overlay-black-xlightest: var(--overlay-black-xlightest);
224
224
  --color-overlay-black-none: var(--overlay-black-none);
225
- --color-overlay-white-lightest: var(--overlay-white-lightest);
226
- --color-overlay-white-light: var(--overlay-white-light);
227
- --color-overlay-white-base: var(--overlay-white-base);
228
- --color-overlay-white-dark: var(--overlay-white-dark);
229
- --color-overlay-white-darkest: var(--overlay-white-darkest);
230
- --color-overlay-white-none: var(--overlay-white-none);
231
225
  --color-states-lightest: var(--states-lightest);
232
226
  --color-states-light: var(--states-light);
233
227
  --color-states-base: var(--states-base);
@@ -263,6 +257,12 @@
263
257
  --color-states-verified-dark: var(--states-verified-dark);
264
258
  --color-states-verified-darkest: var(--states-verified-darkest);
265
259
  --color-states-verified-lightest: var(--states-verified-lightest);
260
+ --color-overlay-white-lightest: var(--overlay-white-lightest);
261
+ --color-overlay-white-light: var(--overlay-white-light);
262
+ --color-overlay-white-base: var(--overlay-white-base);
263
+ --color-overlay-white-dark: var(--overlay-white-dark);
264
+ --color-overlay-white-darkest: var(--overlay-white-darkest);
265
+ --color-overlay-white-none: var(--overlay-white-none);
266
266
  --color-static-dark: var(--static-dark);
267
267
  --color-static-light: var(--static-light);
268
268
  --color-shadow-black-alpha-lightest: var(--shadow-black-alpha-lightest);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@takeoff-design/tokens",
3
- "version": "0.1.1",
3
+ "version": "0.2.0",
4
4
  "description": "Design tokens, CSS variables, SCSS, JS exports, and component recipe styles for Takeoff Design.",
5
5
  "type": "module",
6
6
  "author": "Turkish Technology Frontend Infrastructure Team <takeoffui@thy.com>",
@@ -41,7 +41,7 @@
41
41
  },
42
42
  "devDependencies": {
43
43
  "sass": "^1.98.0",
44
- "style-dictionary": "4",
44
+ "style-dictionary": "5",
45
45
  "vitest": "^4.1.2"
46
46
  },
47
47
  "scripts": {