Socket
Socket
Sign inDemoInstall

rework

Package Overview
Dependencies
Maintainers
1
Versions
45
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

rework - npm Package Compare versions

Comparing version 0.14.0 to 0.15.0

6

component.json
{
"name": "rework",
"version": "0.14.0",
"version": "0.15.0",
"description": "CSS manipulations built on CSSOM",
"keywords": ["css", "manipulation", "preprocess", "transform"],
"dependencies": {
"visionmedia/css": "1.0.8",
"visionmedia/css": "1.3.0",
"visionmedia/debug": "*",

@@ -28,8 +28,6 @@ "component/color-parser": "0.1.0",

"lib/plugins/references.js",
"lib/plugins/opacity.js",
"lib/plugins/prefix-selectors.js",
"lib/plugins/prefix-value.js",
"lib/plugins/media.js",
"lib/plugins/prefix.js"
]
}

11

History.md
0.15.0 / 2013-06-01
==================
* remove opacity plugin. Closes #29
* remove media macros. Closes #36
* update css
* update css
* fix data uris in .url(), .function() too greed with argument splitting. Closes #81
* fix easing functions with animation and timing properties. Closes #83
* remove rework(1) executable, use https://github.com/visionmedia/styl
0.14.0 / 2013-04-10

@@ -3,0 +14,0 @@ ==================

24

lib/plugins/at2x.js

@@ -39,2 +39,4 @@

