@material/animation - npm Package Compare versions

Comparing version 0.3.1 to 0.4.0

dist/mdc.animation.js

@@ -86,3 +86,3 @@ /*!
 
-module.exports = __webpack_require__(9);
+module.exports = __webpack_require__(8);
 
@@ -92,3 +92,3 @@
 
-/***/ 9:
+/***/ 8:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
@@ -95,0 +95,0 @@

dist/mdc.animation.min.js

@@ -6,2 +6,2 @@ /*!
 */
-!function(t,n){"object"==typeof exports&&"object"==typeof module?module.exports=n():"function"==typeof define&&define.amd?define([],n):"object"==typeof exports?exports.animation=n():(t.mdc=t.mdc||{},t.mdc.animation=n())}(this,function(){return function(t){function n(i){if(e[i])return e[i].exports;var r=e[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}var e={};return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:i})},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,n){return Object.prototype.hasOwnProperty.call(t,n)},n.p="/assets/",n(n.s=23)}({23:function(t,n,e){t.exports=e(9)},9:function(t,n,e){"use strict";function i(t){return void 0!==t.document&&"function"==typeof t.document.createElement}function r(t){return t in s||t in c}function o(t,n,e){return n[t].styleProperty in e.style?n[t].noPrefix:n[t].webkitPrefix}function a(t,n){if(!i(t)||!r(n))return n;var e=n in s?s:c,a=t.document.createElement("div");return e===s?o(n,e,a):e[n].noPrefix in a.style?e[n].noPrefix:e[n].webkitPrefix}function f(t,n){return a(t,n)}function u(t,n){return a(t,n)}Object.defineProperty(n,"__esModule",{value:!0}),e.d(n,"transformStyleProperties",function(){return m}),n.getCorrectEventName=f,n.getCorrectPropertyName=u;var s={animationstart:{noPrefix:"animationstart",webkitPrefix:"webkitAnimationStart",styleProperty:"animation"},animationend:{noPrefix:"animationend",webkitPrefix:"webkitAnimationEnd",styleProperty:"animation"},animationiteration:{noPrefix:"animationiteration",webkitPrefix:"webkitAnimationIteration",styleProperty:"animation"},transitionend:{noPrefix:"transitionend",webkitPrefix:"webkitTransitionEnd",styleProperty:"transition"}},c={animation:{noPrefix:"animation",webkitPrefix:"-webkit-animation"},transform:{noPrefix:"transform",webkitPrefix:"-webkit-transform"},transition:{noPrefix:"transition",webkitPrefix:"-webkit-transition"}},m=["transform","WebkitTransform","MozTransform","OTransform","MSTransform"]}})});
+!function(t,n){"object"==typeof exports&&"object"==typeof module?module.exports=n():"function"==typeof define&&define.amd?define([],n):"object"==typeof exports?exports.animation=n():(t.mdc=t.mdc||{},t.mdc.animation=n())}(this,function(){return function(t){function n(i){if(e[i])return e[i].exports;var r=e[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}var e={};return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:i})},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,n){return Object.prototype.hasOwnProperty.call(t,n)},n.p="/assets/",n(n.s=23)}({23:function(t,n,e){t.exports=e(8)},8:function(t,n,e){"use strict";function i(t){return void 0!==t.document&&"function"==typeof t.document.createElement}function r(t){return t in s||t in c}function o(t,n,e){return n[t].styleProperty in e.style?n[t].noPrefix:n[t].webkitPrefix}function a(t,n){if(!i(t)||!r(n))return n;var e=n in s?s:c,a=t.document.createElement("div");return e===s?o(n,e,a):e[n].noPrefix in a.style?e[n].noPrefix:e[n].webkitPrefix}function f(t,n){return a(t,n)}function u(t,n){return a(t,n)}Object.defineProperty(n,"__esModule",{value:!0}),e.d(n,"transformStyleProperties",function(){return m}),n.getCorrectEventName=f,n.getCorrectPropertyName=u;var s={animationstart:{noPrefix:"animationstart",webkitPrefix:"webkitAnimationStart",styleProperty:"animation"},animationend:{noPrefix:"animationend",webkitPrefix:"webkitAnimationEnd",styleProperty:"animation"},animationiteration:{noPrefix:"animationiteration",webkitPrefix:"webkitAnimationIteration",styleProperty:"animation"},transitionend:{noPrefix:"transitionend",webkitPrefix:"webkitTransitionEnd",styleProperty:"transition"}},c={animation:{noPrefix:"animation",webkitPrefix:"-webkit-animation"},transform:{noPrefix:"transform",webkitPrefix:"-webkit-transform"},transition:{noPrefix:"transition",webkitPrefix:"-webkit-transition"}},m=["transform","WebkitTransform","MozTransform","OTransform","MSTransform"]}})});

package.json

 {
   "name": "@material/animation",
   "description": "Animation Variables and Mixins used by Material Components for the web",
-  "version": "0.3.1",
+  "version": "0.4.0",
   "license": "Apache-2.0",
@@ -6,0 +6,0 @@ "keywords": [

README.md

@@ -30,37 +30,7 @@ <!--docs:
 
-### CSS Classes
+### Sass Variables
 
-Some components already use a set curve for their animation. For example, MDC Checkbox uses deceleration curve for its checkmark animation.
+We provide timing functions which you can use with the `animation` or `transition` CSS properties
 
-If you want to animate an element that is not a Material Design component, you can apply the following CSS classes.
-
-CSS Class | Description
---- | ---
-`mdc-animation-deceleration-curve` | Sets the `animation-timing-function` to deceleration curve
-`mdc-animation-standard-curve` | Sets the `animation-timing-function` to standard curve, a.k.a quickly accelerate and slowly decelerate
-`mdc-animation-acceleration-curve` | Sets the `animation-timing-function` to acceleration curve
-`mdc-animation-sharp-curve` | Sets the `animation-timing-function` to sharp curve, a.k.a quickly accelerate and decelerate
-
-### Sass Variables and Mixins
-
-Instead of setting CSS classes on elements, you can use the Sass mixins to achieve the same goal.
-
 ```scss
-@import "@material/animation/mixins";
-
-.my-element--animating {
-  @include mdc-animation-acceleration-curve;
-}
-```
-
-Mixin | Description
---- | ---
-`mdc-animation-deceleration-curve` | Sets the `animation-timing-function` to deceleration curve
-`mdc-animation-standard-curve` | Sets the `animation-timing-function` to standard curve, a.k.a quickly accelerate and slowly decelerate
-`mdc-animation-acceleration-curve` | Sets the `animation-timing-function` to acceleration curve
-`mdc-animation-sharp-curve` | Sets the `animation-timing-function` to sharp curve, a.k.a quickly accelerate and decelerate
-
-We also provide the timing functions used by these mixins, which you can use with the `animation` or `transition` CSS properties
-
-```scss
 @import "@material/animation/variables";
@@ -67,0 +37,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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

19885

decreased by-16.27%

Number of package files

9

decreased by-18.18%

Lines of code

366

decreased by-0.81%

Number of lines in readme file

107

decreased by-21.9%

No dependency changes