Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

postcss-button

Package Overview
Dependencies
Maintainers
1
Versions
49
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

postcss-button - npm Package Compare versions

Comparing version 0.1.21 to 0.2.0

5

CHANGELOG.md

@@ -0,1 +1,4 @@

0.1.3
- feat: option to use shorthand form inside atrules, and longhand form inside rules.
0.1.11

@@ -8,2 +11,2 @@ - fix: revert to display: inline-block

0.1.0
- mvp
- mvp

164

lib/index.js

@@ -13,2 +13,83 @@ 'use strict';

var propOption = function propOption(decl, optionsCurrent) {
var option = {};
var value = decl.value.split(/\s+(?![^\[]*\]|[^(]*\)|[^\{]*})/);
if (decl.prop.match(/^button$/)) {
Object.assign(option, optionsCurrent);
} else if (decl.prop.match(/^button-color-active$/)) {
option.colorActive = value[0];
} else if (decl.prop.match(/^button-color-hover$/)) {
option.colorHover = value[0];
} else if (decl.prop.match(/^button-background-color$/)) {
option.backgroundColor = value[0];
} else if (decl.prop.match(/^button-background-color-active$/)) {
option.backgroundColorActive = value[0];
} else if (decl.prop.match(/^button-background-color-hover$/)) {
option.backgroundColorHover = value[0];
} else if (decl.prop.match(/^border-width$/)) {
option.borderWidth = value[0];
} else if (decl.prop.match(/^button-border-color$/)) {
option.borderColor = value[0];
} else if (decl.prop.match(/^button-border-color-active$/)) {
option.borderColorActive = value[0];
} else if (decl.prop.match(/^button-border-color-hover$/)) {
option.borderColorHover = value[0];
} else if (decl.prop.match(/^button-class-active$/)) {
option.classActive = value[0];
} else if (decl.prop.match(/^button-class-disabled$/)) {
option.classDisabled = value[0];
} else if (decl.prop.match(/^button-color$/)) {
option.color = value[0];
if (value[1]) {
option.colorActive = value[1];
}
if (value[2]) {
option.colorHover = value[2];
}
} else if (decl.prop.match(/^button-background$/)) {
option.backgroundColor = value[0];
if (value[1]) {
option.backgroundColorActive = value[1];
}
if (value[2]) {
option.backgroundColorHover = value[2];
}
} else if (decl.prop.match(/^button-border$/)) {
option.borderWidth = value[0];
if (value[1]) {
option.borderColor = value[1];
}
if (value[2]) {
option.borderColorActive = value[2];
}
if (value[3]) {
option.borderColorHover = value[3];
}
} else if (decl.prop.match(/^button-class$/)) {
option.classActive = value[0];
if (value[1]) {
option.classDisabled = value[1];
}
}
return option;
};
var atruleOptions = function atruleOptions(node, options) {
var option = {};
node.walkDecls(function (decl) {
Object.assign(option, propOption(decl, options[decl.value]));
});
return option;
};
module.exports = _postcss2.default.plugin('postcss-button', function (opts) {

@@ -37,83 +118,12 @@ var options = {

if (node.type === 'atrule' && node.name.match(/^button/)) {
var name = node.params ? node.params : 'default';
var name = node.params || 'default';
options[name] = options[name] || {};
node.walkDecls(function (decl) {
if (decl.prop.match(/^border-width$/)) {
options[name].borderWidth = decl.value;
} else if (decl.prop.match(/^color$/)) {
options[name].color = decl.value;
} else if (decl.prop.match(/^background-color$/)) {
options[name].backgroundColor = decl.value;
} else if (decl.prop.match(/^border-color$/)) {
options[name].borderColor = decl.value;
} else if (decl.prop.match(/^color-active$/)) {
options[name].colorActive = decl.value;
} else if (decl.prop.match(/^background-color-active$/)) {
options[name].backgroundColorActive = decl.value;
} else if (decl.prop.match(/^border-color-active$/)) {
options[name].borderColorActive = decl.value;
} else if (decl.prop.match(/^color-hover$/)) {
options[name].colorHover = decl.value;
} else if (decl.prop.match(/^background-color-hover$/)) {
options[name].backgroundColorHover = decl.value;
} else if (decl.prop.match(/^border-color-hover$/)) {
options[name].borderColorHover = decl.value;
} else if (decl.prop.match(/^class-active$/)) {
options[name].classActive = decl.value;
} else if (decl.prop.match(/^class-disabled$/)) {
options[name].classDisabled = decl.value;
}
});
Object.assign(options[name], atruleOptions(node, options));
node.remove();
} else if (node.type === 'decl' && node.prop.match(/^button/)) {
options.tmp = options.tmp ? options.tmp : Object.assign({}, options.default);
var value = node.value.split(/\s+(?![^\[]*\]|[^(]*\)|[^\{]*})/);
} else if (node.parent.type === 'rule' && node.type === 'decl' && node.prop.match(/^button/)) {
options.tmp = options.tmp || options.default;
if (node.prop.match(/^button$/)) {
Object.assign(options.tmp, options[value[0]]);
} else if (node.prop.match(/^button-color$/)) {
options.tmp.color = value[0];
Object.assign(options.tmp, propOption(node, options[node.value]));
if (value[1]) {
options.tmp.colorActive = value[1];
}
if (value[2]) {
options.tmp.colorHover = value[2];
}
} else if (node.prop.match(/^button-background$/)) {
options.tmp.backgroundColor = value[0];
if (value[1]) {
options.tmp.backgroundColorActive = value[1];
}
if (value[2]) {
options.tmp.backgroundColorHover = value[2];
}
} else if (node.prop.match(/^button-border$/)) {
options.tmp.borderWidth = value[0];
if (value[1]) {
options.tmp.borderColor = value[1];
}
if (value[2]) {
options.tmp.borderColorActive = value[2];
}
if (value[3]) {
options.tmp.borderColorHover = value[3];
}
} else if (node.prop.match(/^button-class$/)) {
options.tmp.classActive = value[0];
if (value[1]) {
options.tmp.classDisabled = value[1];
}
}
if (options.tmp && !node.next()) {

@@ -125,3 +135,3 @@ (0, _button2.default)(node.parent, options.tmp);

node.remove();
} else if (options.tmp && !node.next()) {
} else if (node.parent.type === 'rule' && options.tmp && !node.next()) {
(0, _button2.default)(node.parent, options.tmp);

@@ -128,0 +138,0 @@ delete options.tmp;

{
"name": "postcss-button",
"version": "0.1.21",
"version": "0.2.0",
"description": "A PostCSS plugin to create buttons.",

@@ -23,3 +23,4 @@ "keywords": [

"dependencies": {
"postcss": "^6.0.13"
"postcss": "^6.0.13",
"ava": "^0.22.0"
},

@@ -32,3 +33,2 @@ "scripts": {

"devDependencies": {
"ava": "^0.22.0",
"babel-cli": "^6.26.0",

@@ -35,0 +35,0 @@ "babel-preset-es2015": "^6.24.1",

SocketSocket SOC 2 Logo

Product

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

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc