@hig/skeleton-item - npm Package Compare versions

Comparing version 2.1.0 to 2.2.0

build/index.es.js

@@ -1,2 +0,2 @@
-import { css, cx } from 'emotion';
+import { cx, css } from 'emotion';
 import PropTypes from 'prop-types';
@@ -6,9 +6,46 @@ import React from 'react';
 
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+
+  return target;
+}
+
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+
+  var key, i;
+
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+
+  return target;
+}
+
 function stylesheet(props, themeData) {
-  var height = props.height,
-      marginBottom = props.marginBottom,
-      maxWidth = props.maxWidth,
-      customStylesheet = props.stylesheet;
-
-  var styles = {
+  const {
+    height,
+    marginBottom,
+    maxWidth,
+    stylesheet: customStylesheet
+  } = props;
+  const styles = {
     skeletonItem: {
@@ -20,7 +57,7 @@ backgroundColor: themeData["skeletonItem.backgroundColor"],
       position: "relative",
-      marginBottom: marginBottom,
-      maxWidth: maxWidth,
+      marginBottom,
+      maxWidth,
       "&:after": {
         animation: "3s ease-in infinite shine",
-        backgroundImage: "linear-gradient(135deg, transparent 0%, transparent 40%, " + themeData["skeletonItem.highlightColor"] + " 50%, transparent 60%, transparent 100%)",
+        backgroundImage: `linear-gradient(135deg, transparent 0%, transparent 40%, ${themeData["skeletonItem.highlightColor"]} 50%, transparent 60%, transparent 100%)`,
         bottom: 0,
@@ -46,44 +83,46 @@ content: '""',
   };
-
   return customStylesheet ? customStylesheet(styles, props, themeData) : styles;
 }
 
-function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
+const _excluded = ["height", "marginBottom", "maxWidth", "stylesheet"];
 
-var SkeletonItem = function SkeletonItem(props) {
-  var height = props.height,
-      marginBottom = props.marginBottom,
-      maxWidth = props.maxWidth,
-      customStylesheet = props.stylesheet,
-      otherProps = _objectWithoutProperties(props, ["height", "marginBottom", "maxWidth", "stylesheet"]);
+const SkeletonItem = props => {
+  const {
+    height,
+    marginBottom,
+    maxWidth,
+    stylesheet: customStylesheet
+  } = props,
+        otherProps = _objectWithoutProperties(props, _excluded);
 
-  var className = otherProps.className;
-
-
-  return React.createElement(
-    ThemeContext.Consumer,
-    null,
-    function (_ref) {
-      var resolvedRoles = _ref.resolvedRoles;
-
-      var styles = stylesheet({
-        maxWidth: maxWidth,
-        marginBottom: marginBottom,
-        height: height,
-        stylesheet: customStylesheet
-      }, resolvedRoles);
-      return React.createElement("div", { className: cx(css(styles.skeletonItem), className) });
-    }
-  );
+  const {
+    className
+  } = otherProps;
+  return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, _ref => {
+    let {
+      resolvedRoles
+    } = _ref;
+    const styles = stylesheet({
+      maxWidth,
+      marginBottom,
+      height,
+      stylesheet: customStylesheet
+    }, resolvedRoles);
+    return /*#__PURE__*/React.createElement("div", {
+      className: cx(css(styles.skeletonItem), className)
+    });
+  });
 };
 
 SkeletonItem.displayName = "SkeletonItem";
-
 SkeletonItem.propTypes = {
   /** Sets height of the skeleton item */
   height: PropTypes.string,
+
   /** Sets max width of the skeleton item */
   maxWidth: PropTypes.string,
+
   /** Sets spacing below the skeleton item */
   marginBottom: PropTypes.string,
+
   /** Adds custom/overriding styles */
@@ -127,2 +166,2 @@ stylesheet: PropTypes.func
 
-export default SkeletonItem;
+export { SkeletonItem as default };

build/index.js

@@ -5,16 +5,56 @@ 'use strict';
 
-function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
-
 var emotion = require('emotion');
-var PropTypes = _interopDefault(require('prop-types'));
-var React = _interopDefault(require('react'));
+var PropTypes = require('prop-types');
+var React = require('react');
 var themeContext = require('@hig/theme-context');
 
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+
+  return target;
+}
+
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+
+  var key, i;
+
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+
+  return target;
+}
+
 function stylesheet(props, themeData) {
-  var height = props.height,
-      marginBottom = props.marginBottom,
-      maxWidth = props.maxWidth,
-      customStylesheet = props.stylesheet;
-
-  var styles = {
+  const {
+    height,
+    marginBottom,
+    maxWidth,
+    stylesheet: customStylesheet
+  } = props;
+  const styles = {
     skeletonItem: {
@@ -26,7 +66,7 @@ backgroundColor: themeData["skeletonItem.backgroundColor"],
       position: "relative",
-      marginBottom: marginBottom,
-      maxWidth: maxWidth,
+      marginBottom,
+      maxWidth,
       "&:after": {
         animation: "3s ease-in infinite shine",
-        backgroundImage: "linear-gradient(135deg, transparent 0%, transparent 40%, " + themeData["skeletonItem.highlightColor"] + " 50%, transparent 60%, transparent 100%)",
+        backgroundImage: `linear-gradient(135deg, transparent 0%, transparent 40%, ${themeData["skeletonItem.highlightColor"]} 50%, transparent 60%, transparent 100%)`,
         bottom: 0,
@@ -52,46 +92,48 @@ content: '""',
   };
-
   return customStylesheet ? customStylesheet(styles, props, themeData) : styles;
 }
 
-function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
+const _excluded = ["height", "marginBottom", "maxWidth", "stylesheet"];
 
-var SkeletonItem = function SkeletonItem(props) {
-  var height = props.height,
-      marginBottom = props.marginBottom,
-      maxWidth = props.maxWidth,
-      customStylesheet = props.stylesheet,
-      otherProps = _objectWithoutProperties(props, ["height", "marginBottom", "maxWidth", "stylesheet"]);
+const SkeletonItem = props => {
+  const {
+    height,
+    marginBottom,
+    maxWidth,
+    stylesheet: customStylesheet
+  } = props,
+        otherProps = _objectWithoutProperties(props, _excluded);
 
-  var className = otherProps.className;
-
-
-  return React.createElement(
-    themeContext.ThemeContext.Consumer,
-    null,
-    function (_ref) {
-      var resolvedRoles = _ref.resolvedRoles;
-
-      var styles = stylesheet({
-        maxWidth: maxWidth,
-        marginBottom: marginBottom,
-        height: height,
-        stylesheet: customStylesheet
-      }, resolvedRoles);
-      return React.createElement("div", { className: emotion.cx(emotion.css(styles.skeletonItem), className) });
-    }
-  );
+  const {
+    className
+  } = otherProps;
+  return /*#__PURE__*/React__default["default"].createElement(themeContext.ThemeContext.Consumer, null, _ref => {
+    let {
+      resolvedRoles
+    } = _ref;
+    const styles = stylesheet({
+      maxWidth,
+      marginBottom,
+      height,
+      stylesheet: customStylesheet
+    }, resolvedRoles);
+    return /*#__PURE__*/React__default["default"].createElement("div", {
+      className: emotion.cx(emotion.css(styles.skeletonItem), className)
+    });
+  });
 };
 
 SkeletonItem.displayName = "SkeletonItem";
-
 SkeletonItem.propTypes = {
   /** Sets height of the skeleton item */
-  height: PropTypes.string,
+  height: PropTypes__default["default"].string,
+
   /** Sets max width of the skeleton item */
-  maxWidth: PropTypes.string,
+  maxWidth: PropTypes__default["default"].string,
+
   /** Sets spacing below the skeleton item */
-  marginBottom: PropTypes.string,
+  marginBottom: PropTypes__default["default"].string,
+
   /** Adds custom/overriding styles */
-  stylesheet: PropTypes.func
+  stylesheet: PropTypes__default["default"].func
 };
@@ -133,2 +175,2 @@ SkeletonItem.__docgenInfo = {
 
-exports.default = SkeletonItem;
+exports["default"] = SkeletonItem;

CHANGELOG.md

@@ -0,1 +1,8 @@
+# [@hig/skeleton-item-v2.2.0](https://github.com/Autodesk/hig/compare/@hig/skeleton-item@2.1.0...@hig/skeleton-item@2.2.0) (2022-09-05)
+
+
+### Features
+
+* update theme-data dependency ([999502d](https://github.com/Autodesk/hig/commit/999502d))
+
 # [@hig/skeleton-item-v2.1.0](https://github.com/Autodesk/hig/compare/@hig/skeleton-item@2.0.0...@hig/skeleton-item@2.1.0) (2022-01-24)
@@ -2,0 +9,0 @@

package.json

 {
   "name": "@hig/skeleton-item",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "description": "HIG SkeletonItem component",
@@ -33,3 +33,3 @@ "author": "Autodesk Inc.",
     "@hig/theme-context": "^4.0.0",
-    "@hig/theme-data": "^2.22.1",
+    "@hig/theme-data": "^3.2.0",
     "react": "^17.0.0"
@@ -36,0 +36,0 @@ },

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

Total package byte prevSize

16606

increased by10.05%

Lines of code

295

increased by29.96%

No dependency changes