vercel · arunoda · Feb 26, 2017 · Feb 25, 2017 · Feb 26, 2017 · Feb 26, 2017
diff --git a/client/index.js b/client/index.js
@@ -2,7 +2,6 @@ import { createElement } from 'react'
 import ReactDOM from 'react-dom'
 import { EventEmitter } from 'events'
 import HeadManager from './head-manager'
-import { rehydrate } from '../lib/css'
 import { createRouter } from '../lib/router'
 import App from '../lib/app'
 import evalScript from '../lib/eval-script'
@@ -13,7 +12,6 @@ const {
     component,
     errorComponent,
     props,
-    ids,
     err,
     pathname,
     query
@@ -35,7 +33,6 @@ const container = document.getElementById('__next')
 
 export default (onError) => {
   const emitter = new EventEmitter()
-  if (ids && ids.length) rehydrate(ids)
 
   router.subscribe(({ Component, props, err }) => {
     render({ Component, props, err, emitter }, onError)

diff --git a/examples/with-glamor/package.json b/examples/with-glamor/package.json
@@ -7,7 +7,7 @@
     "start": "next start"
   },
   "dependencies": {
-    "glamor": "^2.20.12",
+    "glamor": "^2.20.24",
     "next": "^2.0.0-beta",
     "react": "^15.4.2",
     "react-dom": "^15.4.2"

diff --git a/examples/with-glamor/pages/_document.js b/examples/with-glamor/pages/_document.js
@@ -4,10 +4,18 @@ import { renderStatic } from 'glamor/server'
 export default class MyDocument extends Document {
   static async getInitialProps ({ renderPage }) {
     const page = renderPage()
-    let styles = renderStatic(() => page.html)
+    const styles = renderStatic(() => page.html)
     return { ...page, ...styles }
   }
 
+  constructor (props) {
+    super(props)
+    const { __NEXT_DATA__, ids } = props
+    if (ids) {
+      __NEXT_DATA__.ids = this.props.ids
+    }
+  }
+
   render () {
     return (
       <html>

diff --git a/examples/with-glamor/pages/index.js b/examples/with-glamor/pages/index.js
@@ -1,5 +1,12 @@
 import React from 'react'
-import { style } from 'glamor'
+import { style, rehydrate } from 'glamor'
+
+// Adds server generated styles to glamor cache.
+// Has to run before any `style()` calls
+// '__NEXT_DATA__.ids' is set in '_document.js'
+if (typeof window !== 'undefined') {
+  rehydrate(window.__NEXT_DATA__.ids)
+}
 
 export default () => <h1 {...styles.title}>My page</h1>
 

diff --git a/lib/css.js b/lib/css.js
@@ -1,29 +1 @@
-import { deprecated } from './utils'
-const css = require('glamor')
-// Needed because of the mutation below
-delete require.cache[require.resolve('glamor')]
-
-for (const [k, v] of Object.entries(css)) {
-  if (typeof v === 'function') {
-    css[k] = deprecated(v, 'Warning: \'next/css\' is deprecated. Please refer to the migration guide: https://github.com/zeit/next.js/wiki/Migrating-from-next-css')
-  }
-}
-
-/**
- * Expose style as default and the whole object as properties
- * so it can be used as follows:
- *
- * import css, { merge } from 'next/css'
- * css({ color: 'red' })
- * merge({ color: 'green' })
- * css.merge({ color: 'blue' })
- */
-
-css.default = css.style
-Object.keys(css).forEach(key => {
-  if (key !== 'default') {
-    css.default[key] = css[key]
-  }
-})
-
-module.exports = css
+throw new Error(`'next/css' has been removed in Next.js 2.0. Please refer to the migration guide: https://github.com/zeit/next.js/wiki/Migrating-from-next-css`)
diff --git a/package.json b/package.json
@@ -61,7 +61,6 @@
     "cross-spawn": "5.0.1",
     "del": "2.2.2",
     "friendly-errors-webpack-plugin": "1.4.0",
-    "glamor": "2.20.23",
     "glob-promise": "3.1.0",
     "htmlescape": "1.1.1",
     "http-status": "1.0.1",

diff --git a/server/document.js b/server/document.js
@@ -1,37 +1,18 @@
 import React, { Component, PropTypes } from 'react'
 import htmlescape from 'htmlescape'
-import { renderStatic } from 'glamor/server'
 import flush from 'styled-jsx/server'
 
 export default class Document extends Component {
   static getInitialProps ({ renderPage }) {
-    let head
-    let rendered
-    let styles
-    try {
-      rendered = renderStatic(() => {
-        const page = renderPage()
-        head = page.head
-        return page.html
-      })
-    } finally {
-      styles = flush()
-    }
-    const { html, css, ids } = rendered
-    const nextCSS = { css, ids, styles }
-    return { html, head, nextCSS }
+    const {html, head} = renderPage()
+    const styles = flush()
+    return { html, head, styles }
   }
 
   static childContextTypes = {
     _documentProps: PropTypes.any
   }
 
-  constructor (props) {
-    super(props)
-    const { __NEXT_DATA__, nextCSS } = props
-    if (nextCSS) __NEXT_DATA__.ids = nextCSS.ids
-  }
-
   getChildContext () {
     return { _documentProps: this.props }
   }
@@ -53,11 +34,10 @@ export class Head extends Component {
   }
 
   render () {
-    const { head, nextCSS } = this.context._documentProps
+    const { head, styles } = this.context._documentProps
     return <head>
       {(head || []).map((h, i) => React.cloneElement(h, { key: i }))}
-      {nextCSS && nextCSS.css ? <style dangerouslySetInnerHTML={{ __html: nextCSS.css }} /> : null}
-      {nextCSS && nextCSS.styles ? nextCSS.styles : null}
+      {styles || null}
       {this.props.children}
     </head>
   }

diff --git a/test/integration/basic/pages/css.js b/test/integration/basic/pages/css.js
diff --git a/test/integration/basic/test/rendering.js b/test/integration/basic/test/rendering.js
@@ -28,14 +28,6 @@ export default function ({ app }, suiteName, render) {
       expect(html.includes('I can haz meta tags')).toBeTruthy()
     })
 
-    test('css helper renders styles', async () => {
-      const $ = await get$('/css')
-      const redBox = $('#red-box')
-
-      expect(redBox.text()).toBe('This is red')
-      expect(redBox.attr('class')).toMatch(/^css-/)
-    })
-
     test('renders styled jsx', async () => {
       const $ = await get$('/styled-jsx')
       const styleId = $('#blue-box').attr('data-jsx')