@hig/themes - npm Package Compare versions

Comparing version 0.1.0-alpha.eea0e093 to 0.1.0-alpha.f38da73f

build/index.es.js

@@ -1,2 +0,3 @@
-import createReactContext from 'create-react-context';
+import PropTypes from 'prop-types';
+import { Component } from 'react';
 
@@ -13,7 +14,103 @@ var HIGLightTheme = {
 
-var _createReactContext = createReactContext(HIGLightTheme),
-    Provider = _createReactContext.Provider,
-    Consumer = _createReactContext.Consumer;
+var themeContextShape = {
+  /** Uniquely identifies a theme */
+  themeId: PropTypes.string,
+  /** A class added to each themed element */
+  themeClass: PropTypes.string
+};
+
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var Provider = function (_Component) {
+  _inherits(Provider, _Component);
+
+  function Provider() {
+    _classCallCheck(this, Provider);
+
+    return _possibleConstructorReturn(this, (Provider.__proto__ || Object.getPrototypeOf(Provider)).apply(this, arguments));
+  }
+
+  _createClass(Provider, [{
+    key: 'getChildContext',
+    value: function getChildContext() {
+      return _extends({}, this.props.value);
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      return this.props.children;
+    }
+  }]);
+
+  return Provider;
+}(Component);
+
+Provider.propTypes = {
+  /** A theme provided to the consumer within */
+  value: PropTypes.shape(themeContextShape),
+  /** Content within will be provided with the passed theme */
+  children: PropTypes.node.isRequired
+};
+Provider.childContextTypes = themeContextShape;
+Provider.defaultProps = {
+  value: HIGLightTheme
+};
+
+var _createClass$1 = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn$1(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits$1(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var Consumer = function (_Component) {
+  _inherits$1(Consumer, _Component);
+
+  function Consumer() {
+    _classCallCheck$1(this, Consumer);
+
+    return _possibleConstructorReturn$1(this, (Consumer.__proto__ || Object.getPrototypeOf(Consumer)).apply(this, arguments));
+  }
+
+  _createClass$1(Consumer, [{
+    key: 'render',
+    value: function render() {
+      var theme = this.context.themeId && this.context.themeClass ? this.context : HIGLightTheme;
+      return this.props.children(theme);
+    }
+  }]);
+
+  return Consumer;
+}(Component);
+
+Consumer.propTypes = {
+  /** A theme provided to the consumer within */
+  children: PropTypes.func
+};
+Consumer.contextTypes = themeContextShape;
+Consumer.__docgenInfo = {
+  'description': '',
+  'displayName': 'Consumer',
+  'props': {
+    'children': {
+      'type': {
+        'name': 'func'
+      },
+      'required': false,
+      'description': 'A theme provided to the consumer within'
+    }
+  }
+};
+
 var index = { Provider: Provider, Consumer: Consumer };
 
 export { HIGLightTheme, MatrixTheme, index as ThemeContext };

build/index.js

@@ -7,3 +7,4 @@ 'use strict';
 
-var createReactContext = _interopDefault(require('create-react-context'));
+var PropTypes = _interopDefault(require('prop-types'));
+var react = require('react');
 
@@ -20,5 +21,101 @@ var HIGLightTheme = {
 
-var _createReactContext = createReactContext(HIGLightTheme),
-    Provider = _createReactContext.Provider,
-    Consumer = _createReactContext.Consumer;
+var themeContextShape = {
+  /** Uniquely identifies a theme */
+  themeId: PropTypes.string,
+  /** A class added to each themed element */
+  themeClass: PropTypes.string
+};
+
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var Provider = function (_Component) {
+  _inherits(Provider, _Component);
+
+  function Provider() {
+    _classCallCheck(this, Provider);
+
+    return _possibleConstructorReturn(this, (Provider.__proto__ || Object.getPrototypeOf(Provider)).apply(this, arguments));
+  }
+
+  _createClass(Provider, [{
+    key: 'getChildContext',
+    value: function getChildContext() {
+      return _extends({}, this.props.value);
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      return this.props.children;
+    }
+  }]);
+
+  return Provider;
+}(react.Component);
+
+Provider.propTypes = {
+  /** A theme provided to the consumer within */
+  value: PropTypes.shape(themeContextShape),
+  /** Content within will be provided with the passed theme */
+  children: PropTypes.node.isRequired
+};
+Provider.childContextTypes = themeContextShape;
+Provider.defaultProps = {
+  value: HIGLightTheme
+};
+
+var _createClass$1 = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn$1(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits$1(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var Consumer = function (_Component) {
+  _inherits$1(Consumer, _Component);
+
+  function Consumer() {
+    _classCallCheck$1(this, Consumer);
+
+    return _possibleConstructorReturn$1(this, (Consumer.__proto__ || Object.getPrototypeOf(Consumer)).apply(this, arguments));
+  }
+
+  _createClass$1(Consumer, [{
+    key: 'render',
+    value: function render() {
+      var theme = this.context.themeId && this.context.themeClass ? this.context : HIGLightTheme;
+      return this.props.children(theme);
+    }
+  }]);
+
+  return Consumer;
+}(react.Component);
+
+Consumer.propTypes = {
+  /** A theme provided to the consumer within */
+  children: PropTypes.func
+};
+Consumer.contextTypes = themeContextShape;
+Consumer.__docgenInfo = {
+  'description': '',
+  'displayName': 'Consumer',
+  'props': {
+    'children': {
+      'type': {
+        'name': 'func'
+      },
+      'required': false,
+      'description': 'A theme provided to the consumer within'
+    }
+  }
+};
+
 var index = { Provider: Provider, Consumer: Consumer };
@@ -25,0 +122,0 @@

package.json

 {
   "name": "@hig/themes",
-  "version": "0.1.0-alpha.eea0e093",
+  "version": "0.1.0-alpha.f38da73f",
   "description": "HIG theme definitions and supporting components",
@@ -10,9 +10,5 @@ "author": "Autodesk Inc.",
   "module": "build/index.es.js",
-  "dependencies": {
-    "create-react-context": "^0.2.1"
-  },
   "devDependencies": {
-    "@hig/banner": "0.2.0-alpha.eea0e093",
-    "@hig/scripts": "0.2.0-alpha.eea0e093",
-    "@hig/styles": "0.1.0-alpha.eea0e093"
+    "@hig/scripts": "0.2.0-alpha.f38da73f",
+    "@hig/styles": "0.1.0-alpha.f38da73f"
   },
@@ -19,0 +15,0 @@ "peerDependencies": {

README.md

@@ -5,2 +5,8 @@ # ThemeContext component
 
+## Getting started
+
+```
+yarn add @hig/themes
+```
+
 ## Provide a theme to components
@@ -15,2 +21,2 @@ ```
 }
-```
+```

src/__stories__/ThemeContext.stories.js

@@ -9,3 +9,3 @@ import React from "react";
 
-import Banner from "@hig/banner";
+import Banner, { AVAILABLE_TYPES as BANNER_TYPES } from "@hig/banner";
 import readme from '../../README.md';
@@ -16,3 +16,2 @@ import ThemeContext from "../ThemeContext";
 
-const typeOptions = makeSelectOptions(Banner.types);
 const themeOptions = {
@@ -36,8 +35,13 @@ "hig-light": "HIG Light",
   const theme = select('Theme', themeOptions, 'hig-light');
-  const bannerType = select("Banner type", typeOptions, Banner.types[0]);
   return (
     <ThemeContext.Provider value={themes[theme]}>
-      <Banner type={bannerType}>{`This message presented in ${themeOptions[theme]} theme`}</Banner>
+      <div>
+        {BANNER_TYPES.map((type) => (
+          <div style={{ marginBottom: "20px" }}>
+            <Banner type={type}>{`This ${type} message presented in ${themeOptions[theme]} theme`}</Banner>
+          </div>
+        ))}
+      </div>
     </ThemeContext.Provider>
   );
 }));

src/ThemeContext/index.js

@@ -1,8 +0,6 @@
-import createReactContext from "create-react-context";
+import Provider from "./Provider";
+import Consumer from "./Consumer";
 
-import HIGLightTheme from "../themes/HIGLightTheme";
-
-const { Provider, Consumer } = createReactContext(HIGLightTheme);
-
-export { Provider, Consumer };
+export { default as Provider } from "./Provider";
+export { default as Consumer } from "./Consumer";
 export default { Provider, Consumer };

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

18794

increased by156.29%

Dependency count

2

decreased by-33.33%

Dev dependency count

2

decreased by-33.33%

Number of package files

19

increased by18.75%

Lines of code

396

increased by108.42%

Number of lines in readme file

21

increased by50%

Number of medium supply chain risk alerts

0

decreased by-100%

Dependency changes

• - Removedcreate-react-context@^0.2.1

• - Removedcreate-react-context@0.2.3(transitive)

• - Removedgud@1.0.0(transitive)