@gitlab/ui 123.7.0 → 123.8.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 (40) hide show
  1. package/dist/index.css +2 -2
  2. package/dist/index.css.map +1 -1
  3. package/dist/tailwind.css +1 -1
  4. package/dist/tailwind.css.map +1 -1
  5. package/dist/tokens/build/js/tokens.dark.js +13 -1
  6. package/dist/tokens/build/js/tokens.js +13 -1
  7. package/dist/tokens/css/tokens.css +12 -0
  8. package/dist/tokens/css/tokens.dark.css +12 -0
  9. package/dist/tokens/docs/tokens-tailwind-docs.dark.json +712 -0
  10. package/dist/tokens/docs/tokens-tailwind-docs.json +712 -0
  11. package/dist/tokens/figma/constants.tokens.json +164 -10
  12. package/dist/tokens/figma/semantic.tokens.json +13 -0
  13. package/dist/tokens/js/tokens.dark.js +39 -0
  14. package/dist/tokens/js/tokens.js +39 -0
  15. package/dist/tokens/json/tokens.dark.json +470 -20
  16. package/dist/tokens/json/tokens.json +470 -20
  17. package/dist/tokens/scss/_tokens.dark.scss +12 -0
  18. package/dist/tokens/scss/_tokens.scss +12 -0
  19. package/dist/tokens/scss/_tokens_custom_properties.scss +12 -0
  20. package/dist/tokens/tailwind/tokens.cjs +8 -0
  21. package/package.json +2 -2
  22. package/src/scss/variables.scss +0 -3
  23. package/src/tokens/build/css/tokens.css +12 -0
  24. package/src/tokens/build/css/tokens.dark.css +12 -0
  25. package/src/tokens/build/docs/tokens-tailwind-docs.dark.json +712 -0
  26. package/src/tokens/build/docs/tokens-tailwind-docs.json +712 -0
  27. package/src/tokens/build/figma/constants.tokens.json +164 -10
  28. package/src/tokens/build/figma/semantic.tokens.json +13 -0
  29. package/src/tokens/build/js/tokens.dark.js +39 -0
  30. package/src/tokens/build/js/tokens.js +39 -0
  31. package/src/tokens/build/json/tokens.dark.json +470 -20
  32. package/src/tokens/build/json/tokens.json +470 -20
  33. package/src/tokens/build/scss/_tokens.dark.scss +12 -0
  34. package/src/tokens/build/scss/_tokens.scss +12 -0
  35. package/src/tokens/build/scss/_tokens_custom_properties.scss +12 -0
  36. package/src/tokens/build/tailwind/tokens.cjs +34 -0
  37. package/src/tokens/constant/font.tokens.json +136 -0
  38. package/src/tokens/constant/line_height.tokens.json +30 -10
  39. package/src/tokens/semantic/font.tokens.json +15 -0
  40. package/tailwind.defaults.js +8 -21
package/src/tokens/build/figma/constants.tokens.json CHANGED
@@ -1719,6 +1719,140 @@
1719
1719
  }
1720
1720
  }
1721
1721
  },
