@cloudflare/style-provider - npm Package Compare versions

Comparing version 1.1.26 to 1.1.27

CHANGELOG.md

@@ -6,3 +6,11 @@ # Change Log
 
-    <a name="1.1.26"></a>
+      <a name="1.1.27"></a>
+## [1.1.27](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/style-provider@1.1.26...@cloudflare/style-provider@1.1.27) (2018-08-22)
+
+
+
+
+**Note:** Version bump only for package @cloudflare/style-provider
+
+      <a name="1.1.26"></a>
 ## [1.1.26](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/style-provider@1.1.25...@cloudflare/style-provider@1.1.26) (2018-08-17)
@@ -15,3 +23,3 @@
 
-    <a name="1.1.25"></a>
+  <a name="1.1.25"></a>
 ## [1.1.25](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/style-provider@1.1.24...@cloudflare/style-provider@1.1.25) (2018-08-01)
@@ -24,3 +32,3 @@
 
-  <a name="1.1.24"></a>
+<a name="1.1.24"></a>
 ## [1.1.24](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/style-provider@1.1.23...@cloudflare/style-provider@1.1.24) (2018-07-31)
@@ -27,0 +35,0 @@

es/createRenderer.js

@@ -6,3 +6,2 @@ import { createRenderer as createFelaRenderer } from 'fela'; // eslint-disable-line behance/no-deprecated
 import unit from 'fela-plugin-unit';
-import lvha from 'fela-plugin-lvha';
 import embedded from 'fela-plugin-embedded';
@@ -12,32 +11,30 @@ import namedMediaQuery from 'fela-plugin-named-media-query';
 
