Add utility typography CSS vars to main bundle (#2438)

* update main bundle

* Create small-nails-matter.md

.changeset/small-nails-matter.md

@@ -0,0 +1,5 @@
+---
+"@primer/css": patch
+---
+
+Add utility typography CSS vars to main bundle

docs/.storybook/preview.js

@@ -4,15 +4,15 @@ import '../../src/base/index.scss'
 import '../src/stories/helpers/storybook-styles.scss'
 // temporary import until primitives moves to core bundle
 // importing the index from /css didn't play nice with Storybook
-import '../../node_modules/@primer/primitives/tokens-v2-private/css/tokens/base/size/size.css'
-import '../../node_modules/@primer/primitives/tokens-v2-private/css/tokens/base/typography/typography.css'
-import '../../node_modules/@primer/primitives/tokens-v2-private/css/tokens/functional/size/border.css'
-import '../../node_modules/@primer/primitives/tokens-v2-private/css/tokens/functional/size/breakpoints.css'
-import '../../node_modules/@primer/primitives/tokens-v2-private/css/tokens/functional/size/size-coarse.css'
-import '../../node_modules/@primer/primitives/tokens-v2-private/css/tokens/functional/size/size-fine.css'
-import '../../node_modules/@primer/primitives/tokens-v2-private/css/tokens/functional/size/size.css'
-import '../../node_modules/@primer/primitives/tokens-v2-private/css/tokens/functional/size/viewport.css'
-import '../../node_modules/@primer/primitives/tokens-v2-private/css/tokens/functional/typography/typography.css'
+import '@primer/primitives/tokens-next-private/css/base/size/size.css';
+import '@primer/primitives/tokens-next-private/css/base/typography/typography.css';
+import '@primer/primitives/tokens-next-private/css/functional/size/border.css';
+import '@primer/primitives/tokens-next-private/css/functional/size/breakpoints.css';
+import '@primer/primitives/tokens-next-private/css/functional/size/size-coarse.css';
+import '@primer/primitives/tokens-next-private/css/functional/size/size-fine.css';
+import '@primer/primitives/tokens-next-private/css/functional/size/size.css';
+import '@primer/primitives/tokens-next-private/css/functional/size/viewport.css';
+import '@primer/primitives/tokens-next-private/css/functional/typography/typography.css';
 import renderToHTML from '../src/stories/helpers/code-snippet-html-helper'
 
 const customViewports = {

docs/package.json

@@ -15,7 +15,7 @@
     "@primer/gatsby-theme-doctocat": "4.4.0",
     "@primer/octicons": "17.0.0",
     "@primer/octicons-react": "17.0.0",
-    "@primer/primitives": "7.8.3",
+    "@primer/primitives": "7.11.7",
     "@primer/view-components": "^0.0.114",
     "@svgr/webpack": "5.5.0",
     "autoprefixer": "10.4.2",