1722
+ "font": {
1723
+ "family": {
1724
+ "regular": {
1725
+ "$value": [
1726
+ "var(--default-regular-font, 'GitLab Sans')",
1727
+ "-apple-system",
1728
+ "BlinkMacSystemFont",
1729
+ "'Segoe UI'",
1730
+ "Roboto",
1731
+ "'Noto Sans'",
1732
+ "Ubuntu",
1733
+ "Cantarell",
1734
+ "'Helvetica Neue'",
1735
+ "sans-serif",
1736
+ "'Apple Color Emoji'",
1737
+ "'Segoe UI Emoji'",
1738
+ "'Segoe UI Symbol'",
1739
+ "'Noto Color Emoji'"
1740
+ ],
1741
+ "$type": "fontFamily",
1742
+ "$extensions": {
1743
+ "com.figma.scope": [
1744
+ "FONT_FAMILY"
1745
+ ]
1746
+ }
1747
+ },
1748
+ "monospace": {
1749
+ "$value": [
1750
+ "var(--default-mono-font, 'GitLab Mono')",
1751
+ "'JetBrains Mono'",
1752
+ "Menlo",
1753
+ "'DejaVu Sans Mono'",
1754
+ "'Liberation Mono'",
1755
+ "Consolas",
1756
+ "'Ubuntu Mono'",
1757
+ "'Courier New'",
1758
+ "'andale mono'",
1759
+ "'lucida console'",
1760
+ "monospace"
1761
+ ],
1762
+ "$type": "fontFamily",
1763
+ "$extensions": {
1764
+ "com.figma.scope": [
1765
+ "FONT_FAMILY"
1766
+ ]
1767
+ }
1768
+ }
1769
+ },
1770
+ "size": {
1771
+ "xs": {
1772
+ "$value": "0.625rem",
1773
+ "$type": "dimension",
1774
+ "$extensions": {
1775
+ "com.figma.scope": [
1776
+ "FONT_SIZE"
1777
+ ]
1778
+ }
1779
+ },
1780
+ "sm": {
1781
+ "$value": "0.75rem",
1782
+ "$type": "dimension",
1783
+ "$extensions": {
1784
+ "com.figma.scope": [
1785
+ "FONT_SIZE"
1786
+ ]
1787
+ }
1788
+ },
1789
+ "md": {
1790
+ "$value": "0.875rem",
1791
+ "$type": "dimension",
1792
+ "$extensions": {
1793
+ "com.figma.scope": [
1794
+ "FONT_SIZE"
1795
+ ]
1796
+ }
1797
+ },
1798
+ "lg": {
1799
+ "$value": "1rem",
1800
+ "$type": "dimension",
1801
+ "$extensions": {
1802
+ "com.figma.scope": [
1803
+ "FONT_SIZE"
1804
+ ]
1805
+ }
1806
+ }
1807
+ },
1808
+ "weight": {
1809
+ "100": {
1810
+ "$value": "100",
1811
+ "$type": "fontWeight",
1812
+ "$extensions": {
1813
+ "com.figma.scope": [
1814
+ "FONT_WEIGHT"
1815
+ ]
1816
+ }
1817
+ },
1818
+ "300": {
1819
+ "$value": "300",
1820
+ "$type": "fontWeight",
1821
+ "$extensions": {
1822
+ "com.figma.scope": [
1823
+ "FONT_WEIGHT"
1824
+ ]
1825
+ }
1826
+ },
1827
+ "normal": {
1828
+ "$value": "400",
1829
+ "$type": "fontWeight",
1830
+ "$extensions": {
1831
+ "com.figma.scope": [
1832
+ "FONT_WEIGHT"
1833
+ ]
1834
+ }
1835
+ },
1836
+ "semibold": {
1837
+ "$value": "500",
1838
+ "$type": "fontWeight",
1839
+ "$extensions": {
1840
+ "com.figma.scope": [
1841
+ "FONT_WEIGHT"
1842
+ ]
1843
+ }
1844
+ },
1845
+ "bold": {
1846
+ "$value": "600",
1847
+ "$type": "fontWeight",
1848
+ "$extensions": {
1849
+ "com.figma.scope": [
1850
+ "FONT_WEIGHT"
1851
+ ]
1852
+ }
1853
+ }
1854
+ }
1855
+ },
1722
1856
  "line-height": {
1723
1857
  "12": {
1724
1858
  "$value": {
@@ -1727,7 +1861,9 @@
1727
1861
  },
1728
1862
  "$type": "dimension",
1729
1863
  "$extensions": {
1730
- "com.figma.scope": []
1864
+ "com.figma.scope": [
1865
+ "LINE_HEIGHT"
1866
+ ]
1731
1867
  }
1732
1868
  },
1733
1869
  "16": {
@@ -1737,7 +1873,9 @@
1737
1873
  },
1738
1874
  "$type": "dimension",
1739
1875
  "$extensions": {
1740
- "com.figma.scope": []
1876
+ "com.figma.scope": [
1877
+ "LINE_HEIGHT"
1878
+ ]
1741
1879
  }
1742
1880
  },
1743
1881
  "20": {
@@ -1747,7 +1885,9 @@
1747
1885
  },
1748
1886
  "$type": "dimension",
1749
1887
  "$extensions": {
1750
- "com.figma.scope": []
1888
+ "com.figma.scope": [
1889
+ "LINE_HEIGHT"
1890
+ ]
1751
1891
  }
