Support PostCSS 8 (#2)

Author: lubomirblazekcz

.gitignore

@@ -7,3 +7,4 @@ node_modules
 !.travis.yml
 *.log*
 *.result.css
+/index.*

index.js

@@ -1,42 +1,47 @@
-// tooling
-const postcss = require('postcss');
+const creator = () => {
+	// side properties
+	const properties = ['top', 'right', 'bottom', 'left'];
 
-// side properties
-const properties = ['top', 'right', 'bottom', 'left'];
+	return {
+		postcssPlugin: 'postcss-inset',
+		Declaration: {
+			'inset': (decl, { list }) => {
+				// space-separated side values (top, right, bottom, left)
+				const values = list.space(decl.value);
 
-// inset plugin
-module.exports = postcss.plugin('postcss-inset', () => (root) => {
-	root.walkDecls('inset', (decl) => {
-		// space-separated side values (top, right, bottom, left)
-		const values = postcss.list.space(decl.value);
+				// conditionally add a right value
+				if (values.length === 1) {
+					values.push(values[0]);
+				}
 
-		// conditionally add a right value
-		if (values.length === 1) {
-			values.push(values[0]);
-		}
+				// conditionally add a bottom value
+				if (values.length === 2) {
+					values.push(values[0]);
+				}
 
-		// conditionally add a bottom value
-		if (values.length === 2) {
-			values.push(values[0]);
-		}
+				// conditionally add a left value
+				if (values.length === 3) {
+					values.push(values[1]);
+				}
 
-		// conditionally add a left value
-		if (values.length === 3) {
-			values.push(values[1]);
-		}
+				// only transform up to 4 side values
+				if (values.length === 4) {
+					// for each side property
+					properties.forEach((property, index) => {
+						// create a new declaration for the side
+						decl.cloneBefore({
+							prop: property,
+							value: values[index]
+						});
+					});
+				}
 
-		// only transform up to 4 side values
-		if (values.length === 4) {
-			// for each side property
-			properties.forEach((property, index) => {
-				// create a new declaration for the side
-				decl.cloneBefore({
-					prop: property,
-					value: values[index]
-				});
-			});
+				decl.remove();
+			},
 		}
+	}
+}
+
+creator.postcss = true
 
-		decl.remove();
-	});
-});
+export default creator

package.json

@@ -7,12 +7,16 @@
   "repository": "jonathantneal/postcss-inset",
   "homepage": "https://github.com/jonathantneal/postcss-inset#readme",
   "bugs": "https://github.com/jonathantneal/postcss-inset/issues",
-  "main": "index.js",
+  "main": "index.cjs.js",
+  "module": "index.es.mjs",
   "files": [
-    "index.js"
+    "index.js",
+    "index.cjs.js",
+    "index.es.mjs"
   ],
   "scripts": {
     "clean": "git clean -X -d -f",
+    "build": "rollup index.js --file index.cjs.js --format cjs --exports default && rollup index.js --file index.es.mjs --format es --exports default",
     "prepublish": "npm test",
     "test": "echo 'Running tests...'; npm run test:js && npm run test:tape",
     "test:js": "eslint *.js --cache --ignore-pattern .gitignore",
@@ -22,7 +26,7 @@
     "node": ">=4.0.0"
   },
   "dependencies": {
-    "postcss": "^6.0.1"
+    "postcss": "^8.2.0"
   },
   "devDependencies": {
     "eslint": "^3.19.0",