-var defaultOpts = {
+const defaultOpts = {
   dev: false
 };
-var mediaQueries = {
-  mobile: "@media (min-width: ".concat(variables.breakpoints.mobile, ")"),
-  mobileWide: "@media (min-width: ".concat(variables.breakpoints.mobileWide, ")"),
-  tablet: "@media (min-width: ".concat(variables.breakpoints.tablet, ")"),
-  tabletLegacy: "@media (min-width: ".concat(variables.breakpoints.tabletLegacy, ")"),
-  tabletWide: "@media (min-width: ".concat(variables.breakpoints.tabletWide, ")"),
-  desktop: "@media (min-width: ".concat(variables.breakpoints.desktop, ")"),
-  desktopLegacy: "@media (min-width: ".concat(variables.breakpoints.desktopLegacy, ")"),
-  desktopLarge: "@media (min-width: ".concat(variables.breakpoints.desktopLarge, ")"),
-  hover: "@media (hover)"
+const mediaQueries = {
+  mobile: `@media (min-width: ${variables.breakpoints.mobile})`,
+  mobileWide: `@media (min-width: ${variables.breakpoints.mobileWide})`,
+  tablet: `@media (min-width: ${variables.breakpoints.tablet})`,
+  tabletLegacy: `@media (min-width: ${variables.breakpoints.tabletLegacy})`,
+  tabletWide: `@media (min-width: ${variables.breakpoints.tabletWide})`,
+  desktop: `@media (min-width: ${variables.breakpoints.desktop})`,
+  desktopLegacy: `@media (min-width: ${variables.breakpoints.desktopLegacy})`,
+  desktopLarge: `@media (min-width: ${variables.breakpoints.desktopLarge})`,
+  hover: `@media (hover)`
 };
 
-var removePrefix = function removePrefix(query) {
-  return query.replace('@media ', '');
-};
+const removePrefix = query => query.replace('@media ', '');
 
-var createRenderer = function createRenderer(opts) {
-  var usedOpts = Object.assign({}, defaultOpts, opts);
-  var plugins = [prefixer(), fallbackValue(), unit(), lvha(), embedded(), namedMediaQuery(mediaQueries)];
-  var enhancers = [];
+const createRenderer = opts => {
+  const usedOpts = Object.assign({}, defaultOpts, opts);
+  const plugins = [prefixer(), fallbackValue(), unit(), embedded(), namedMediaQuery(mediaQueries)];
+  const enhancers = [];
 
   if (usedOpts.dev === true) {
-    var validator = require('fela-plugin-validator').default;
+    const validator = require('fela-plugin-validator').default;
 
-    var whitelistMediaQuery = require('./whitelistMediaQuery').default;
+    const whitelistMediaQuery = require('./whitelistMediaQuery').default;
 
-    var beautifier = require('fela-beautifier').default;
+    const beautifier = require('fela-beautifier').default;
 
@@ -50,5 +47,6 @@ plugins.push(validator());
   return createFelaRenderer({
-    plugins: plugins,
-    enhancers: enhancers,
+    plugins,
+    enhancers,
     selectorPrefix: usedOpts.selectorPrefix,
+    devMode: usedOpts.dev,
     mediaQueryOrder: [removePrefix(mediaQueries.hover), removePrefix(mediaQueries.mobile), removePrefix(mediaQueries.mobileWide), removePrefix(mediaQueries.tablet), removePrefix(mediaQueries.tabletLegacy), removePrefix(mediaQueries.tabletWide), removePrefix(mediaQueries.desktop), removePrefix(mediaQueries.desktopLegacy), removePrefix(mediaQueries.desktopLarge)]
@@ -55,0 +53,0 @@ });

es/felaSnapshot.js

@@ -6,3 +6,3 @@ import renderer from 'react-test-renderer';
 import cssbeautify from 'cssbeautify';
-var options = {
+const options = {
   indent: '  ',
@@ -12,5 +12,4 @@ openbrace: 'end-of-line',
 };
-export default (function (component) {
-  var renderOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  var felaRenderer = createRenderer({
+export default ((component, renderOptions = {}) => {
+  const felaRenderer = createRenderer({
     dev: true
@@ -20,4 +19,4 @@ });
     component: renderer.create(felaTestContext(component, felaRenderer), renderOptions).toJSON(),
-    styles: "\n".concat(cssbeautify(renderToString(felaRenderer), options), "\n")
+    styles: `\n${cssbeautify(renderToString(felaRenderer), options)}\n`
   };
 });

es/felaTestContext.js

@@ -6,9 +6,7 @@ // this is a wrapper for testing, it passes fela based
 
-var felaTestContext = function felaTestContext(component, renderer) {
-  return React.createElement(StyleProvider, {
-    renderer: renderer,
-    dev: true
-  }, component);
-};
+const felaTestContext = (component, renderer) => React.createElement(StyleProvider, {
+  renderer: renderer,
+  dev: true
+}, component);
 
 export default felaTestContext;

es/index.js

 import createRenderer from './createRenderer';
 import StyleProvider from './StyleProvider';
-var isProd = process.env.NODE_ENV === 'production';
-var felaSnapshot = isProd ? null : require('./felaSnapshot').default;
-var felaTestContext = isProd ? null : require('./felaTestContext').default;
+const isProd = process.env.NODE_ENV === 'production';
+const felaSnapshot = isProd ? null : require('./felaSnapshot').default;
+const felaTestContext = isProd ? null : require('./felaTestContext').default;
 export { createRenderer, StyleProvider, felaTestContext, felaSnapshot };

es/StyleProvider.js

@@ -18,13 +18,15 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
 
-var StyleProvider = function StyleProvider(_ref) {
-  var dev = _ref.dev,
-      children = _ref.children,
-      renderer = _ref.renderer,
-      rehydrate = _ref.rehydrate,
+const StyleProvider = (_ref) => {
+  let {
+    dev,
+    children,
+    renderer,
+    rehydrate
+  } = _ref,
       restProps = _objectWithoutProperties(_ref, ["dev", "children", "renderer", "rehydrate"]);
 
-  var providerRenderer = renderer || createRenderer({
-    dev: dev
+  const providerRenderer = renderer || createRenderer({
+    dev
   });
-  var child = Children.only(children);
+  const child = Children.only(children);
   return React.createElement(Provider, {
@@ -31,0 +33,0 @@ renderer: providerRenderer,

es/whitelistMediaQuery.js

@@ -5,18 +5,12 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
 
-function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+const isObject = value => typeof value === 'object' && !Array.isArray(value);
 
-var isObject = function isObject(value) {
-  return _typeof(value) === 'object' && !Array.isArray(value);
-};
+const flipKeysAndValues = input => Object.keys(input).reduce((obj, key) => _objectSpread({}, obj, {
+  [input[key]]: key
+}), {});
 
-var flipKeysAndValues = function flipKeysAndValues(input) {
-  return Object.keys(input).reduce(function (obj, key) {
-    return _objectSpread({}, obj, _defineProperty({}, input[key], key));
-  }, {});
-};
-
 function checkMediaQuery(style, mediaQueryMap, aliases) {
-  for (var property in style) {
+  for (const property in style) {
     if (style.hasOwnProperty(property)) {
-      var value = style[property];
+      const value = style[property];
 
@@ -27,3 +21,4 @@ if (isObject(value)) {
         if (property.substring(0, 6) === '@media' && !mediaQueryMap.hasOwnProperty(property)) {
-          console.warn("Please don't use \"".concat(property, "\". Use one of the aliases: ").concat(aliases.join(', '), ".\nMore info: https://github.com/cloudflare/cf-ui/tree/master/packages/cf-style-provider#named-media-query"));
+          console.warn(`Please don't use "${property}". Use one of the aliases: ${aliases.join(', ')}.
+More info: https://github.com/cloudflare/cf-ui/tree/master/packages/cf-style-provider#named-media-query`);
         }
@@ -38,5 +33,3 @@ }
 export default function whitelistMediaQuery(mediaQueryMap) {
-  return function (style) {
-    return checkMediaQuery(style, flipKeysAndValues(mediaQueryMap), Object.keys(mediaQueryMap));
-  };
+  return style => checkMediaQuery(style, flipKeysAndValues(mediaQueryMap), Object.keys(mediaQueryMap));
 }

lib/createRenderer.js

@@ -16,4 +16,2 @@ "use strict";
 
-var _felaPluginLvha = _interopRequireDefault(require("fela-plugin-lvha"));
-
 var _felaPluginEmbedded = _interopRequireDefault(require("fela-plugin-embedded"));
@@ -29,32 +27,30 @@
 // eslint-disable-line behance/no-deprecated
-var defaultOpts = {
+const defaultOpts = {
   dev: false
 };
-var mediaQueries = {
-  mobile: "@media (min-width: ".concat(_styleConst.variables.breakpoints.mobile, ")"),
-  mobileWide: "@media (min-width: ".concat(_styleConst.variables.breakpoints.mobileWide, ")"),
-  tablet: "@media (min-width: ".concat(_styleConst.variables.breakpoints.tablet, ")"),
-  tabletLegacy: "@media (min-width: ".concat(_styleConst.variables.breakpoints.tabletLegacy, ")"),
-  tabletWide: "@media (min-width: ".concat(_styleConst.variables.breakpoints.tabletWide, ")"),
-  desktop: "@media (min-width: ".concat(_styleConst.variables.breakpoints.desktop, ")"),
-  desktopLegacy: "@media (min-width: ".concat(_styleConst.variables.breakpoints.desktopLegacy, ")"),
-  desktopLarge: "@media (min-width: ".concat(_styleConst.variables.breakpoints.desktopLarge, ")"),
-  hover: "@media (hover)"
+const mediaQueries = {
+  mobile: `@media (min-width: ${_styleConst.variables.breakpoints.mobile})`,
+  mobileWide: `@media (min-width: ${_styleConst.variables.breakpoints.mobileWide})`,
+  tablet: `@media (min-width: ${_styleConst.variables.breakpoints.tablet})`,
+  tabletLegacy: `@media (min-width: ${_styleConst.variables.breakpoints.tabletLegacy})`,
+  tabletWide: `@media (min-width: ${_styleConst.variables.breakpoints.tabletWide})`,
+  desktop: `@media (min-width: ${_styleConst.variables.breakpoints.desktop})`,
+  desktopLegacy: `@media (min-width: ${_styleConst.variables.breakpoints.desktopLegacy})`,
+  desktopLarge: `@media (min-width: ${_styleConst.variables.breakpoints.desktopLarge})`,
+  hover: `@media (hover)`
 };
 
-var removePrefix = function removePrefix(query) {
-  return query.replace('@media ', '');
-};
+const removePrefix = query => query.replace('@media ', '');
 
-var createRenderer = function createRenderer(opts) {
-  var usedOpts = Object.assign({}, defaultOpts, opts);
-  var plugins = [(0, _felaPluginPrefixer.default)(), (0, _felaPluginFallbackValue.default)(), (0, _felaPluginUnit.default)(), (0, _felaPluginLvha.default)(), (0, _felaPluginEmbedded.default)(), (0, _felaPluginNamedMediaQuery.default)(mediaQueries)];
-  var enhancers = [];
+const createRenderer = opts => {
+  const usedOpts = Object.assign({}, defaultOpts, opts);
+  const plugins = [(0, _felaPluginPrefixer.default)(), (0, _felaPluginFallbackValue.default)(), (0, _felaPluginUnit.default)(), (0, _felaPluginEmbedded.default)(), (0, _felaPluginNamedMediaQuery.default)(mediaQueries)];
+  const enhancers = [];
 
   if (usedOpts.dev === true) {
-    var validator = require('fela-plugin-validator').default;
+    const validator = require('fela-plugin-validator').default;
 
-    var whitelistMediaQuery = require('./whitelistMediaQuery').default;
+    const whitelistMediaQuery = require('./whitelistMediaQuery').default;
 
-    var beautifier = require('fela-beautifier').default;
+    const beautifier = require('fela-beautifier').default;
 
@@ -67,5 +63,6 @@ plugins.push(validator());
   return (0, _fela.createRenderer)({
-    plugins: plugins,
-    enhancers: enhancers,
+    plugins,
+    enhancers,
     selectorPrefix: usedOpts.selectorPrefix,
+    devMode: usedOpts.dev,
     mediaQueryOrder: [removePrefix(mediaQueries.hover), removePrefix(mediaQueries.mobile), removePrefix(mediaQueries.mobileWide), removePrefix(mediaQueries.tablet), removePrefix(mediaQueries.tabletLegacy), removePrefix(mediaQueries.tabletWide), removePrefix(mediaQueries.desktop), removePrefix(mediaQueries.desktopLegacy), removePrefix(mediaQueries.desktopLarge)]
@@ -72,0 +69,0 @@ });

lib/felaSnapshot.js

@@ -20,3 +20,3 @@ "use strict";
 
-var options = {
+const options = {
   indent: '  ',
@@ -27,5 +27,4 @@ openbrace: 'end-of-line',
 
-var _default = function _default(component) {
-  var renderOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  var felaRenderer = (0, _createRenderer.default)({
+var _default = (component, renderOptions = {}) => {
+  const felaRenderer = (0, _createRenderer.default)({
     dev: true
@@ -35,3 +34,3 @@ });
     component: _reactTestRenderer.default.create((0, _felaTestContext.default)(component, felaRenderer), renderOptions).toJSON(),
-    styles: "\n".concat((0, _cssbeautify.default)((0, _felaTools.renderToString)(felaRenderer), options), "\n")
+    styles: `\n${(0, _cssbeautify.default)((0, _felaTools.renderToString)(felaRenderer), options)}\n`
   };
@@ -38,0 +37,0 @@ };

lib/felaTestContext.js

@@ -16,10 +16,8 @@ "use strict";
 // components fela's renderer and global theme
-var felaTestContext = function felaTestContext(component, renderer) {
-  return _react.default.createElement(_StyleProvider.default, {
-    renderer: renderer,
-    dev: true
-  }, component);
-};
+const felaTestContext = (component, renderer) => _react.default.createElement(_StyleProvider.default, {
+  renderer: renderer,
+  dev: true
+}, component);
 
 var _default = felaTestContext;
 exports.default = _default;

lib/index.js

@@ -8,3 +8,3 @@ "use strict";
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _createRenderer.default;
@@ -15,3 +15,3 @@ }
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _StyleProvider.default;
@@ -28,6 +28,6 @@ }
 
-var isProd = process.env.NODE_ENV === 'production';
-var felaSnapshot = isProd ? null : require('./felaSnapshot').default;
+const isProd = process.env.NODE_ENV === 'production';
+const felaSnapshot = isProd ? null : require('./felaSnapshot').default;
 exports.felaSnapshot = felaSnapshot;
-var felaTestContext = isProd ? null : require('./felaTestContext').default;
+const felaTestContext = isProd ? null : require('./felaTestContext').default;
 exports.felaTestContext = felaTestContext;

lib/StyleProvider.js

@@ -32,14 +32,16 @@ "use strict";
 
-var StyleProvider = function StyleProvider(_ref) {
-  var dev = _ref.dev,
-      children = _ref.children,
-      renderer = _ref.renderer,
-      rehydrate = _ref.rehydrate,
+const StyleProvider = (_ref) => {
+  let {
+    dev,
+    children,
+    renderer,
+    rehydrate
+  } = _ref,
       restProps = _objectWithoutProperties(_ref, ["dev", "children", "renderer", "rehydrate"]);
 
-  var providerRenderer = renderer || (0, _createRenderer.default)({
-    dev: dev
+  const providerRenderer = renderer || (0, _createRenderer.default)({
+    dev
   });
 
-  var child = _react.Children.only(children);
+  const child = _react.Children.only(children);
 
@@ -46,0 +48,0 @@ return _react.default.createElement(_reactFela.Provider, {

lib/whitelistMediaQuery.js

@@ -12,18 +12,12 @@ "use strict";
 
-function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+const isObject = value => typeof value === 'object' && !Array.isArray(value);
 
-var isObject = function isObject(value) {
-  return _typeof(value) === 'object' && !Array.isArray(value);
-};
+const flipKeysAndValues = input => Object.keys(input).reduce((obj, key) => _objectSpread({}, obj, {
+  [input[key]]: key
+}), {});
 
-var flipKeysAndValues = function flipKeysAndValues(input) {
-  return Object.keys(input).reduce(function (obj, key) {
-    return _objectSpread({}, obj, _defineProperty({}, input[key], key));
-  }, {});
-};
-
 function checkMediaQuery(style, mediaQueryMap, aliases) {
-  for (var property in style) {
+  for (const property in style) {
     if (style.hasOwnProperty(property)) {
-      var value = style[property];
+      const value = style[property];
 
@@ -34,3 +28,4 @@ if (isObject(value)) {
         if (property.substring(0, 6) === '@media' && !mediaQueryMap.hasOwnProperty(property)) {
-          console.warn("Please don't use \"".concat(property, "\". Use one of the aliases: ").concat(aliases.join(', '), ".\nMore info: https://github.com/cloudflare/cf-ui/tree/master/packages/cf-style-provider#named-media-query"));
+          console.warn(`Please don't use "${property}". Use one of the aliases: ${aliases.join(', ')}.
+More info: https://github.com/cloudflare/cf-ui/tree/master/packages/cf-style-provider#named-media-query`);
         }
@@ -45,5 +40,3 @@ }
 function whitelistMediaQuery(mediaQueryMap) {
-  return function (style) {
-    return checkMediaQuery(style, flipKeysAndValues(mediaQueryMap), Object.keys(mediaQueryMap));
-  };
+  return style => checkMediaQuery(style, flipKeysAndValues(mediaQueryMap), Object.keys(mediaQueryMap));
 }

package.json

 {
   "name": "@cloudflare/style-provider",
   "description": "Cloudflare Style Provider",
-  "version": "1.1.26",
+  "version": "1.1.27",
   "main": "lib/index.js",
@@ -16,17 +16,16 @@ "module": "es/index.js",
     "@cloudflare/style-const": "^2.0.6",
-    "@cloudflare/style-container": "^4.0.10",
+    "@cloudflare/style-container": "^4.0.11",
     "cssbeautify": "^0.3.1",
-    "fela": "^6.1.9",
-    "fela-beautifier": "^5.0.15",
-    "fela-plugin-embedded": "^5.2.9",
+    "fela": "^6.2.0",
+    "fela-beautifier": "^5.0.16",
+    "fela-plugin-embedded": "^5.2.10",
     "fela-plugin-fallback-value": "^5.0.18",
-    "fela-plugin-lvha": "^5.0.15",
     "fela-plugin-named-media-query": "^5.0.13",
     "fela-plugin-prefixer": "^5.0.19",
     "fela-plugin-unit": "^5.1.0",
-    "fela-plugin-validator": "^5.2.1",
-    "fela-tools": "^5.1.7",
+    "fela-plugin-validator": "^5.2.2",
+    "fela-tools": "^5.2.0",
     "inline-style-prefixer": "^3.0.5",
     "prop-types": "^15.6.0",
-    "react-fela": "^7.3.1",
+    "react-fela": "^8.0.0",
     "react-test-renderer": "^16.1.1"
@@ -33,0 +32,0 @@ },

src/createRenderer.js

@@ -5,3 +5,2 @@ import { createRenderer as createFelaRenderer } from 'fela'; // eslint-disable-line behance/no-deprecated
 import unit from 'fela-plugin-unit';
-import lvha from 'fela-plugin-lvha';
 import embedded from 'fela-plugin-embedded';
@@ -35,3 +34,2 @@ import namedMediaQuery from 'fela-plugin-named-media-query';
     unit(),
-    lvha(),
     embedded(),
@@ -55,2 +53,3 @@ namedMediaQuery(mediaQueries)
     selectorPrefix: usedOpts.selectorPrefix,
+    devMode: usedOpts.dev,
     mediaQueryOrder: [
@@ -57,0 +56,0 @@ removePrefix(mediaQueries.hover),

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Dependency count

17

decreased by-5.56%

Worsened metrics

Total package byte prevSize

52260

decreased by-2.93%

Lines of code

514

decreased by-3.93%

Dependency changes

• - Removedfela-plugin-lvha@^5.0.15

• - Removedfela-bindings@2.3.1(transitive)

• - Removedfela-dom@7.0.9(transitive)

• - Removedfela-plugin-lvha@5.0.16(transitive)

• - Removedreact-fela@7.3.1(transitive)

• Updated@cloudflare/style-container@^4.0.11

• Updatedfela@^6.2.0

• Updatedfela-beautifier@^5.0.16

• Updatedfela-plugin-embedded@^5.2.10

• Updatedfela-plugin-validator@^5.2.2

• Updatedfela-tools@^5.2.0

• Updatedreact-fela@^8.0.0