1752
1892
  },
1753
1893
  "24": {
@@ -1757,7 +1897,9 @@
1757
1897
  },
1758
1898
  "$type": "dimension",
1759
1899
  "$extensions": {
1760
- "com.figma.scope": []
1900
+ "com.figma.scope": [
1901
+ "LINE_HEIGHT"
1902
+ ]
1761
1903
  }
1762
1904
  },
1763
1905
  "28": {
@@ -1767,7 +1909,9 @@
1767
1909
  },
1768
1910
  "$type": "dimension",
1769
1911
  "$extensions": {
1770
- "com.figma.scope": []
1912
+ "com.figma.scope": [
1913
+ "LINE_HEIGHT"
1914
+ ]
1771
1915
  }
1772
1916
  },
1773
1917
  "32": {
@@ -1777,7 +1921,9 @@
1777
1921
  },
1778
1922
  "$type": "dimension",
1779
1923
  "$extensions": {
1780
- "com.figma.scope": []
1924
+ "com.figma.scope": [
1925
+ "LINE_HEIGHT"
1926
+ ]
1781
1927
  }
1782
1928
  },
1783
1929
  "36": {
@@ -1787,7 +1933,9 @@
1787
1933
  },
1788
1934
  "$type": "dimension",
1789
1935
  "$extensions": {
1790
- "com.figma.scope": []
1936
+ "com.figma.scope": [
1937
+ "LINE_HEIGHT"
1938
+ ]
1791
1939
  }
1792
1940
  },
1793
1941
  "42": {
@@ -1797,7 +1945,9 @@
1797
1945
  },
1798
1946
  "$type": "dimension",
1799
1947
  "$extensions": {
1800
- "com.figma.scope": []
1948
+ "com.figma.scope": [
1949
+ "LINE_HEIGHT"
1950
+ ]
1801
1951
  }
1802
1952
  },
1803
1953
  "44": {
@@ -1807,7 +1957,9 @@
1807
1957
  },
1808
1958
  "$type": "dimension",
1809
1959
  "$extensions": {
1810
- "com.figma.scope": []
1960
+ "com.figma.scope": [
1961
+ "LINE_HEIGHT"
1962
+ ]
1811
1963
  }
1812
1964
  },
1813
1965
  "52": {
@@ -1817,7 +1969,9 @@
1817
1969
  },
1818
1970
  "$type": "dimension",
1819
1971
  "$extensions": {
1820
- "com.figma.scope": []
1972
+ "com.figma.scope": [
1973
+ "LINE_HEIGHT"
1974
+ ]
1821
1975
  }
1822
1976
  }
1823
1977
  },
package/src/tokens/build/figma/semantic.tokens.json CHANGED
@@ -1823,6 +1823,19 @@
1823
1823
  }
1824
1824
  }
1825
1825
  },