var backgroundSize = rule.declarations.filter(backgroundWithSize).map(value)[0] || 'contain';
rule.declarations.filter(backgroundWithURL).forEach(function(decl){

@@ -54,8 +56,11 @@ // parse url

style.rules.push({
type: 'media',
media: 'all and (-webkit-min-device-pixel-ratio: 1.5)',
rules: [
{
type: 'rule',
selectors: rule.selectors,
declarations: [
{
type: 'declaration',
property: 'background-image',

@@ -65,4 +70,5 @@ value: 'url("' + url + '")'

{
type: 'declaration',
property: 'background-size',
value: 'contain'
value: backgroundSize
}

@@ -92,1 +98,17 @@ ]

}
/**
* Predicate on background-size property.
*/
function backgroundWithSize(decl) {
return 'background-size' == decl.property;
}
/**
* Return value atribute of a declaration.
*/
function value(decl) {
return decl.value;
}

2

lib/plugins/ease.js

@@ -75,3 +75,3 @@

var decl = declarations[i];
if (!~decl.property.indexOf('transition')) continue;
if (!decl.property.match(/transition|animation|timing/)) continue;
for (var k = 0; k < keys.length; ++k) {

@@ -78,0 +78,0 @@ var key = keys[k];

14

lib/plugins/function.js

@@ -7,3 +7,4 @@

var visit = require('../visit')
, utils = require('../utils');
, utils = require('../utils')
, strip = utils.stripQuotes;

@@ -14,3 +15,3 @@ /**

module.exports = function(functions) {
module.exports = function(functions, args) {
if (!functions) throw new Error('functions object required');

@@ -20,3 +21,3 @@ return function(style, rework){

for (var name in functions) {
func(declarations, name, functions[name]);
func(declarations, name, functions[name], args);
}

@@ -43,6 +44,8 @@ });

* @param {Object} functions
* @param {Boolean} [parseArgs]
* @api private
*/
function func(declarations, name, func) {
function func(declarations, name, func, parseArgs) {
if (false !== parseArgs) parseArgs = true;
var regexp = new RegExp(escape(name) + '\\(([^\)]+)\\)', 'g');

@@ -52,3 +55,4 @@ declarations.forEach(function(decl){

decl.value = decl.value.replace(regexp, function(_, args){
args = args.split(/,\s*/).map(utils.stripQuotes);
if (!parseArgs) return func.call(decl, strip(args));
args = args.split(/,\s*/).map(strip);
return func.apply(decl, args);

@@ -55,0 +59,0 @@ });

5

lib/plugins/keyframes.js

@@ -65,2 +65,3 @@

var clone = { name: rule.name };
clone.type = 'keyframes';
clone.vendor = rule.vendor;

@@ -83,5 +84,7 @@ clone.keyframes = [];

var clone = {};
clone.type = 'keyframe';
clone.values = keyframe.values.slice();
clone.declarations = keyframe.declarations.map(function(decl){
return {
type: 'declaration',
property: decl.property,

@@ -92,2 +95,2 @@ value: decl.value

return clone;
}
}

1

lib/plugins/mixin.js

@@ -44,2 +44,3 @@

declarations.splice(i++, 0, {
type: 'declaration',
property: key,

@@ -46,0 +47,0 @@ value: ret[key]

1

lib/plugins/prefix-value.js

@@ -47,2 +47,3 @@

declarations.splice(i++, 0, {
type: 'declaration',
property: prop,

@@ -49,0 +50,0 @@ value: decl.value.replace(value, vendor + value)

1

lib/plugins/prefix.js

@@ -48,2 +48,3 @@

declarations.push({
type: 'declaration',
property: vendors[k] + decl.property,

@@ -50,0 +51,0 @@ value: decl.value

10

lib/plugins/url.js

@@ -25,7 +25,7 @@

module.exports = function(fn) {
return func({ url: url });
function url(path){
return 'url("' + fn(path) + '")';
};
return func({
url: function(path){
return 'url("' + fn(path) + '")';
}
}, false);
};

3

lib/properties.js

@@ -74,3 +74,4 @@

'wrap-padding',
'wrap-through'
'wrap-through',
'overflow-scrolling'
];

11

lib/rework.js

@@ -93,3 +93,2 @@

exports.media = require('./plugins/media');
exports.mixin = exports.mixins = require('./plugins/mixin');

@@ -104,3 +103,2 @@ exports.function = exports.functions = require('./plugins/function');

exports.keyframes = require('./plugins/keyframes');
exports.opacity = require('./plugins/opacity');
exports.at2x = require('./plugins/at2x');

@@ -110,2 +108,9 @@ exports.url = require('./plugins/url');

exports.vars = require('./plugins/vars');
exports.inline = require('./plugins/inline');
/**
* Try/catch plugins unavailable in component.
*/
try {
exports.inline = require('./plugins/inline');
} catch (err) {};

9

package.json
{
"name": "rework",
"version": "0.14.0",
"version": "0.15.0",
"description": "CSS manipulations built on CSSOM",
"keywords": ["css", "manipulation", "preprocess", "transform"],
"author": "TJ Holowaychuk <tj@vision-media.ca>",
"bin": {
"rework": "./bin/rework"
"repository": {
"type": "git",
"url": "git://github.com/visionmedia/rework.git"
},
"dependencies": {
"css": "1.1.0",
"css": "1.3.0",
"commander": "1.0.4",

@@ -13,0 +14,0 @@ "color-parser": "0.1.0",

113

Readme.md

@@ -26,24 +26,7 @@ # rework

## rework(1)
## Built with rework
```
- [styl](https://github.com/visionmedia/styl) - CSS preprocessor built on Rework
- [autoprefixer](https://github.com/ai/autoprefixer) - prefixer based on the Can I Use database
Usage: rework [options]
Options:
-h, --help output usage information
-V, --version output the version number
-v, --vendors <list> specify list of vendors
-e, --ease add additional easing functions
--vars add css variable support
```
for example:
```
$ rework -v webkit,moz < my.css > my.reworked.css
```
## API

@@ -76,3 +59,3 @@

- [media macros](#mediaobj) — define your own __@media__ queries
- [extend](#extend) — add `extend: selector` support
- [ease](#ease) — several additional easing functions

@@ -83,11 +66,11 @@ - [at2x](#at2xvendors) — serve high resolution images

- [prefixSelectors](#prefixselectorsstring) — add prefixes to selectors
- [opacity](#opacity) — add IE opacity support
- [url](#urlcallback) — rewrite `url()`s with a callback function
- [vars](#varsobject) — add css variable support
- [keyframes](#keyframesvendors) — add __@keyframe__ vendor prefixing
- [colors](#colors) — add colour helpers like `rgba(#fc0, .5)`
- [mixin](#mixinobject) — add custom property logic with mixing
- [function](#functionobject) — Add user-defined CSS functions
- [references](#references) — add property references support `height: @width` etc
- [mixin](#mixinobjects) — add custom property logic with mixing
- [extend](#extend) — add `extend: selector` support
- [vars](#varsobject) — add css variable support
### .extend()

@@ -190,45 +173,2 @@

### .media(obj)
Define media macros with the given `obj`.
For example define two contrived custom media types, "phone" and "phone-landscape":
```js
style.use(rework.media({
'phone': 'only screen and (min-device-width : 320px) and (max-device-width : 480px)',
'phone-landscape': 'only screen and (min-width : 321px)'
}))
```
```css
@media phone {
body {
background: 'green'
}
}
@media phone-landscape {
body {
background: 'red'
}
}
```
yields:
```css
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
body {
background: 'green'
}
}
@media only screen and (min-width : 321px) {
body {
background: 'red'
}
}
```
### .ease()

@@ -407,37 +347,2 @@

### .opacity()
Add IE opacity support.
```css
ul {
opacity: 1 !important;
}
```
yields:
```css
ul {
opacity: 1 !important;
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100) !important;
filter: alpha(opacity=100) !important
}
```
### .url(callback)
Map `url()` calls, useful for inlining images as data-uris, converting
relative paths to absolute etc.
```js
function rewrite(url) {
return 'http://example.com' + url;
}
rework(str)
.use(rework.url(rewrite))
.toString()
```
### .mixin(object)

@@ -677,3 +582,3 @@

Of cource, you can use inline only with node. It is not available
Of course, you can use inline only with node. It is not available
in the browser with component.

@@ -680,0 +585,0 @@

4

testing/index.js

@@ -9,5 +9,3 @@

str = rework(str)
.vendors(vendors)
.use(rework.colors())
.use(rework.prefix('linear-gradient'))
.use(rework.prefixSelector(''))
.toString();

@@ -14,0 +12,0 @@ 

bin/rework
lib/plugins/media.js
lib/plugins/opacity.js
.travis.yml

Sorry, the diff of this file is not supported yet

Makefile

Sorry, the diff of this file is not supported yet

testing/index.css

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc