From 7d102598f94d132e9d6c8aaf17de40b32f1d2a3d Mon Sep 17 00:00:00 2001
From: Adam Wathan <adam.wathan@gmail.com>
Date: Sat, 17 Oct 2020 20:45:10 -0400
Subject: [PATCH] Add line-heights to font-size utilities by default

---
 .../fixtures/tailwind-output-important.css    | 50 +++++++++++++++++++
 .../tailwind-output-no-color-opacity.css      | 50 +++++++++++++++++++
 __tests__/fixtures/tailwind-output.css        | 50 +++++++++++++++++++
 src/featureFlags.js                           |  2 +-
 src/flagged/defaultLineHeights.js             | 16 ------
 src/util/getAllConfigs.js                     |  2 -
 stubs/defaultConfig.stub.js                   | 20 ++++----
 7 files changed, 161 insertions(+), 29 deletions(-)
 delete mode 100644 src/flagged/defaultLineHeights.js

diff --git a/__tests__/fixtures/tailwind-output-important.css b/__tests__/fixtures/tailwind-output-important.css
index 8fb554545..0286fb296 100644
--- a/__tests__/fixtures/tailwind-output-important.css
+++ b/__tests__/fixtures/tailwind-output-important.css
@@ -9804,42 +9804,52 @@ video {
 
 .text-xs {
   font-size: 0.75rem !important;
+  line-height: 1rem !important;
 }
 
 .text-sm {
   font-size: 0.875rem !important;
+  line-height: 1.25rem !important;
 }
 
 .text-base {
   font-size: 1rem !important;
+  line-height: 1.5rem !important;
 }
 
 .text-lg {
   font-size: 1.125rem !important;
+  line-height: 1.75rem !important;
 }
 
 .text-xl {
   font-size: 1.25rem !important;
+  line-height: 1.75rem !important;
 }
 
 .text-2xl {
   font-size: 1.5rem !important;
+  line-height: 2rem !important;
 }
 
 .text-3xl {
   font-size: 1.875rem !important;
+  line-height: 2.25rem !important;
 }
 
 .text-4xl {
   font-size: 2.25rem !important;
+  line-height: 2.5rem !important;
 }
 
 .text-5xl {
   font-size: 3rem !important;
+  line-height: 1 !important;
 }
 
 .text-6xl {
   font-size: 4rem !important;
+  line-height: 1 !important;
 }
 
 .leading-3 {
@@ -27142,42 +27152,52 @@ video {
 
   .sm\:text-xs {
     font-size: 0.75rem !important;
+    line-height: 1rem !important;
   }
 
   .sm\:text-sm {
     font-size: 0.875rem !important;
+    line-height: 1.25rem !important;
   }
 
   .sm\:text-base {
     font-size: 1rem !important;
+    line-height: 1.5rem !important;
   }
 
   .sm\:text-lg {
     font-size: 1.125rem !important;
+    line-height: 1.75rem !important;
   }
 
   .sm\:text-xl {
     font-size: 1.25rem !important;
+    line-height: 1.75rem !important;
   }
 
   .sm\:text-2xl {
     font-size: 1.5rem !important;
+    line-height: 2rem !important;
   }
 
   .sm\:text-3xl {
     font-size: 1.875rem !important;
+    line-height: 2.25rem !important;
   }
 
   .sm\:text-4xl {
     font-size: 2.25rem !important;
+    line-height: 2.5rem !important;
   }
 
   .sm\:text-5xl {
     font-size: 3rem !important;
+    line-height: 1 !important;
   }
 
   .sm\:text-6xl {
     font-size: 4rem !important;
+    line-height: 1 !important;
   }
 
   .sm\:leading-3 {
@@ -44450,42 +44470,52 @@ video {
 
   .md\:text-xs {
     font-size: 0.75rem !important;
+    line-height: 1rem !important;
   }
 
   .md\:text-sm {
     font-size: 0.875rem !important;
+    line-height: 1.25rem !important;
   }
 
   .md\:text-base {
     font-size: 1rem !important;
+    line-height: 1.5rem !important;
   }
 
   .md\:text-lg {
     font-size: 1.125rem !important;
+    line-height: 1.75rem !important;
   }
 
   .md\:text-xl {
     font-size: 1.25rem !important;
+    line-height: 1.75rem !important;
   }
 
   .md\:text-2xl {
     font-size: 1.5rem !important;
+    line-height: 2rem !important;
   }
 
   .md\:text-3xl {
     font-size: 1.875rem !important;
+    line-height: 2.25rem !important;
   }
 
   .md\:text-4xl {
     font-size: 2.25rem !important;
+    line-height: 2.5rem !important;
   }
 
   .md\:text-5xl {
     font-size: 3rem !important;
+    line-height: 1 !important;
   }
 
   .md\:text-6xl {
     font-size: 4rem !important;
+    line-height: 1 !important;
   }
 
   .md\:leading-3 {
@@ -61758,42 +61788,52 @@ video {
 
   .lg\:text-xs {
     font-size: 0.75rem !important;
+    line-height: 1rem !important;
   }
 
   .lg\:text-sm {
     font-size: 0.875rem !important;
+    line-height: 1.25rem !important;
   }
 
   .lg\:text-base {
     font-size: 1rem !important;
+    line-height: 1.5rem !important;
   }
 
   .lg\:text-lg {
     font-size: 1.125rem !important;
+    line-height: 1.75rem !important;
   }
 
   .lg\:text-xl {
     font-size: 1.25rem !important;
+    line-height: 1.75rem !important;
   }
 
   .lg\:text-2xl {
     font-size: 1.5rem !important;
+    line-height: 2rem !important;
   }
 
   .lg\:text-3xl {
     font-size: 1.875rem !important;
+    line-height: 2.25rem !important;
   }
 
   .lg\:text-4xl {
     font-size: 2.25rem !important;
+    line-height: 2.5rem !important;
   }
 
   .lg\:text-5xl {
     font-size: 3rem !important;
+    line-height: 1 !important;
   }
 
   .lg\:text-6xl {
     font-size: 4rem !important;
+    line-height: 1 !important;
   }
 
   .lg\:leading-3 {
@@ -79066,42 +79106,52 @@ video {
 
   .xl\:text-xs {
     font-size: 0.75rem !important;
+    line-height: 1rem !important;
   }
 
   .xl\:text-sm {
     font-size: 0.875rem !important;
+    line-height: 1.25rem !important;
   }
 
   .xl\:text-base {
     font-size: 1rem !important;
+    line-height: 1.5rem !important;
   }
 
   .xl\:text-lg {
     font-size: 1.125rem !important;
+    line-height: 1.75rem !important;
   }
 
   .xl\:text-xl {
     font-size: 1.25rem !important;
+    line-height: 1.75rem !important;
   }
 
   .xl\:text-2xl {
     font-size: 1.5rem !important;
+    line-height: 2rem !important;
   }
 
   .xl\:text-3xl {
     font-size: 1.875rem !important;
+    line-height: 2.25rem !important;
   }
 
   .xl\:text-4xl {
     font-size: 2.25rem !important;
+    line-height: 2.5rem !important;
   }
 
   .xl\:text-5xl {
     font-size: 3rem !important;
+    line-height: 1 !important;
   }
 
   .xl\:text-6xl {
     font-size: 4rem !important;
+    line-height: 1 !important;
   }
 
   .xl\:leading-3 {
diff --git a/__tests__/fixtures/tailwind-output-no-color-opacity.css b/__tests__/fixtures/tailwind-output-no-color-opacity.css
index 0a3606bc4..0859414a5 100644
--- a/__tests__/fixtures/tailwind-output-no-color-opacity.css
+++ b/__tests__/fixtures/tailwind-output-no-color-opacity.css
@@ -9020,42 +9020,52 @@ video {
 
 .text-xs {
   font-size: 0.75rem;
+  line-height: 1rem;
 }
 
 .text-sm {
   font-size: 0.875rem;
+  line-height: 1.25rem;
 }
 
 .text-base {
   font-size: 1rem;
+  line-height: 1.5rem;
 }
 
 .text-lg {
   font-size: 1.125rem;
+  line-height: 1.75rem;
 }
 
 .text-xl {
   font-size: 1.25rem;
+  line-height: 1.75rem;
 }
 
 .text-2xl {
   font-size: 1.5rem;
+  line-height: 2rem;
 }
 
 .text-3xl {
   font-size: 1.875rem;
+  line-height: 2.25rem;
 }
 
 .text-4xl {
   font-size: 2.25rem;
+  line-height: 2.5rem;
 }
 
 .text-5xl {
   font-size: 3rem;
+  line-height: 1;
 }
 
 .text-6xl {
   font-size: 4rem;
+  line-height: 1;
 }
 
 .leading-3 {
@@ -25014,42 +25024,52 @@ video {
 
   .sm\:text-xs {
     font-size: 0.75rem;
+    line-height: 1rem;
   }
 
   .sm\:text-sm {
     font-size: 0.875rem;
+    line-height: 1.25rem;
   }
 
   .sm\:text-base {
     font-size: 1rem;
+    line-height: 1.5rem;
   }
 
   .sm\:text-lg {
     font-size: 1.125rem;
+    line-height: 1.75rem;
   }
 
   .sm\:text-xl {
     font-size: 1.25rem;
+    line-height: 1.75rem;
   }
 
   .sm\:text-2xl {
     font-size: 1.5rem;
+    line-height: 2rem;
   }
 
   .sm\:text-3xl {
     font-size: 1.875rem;
+    line-height: 2.25rem;
   }
 
   .sm\:text-4xl {
     font-size: 2.25rem;
+    line-height: 2.5rem;
   }
 
   .sm\:text-5xl {
     font-size: 3rem;
+    line-height: 1;
   }
 
   .sm\:text-6xl {
     font-size: 4rem;
+    line-height: 1;
   }
 
   .sm\:leading-3 {
@@ -40978,42 +40998,52 @@ video {
 
   .md\:text-xs {
     font-size: 0.75rem;
+    line-height: 1rem;
   }
 
   .md\:text-sm {
     font-size: 0.875rem;
+    line-height: 1.25rem;
   }
 
   .md\:text-base {
     font-size: 1rem;
+    line-height: 1.5rem;
   }
 
   .md\:text-lg {
     font-size: 1.125rem;
+    line-height: 1.75rem;
   }
 
   .md\:text-xl {
     font-size: 1.25rem;
+    line-height: 1.75rem;
   }
 
   .md\:text-2xl {
     font-size: 1.5rem;
+    line-height: 2rem;
   }
 
   .md\:text-3xl {
     font-size: 1.875rem;
+    line-height: 2.25rem;
   }
 
   .md\:text-4xl {
     font-size: 2.25rem;
+    line-height: 2.5rem;
   }
 
   .md\:text-5xl {
     font-size: 3rem;
+    line-height: 1;
   }
 
   .md\:text-6xl {
     font-size: 4rem;
+    line-height: 1;
   }
 
   .md\:leading-3 {
@@ -56942,42 +56972,52 @@ video {
 
   .lg\:text-xs {
     font-size: 0.75rem;
+    line-height: 1rem;
   }
 
   .lg\:text-sm {
     font-size: 0.875rem;
+    line-height: 1.25rem;
   }
 
   .lg\:text-base {
     font-size: 1rem;
+    line-height: 1.5rem;
   }
 
   .lg\:text-lg {
     font-size: 1.125rem;
+    line-height: 1.75rem;
   }
 
   .lg\:text-xl {
     font-size: 1.25rem;
+    line-height: 1.75rem;
   }
 
   .lg\:text-2xl {
     font-size: 1.5rem;
+    line-height: 2rem;
   }
 
   .lg\:text-3xl {
     font-size: 1.875rem;
+    line-height: 2.25rem;
   }
 
   .lg\:text-4xl {
     font-size: 2.25rem;
+    line-height: 2.5rem;
   }
 
   .lg\:text-5xl {
     font-size: 3rem;
+    line-height: 1;
   }
 
   .lg\:text-6xl {
     font-size: 4rem;
+    line-height: 1;
   }
 
   .lg\:leading-3 {
@@ -72906,42 +72946,52 @@ video {
 
   .xl\:text-xs {
     font-size: 0.75rem;
+    line-height: 1rem;
   }
 
   .xl\:text-sm {
     font-size: 0.875rem;
+    line-height: 1.25rem;
   }
 
   .xl\:text-base {
     font-size: 1rem;
+    line-height: 1.5rem;
   }
 
   .xl\:text-lg {
     font-size: 1.125rem;
+    line-height: 1.75rem;
   }
 
   .xl\:text-xl {
     font-size: 1.25rem;
+    line-height: 1.75rem;
   }
 
   .xl\:text-2xl {
     font-size: 1.5rem;
+    line-height: 2rem;
   }
 
   .xl\:text-3xl {
     font-size: 1.875rem;
+    line-height: 2.25rem;
   }
 
   .xl\:text-4xl {
     font-size: 2.25rem;
+    line-height: 2.5rem;
   }
 
   .xl\:text-5xl {
     font-size: 3rem;
+    line-height: 1;
   }
 
   .xl\:text-6xl {
     font-size: 4rem;
+    line-height: 1;
   }
 
   .xl\:leading-3 {
diff --git a/__tests__/fixtures/tailwind-output.css b/__tests__/fixtures/tailwind-output.css
index 98cb16171..611ad16fb 100644
--- a/__tests__/fixtures/tailwind-output.css
+++ b/__tests__/fixtures/tailwind-output.css
@@ -9804,42 +9804,52 @@ video {
 
 .text-xs {
   font-size: 0.75rem;
+  line-height: 1rem;
 }
 
 .text-sm {
   font-size: 0.875rem;
+  line-height: 1.25rem;
 }
 
 .text-base {
   font-size: 1rem;
+  line-height: 1.5rem;
 }
 
 .text-lg {
   font-size: 1.125rem;
+  line-height: 1.75rem;
 }
 
 .text-xl {
   font-size: 1.25rem;
+  line-height: 1.75rem;
 }
 
 .text-2xl {
   font-size: 1.5rem;
+  line-height: 2rem;
 }
 
 .text-3xl {
   font-size: 1.875rem;
+  line-height: 2.25rem;
 }
 
 .text-4xl {
   font-size: 2.25rem;
+  line-height: 2.5rem;
 }
 
 .text-5xl {
   font-size: 3rem;
+  line-height: 1;
 }
 
 .text-6xl {
   font-size: 4rem;
+  line-height: 1;
 }
 
 .leading-3 {
@@ -27142,42 +27152,52 @@ video {
 
   .sm\:text-xs {
     font-size: 0.75rem;
+    line-height: 1rem;
   }
 
   .sm\:text-sm {
     font-size: 0.875rem;
+    line-height: 1.25rem;
   }
 
   .sm\:text-base {
     font-size: 1rem;
+    line-height: 1.5rem;
   }
 
   .sm\:text-lg {
     font-size: 1.125rem;
+    line-height: 1.75rem;
   }
 
   .sm\:text-xl {
     font-size: 1.25rem;
+    line-height: 1.75rem;
   }
 
   .sm\:text-2xl {
     font-size: 1.5rem;
+    line-height: 2rem;
   }
 
   .sm\:text-3xl {
     font-size: 1.875rem;
+    line-height: 2.25rem;
   }
 
   .sm\:text-4xl {
     font-size: 2.25rem;
+    line-height: 2.5rem;
   }
 
   .sm\:text-5xl {
     font-size: 3rem;
+    line-height: 1;
   }
 
   .sm\:text-6xl {
     font-size: 4rem;
+    line-height: 1;
   }
 
   .sm\:leading-3 {
@@ -44450,42 +44470,52 @@ video {
 
   .md\:text-xs {
     font-size: 0.75rem;
+    line-height: 1rem;
   }
 
   .md\:text-sm {
     font-size: 0.875rem;
+    line-height: 1.25rem;
   }
 
   .md\:text-base {
     font-size: 1rem;
+    line-height: 1.5rem;
   }
 
   .md\:text-lg {
     font-size: 1.125rem;
+    line-height: 1.75rem;
   }
 
   .md\:text-xl {
     font-size: 1.25rem;
+    line-height: 1.75rem;
   }
 
   .md\:text-2xl {
     font-size: 1.5rem;
+    line-height: 2rem;
   }
 
   .md\:text-3xl {
     font-size: 1.875rem;
+    line-height: 2.25rem;
   }
 
   .md\:text-4xl {
     font-size: 2.25rem;
+    line-height: 2.5rem;
   }
 
   .md\:text-5xl {
     font-size: 3rem;
+    line-height: 1;
   }
 
   .md\:text-6xl {
     font-size: 4rem;
+    line-height: 1;
   }
 
   .md\:leading-3 {
@@ -61758,42 +61788,52 @@ video {
 
   .lg\:text-xs {
     font-size: 0.75rem;
+    line-height: 1rem;
   }
 
   .lg\:text-sm {
     font-size: 0.875rem;
+    line-height: 1.25rem;
   }
 
   .lg\:text-base {
     font-size: 1rem;
+    line-height: 1.5rem;
   }
 
   .lg\:text-lg {
     font-size: 1.125rem;
+    line-height: 1.75rem;
   }
 
   .lg\:text-xl {
     font-size: 1.25rem;
+    line-height: 1.75rem;
   }
 
   .lg\:text-2xl {
     font-size: 1.5rem;
+    line-height: 2rem;
   }
 
   .lg\:text-3xl {
     font-size: 1.875rem;
+    line-height: 2.25rem;
   }
 
   .lg\:text-4xl {
     font-size: 2.25rem;
+    line-height: 2.5rem;
   }
 
   .lg\:text-5xl {
     font-size: 3rem;
+    line-height: 1;
   }
 
   .lg\:text-6xl {
     font-size: 4rem;
+    line-height: 1;
   }
 
   .lg\:leading-3 {
@@ -79066,42 +79106,52 @@ video {
 
   .xl\:text-xs {
     font-size: 0.75rem;
+    line-height: 1rem;
   }
 
   .xl\:text-sm {
     font-size: 0.875rem;
+    line-height: 1.25rem;
   }
 
   .xl\:text-base {
     font-size: 1rem;
+    line-height: 1.5rem;
   }
 
   .xl\:text-lg {
     font-size: 1.125rem;
+    line-height: 1.75rem;
   }
 
   .xl\:text-xl {
     font-size: 1.25rem;
+    line-height: 1.75rem;
   }
 
   .xl\:text-2xl {
     font-size: 1.5rem;
+    line-height: 2rem;
   }
 
   .xl\:text-3xl {
     font-size: 1.875rem;
+    line-height: 2.25rem;
   }
 
   .xl\:text-4xl {
     font-size: 2.25rem;
+    line-height: 2.5rem;
   }
 
   .xl\:text-5xl {
     font-size: 3rem;
+    line-height: 1;
   }
 
   .xl\:text-6xl {
     font-size: 4rem;
+    line-height: 1;
   }
 
   .xl\:leading-3 {
diff --git a/src/featureFlags.js b/src/featureFlags.js
index 56713ee3a..ce75062a3 100644
--- a/src/featureFlags.js
+++ b/src/featureFlags.js
@@ -3,7 +3,7 @@ import chalk from 'chalk'
 import log from './util/log'
 
 const featureFlags = {
-  future: ['defaultLineHeights', 'standardFontWeights', 'moveTruncateToTextOverflow'],
+  future: ['standardFontWeights', 'moveTruncateToTextOverflow'],
   experimental: [
     'uniformColorPalette',
     'extendedSpacingScale',
diff --git a/src/flagged/defaultLineHeights.js b/src/flagged/defaultLineHeights.js
deleted file mode 100644
index 1fd9e6660..000000000
--- a/src/flagged/defaultLineHeights.js
+++ /dev/null
@@ -1,16 +0,0 @@
-export default {
-  theme: {
-    fontSize: {
-      xs: ['0.75rem', { lineHeight: '1rem' }],
-      sm: ['0.875rem', { lineHeight: '1.25rem' }],
-      base: ['1rem', { lineHeight: '1.5rem' }],
-      lg: ['1.125rem', { lineHeight: '1.75rem' }],
-      xl: ['1.25rem', { lineHeight: '1.75rem' }],
-      '2xl': ['1.5rem', { lineHeight: '2rem' }],
-      '3xl': ['1.875rem', { lineHeight: '2.25rem' }],
-      '4xl': ['2.25rem', { lineHeight: '2.5rem' }],
-      '5xl': ['3rem', { lineHeight: '1' }],
-      '6xl': ['4rem', { lineHeight: '1' }],
-    },
-  },
-}
diff --git a/src/util/getAllConfigs.js b/src/util/getAllConfigs.js
index 4005d817b..7b2049726 100644
--- a/src/util/getAllConfigs.js
+++ b/src/util/getAllConfigs.js
@@ -2,7 +2,6 @@ import defaultConfig from '../../stubs/defaultConfig.stub.js'
 import { flagEnabled } from '../featureFlags'
 import uniformColorPalette from '../flagged/uniformColorPalette.js'
 import extendedSpacingScale from '../flagged/extendedSpacingScale.js'
-import defaultLineHeights from '../flagged/defaultLineHeights.js'
 import extendedFontSizeScale from '../flagged/extendedFontSizeScale.js'
 import darkModeVariant from '../flagged/darkModeVariant.js'
 import standardFontWeights from '../flagged/standardFontWeights'
@@ -17,7 +16,6 @@ export default function getAllConfigs(config, defaultPresets = [defaultConfig])
   const features = {
     uniformColorPalette,
     extendedSpacingScale,
-    defaultLineHeights,
     extendedFontSizeScale,
     standardFontWeights,
     darkModeVariant,
diff --git a/stubs/defaultConfig.stub.js b/stubs/defaultConfig.stub.js
index 2b51dc04e..cd262395b 100644
--- a/stubs/defaultConfig.stub.js
+++ b/stubs/defaultConfig.stub.js
@@ -263,16 +263,16 @@ module.exports = {
       mono: ['ui-monospace', 'SFMono-Regular', 'Menlo', 'Monaco', 'Consolas', '"Liberation Mono"', '"Courier New"', 'monospace'],
     },
     fontSize: {
-      xs: '0.75rem',
-      sm: '0.875rem',
-      base: '1rem',
-      lg: '1.125rem',
-      xl: '1.25rem',
-      '2xl': '1.5rem',
-      '3xl': '1.875rem',
-      '4xl': '2.25rem',
-      '5xl': '3rem',
-      '6xl': '4rem',
+      xs: ['0.75rem', { lineHeight: '1rem' }],
+      sm: ['0.875rem', { lineHeight: '1.25rem' }],
+      base: ['1rem', { lineHeight: '1.5rem' }],
+      lg: ['1.125rem', { lineHeight: '1.75rem' }],
+      xl: ['1.25rem', { lineHeight: '1.75rem' }],
+      '2xl': ['1.5rem', { lineHeight: '2rem' }],
+      '3xl': ['1.875rem', { lineHeight: '2.25rem' }],
+      '4xl': ['2.25rem', { lineHeight: '2.5rem' }],
+      '5xl': ['3rem', { lineHeight: '1' }],
+      '6xl': ['4rem', { lineHeight: '1' }],
     },
     fontWeight: {
       hairline: '100',