1826
+ "font": {
1827
+ "size": {
1828
+ "base": {
1829
+ "$value": "{font.size.md}",
1830
+ "$type": "dimension",
1831
+ "$extensions": {
1832
+ "com.figma.scope": [
1833
+ "FONT_SIZE"
1834
+ ]
1835
+ }
1836
+ }
1837
+ }
1838
+ },
1826
1839
  "highlight": {
1827
1840
  "match": {
1828
1841
  "background": {
package/src/tokens/build/js/tokens.dark.js CHANGED
@@ -243,6 +243,45 @@ export const GL_COLOR_BRAND_GRAY_03 = '#74717a';
243
243
  export const GL_COLOR_BRAND_GRAY_04 = '#45424d';
244
244
  export const GL_COLOR_BRAND_GRAY_05 = '#2b2838';
245
245
  export const GL_COLOR_BRAND_PINK_01G = '#ffb9c9';
246
+ export const GL_FONT_FAMILY_REGULAR = [
247
+ "var(--default-regular-font, 'GitLab Sans')",
248
+ '-apple-system',
249
+ 'BlinkMacSystemFont',
250
+ "'Segoe UI'",
251
+ 'Roboto',
252
+ "'Noto Sans'",
253
+ 'Ubuntu',
254
+ 'Cantarell',
255
+ "'Helvetica Neue'",
256
+ 'sans-serif',
257
+ "'Apple Color Emoji'",
258
+ "'Segoe UI Emoji'",
259
+ "'Segoe UI Symbol'",
260
+ "'Noto Color Emoji'",
261
+ ];
262
+ export const GL_FONT_FAMILY_MONOSPACE = [
263
+ "var(--default-mono-font, 'GitLab Mono')",
264
+ "'JetBrains Mono'",
265
+ 'Menlo',
266
+ "'DejaVu Sans Mono'",
267
+ "'Liberation Mono'",
268
+ 'Consolas',
269
+ "'Ubuntu Mono'",
270
+ "'Courier New'",
271
+ "'andale mono'",
272
+ "'lucida console'",
273
+ 'monospace',
274
+ ];
275
+ export const GL_FONT_SIZE_XS = '0.625rem';
276
+ export const GL_FONT_SIZE_SM = '0.75rem';
277
+ export const GL_FONT_SIZE_MD = '0.875rem';
278
+ export const GL_FONT_SIZE_LG = '1rem';
279
+ export const GL_FONT_SIZE_BASE = '0.875rem';
280
+ export const GL_FONT_WEIGHT_100 = '100';
281
+ export const GL_FONT_WEIGHT_300 = '300';
282
+ export const GL_FONT_WEIGHT_NORMAL = '400';
283
+ export const GL_FONT_WEIGHT_SEMIBOLD = '500';
284
+ export const GL_FONT_WEIGHT_BOLD = '600';
246
285
  export const GL_LINE_HEIGHT_12 = '0.75rem';
247
286
  export const GL_LINE_HEIGHT_16 = '1rem';
248
287
  export const GL_LINE_HEIGHT_20 = '1.25rem';
package/src/tokens/build/js/tokens.js CHANGED
@@ -243,6 +243,45 @@ export const GL_COLOR_BRAND_GRAY_03 = '#74717a';
243
243
  export const GL_COLOR_BRAND_GRAY_04 = '#45424d';
244
244
  export const GL_COLOR_BRAND_GRAY_05 = '#2b2838';
245
245
  export const GL_COLOR_BRAND_PINK_01G = '#ffb9c9';
246
+ export const GL_FONT_FAMILY_REGULAR = [
247
+ "var(--default-regular-font, 'GitLab Sans')",
248
+ '-apple-system',
249
+ 'BlinkMacSystemFont',
250
+ "'Segoe UI'",
251
+ 'Roboto',
252
+ "'Noto Sans'",
253
+ 'Ubuntu',
254
+ 'Cantarell',
255
+ "'Helvetica Neue'",
256
+ 'sans-serif',
257
+ "'Apple Color Emoji'",
258
+ "'Segoe UI Emoji'",
259
+ "'Segoe UI Symbol'",
260
+ "'Noto Color Emoji'",
261
+ ];
262
+ export const GL_FONT_FAMILY_MONOSPACE = [
263
+ "var(--default-mono-font, 'GitLab Mono')",
264
+ "'JetBrains Mono'",
265
+ 'Menlo',
266
+ "'DejaVu Sans Mono'",
267
+ "'Liberation Mono'",
268
+ 'Consolas',
269
+ "'Ubuntu Mono'",
270
+ "'Courier New'",
271
+ "'andale mono'",
272
+ "'lucida console'",
273
+ 'monospace',
274
+ ];
275
+ export const GL_FONT_SIZE_XS = '0.625rem';
276
+ export const GL_FONT_SIZE_SM = '0.75rem';
277
+ export const GL_FONT_SIZE_MD = '0.875rem';
278
+ export const GL_FONT_SIZE_LG = '1rem';
279
+ export const GL_FONT_SIZE_BASE = '0.875rem';
280
+ export const GL_FONT_WEIGHT_100 = '100';
281
+ export const GL_FONT_WEIGHT_300 = '300';
282
+ export const GL_FONT_WEIGHT_NORMAL = '400';
283
+ export const GL_FONT_WEIGHT_SEMIBOLD = '500';
284
+ export const GL_FONT_WEIGHT_BOLD = '600';
246
285
  export const GL_LINE_HEIGHT_12 = '0.75rem';
247
286
  export const GL_LINE_HEIGHT_16 = '1rem';
248
287
  export const GL_LINE_HEIGHT_20 = '1.25rem';