@atlaskit/select - npm Package Compare versions

Comparing version 4.3.2 to 4.3.3

CHANGELOG.md

 # @atlaskit/select
 
+## 4.3.3
+- [patch] Replace internal styled components with emotion styled components [415a64a](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/415a64a)
+- [none] Updated dependencies [415a64a](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/415a64a)
+
 ## 4.3.2
@@ -4,0 +8,0 @@ - [patch] Updated dependencies [470a1fb](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/470a1fb)

dist/cjs/components/input-options.js

@@ -8,2 +8,4 @@ 'use strict';
 
+var _emotion = require('emotion');
+
 var _extends2 = require('babel-runtime/helpers/extends');
@@ -41,6 +43,2 @@
 
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
 var _reactSelect = require('react-select');
@@ -62,2 +60,3 @@
 var backgroundColor = (0, _theme.themed)({ light: _theme.colors.N40A, dark: _theme.colors.DN10 });
+
 var transparent = (0, _theme.themed)({ light: 'transparent', dark: 'transparent' });
@@ -206,5 +205,18 @@
 
-var Truncate = /*#__PURE__*/(0, _styledComponents2.default)('div', {
-  target: 'eoj8r4t0'
-})('text-overflow:ellipsis;overflow-x:hidden;flex:1;white-space:nowrap;');
+var _ref5 = {
+  textOverflow: 'ellipsis',
+  'overflow-x': 'hidden',
+  flex: 1,
+  whiteSpace: 'nowrap'
+};
+var Truncate = function Truncate(_ref4) {
+  var children = _ref4.children;
+  return _react2.default.createElement(
+    'div',
+    {
+      className: (0, _emotion.css)(_ref5)
+    },
+    children
+  );
+};
 
@@ -211,0 +223,0 @@ var CheckboxOption = exports.CheckboxOption = function CheckboxOption(props) {

dist/cjs/CountrySelect.js

@@ -11,2 +11,4 @@ 'use strict';
 
+var _emotion = require('emotion');
+
 var _react = require('react');
@@ -16,6 +18,2 @@
 
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
 var _countries = require('./data/countries');
@@ -33,8 +31,17 @@
 // flow stuff
-var Label = /*#__PURE__*/(0, _styledComponents2.default)('div', {
-  target: 'e1dv3t2v0'
-})('align-items:center;display:flex;line-height:1.2;');
-var Flag = /*#__PURE__*/(0, _styledComponents2.default)('span', {
-  target: 'e1dv3t2v1'
-})('font-size:18px;margin-right:8px;');
+var labelCSS = function labelCSS() {
+  return {
+    alignItems: 'center',
+    display: 'flex',
+    lineHeight: 1.2
+  };
+};
+
+var flagCSS = function flagCSS() {
+  return {
+    fontSize: '18px',
+    marginRight: '8px'
+  };
+};
+
 var Opt = function Opt(_ref) {
@@ -44,7 +51,11 @@ var children = _ref.children,
   return _react2.default.createElement(
-    Label,
-    null,
+    'div',
+    {
+      className: (0, _emotion.css)(labelCSS())
+    },
     _react2.default.createElement(
-      Flag,
-      null,
+      'span',
+      {
+        className: (0, _emotion.css)(flagCSS())
+      },
       icon
@@ -51,0 +62,0 @@ ),

dist/esm/components/input-options.js

@@ -0,1 +1,2 @@
+import { css as _css } from 'emotion';
 import _extends from 'babel-runtime/helpers/extends';
@@ -9,3 +10,2 @@ import _Object$getPrototypeOf from 'babel-runtime/core-js/object/get-prototype-of';
 import React, { Component } from 'react';
-import styled from 'styled-components';
 import { components } from 'react-select';
@@ -164,5 +164,18 @@ import RadioIcon from '@atlaskit/icon/glyph/radio';
 
-var Truncate = /*#__PURE__*/styled('div', {
-  target: 'eoj8r4t0'
-})('text-overflow:ellipsis;overflow-x:hidden;flex:1;white-space:nowrap;');
+var _ref5 = {
+  textOverflow: 'ellipsis',
+  'overflow-x': 'hidden',
+  flex: 1,
+  whiteSpace: 'nowrap'
+};
+var Truncate = function Truncate(_ref4) {
+  var children = _ref4.children;
+  return React.createElement(
+    'div',
+    {
+      className: _css(_ref5)
+    },
+    children
+  );
+};
 
@@ -169,0 +182,0 @@ export var CheckboxOption = function CheckboxOption(props) {

dist/esm/CountrySelect.js

 import _extends from 'babel-runtime/helpers/extends';
+import { css as _css2 } from 'emotion';
+import { css as _css } from 'emotion';
 import React from 'react';
-import styled from 'styled-components';
 
@@ -12,8 +13,17 @@ import { groupedCountries } from './data/countries';
 // custom option renderer
-var Label = /*#__PURE__*/styled('div', {
-  target: 'e1dv3t2v0'
-})('align-items:center;display:flex;line-height:1.2;');
-var Flag = /*#__PURE__*/styled('span', {
-  target: 'e1dv3t2v1'
-})('font-size:18px;margin-right:8px;');
+var labelCSS = function labelCSS() {
+  return {
+    alignItems: 'center',
+    display: 'flex',
+    lineHeight: 1.2
+  };
+};
+
+var flagCSS = function flagCSS() {
+  return {
+    fontSize: '18px',
+    marginRight: '8px'
+  };
+};
+
 var Opt = function Opt(_ref) {
@@ -23,7 +33,11 @@ var children = _ref.children,
   return React.createElement(
-    Label,
-    null,
+    'div',
+    {
+      className: _css(labelCSS())
+    },
     React.createElement(
-      Flag,
-      null,
+      'span',
+      {
+        className: _css2(flagCSS())
+      },
       icon
@@ -30,0 +44,0 @@ ),

dist/package.json

 {
 	"name": "@atlaskit/select",
-	"version": "4.3.1"
+	"version": "4.3.2"
 }

package.json

 {
   "name": "@atlaskit/select",
-  "version": "4.3.2",
+  "version": "4.3.3",
   "description": "React component which allows selection of item(s) from a dropdown list.",
@@ -51,2 +51,2 @@ "license": "Apache-2.0",
   }
-}
+}

No alert changes

Worsened metrics

Total package byte prevSize

206192

decreased by-4.65%

Number of package files

65

decreased by-5.8%

Lines of code

2010

decreased by-5.41%

No dependency changes