emotion - npm Package Compare versions

Comparing version 1.0.3 to 1.0.4

dist/emotion.es.js

		@@ -8,3 +8,3 @@ import React from 'react';
		var cls = ref[0];
		var vars = ref[1];
		var vars = ref[1]; if ( vars === void 0 ) vars = [];

		@@ -25,3 +25,3 @@ return (function (superclass) {
		cls,
		vars.map(function (v) { return (typeof v === 'function' ? v(this$1.props) : v); })
		vars.map(function (v) { return (v && typeof v === 'function' ? v(this$1.props) : v); })
		);
		@@ -28,0 +28,0 @@

dist/emotion.umd.js

		@@ -1,2 +0,2 @@
		!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("glam")):"function"==typeof define&&define.amd?define(["exports","react","glam"],t):t(e.emotion=e.emotion\|\|{},e.React,e.glam)}(this,function(e,t,o){function n(e,n){var i=n[0],p=n[1];return function(t){function n(){t.apply(this,arguments)}return t&&(n.__proto__=t),n.prototype=Object.create(t&&t.prototype),n.prototype.constructor=n,n.prototype.render=function(){var t=this,n=o(i,p.map(function(e){return"function"==typeof e?e(t.props):e}));return r(e,Object.assign({},this.props,{className:(this.props.className\|\|"")+" "+n}))},n}(t.Component)}t="default"in t?t.default:t,o="default"in o?o.default:o;var r=t.createElement;e.emotion=n,Object.defineProperty(e,"__esModule",{value:!0})});
		!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("glam")):"function"==typeof define&&define.amd?define(["exports","react","glam"],t):t(e.emotion=e.emotion\|\|{},e.React,e.glam)}(this,function(e,t,o){function n(e,n){var i=n[0],p=n[1];return void 0===p&&(p=[]),function(t){function n(){t.apply(this,arguments)}return t&&(n.__proto__=t),n.prototype=Object.create(t&&t.prototype),n.prototype.constructor=n,n.prototype.render=function(){var t=this,n=o(i,p.map(function(e){return e&&"function"==typeof e?e(t.props):e}));return r(e,Object.assign({},this.props,{className:(this.props.className\|\|"")+" "+n}))},n}(t.Component)}t="default"in t?t.default:t,o="default"in o?o.default:o;var r=t.createElement;e.emotion=n,Object.defineProperty(e,"__esModule",{value:!0})});
		//# sourceMappingURL=emotion.umd.js.map

dist/glam.js

		@@ -1,2 +0,2 @@
		function t(t){return t&&"object"==typeof t&&"default"in t?t.default:t}function e(t,e){var p=e[0],u=e[1];return function(e){function r(){e.apply(this,arguments)}return e&&(r.__proto__=e),r.prototype=Object.create(e&&e.prototype),r.prototype.constructor=r,r.prototype.render=function(){var e=this,r=o(p,u.map(function(t){return"function"==typeof t?t(e.props):t}));return n(t,Object.assign({},this.props,{className:(this.props.className\|\|"")+" "+r}))},r}(r.Component)}Object.defineProperty(exports,"__esModule",{value:!0});var r=t(require("react")),o=t(require("glam")),n=r.createElement;exports.emotion=e;
		function t(t){return t&&"object"==typeof t&&"default"in t?t.default:t}function e(t,e){var p=e[0],u=e[1];return void 0===u&&(u=[]),function(e){function r(){e.apply(this,arguments)}return e&&(r.__proto__=e),r.prototype=Object.create(e&&e.prototype),r.prototype.constructor=r,r.prototype.render=function(){var e=this,r=o(p,u.map(function(t){return t&&"function"==typeof t?t(e.props):t}));return n(t,Object.assign({},this.props,{className:(this.props.className\|\|"")+" "+r}))},r}(r.Component)}Object.defineProperty(exports,"__esModule",{value:!0});var r=t(require("react")),o=t(require("glam")),n=r.createElement;exports.emotion=e;
		//# sourceMappingURL=glam.js.map

package.json

		{
		"name": "emotion",
		"version": "1.0.3",
		"version": "1.0.4",
		"description": "👩‍🎤 Glam + React",
		@@ -5,0 +5,0 @@ "jsnext:main": "dist/emotion.es.js",

src/__tests__/react.js

		@@ -6,3 +6,3 @@ /* eslint-disable jsx-quotes,no-useless-escape,no-template-curly-in-string */
		import css, {fragment} from 'glam'
		import { emotion } from '../react'
		import {emotion} from '../react'
		import plugin from '../babel'
		@@ -86,3 +86,3 @@

		const H2 = emotion(H1)`font-size: ${({ scale }) => fontSize * scale}`
		const H2 = emotion(H1)`font-size: ${({scale}) => fontSize * scale}`

		@@ -99,2 +99,41 @@ const tree = renderer
		})

		test('function in expression', () => {
		const fontSize = 20
		const Content = emotion('div')`
		font-size: ${fontSize}px;
		`

		const flexColumn = Component => {
		const NewComponent = emotion(Component)`
		flex-direction: column;
		`
		NewComponent.displayName = `flexColumn${Component.displayName}`

		return NewComponent
		}

		const ColumnContent = flexColumn(Content)

		const tree = renderer
		.create(
		<ColumnContent>
		<div
		css={`height: 100px; width: 100px; background-color: #20c997; margin: 8ch;`}
		/>
		<div
		css={`height: 100px; width: 100px; background-color: #20c997; margin: 8ch;`}
		/>
		<div
		css={`height: 100px; width: 100px; background-color: #20c997; margin: 8ch;`}
		/>
		<div
		css={`height: 100px; width: 100px; background-color: #20c997; margin: 8ch;`}
		/>
		</ColumnContent>
		)
		.toJSON()

		expect(tree).toMatchSnapshot()
		})
		})

src/react.js

		@@ -6,3 +6,3 @@ import React from 'react'

		export function emotion (tag, [cls, vars]) {
		export function emotion (tag, [cls, vars = []]) {
		return class Target extends React.Component {
		@@ -12,3 +12,3 @@ render () {
		cls,
		vars.map(v => (typeof v === 'function' ? v(this.props) : v))
		vars.map(v => (v && typeof v === 'function' ? v(this.props) : v))
		)
		@@ -15,0 +15,0 @@

dist/emotion.es.js.map