First version
This commit is contained in:
40
CTOAsYouGo/node_modules/postcss-js/CHANGELOG.md
generated
vendored
Normal file
40
CTOAsYouGo/node_modules/postcss-js/CHANGELOG.md
generated
vendored
Normal file
@@ -0,0 +1,40 @@
|
||||
# Change Log
|
||||
This project adheres to [Semantic Versioning](http://semver.org/).
|
||||
|
||||
## 2.0.3
|
||||
* Fix `from` option warning.
|
||||
|
||||
## 2.0.2
|
||||
* Fix `!important` support (by Adam Wathan).
|
||||
|
||||
## 2.0.1
|
||||
* Improve objectifier performance.
|
||||
* Do not change source `Root` in objectifier.
|
||||
|
||||
## 2.0.0
|
||||
* Remove Node.js 9 and Node.js 4 support.
|
||||
* Use PostCSS 7.0.
|
||||
|
||||
## 1.0.1
|
||||
* Ignore nodes with `undefined` value.
|
||||
|
||||
## 1.0
|
||||
* Use PostCSS 6.0.
|
||||
|
||||
## 0.3
|
||||
* Add support for at-rules with same name (like `@font-face`).
|
||||
|
||||
## 0.2
|
||||
* Add `!important` support (by Dan Lynch).
|
||||
|
||||
## 0.1.3
|
||||
* Fix rules merge with at-rules.
|
||||
|
||||
## 0.1.2
|
||||
* Add `cssFloat` alias support.
|
||||
|
||||
## 0.1.1
|
||||
* Fix losing rules in parser on same selector (by Bogdan Chadkin).
|
||||
|
||||
## 0.1
|
||||
* Initial release.
|
||||
144
CTOAsYouGo/node_modules/postcss-js/README.md
generated
vendored
144
CTOAsYouGo/node_modules/postcss-js/README.md
generated
vendored
@@ -1,22 +1,138 @@
|
||||
# PostCSS JS
|
||||
# PostCSS JS [![Build Status][ci-img]][ci]
|
||||
|
||||
<img align="right" width="135" height="95"
|
||||
<img align="right" width="95" height="95"
|
||||
title="Philosopher’s stone, logo of PostCSS"
|
||||
src="https://postcss.org/logo-leftp.svg">
|
||||
src="http://postcss.github.io/postcss/logo.svg">
|
||||
|
||||
[PostCSS] for CSS-in-JS and styles in JS objects.
|
||||
[PostCSS] for React Inline Styles, Radium, JSS and other CSS-in-JS.
|
||||
|
||||
For example, to use [Stylelint] or [RTLCSS] plugins in your workflow.
|
||||
For example, to use [Stylelint], [RTLCSS] or [postcss-write-svg] plugins
|
||||
in your workflow.
|
||||
|
||||
<a href="https://evilmartians.com/?utm_source=postcss-js">
|
||||
<img src="https://evilmartians.com/badges/sponsored-by-evil-martians.svg"
|
||||
alt="Sponsored by Evil Martians" width="236" height="54">
|
||||
</a>
|
||||
[postcss-write-svg]: https://github.com/jonathantneal/postcss-write-svg
|
||||
[Stylelint]: https://github.com/stylelint/stylelint
|
||||
[PostCSS]: https://github.com/postcss/postcss
|
||||
[RTLCSS]: https://github.com/MohammadYounes/rtlcss
|
||||
[ci-img]: https://travis-ci.org/postcss/postcss-js.svg
|
||||
[ci]: https://travis-ci.org/postcss/postcss-js
|
||||
|
||||
[Stylelint]: https://github.com/stylelint/stylelint
|
||||
[PostCSS]: https://github.com/postcss/postcss
|
||||
[RTLCSS]: https://github.com/MohammadYounes/rtlcss
|
||||
## Usage
|
||||
|
||||
### Installation
|
||||
|
||||
## Docs
|
||||
Read full docs **[here](https://github.com/postcss/postcss-js#readme)**.
|
||||
```sh
|
||||
npm i postcss-js
|
||||
```
|
||||
|
||||
### Processing
|
||||
|
||||
```js
|
||||
const postcssJs = require('postcss-js')
|
||||
const autoprefixer = require('autoprefixer')
|
||||
|
||||
const prefixer = postcssJs.sync([ autoprefixer ]);
|
||||
|
||||
const style = prefixer({
|
||||
userSelect: 'none'
|
||||
});
|
||||
|
||||
style //=> {
|
||||
// WebkitUserSelect: 'none',
|
||||
// MozUserSelect: 'none',
|
||||
// msUserSelect: 'none',
|
||||
// userSelect: 'none'
|
||||
// }
|
||||
```
|
||||
|
||||
### Compile CSS-in-JS to CSS
|
||||
|
||||
```js
|
||||
const postcss = require('postcss')
|
||||
const postcssJs = require('postcss-js')
|
||||
|
||||
const style = {
|
||||
top: 10,
|
||||
'&:hover': {
|
||||
top: 5
|
||||
}
|
||||
};
|
||||
|
||||
postcss().process(style, { parser: postcssJs }).then( (result) => {
|
||||
result.css //=> top: 10px;
|
||||
// &:hover { top: 5px; }
|
||||
})
|
||||
```
|
||||
|
||||
### Compile CSS to CSS-in-JS
|
||||
|
||||
```js
|
||||
const postcss = require('postcss')
|
||||
const postcssJs = require('postcss-js')
|
||||
|
||||
const css = '@media screen { z-index: 1 }'
|
||||
const root = postcss.parse(css);
|
||||
|
||||
postcssJs.objectify(root) //=> { '@media screen': { zIndex: '1' } }
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
### `sync(plugins): function`
|
||||
|
||||
Create PostCSS processor with simple API, but with only sync PostCSS plugins
|
||||
support.
|
||||
|
||||
Processor is just a function, which takes one style object and return other.
|
||||
|
||||
### `async(plugins): function`
|
||||
|
||||
Same as `sync`, but also support async plugins.
|
||||
|
||||
Returned processor will return Promise.
|
||||
|
||||
### `parse(obj): Root`
|
||||
|
||||
Parse CSS-in-JS style object to PostCSS `Root` instance.
|
||||
|
||||
It converts numbers to pixels and parses
|
||||
[Free Style] like selectors and at-rules:
|
||||
|
||||
```js
|
||||
{
|
||||
'@media screen': {
|
||||
'&:hover': {
|
||||
top: 10
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
This methods use Custom Syntax name convention, so you can use it like this:
|
||||
|
||||
```js
|
||||
postcss().process(obj, { parser: postcssJs })
|
||||
```
|
||||
|
||||
### `objectify(root): object`
|
||||
|
||||
Convert PostCSS `Root` instance to CSS-in-JS style object.
|
||||
|
||||
## Troubleshoot
|
||||
|
||||
Webpack may need some extra config for some PostCSS plugins.
|
||||
|
||||
### `Module parse failed`
|
||||
|
||||
Autoprefixer and some other plugins
|
||||
need a [json-loader](https://github.com/webpack/json-loader) to import data.
|
||||
|
||||
So, please install this loader and add to webpack config:
|
||||
|
||||
```js
|
||||
loaders: [
|
||||
{
|
||||
test: /\.json$/,
|
||||
loader: "json-loader"
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
17
CTOAsYouGo/node_modules/postcss-js/async.js
generated
vendored
17
CTOAsYouGo/node_modules/postcss-js/async.js
generated
vendored
@@ -1,15 +1,14 @@
|
||||
let postcss = require('postcss')
|
||||
var postcss = require('postcss')
|
||||
|
||||
let processResult = require('./process-result')
|
||||
let parse = require('./parser')
|
||||
var processResult = require('./process-result')
|
||||
var parse = require('./parser')
|
||||
|
||||
module.exports = function async(plugins) {
|
||||
let processor = postcss(plugins)
|
||||
return async input => {
|
||||
let result = await processor.process(input, {
|
||||
module.exports = function (plugins) {
|
||||
var processor = postcss(plugins)
|
||||
return function (input) {
|
||||
return processor.process(input, {
|
||||
parser: parse,
|
||||
from: undefined
|
||||
})
|
||||
return processResult(result)
|
||||
}).then(processResult)
|
||||
}
|
||||
}
|
||||
|
||||
16
CTOAsYouGo/node_modules/postcss-js/index.js
generated
vendored
16
CTOAsYouGo/node_modules/postcss-js/index.js
generated
vendored
@@ -1,11 +1,11 @@
|
||||
let objectify = require('./objectifier')
|
||||
let parse = require('./parser')
|
||||
let async = require('./async')
|
||||
let sync = require('./sync')
|
||||
var objectify = require('./objectifier')
|
||||
var parse = require('./parser')
|
||||
var async = require('./async')
|
||||
var sync = require('./sync')
|
||||
|
||||
module.exports = {
|
||||
objectify,
|
||||
parse,
|
||||
async,
|
||||
sync
|
||||
objectify: objectify,
|
||||
parse: parse,
|
||||
async: async,
|
||||
sync: sync
|
||||
}
|
||||
|
||||
8
CTOAsYouGo/node_modules/postcss-js/index.mjs
generated
vendored
8
CTOAsYouGo/node_modules/postcss-js/index.mjs
generated
vendored
@@ -1,8 +0,0 @@
|
||||
import index from './index.js'
|
||||
|
||||
export default index
|
||||
|
||||
export const objectify = index.objectify
|
||||
export const parse = index.parse
|
||||
export const async = index.async
|
||||
export const sync = index.sync
|
||||
54
CTOAsYouGo/node_modules/postcss-js/objectifier.js
generated
vendored
54
CTOAsYouGo/node_modules/postcss-js/objectifier.js
generated
vendored
@@ -1,31 +1,6 @@
|
||||
let camelcase = require('camelcase-css')
|
||||
var camelcase = require('camelcase-css')
|
||||
|
||||
let UNITLESS = {
|
||||
boxFlex: true,
|
||||
boxFlexGroup: true,
|
||||
columnCount: true,
|
||||
flex: true,
|
||||
flexGrow: true,
|
||||
flexPositive: true,
|
||||
flexShrink: true,
|
||||
flexNegative: true,
|
||||
fontWeight: true,
|
||||
lineClamp: true,
|
||||
lineHeight: true,
|
||||
opacity: true,
|
||||
order: true,
|
||||
orphans: true,
|
||||
tabSize: true,
|
||||
widows: true,
|
||||
zIndex: true,
|
||||
zoom: true,
|
||||
fillOpacity: true,
|
||||
strokeDashoffset: true,
|
||||
strokeOpacity: true,
|
||||
strokeWidth: true
|
||||
}
|
||||
|
||||
function atRule(node) {
|
||||
function atRule (node) {
|
||||
if (typeof node.nodes === 'undefined') {
|
||||
return true
|
||||
} else {
|
||||
@@ -33,11 +8,11 @@ function atRule(node) {
|
||||
}
|
||||
}
|
||||
|
||||
function process(node) {
|
||||
let name
|
||||
let result = {}
|
||||
function process (node) {
|
||||
var name
|
||||
var result = { }
|
||||
|
||||
node.each(child => {
|
||||
node.each(function (child) {
|
||||
if (child.type === 'atrule') {
|
||||
name = '@' + child.name
|
||||
if (child.params) name += ' ' + child.params
|
||||
@@ -49,26 +24,17 @@ function process(node) {
|
||||
result[name] = [result[name], atRule(child)]
|
||||
}
|
||||
} else if (child.type === 'rule') {
|
||||
let body = process(child)
|
||||
var body = process(child)
|
||||
if (result[child.selector]) {
|
||||
for (let i in body) {
|
||||
for (var i in body) {
|
||||
result[child.selector][i] = body[i]
|
||||
}
|
||||
} else {
|
||||
result[child.selector] = body
|
||||
}
|
||||
} else if (child.type === 'decl') {
|
||||
if (child.prop[0] === '-' && child.prop[1] === '-') {
|
||||
name = child.prop
|
||||
} else if (child.parent && child.parent.selector === ':export') {
|
||||
name = child.prop
|
||||
} else {
|
||||
name = camelcase(child.prop)
|
||||
}
|
||||
let value = child.value
|
||||
if (!isNaN(child.value) && UNITLESS[name]) {
|
||||
value = parseFloat(child.value)
|
||||
}
|
||||
name = camelcase(child.prop)
|
||||
var value = child.value
|
||||
if (child.important) value += ' !important'
|
||||
if (typeof result[name] === 'undefined') {
|
||||
result[name] = value
|
||||
|
||||
29
CTOAsYouGo/node_modules/postcss-js/package.json
generated
vendored
29
CTOAsYouGo/node_modules/postcss-js/package.json
generated
vendored
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "postcss-js",
|
||||
"version": "4.0.1",
|
||||
"description": "PostCSS for CSS-in-JS and styles in JS objects",
|
||||
"version": "2.0.3",
|
||||
"description": "PostCSS for React Inline Styles, Radium, Free Style and other CSS-in-JS",
|
||||
"keywords": [
|
||||
"postcss",
|
||||
"postcss-runner",
|
||||
@@ -14,29 +14,8 @@
|
||||
"author": "Andrey Sitnik <andrey@sitnik.ru>",
|
||||
"license": "MIT",
|
||||
"repository": "postcss/postcss-js",
|
||||
"engines": {
|
||||
"node": "^12 || ^14 || >= 16"
|
||||
},
|
||||
"exports": {
|
||||
".": {
|
||||
"require": "./index.js",
|
||||
"import": "./index.mjs"
|
||||
},
|
||||
"./package.json": "./package.json",
|
||||
"./async": "./async.js",
|
||||
"./objectifier": "./objectifier.js",
|
||||
"./parser": "./parser.js",
|
||||
"./process-result": "./process-result.js",
|
||||
"./sync": "./sync.js"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/postcss/"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"postcss": "^8.4.21"
|
||||
},
|
||||
"dependencies": {
|
||||
"camelcase-css": "^2.0.1"
|
||||
"camelcase-css": "^2.0.1",
|
||||
"postcss": "^7.0.18"
|
||||
}
|
||||
}
|
||||
|
||||
71
CTOAsYouGo/node_modules/postcss-js/parser.js
generated
vendored
71
CTOAsYouGo/node_modules/postcss-js/parser.js
generated
vendored
@@ -1,8 +1,8 @@
|
||||
let postcss = require('postcss')
|
||||
var postcss = require('postcss')
|
||||
|
||||
let IMPORTANT = /\s*!important\s*$/i
|
||||
var IMPORTANT = /\s*!important\s*$/i
|
||||
|
||||
let UNITLESS = {
|
||||
var unitless = {
|
||||
'box-flex': true,
|
||||
'box-flex-group': true,
|
||||
'column-count': true,
|
||||
@@ -27,22 +27,19 @@ let UNITLESS = {
|
||||
'stroke-width': true
|
||||
}
|
||||
|
||||
function dashify(str) {
|
||||
function dashify (str) {
|
||||
return str
|
||||
.replace(/([A-Z])/g, '-$1')
|
||||
.replace(/^ms-/, '-ms-')
|
||||
.toLowerCase()
|
||||
}
|
||||
|
||||
function decl(parent, name, value) {
|
||||
function decl (parent, name, value) {
|
||||
if (value === false || value === null) return
|
||||
|
||||
if (!name.startsWith('--')) {
|
||||
name = dashify(name)
|
||||
}
|
||||
|
||||
name = dashify(name)
|
||||
if (typeof value === 'number') {
|
||||
if (value === 0 || UNITLESS[name]) {
|
||||
if (value === 0 || unitless[name]) {
|
||||
value = value.toString()
|
||||
} else {
|
||||
value += 'px'
|
||||
@@ -53,14 +50,14 @@ function decl(parent, name, value) {
|
||||
|
||||
if (IMPORTANT.test(value)) {
|
||||
value = value.replace(IMPORTANT, '')
|
||||
parent.push(postcss.decl({ prop: name, value, important: true }))
|
||||
parent.push(postcss.decl({ prop: name, value: value, important: true }))
|
||||
} else {
|
||||
parent.push(postcss.decl({ prop: name, value }))
|
||||
parent.push(postcss.decl({ prop: name, value: value }))
|
||||
}
|
||||
}
|
||||
|
||||
function atRule(parent, parts, value) {
|
||||
let node = postcss.atRule({ name: parts[1], params: parts[3] || '' })
|
||||
function atRule (parent, parts, value) {
|
||||
var node = postcss.atRule({ name: parts[1], params: parts[3] || '' })
|
||||
if (typeof value === 'object') {
|
||||
node.nodes = []
|
||||
parse(value, node)
|
||||
@@ -68,37 +65,39 @@ function atRule(parent, parts, value) {
|
||||
parent.push(node)
|
||||
}
|
||||
|
||||
function parse(obj, parent) {
|
||||
let name, value, node
|
||||
function parse (obj, parent) {
|
||||
var name, value, node, i
|
||||
for (name in obj) {
|
||||
value = obj[name]
|
||||
if (value === null || typeof value === 'undefined') {
|
||||
continue
|
||||
} else if (name[0] === '@') {
|
||||
let parts = name.match(/@(\S+)(\s+([\W\w]*)\s*)?/)
|
||||
if (Array.isArray(value)) {
|
||||
for (let i of value) {
|
||||
atRule(parent, parts, i)
|
||||
if (obj.hasOwnProperty(name)) {
|
||||
value = obj[name]
|
||||
if (value === null || typeof value === 'undefined') {
|
||||
continue
|
||||
} else if (name[0] === '@') {
|
||||
var parts = name.match(/@([^\s]+)(\s+([\w\W]*)\s*)?/)
|
||||
if (Array.isArray(value)) {
|
||||
for (i = 0; i < value.length; i++) {
|
||||
atRule(parent, parts, value[i])
|
||||
}
|
||||
} else {
|
||||
atRule(parent, parts, value)
|
||||
}
|
||||
} else if (Array.isArray(value)) {
|
||||
for (i = 0; i < value.length; i++) {
|
||||
decl(parent, name, value[i])
|
||||
}
|
||||
} else if (typeof value === 'object') {
|
||||
node = postcss.rule({ selector: name })
|
||||
parse(value, node)
|
||||
parent.push(node)
|
||||
} else {
|
||||
atRule(parent, parts, value)
|
||||
decl(parent, name, value)
|
||||
}
|
||||
} else if (Array.isArray(value)) {
|
||||
for (let i of value) {
|
||||
decl(parent, name, i)
|
||||
}
|
||||
} else if (typeof value === 'object') {
|
||||
node = postcss.rule({ selector: name })
|
||||
parse(value, node)
|
||||
parent.push(node)
|
||||
} else {
|
||||
decl(parent, name, value)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = function (obj) {
|
||||
let root = postcss.root()
|
||||
var root = postcss.root()
|
||||
parse(obj, root)
|
||||
return root
|
||||
}
|
||||
|
||||
8
CTOAsYouGo/node_modules/postcss-js/process-result.js
generated
vendored
8
CTOAsYouGo/node_modules/postcss-js/process-result.js
generated
vendored
@@ -1,9 +1,9 @@
|
||||
let objectify = require('./objectifier')
|
||||
var objectify = require('./objectifier')
|
||||
|
||||
module.exports = function processResult(result) {
|
||||
module.exports = function (result) {
|
||||
if (console && console.warn) {
|
||||
result.warnings().forEach(warn => {
|
||||
let source = warn.plugin || 'PostCSS'
|
||||
result.warnings().forEach(function (warn) {
|
||||
var source = warn.plugin || 'PostCSS'
|
||||
console.warn(source + ': ' + warn.text)
|
||||
})
|
||||
}
|
||||
|
||||
12
CTOAsYouGo/node_modules/postcss-js/sync.js
generated
vendored
12
CTOAsYouGo/node_modules/postcss-js/sync.js
generated
vendored
@@ -1,12 +1,12 @@
|
||||
let postcss = require('postcss')
|
||||
var postcss = require('postcss')
|
||||
|
||||
let processResult = require('./process-result')
|
||||
let parse = require('./parser')
|
||||
var processResult = require('./process-result')
|
||||
var parse = require('./parser')
|
||||
|
||||
module.exports = function (plugins) {
|
||||
let processor = postcss(plugins)
|
||||
return input => {
|
||||
let result = processor.process(input, { parser: parse, from: undefined })
|
||||
var processor = postcss(plugins)
|
||||
return function (input) {
|
||||
var result = processor.process(input, { parser: parse, from: undefined })
|
||||
return processResult(result)
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user