From 05b4d962d1094d68b940d9587d3bab53eb1cc383 Mon Sep 17 00:00:00 2001
From: Adam Wathan <adam.wathan@gmail.com>
Date: Thu, 5 Oct 2017 20:20:43 -0400
Subject: [PATCH] Add support for @breakpoint rule

---
 src/index.js                           |  2 ++
 src/lib/substituteBreakpointAtRules.js | 20 ++++++++++++++++++++
 2 files changed, 22 insertions(+)
 create mode 100644 src/lib/substituteBreakpointAtRules.js

diff --git a/src/index.js b/src/index.js
index 828230129..6e10d2d3c 100644
--- a/src/index.js
+++ b/src/index.js
@@ -11,6 +11,7 @@ import addCustomMediaQueries from './lib/addCustomMediaQueries'
 import generateUtilities from './lib/generateUtilities'
 import substituteHoverableAtRules from './lib/substituteHoverableAtRules'
 import substituteResponsiveAtRules from './lib/substituteResponsiveAtRules'
+import substituteBreakpointAtRules from './lib/substituteBreakpointAtRules'
 import substituteClassApplyAtRules from './lib/substituteClassApplyAtRules'
 
 const plugin = postcss.plugin('tailwind', (options = {}) => {
@@ -21,6 +22,7 @@ const plugin = postcss.plugin('tailwind', (options = {}) => {
     generateUtilities(config),
     substituteHoverableAtRules(config),
     substituteResponsiveAtRules(config),
+    substituteBreakpointAtRules(config),
     substituteClassApplyAtRules(config),
     cssnext(),
     stylefmt,
diff --git a/src/lib/substituteBreakpointAtRules.js b/src/lib/substituteBreakpointAtRules.js
new file mode 100644
index 000000000..a6e9bad3b
--- /dev/null
+++ b/src/lib/substituteBreakpointAtRules.js
@@ -0,0 +1,20 @@
+import _ from 'lodash'
+import postcss from 'postcss'
+import cloneNodes from '../util/cloneNodes'
+
+export default function(options) {
+  return function(css) {
+    const rules = []
+
+    css.walkAtRules('breakpoint', atRule => {
+      const breakpoint = atRule.params
+
+      if (! _.has(options.breakpoints, breakpoint)) {
+        throw atRule.error(`No \`${breakpoint}\` breakpoint found.`)
+      }
+
+      atRule.name = 'media'
+      atRule.params = `(--breakpoint-${atRule.params})`
+    })
+  }
+}