easy-css-transform-builder - npm Package Compare versions

Comparing version 0.0.2 to 0.1.0

lib/index.js

 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.properties = exports.createCSSTransformBuilder = undefined;
-
-var _createCssTransformBuilder = require("./create-css-transform-builder");
-
-var _createCssTransformBuilder2 = _interopRequireDefault(_createCssTransformBuilder);
-
-var _properties2 = require("./properties");
-
-var _properties3 = _interopRequireDefault(_properties2);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-exports.createCSSTransformBuilder = _createCssTransformBuilder2.default;
-exports.properties = _properties3.default;
+Object.defineProperty(exports, "__esModule", { value: true });
+var createCSSTransformBuilder_1 = require("./createCSSTransformBuilder");
+exports.createCSSTransformBuilder = createCSSTransformBuilder_1.createCSSTransformBuilder;
+var properties_1 = require("./properties");
+exports.properties = properties_1.properties;

lib/properties.js

 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var UnitTypes = exports.UnitTypes = {
-  NONE: "none",
-  LENGTH: "length",
-  ANGLE: "angle"
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UnitTypes = {
+    NONE: 'none',
+    LENGTH: 'length',
+    ANGLE: 'angle',
 };
-
-var transformProperties = exports.transformProperties = [{ name: "translateX", unit: UnitTypes.LENGTH }, { name: "translateY", unit: UnitTypes.LENGTH }, { name: "translateZ", unit: UnitTypes.LENGTH }, { name: "translate", units: [UnitTypes.LENGTH, UnitTypes.LENGTH] }, { name: "translate3d", units: [UnitTypes.LENGTH, UnitTypes.LENGTH, UnitTypes.LENGTH] }, { name: "scale", unit: UnitTypes.NONE }, { name: "scale3d", units: [UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE] }, { name: "scaleX", unit: UnitTypes.NONE }, { name: "scaleY", unit: UnitTypes.NONE }, { name: "scaleZ", unit: UnitTypes.NONE }, { name: "rotate", unit: UnitTypes.ANGLE }, { name: "rotate3d", units: [UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.ANGLE] }, { name: "rotateX", unit: UnitTypes.ANGLE }, { name: "rotateY", unit: UnitTypes.ANGLE }, { name: "rotateZ", unit: UnitTypes.ANGLE }, { name: "skewX", unit: UnitTypes.ANGLE }, { name: "skewY", unit: UnitTypes.ANGLE }, { name: "perspective", unit: UnitTypes.LENGTH }, {
-  name: "matrix",
-  units: [UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE]
-}, {
-  name: "matrix3d",
-  units: [UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE, UnitTypes.NONE]
-}];
-
-var properties = transformProperties.map(function (prop) {
-  return prop.name;
-});
-
-exports.default = properties;
+exports.transformProperties = [
+    { name: 'translateX', unit: exports.UnitTypes.LENGTH },
+    { name: 'translateY', unit: exports.UnitTypes.LENGTH },
+    { name: 'translateZ', unit: exports.UnitTypes.LENGTH },
+    { name: 'translate', units: [exports.UnitTypes.LENGTH, exports.UnitTypes.LENGTH] },
+    { name: 'translate3d', units: [exports.UnitTypes.LENGTH, exports.UnitTypes.LENGTH, exports.UnitTypes.LENGTH] },
+    { name: 'scale', unit: exports.UnitTypes.NONE },
+    { name: 'scale3d', units: [exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE] },
+    { name: 'scaleX', unit: exports.UnitTypes.NONE },
+    { name: 'scaleY', unit: exports.UnitTypes.NONE },
+    { name: 'scaleZ', unit: exports.UnitTypes.NONE },
+    { name: 'rotate', unit: exports.UnitTypes.ANGLE },
+    { name: 'rotate3d', units: [exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.ANGLE] },
+    { name: 'rotateX', unit: exports.UnitTypes.ANGLE },
+    { name: 'rotateY', unit: exports.UnitTypes.ANGLE },
+    { name: 'rotateZ', unit: exports.UnitTypes.ANGLE },
+    { name: 'skewX', unit: exports.UnitTypes.ANGLE },
+    { name: 'skewY', unit: exports.UnitTypes.ANGLE },
+    { name: 'perspective', unit: exports.UnitTypes.LENGTH },
+    {
+        name: 'matrix',
+        units: [
+            exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE,
+            exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE,
+        ],
+    },
+    {
+        name: 'matrix3d',
+        units: [
+            exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE,
+            exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE,
+            exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE,
+            exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE, exports.UnitTypes.NONE,
+        ],
+    },
+];
+exports.properties = exports.transformProperties.map(function (prop) { return prop.name; });

package.json

 {
   "name": "easy-css-transform-builder",
-  "version": "0.0.2",
+  "version": "0.1.0",
   "description": "Easily build CSS transform values with JavaScript.",
   "main": "lib/index.js",
+  "types": "lib/index.d.ts",
   "scripts": {
-    "build": "babel src --out-dir lib",
-    "watch": "npm run test -- -w",
-    "test": "NODE_ENV=development mocha test/**/*.spec.js --compilers js:babel-register --recursive",
-    "lint": "eslint src/**/*.js test/**/*.js .eslintrc.js --no-ignore",
-    "prepublish": "npm run build"
+    "build": "tsc",
+    "clean": "rm -rf lib",
+    "test": "npm-run-all -s test:clean test:build -p test:lint test:unit",
+    "test:watch": "npm-run-all -p test:build:watch test:unit:watch",
+    "test:clean": "rm -rf tmp",
+    "test:build": "tsc -p test",
+    "test:build:watch": "npm run test:build -- --watch",
+    "test:lint": "tslint -c tslint.json \"src/**/*.ts\" \"test/**/*.ts\"",
+    "test:unit": "ava \"tmp/**/*.spec.js\"",
+    "test:unit:watch": "npm run test:unit -- --watch",
+    "prebuild": "npm run clean",
+    "posttest": "npm run test:clean",
+    "prepublishOnly": "npm run build"
   },
@@ -36,17 +45,12 @@ "repository": {
   "devDependencies": {
-    "babel-cli": "^6.18.0",
-    "babel-eslint": "^7.1.0",
-    "babel-preset-es2015": "^6.18.0",
-    "babel-preset-power-assert": "^1.0.0",
-    "babel-preset-stage-1": "^6.16.0",
-    "babel-register": "^6.18.0",
-    "babelify": "^7.3.0",
-    "eslint": "^3.10.1",
-    "jsdom": "^9.8.3",
-    "mocha": "^3.1.2",
-    "power-assert": "^1.4.2"
+    "ava": "^0.24.0",
+    "npm-run-all": "^4.1.2",
+    "power-assert": "^1.4.2",
+    "tslint": "^5.9.1",
+    "typescript": "^2.6.2"
   },
   "dependencies": {
+    "@types/invariant": "^2.2.29",
     "invariant": "^2.2.2"
   }
 }

README.md

@@ -1,3 +0,2 @@
-easy-css-transform-builder
-==========================
+# easy-css-transform-builder
 
@@ -7,9 +6,9 @@ [![Build Status](http://img.shields.io/travis/tsuyoshiwada/easy-css-transform-builder.svg?style=flat-square)](https://travis-ci.org/tsuyoshiwada/easy-css-transform-builder)
 [![David](https://img.shields.io/david/tsuyoshiwada/easy-css-transform-builder.svg?style=flat-square)](https://david-dm.org/tsuyoshiwada/easy-css-transform-builder)
-[![David dev](https://img.shields.io/david/dev/tsuyoshiwada/easy-css-transform-builder.svg?style=flat-square)](https://david-dm.org/tsuyoshiwada/easy-css-transform-builder/#info=devDependencies&view=table)
 [![License](https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square)](https://raw.githubusercontent.com/tsuyoshiwada/easy-css-transform-builder/master/LICENSE)
 
+> Easily build CSS transform values with JavaScript.
 
-Easily build CSS transform values with JavaScript.
 
 
+
 ## Install
@@ -22,2 +21,4 @@
 
+
+
 ## Usage
@@ -28,7 +29,7 @@
 ```javascript
-import { createCSSTransformBuilder } from "easy-css-transform-builder";
+import { createCSSTransformBuilder } from 'easy-css-transform-builder';
 
 const builder = createCSSTransformBuilder({
-  length: "px",
-  angle: "deg"
+  length: 'px',
+  angle: 'deg',
 });
@@ -40,3 +41,3 @@
   rotate3d: [1, 0, 0, 60],
-  skewY: "40rad"
+  skewY: '40rad',
 });
@@ -50,2 +51,3 @@
 
+
 ## API
@@ -85,18 +87,15 @@
   createCSSTransformBuilder,
-  properties
-} from "easy-css-transform-builder";
+  properties,
+} from 'easy-css-transform-builder';
 ```
 
 
-### `createCSSTransformBuilder(units = { length: "px", angle: "deg" })`
+### `createCSSTransformBuilder(units: object)`
 
 Create a Builder.
 
-**units: {Object}**  
-**return: {}**
-
 **Example:**
 
 ```javascript
-const builder = createCSSTransformBuilder({ length: "em", angle: "rad" })
+const builder = createCSSTransformBuilder({ length: 'em', angle: 'rad' });
 
@@ -107,3 +106,3 @@ builder({ translateY: 50 }); // translateY(50px)
 
-### `properties`
+### `properties: string[]`
 
@@ -129,8 +128,7 @@ An array of supported property names.
 ```javascript
-import React, { Component } from "react";
-import { createCSSTransformBuilder } from "easy-css-transform-builder";
+import React, { Component } from 'react';
+import { createCSSTransformBuilder } from 'easy-css-transform-builder';
 
 const builder = createCSSTransformBuilder();
 
-
 class MyComponent extends Component {
@@ -140,3 +138,3 @@ render() {
       <div style={{
-        background: "#efefef",
+        background: '#efefef',
         transform: builder({
@@ -157,25 +155,41 @@ translateX: 100,
 
-## License
 
-Released under the [MIT Licence](https://raw.githubusercontent.com/tsuyoshiwada/easy-css-transform-builder/master/LICENSE)
+## CHANGELOG
 
+See the [CHANGELOG.md](./CHANGELOG.md)
 
 
 
-## Author
 
-[tsuyoshiwada](https://github.com/tsuyoshiwada)
+## Contibute
 
+1. Fork it!
+1. Create your feature branch: `git checkout -b my-new-feature`
+1. Commit your changes: `git commit -am 'Add some feature'`
+1. Push to the branch: `git push origin my-new-feature`
+1. Submit a pull request :muscle:
 
+Bugs, feature requests and comments are more than welcome in the [issues](https://github.com/tsuyoshiwada/easy-css-transform-builder/issues).
 
-## Contribution
 
-Thank you for your interest in easy-css-transform-builder.js.
-Bugs, feature requests and comments are more than welcome in the [issues](https://github.com/tsuyoshiwada/easy-css-transform-builder/issues).
+### Development
 
-**Before you open a PR:**
+We will develop using the following npm scripts.
 
-Be careful to follow the code style of the project. Run `npm test` after your changes and ensure you do not introduce any new errors or warnings.
-All new features and changes need documentation.
 
-Thanks!
+#### `npm run build`
+
+Compile TypeScript and create type definitions.
+
+
+#### `npm run test`
+
+Run unit testing with Ava, And linting with TSLint.
+
+
+
+
+## License
+
+[MIT © tsuyoshiwada](./LICENSE)
+

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

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

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

Dev dependency count

5

decreased by-54.55%

Number of package files

14

increased by40%

Lines of code

352

increased by5.07%

Number of lines in readme file

186

increased by8.14%

Worsened metrics

Total package byte prevSize

17623

decreased by-0.12%

Dependency count

2

increased by100%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@types/invariant@^2.2.29

• + Added@types/invariant@2.2.37(transitive)